/* Retrans · Home · VISS Digital · viss.digital
   Slider "Revolution Slider + Slicey" refeito em CSS, cartões que viram (JetElements), blocos azuis, projetos, áreas de atuação.
   Frames 1440 / 768 / 390, 1rem = 16px. O slider escala por faixa como o original (.968, .875 e .8125 na janela de referência). */

/* ---- slider em tela cheia: altura da janela menos 60px ---- */
.slider { position: relative; height: calc(100svh - 3.75rem); min-height: 22rem; overflow: hidden; background: #000; color: #fff; }
.slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .9s ease, visibility .9s; }
.slide.is-ativo { opacity: 1; visibility: visible; }
.slide__fundo { position: absolute; inset: 0; overflow: hidden; }
.slide__fundo img, .slide__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slide__video { opacity: 0; transition: opacity .8s ease; }
.slide__video.is-tocando { opacity: 1; }
/* filtro "clarendon" do Revolution Slider (mais contraste e cor) aproximado em CSS */
.slide__fundo--filtro img { filter: contrast(1.2) saturate(1.35); }
.slide__veu { position: absolute; inset: 0; background: rgb(0 0 0 / .5); }
.ret { position: absolute; background: rgb(0 0 0 / .5); opacity: 0; transition: opacity .7s ease .3s; }
.slide.is-ativo .ret { opacity: 1; }

.slide__texto { position: absolute; inset: 0; }
.slide__titulo, .slide__sub, .slide__botao { position: absolute; left: 50%; transform: translate(-50%, 0); text-align: center; opacity: 0; transition: opacity 1.2s ease 1s; }
.slide.is-ativo .slide__titulo, .slide.is-ativo .slide__sub, .slide.is-ativo .slide__botao { opacity: 1; }
.slide__titulo {
  top: calc(50% - 6.475rem); transform: translate(-50%, -50%); white-space: nowrap;
  font: 500 3.63rem/5.44rem var(--font-titulo); letter-spacing: 0; color: #fff;
}
.slide__sub {
  top: calc(50% - .375rem); width: 62.5rem; height: 4.375rem;
  font: 300 1.8125rem/2.125rem var(--font-titulo); letter-spacing: 0; color: #fff;
}
.slide__botao {
  top: calc(50% + 11.5rem - 1.3125rem); position: absolute; display: flex; align-items: center; justify-content: center; height: 2.625rem; padding: 0 2.1875rem;
  border-radius: 1.875rem; background: var(--color-primary); color: #333; font: 500 1.0625rem/1.0625rem var(--font-botao); letter-spacing: .4px; white-space: nowrap;
  transition: opacity 1.2s ease 1s, background-color .2s ease;
}
.slide__botao a { color: inherit; }
.slide__botao a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; } /* a área do botão inteiro clica */
.slide__botao:hover, .slide__botao:focus-within { background: var(--color-blue-light); }

.slider__marcadores { position: absolute; left: 50%; bottom: 3.125rem; z-index: 3; display: flex; gap: .3125rem; transform: translateX(-50%); }
.slider__marcador { position: relative; width: 3.75rem; height: .1875rem; background: rgb(204 204 204 / .5); }
.slider__marcador::after { content: ''; position: absolute; inset: -.75rem -.125rem; } /* área de toque maior sem mudar o desenho */
.slider__marcador.is-ativo { background: #ccc; }
.slider__progresso { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; height: .3125rem; }
.slider__barra { display: block; width: 100%; height: 100%; background: #57ca85; transform: scaleX(0); transform-origin: left; }
.slider.is-rodando .slider__barra { animation: slider-barra 9s linear forwards; }
@keyframes slider-barra { to { transform: scaleX(1); } }
.slider__pausa {
  position: absolute; left: 1.25rem; bottom: 1.5rem; z-index: 3; display: flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%; background: rgb(0 0 0 / .45); color: #fff;
}
.slider__pausa:hover, .slider__pausa:focus-visible { background: rgb(0 0 0 / .7); }
.slider__pausa-icone { width: .625rem; height: .75rem; border-left: .1875rem solid #fff; border-right: .1875rem solid #fff; }
.slider__pausa[aria-pressed='true'] .slider__pausa-icone { width: 0; height: 0; border: 0; border-left: .6875rem solid #fff; border-top: .4375rem solid transparent; border-bottom: .4375rem solid transparent; margin-left: .125rem; }

/* ---- retângulos escuros (Slicey): posição do centro e tamanho por faixa; gerado por scripts/retangulos.mjs ---- */
@media (min-width: 1240px) {
  .slide--1 .ret--big1 { left: calc(50% + -14.3385rem); top: calc(50% + -17.787rem); width: 15.125rem; height: 9.075rem; }
  .slide--1 .ret--big2 { left: calc(50% + 4.598rem); top: calc(50% + -18.876rem); width: 9.075rem; height: 12.1rem; }
  .slide--1 .ret--big6 { left: calc(50% + -24.2rem); top: calc(50% + -7.381rem); width: 9.075rem; height: 15.125rem; }
  .slide--1 .ret--big4 { left: calc(50% + 2.2385rem); top: calc(50% + 7.26rem); width: 15.125rem; height: 9.075rem; }
  .slide--1 .ret--verybig1 { left: calc(50% + -33.517rem); top: calc(50% + -28.8585rem); width: 15.125rem; height: 18.15rem; }
  .slide--1 .ret--verybig2 { left: calc(50% + 16.456rem); top: calc(50% + -22.385rem); width: 18.15rem; height: 15.125rem; }
  .slide--1 .ret--big3 { left: calc(50% + 12.947rem); top: calc(50% + -4.4165rem); width: 15.125rem; height: 9.075rem; }
  .slide--1 .ret--verybig3 { left: calc(50% + 24.1395rem); top: calc(50% + 6.7155rem); width: 18.15rem; height: 15.125rem; }
  .slide--1 .ret--verybig4 { left: calc(50% + -40.656rem); top: calc(50% + 12.947rem); width: 18.15rem; height: 15.125rem; }
  .slide--1 .ret--verybig5 { left: calc(50% + -44.649rem); top: calc(50% + -1.694rem); width: 18.15rem; height: 12.1rem; }
  .slide--1 .ret--long1 { left: calc(50% + -15.851rem); top: calc(50% + -27.2855rem); width: 27.225rem; height: 6.05rem; }
  .slide--1 .ret--big5 { left: calc(50% + -20.328rem); top: calc(50% + 10.2245rem); width: 18.15rem; height: 12.1rem; }
  .slide--1 .ret--long3 { left: calc(50% + 0.6655rem); top: calc(50% + 18.9365rem); width: 21.175rem; height: 6.05rem; }
  .slide--2 .ret--big1 { left: calc(50% + -14.3385rem); top: calc(50% + -17.787rem); width: 15.125rem; height: 9.075rem; }
  .slide--2 .ret--big2 { left: calc(50% + 4.598rem); top: calc(50% + -18.876rem); width: 9.075rem; height: 12.1rem; }
  .slide--2 .ret--big6 { left: calc(50% + -24.2rem); top: calc(50% + -7.381rem); width: 9.075rem; height: 15.125rem; }
  .slide--2 .ret--big4 { left: calc(50% + 2.2385rem); top: calc(50% + 7.26rem); width: 15.125rem; height: 9.075rem; }
  .slide--2 .ret--verybig1 { left: calc(50% + -33.517rem); top: calc(50% + -28.8585rem); width: 15.125rem; height: 18.15rem; }
  .slide--2 .ret--verybig2 { left: calc(50% + 16.456rem); top: calc(50% + -22.385rem); width: 18.15rem; height: 15.125rem; }
  .slide--2 .ret--big3 { left: calc(50% + 12.947rem); top: calc(50% + -4.4165rem); width: 15.125rem; height: 9.075rem; }
  .slide--2 .ret--verybig3 { left: calc(50% + 24.1395rem); top: calc(50% + 6.7155rem); width: 18.15rem; height: 15.125rem; }
  .slide--2 .ret--verybig4 { left: calc(50% + -40.656rem); top: calc(50% + 12.947rem); width: 18.15rem; height: 15.125rem; }
  .slide--2 .ret--verybig5 { left: calc(50% + -44.649rem); top: calc(50% + -1.694rem); width: 18.15rem; height: 12.1rem; }
  .slide--2 .ret--long1 { left: calc(50% + -15.851rem); top: calc(50% + -27.2855rem); width: 27.225rem; height: 6.05rem; }
  .slide--2 .ret--big5 { left: calc(50% + -20.328rem); top: calc(50% + 10.2245rem); width: 18.15rem; height: 12.1rem; }
  .slide--2 .ret--long3 { left: calc(50% + 0.6655rem); top: calc(50% + 18.9365rem); width: 21.175rem; height: 6.05rem; }
}
@media (min-width: 1025px) and (max-width: 1239px) {
  .slide--1 .ret--big1 { left: calc(50% + -10.5rem); top: calc(50% + -16.1875rem); width: 15.625rem; height: 9.375rem; }
  .slide--1 .ret--big2 { left: calc(50% + 9.5625rem); top: calc(50% + -14.625rem); width: 9.375rem; height: 9.375rem; }
  .slide--1 .ret--big6 { left: calc(50% + 13.5625rem); top: calc(50% + -1.25rem); width: 9.375rem; height: 9.375rem; }
  .slide--1 .ret--big4 { left: calc(50% + 5.6875rem); top: calc(50% + 10.625rem); width: 15.625rem; height: 9.375rem; }
  .slide--1 .ret--verybig1 { left: calc(50% + 24.875rem); top: calc(50% + 1.4375rem); width: 15.625rem; height: 18.75rem; }
  .slide--1 .ret--verybig2 { left: calc(50% + -34.9375rem); top: calc(50% + -12.3125rem); width: 18.75rem; height: 15.625rem; }
  .slide--1 .ret--big3 { left: calc(50% + -35.4375rem); top: calc(50% + 5.625rem); width: 15.625rem; height: 9.375rem; }
  .slide--1 .ret--verybig3 { left: calc(50% + -37.1875rem); top: calc(50% + 17.1875rem); width: 18.75rem; height: 15.625rem; }
  .slide--1 .ret--verybig4 { left: calc(50% + 21.375rem); top: calc(50% + -19.0625rem); width: 18.75rem; height: 15.625rem; }
  .slide--1 .ret--verybig5 { left: calc(50% + -32.8125rem); top: calc(50% + -26.75rem); width: 18.75rem; height: 12.5rem; }
  .slide--1 .ret--long1 { left: calc(50% + -7.9375rem); top: calc(50% + -24.375rem); width: 25rem; height: 6.25rem; }
  .slide--1 .ret--big5 { left: calc(50% + -16.8125rem); top: calc(50% + 7.3125rem); width: 18.75rem; height: 12.5rem; }
  .slide--1 .ret--long3 { left: calc(50% + -10.125rem); top: calc(50% + 22rem); width: 25rem; height: 6.25rem; }
  .slide--2 .ret--big1 { left: calc(50% + -10.5rem); top: calc(50% + -16.1875rem); width: 15.625rem; height: 9.375rem; }
  .slide--2 .ret--big2 { left: calc(50% + 9.5625rem); top: calc(50% + -14.625rem); width: 9.375rem; height: 9.375rem; }
  .slide--2 .ret--big6 { left: calc(50% + 13.5625rem); top: calc(50% + -1.25rem); width: 9.375rem; height: 9.375rem; }
  .slide--2 .ret--big4 { left: calc(50% + 5.6875rem); top: calc(50% + 10.625rem); width: 15.625rem; height: 9.375rem; }
  .slide--2 .ret--verybig1 { left: calc(50% + 24.875rem); top: calc(50% + 1.4375rem); width: 15.625rem; height: 18.75rem; }
  .slide--2 .ret--verybig2 { left: calc(50% + -34.9375rem); top: calc(50% + -12.3125rem); width: 18.75rem; height: 15.625rem; }
  .slide--2 .ret--big3 { left: calc(50% + -35.4375rem); top: calc(50% + 5.625rem); width: 15.625rem; height: 9.375rem; }
  .slide--2 .ret--verybig3 { left: calc(50% + -37.1875rem); top: calc(50% + 17.1875rem); width: 18.75rem; height: 15.625rem; }
  .slide--2 .ret--verybig4 { left: calc(50% + 21.375rem); top: calc(50% + -19.0625rem); width: 18.75rem; height: 15.625rem; }
  .slide--2 .ret--verybig5 { left: calc(50% + -32.8125rem); top: calc(50% + -26.75rem); width: 18.75rem; height: 12.5rem; }
  .slide--2 .ret--long1 { left: calc(50% + -7.9375rem); top: calc(50% + -24.375rem); width: 25rem; height: 6.25rem; }
  .slide--2 .ret--big5 { left: calc(50% + -16.8125rem); top: calc(50% + 7.3125rem); width: 18.75rem; height: 12.5rem; }
  .slide--2 .ret--long3 { left: calc(50% + -10.125rem); top: calc(50% + 22rem); width: 25rem; height: 6.25rem; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .slide--1 .ret--big1 { left: calc(50% + -8.5313rem); top: calc(50% + -12.8516rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--1 .ret--big2 { left: calc(50% + 9.5156rem); top: calc(50% + -0.2188rem); width: 5.4688rem; height: 8.2031rem; }
  .slide--1 .ret--big6 { left: calc(50% + 4.7578rem); top: calc(50% + -16.4063rem); width: 8.2031rem; height: 2.7344rem; }
  .slide--1 .ret--big4 { left: calc(50% + -15.8047rem); top: calc(50% + -3.7734rem); width: 5.4688rem; height: 8.2031rem; }
  .slide--1 .ret--verybig1 { left: calc(50% + -14.4922rem); top: calc(50% + 5.7969rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--1 .ret--verybig2 { left: calc(50% + 7.2734rem); top: calc(50% + 13.3438rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--1 .ret--big3 { left: calc(50% + 1.5859rem); top: calc(50% + -12.1406rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--1 .ret--verybig3 { left: calc(50% + -2.5703rem); top: calc(50% + 13.1797rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--1 .ret--verybig4 { left: calc(50% + -12.3594rem); top: calc(50% + 15.3125rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--1 .ret--verybig5 { left: calc(50% + -17.9375rem); top: calc(50% + -13.5078rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--1 .ret--long1 { left: calc(50% + -10.9922rem); top: calc(50% + -17.3906rem); width: 13.6719rem; height: 2.7344rem; }
  .slide--1 .ret--big5 { left: calc(50% + 10.8281rem); top: calc(50% + -10.7188rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--1 .ret--long3 { left: calc(50% + -0.4922rem); top: calc(50% + 9.0234rem); width: 13.6719rem; height: 2.7344rem; }
  .slide--2 .ret--big1 { left: calc(50% + -8.5313rem); top: calc(50% + -12.8516rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--2 .ret--big2 { left: calc(50% + 9.5156rem); top: calc(50% + -0.2188rem); width: 5.4688rem; height: 8.2031rem; }
  .slide--2 .ret--big6 { left: calc(50% + 4.7578rem); top: calc(50% + -16.4063rem); width: 8.2031rem; height: 2.7344rem; }
  .slide--2 .ret--big4 { left: calc(50% + -15.8047rem); top: calc(50% + -3.7734rem); width: 5.4688rem; height: 8.2031rem; }
  .slide--2 .ret--verybig1 { left: calc(50% + -14.4922rem); top: calc(50% + 5.7969rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--2 .ret--verybig2 { left: calc(50% + 7.2734rem); top: calc(50% + 13.3438rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--2 .ret--big3 { left: calc(50% + 1.5859rem); top: calc(50% + -12.1406rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--2 .ret--verybig3 { left: calc(50% + -2.5703rem); top: calc(50% + 13.1797rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--2 .ret--verybig4 { left: calc(50% + -12.3594rem); top: calc(50% + 15.3125rem); width: 8.2031rem; height: 5.4688rem; }
  .slide--2 .ret--verybig5 { left: calc(50% + -17.9375rem); top: calc(50% + -13.5078rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--2 .ret--long1 { left: calc(50% + -10.9922rem); top: calc(50% + -17.3906rem); width: 13.6719rem; height: 2.7344rem; }
  .slide--2 .ret--big5 { left: calc(50% + 10.8281rem); top: calc(50% + -10.7188rem); width: 8.2031rem; height: 8.2031rem; }
  .slide--2 .ret--long3 { left: calc(50% + -0.4922rem); top: calc(50% + 9.0234rem); width: 13.6719rem; height: 2.7344rem; }
}
@media (max-width: 767px) {
  .slide--1 .ret--big1 { left: calc(50% + -1.5742rem); top: calc(50% + 6.7031rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--1 .ret--big2 { left: calc(50% + 3.4023rem); top: calc(50% + -15.082rem); width: 5.0781rem; height: 7.6172rem; }
  .slide--1 .ret--big6 { left: calc(50% + -5.5352rem); top: calc(50% + -10.1055rem); width: 7.6172rem; height: 2.5391rem; }
  .slide--1 .ret--big4 { left: calc(50% + 7.2617rem); top: calc(50% + 3.6055rem); width: 5.0781rem; height: 7.6172rem; }
  .slide--1 .ret--verybig1 { left: calc(50% + -19.3477rem); top: calc(50% + 20.5664rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--1 .ret--verybig2 { left: calc(50% + 7.6172rem); top: calc(50% + -3.25rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--1 .ret--big3 { left: calc(50% + -11.8828rem); top: calc(50% + 8.582rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--1 .ret--verybig3 { left: calc(50% + -2.1328rem); top: calc(50% + 13.3047rem); width: 10.1563rem; height: 2.5391rem; }
  .slide--1 .ret--verybig4 { left: calc(50% + 9.4961rem); top: calc(50% + -9.6992rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--1 .ret--verybig5 { left: calc(50% + -14.3203rem); top: calc(50% + -9.4453rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--1 .ret--long1 { left: calc(50% + -11.4258rem); top: calc(50% + -13.7617rem); width: 12.6953rem; height: 2.5391rem; }
  .slide--1 .ret--big5 { left: calc(50% + -15.1328rem); top: calc(50% + -0.3047rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--1 .ret--long3 { left: calc(50% + -5.4844rem); top: calc(50% + 18.7891rem); width: 12.6953rem; height: 2.5391rem; }
  .slide--2 .ret--big1 { left: calc(50% + -1.5742rem); top: calc(50% + 6.7031rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--2 .ret--big2 { left: calc(50% + 3.4023rem); top: calc(50% + -15.082rem); width: 5.0781rem; height: 7.6172rem; }
  .slide--2 .ret--big6 { left: calc(50% + -5.5352rem); top: calc(50% + -10.1055rem); width: 7.6172rem; height: 2.5391rem; }
  .slide--2 .ret--big4 { left: calc(50% + 7.2617rem); top: calc(50% + 3.6055rem); width: 5.0781rem; height: 7.6172rem; }
  .slide--2 .ret--verybig1 { left: calc(50% + -19.3477rem); top: calc(50% + 20.5664rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--2 .ret--verybig2 { left: calc(50% + 7.6172rem); top: calc(50% + -3.25rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--2 .ret--big3 { left: calc(50% + -11.8828rem); top: calc(50% + 8.582rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--2 .ret--verybig3 { left: calc(50% + -2.1328rem); top: calc(50% + 13.3047rem); width: 10.1563rem; height: 2.5391rem; }
  .slide--2 .ret--verybig4 { left: calc(50% + 9.4961rem); top: calc(50% + -9.6992rem); width: 7.6172rem; height: 5.0781rem; }
  .slide--2 .ret--verybig5 { left: calc(50% + -14.3203rem); top: calc(50% + -9.4453rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--2 .ret--long1 { left: calc(50% + -11.4258rem); top: calc(50% + -13.7617rem); width: 12.6953rem; height: 2.5391rem; }
  .slide--2 .ret--big5 { left: calc(50% + -15.1328rem); top: calc(50% + -0.3047rem); width: 7.6172rem; height: 7.6172rem; }
  .slide--2 .ret--long3 { left: calc(50% + -5.4844rem); top: calc(50% + 18.7891rem); width: 12.6953rem; height: 2.5391rem; }
}

/* ---- textos do slider por faixa (valores do Revolution Slider × escala da faixa) ---- */
@media (min-width: 1025px) and (max-width: 1239px) {
  .slide__titulo { font-size: 3.75rem; line-height: 5.625rem; top: calc(50% - 6.6875rem); }
  .slide__sub { top: calc(50% - .3125rem); width: 64.5625rem; font-size: 1.875rem; line-height: 2.1875rem; }
  .slide__botao { top: calc(50% + 11.875rem - 1.3125rem); }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .slide__titulo { top: calc(50% - 3.828rem); width: 26.3125rem; white-space: normal; font-size: 3.828rem; line-height: 3.828rem; letter-spacing: -.2734rem; }
  .slide__sub { top: calc(50% + 1.3125rem); width: 56.5rem; height: 3.9375rem; font-size: 1.625rem; line-height: 1.9375rem; }
  .slide__botao { top: calc(50% + 10.375rem - 1.3125rem); }
}
@media (max-width: 767px) {
  .slide__titulo { top: calc(50% - 4.925rem); width: 23.75rem; height: 6.25rem; white-space: normal; font-size: 1.5234rem; line-height: 1.5234rem; letter-spacing: 0; }
  .slide--2 .slide__titulo { top: calc(50% - 5.23rem); width: 18.28rem; height: auto; }
  .slide__sub { top: calc(50% - 1.703rem); width: 20.1875rem; height: 4.625rem; font-size: 1.25rem; line-height: 1.5rem; font-weight: 400; }
  .slide--2 .slide__sub { top: calc(50% - 2.49rem); width: 25.3rem; max-width: calc(100vw - 2rem); height: 6.3rem; font-size: .9635rem; } /* abaixo de 360px não corta nas bordas */
  .slide__botao { top: calc(50% + 9.8rem - 1.3125rem); }
  .slide--2 .slide__botao { top: calc(50% + 9.19rem - 1.3125rem); }
}

/* ---- serviços: cartões que viram no hover e no foco do teclado ---- */
.servicos { position: relative; z-index: 1; background: #fff; }
.servicos__cab { max-width: 71.25rem; margin-inline: auto; padding: 6.25rem 0; }
.servicos__grade { width: 100%; max-width: 68.75rem; margin-inline: auto; }
.servicos__linha { display: grid; grid-template-columns: repeat(4, 14.6875rem); justify-content: start; padding: 1.25rem; column-gap: 2.5rem; }
.servicos__acao { display: flex; justify-content: center; margin-top: 3.125rem; padding-bottom: 9.375rem; }

.cartao { position: relative; height: 15.625rem; perspective: 62.5rem; }
.cartao__frente, .cartao__verso {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; backface-visibility: hidden;
  transition: transform .7s cubic-bezier(.11, .6, .24, .89), visibility .7s;
}
.cartao__frente { padding-top: 0; border: 1px solid var(--color-card-line); background: #fff; }
.cartao__conteudo { display: flex; flex-direction: column; align-items: center; width: 100%; text-align: center; }
.cartao__titulo { margin-bottom: .625rem; font: 600 1.4375rem/2.0125rem var(--font-titulo); letter-spacing: .4px; color: var(--color-title); }
.cartao__traco { margin-bottom: .625rem; font: 600 1.125rem/1.575rem var(--font-titulo); letter-spacing: -1.6px; color: var(--color-card-line); }
.cartao__desc { margin-bottom: .625rem; font: 400 .8125rem/1.4625rem var(--font-texto); letter-spacing: .4px; color: #919191; }
.cartao__verso {
  flex-direction: column; padding: 1.5rem 1.25rem; background: var(--color-blue); color: #fff; text-align: center;
  box-shadow: 0 0 .625rem .125rem rgb(126 136 178 / .38); transform: rotateY(-180deg);
  opacity: 0; transition: transform .7s cubic-bezier(.11, .6, .24, .89), opacity 0s linear .35s; /* opacidade 0 e não visibility: o botão do verso precisa poder receber o foco */
}
.cartao__verso > * { opacity: 0; transition: opacity 0s linear .35s; }
.cartao__verso-texto { margin-bottom: .625rem; font: 400 .8125rem/1.4625rem var(--font-texto); letter-spacing: .4px; }
.cartao__botao { padding: .9375rem 1.875rem; font: 400 .75rem/.75rem var(--font-titulo); letter-spacing: .4px; color: #fff; transition: color .3s ease; }
.cartao__botao:hover, .cartao__botao:focus-visible { color: #fcbf83; }
.cartao:hover .cartao__frente, .cartao:focus-within .cartao__frente { transform: rotateY(180deg); visibility: hidden; }
.cartao:hover .cartao__verso, .cartao:focus-within .cartao__verso { transform: none; opacity: 1; }
.cartao:hover .cartao__verso > *, .cartao:focus-within .cartao__verso > * { opacity: 1; }

/* ---- três blocos azuis (sobrepõem o começo da faixa escura abaixo) ---- */
.destaques { position: relative; z-index: 2; height: 11.4375rem; }
.destaques__in { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; max-width: 68.75rem; margin-inline: auto; }
.destaque {
  display: flex; flex-direction: column; align-items: stretch; justify-content: center; height: 16.4375rem; padding: 1.25rem 3.4375rem 0;
  background: var(--color-blue); box-shadow: 0 0 6.25rem 0 rgb(0 0 0 / .31); text-align: center;
}
.destaque--2 { background: var(--color-blue-light); }
.destaque img { margin: 0 auto; }
.destaque__titulo { margin-top: 1.4375rem; font: 600 1.125rem/1.575rem var(--font-titulo); letter-spacing: .4px; color: #fff; }
.destaque__texto { margin-top: 1.25rem; font: 400 .75rem/1.35rem var(--font-texto); letter-spacing: .4px; color: var(--color-card-line); }

/* ---- projetos, execuções e assistência técnica ---- */
.projetos { position: relative; display: grid; grid-template-columns: 50% 50%; min-height: 36.9375rem; background: var(--color-navy); }
.projetos__foto { display: flex; flex-direction: column; align-items: center; padding-top: 14.375rem; background: url('../img/projetos-945.webp') right top / cover no-repeat; background-image: image-set(url('../img/projetos-945.avif') type('image/avif'), url('../img/projetos-945.webp') type('image/webp')); }
.projetos__titulo { font: 500 1.875rem/2.8125rem var(--font-titulo); letter-spacing: .4px; color: #fff; text-align: center; }
.projetos__foto .botao-cota { margin-top: 3.125rem; min-width: 8.9375rem; padding: 0 1.875rem; }
.projetos__texto { padding: 12.5rem 3.125rem 6.25rem; }
.projetos__sub { font: 600 1.25rem/1.25rem var(--font-titulo); letter-spacing: .4px; color: #fff; }
.projetos__texto p { margin-top: 1.25rem; font: 400 .875rem/1.575rem var(--font-texto); letter-spacing: .4px; color: var(--color-sub); text-align: justify; }
.contadores--escuro { margin-top: 1.25rem; }
.contadores--escuro .contador { padding: .625rem; }
.contadores--escuro .contador__titulo { color: #f7f7f7; text-align: left; }

/* ---- áreas de atuação ---- */
.areas { background: #fff; }
.areas__cab { max-width: 75rem; margin-inline: auto; padding: 6.25rem 0 0; }
.areas__lista { display: grid; grid-template-columns: 1fr 1fr; width: 100%; max-width: 75rem; margin: 1.25rem auto 0; padding: 2.1875rem 1.875rem 1.25rem; }
.area { text-align: center; }
.area img { width: 35.625rem; max-width: 100%; height: auto; opacity: .5; transition: opacity .3s ease; }
.area:hover img { opacity: 1; }
.area__nome { margin-top: 1.6875rem; font: 600 1.25rem/1.75rem var(--font-titulo); letter-spacing: .4px; color: #000; }
.areas__acao { display: flex; justify-content: center; margin-top: 3.125rem; padding-bottom: 9.375rem; }

/* ---- tablet (768 a 1024) ---- */
@media (max-width: 1024px) {
  .servicos__linha { grid-template-columns: repeat(4, 10.75rem); column-gap: .625rem; padding: 0 1.25rem; }
  .servicos__grade { max-width: none; }
  .servicos__cab, .areas__cab { padding-inline: 1.5625rem; }
  .destaques { margin-top: -7.25rem; height: auto; }
  .destaques__in { max-width: none; }
  .destaque { height: 19.5625rem; padding: .625rem 3.4375rem 0; }
  .projetos { grid-template-columns: 1fr; padding: 6.25rem 1.5625rem; }
  .projetos__foto { min-height: 33.125rem; padding-top: 12.5rem; }
  .projetos__texto { padding: 3.125rem 0 0; }
  .contadores--escuro { grid-template-columns: repeat(3, 33%); }
  .areas__lista { column-gap: 1.25rem; padding-inline: 1.5625rem; }
  .area__nome { margin-top: 1.625rem; }
}

/* ---- celular ---- */
@media (max-width: 767px) {
  .slider { min-height: 24rem; }
  .servicos__cab { padding: 3.125rem 1.25rem; }
  .servicos__linha { grid-template-columns: 1fr; row-gap: 1.875rem; padding: 0 1.25rem; }
  .servicos__linha + .servicos__linha { margin-top: 1.875rem; }
  .servicos__acao { margin-top: 5rem; }
  .destaques { height: auto; margin-top: 0; padding-bottom: 3.1875rem; }
  .destaques__in { grid-template-columns: 1fr; margin-inline: .9375rem; width: auto; }
  .destaque { height: auto; justify-content: flex-start; padding: 1.5625rem 0 .875rem; }
  .destaque--3 { padding-inline: .625rem; }
  .projetos { display: flex; flex-direction: column; padding: 3.125rem 1.5625rem; }
  .projetos__texto { order: 1; padding: 0; }
  .projetos__foto { order: 2; min-height: 40.625rem; margin-top: .9375rem; }
  .projetos__titulo { font-size: 2.1875rem; line-height: 3.28125rem; }
  .contadores--escuro { grid-template-columns: 1fr; }
  .areas__cab { padding: 3.125rem 1.25rem 0; }
  .areas__lista { grid-template-columns: 1fr; row-gap: 3.4375rem; padding: .9375rem 1.25rem 1.25rem; }
  .areas__acao { padding-bottom: 6.25rem; }
  .area__nome { margin-top: 1.75rem; }
}

/* ---- movimento reduzido: slide troca sem animação (o JS também não roda a troca automática) ---- */
@media (prefers-reduced-motion: reduce) {
  .slide, .ret, .slide__titulo, .slide__sub, .slide__botao { transition: none; }
  .slider.is-rodando .slider__barra { animation: none; }
  .cartao__frente, .cartao__verso { transition: none; }
}