/* Alvo Global — estilo do site */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/montserrat-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/montserrat-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Roboto';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/roboto-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Roboto';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/roboto-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}


:root {
  --vermelho: #ee1d23;
  --vermelho-escuro: #c7161c;
  --preto: #0e0e0e;
  --grafite: #1c1c1c;
  --grafite-2: #262626;
  --cinza: #6f6f6f;
  --cinza-claro: #bdbdbd;
  --linha: #e4e4e4;
  --claro: #f6f6f6;
  --branco: #fff;
  --titulo: "Montserrat", "Segoe UI", Arial, sans-serif;
  --texto: "Roboto", "Segoe UI", Arial, sans-serif;
  --largura: 1200px;
  --lateral: clamp(16px, 4vw, 40px);
  --cab: 84px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: 70px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font: 400 16px/1.75 var(--texto);
  color: var(--cinza);
  background: var(--branco);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, h5 { font-family: var(--titulo); color: var(--grafite); margin: 0 0 .6em; line-height: 1.25; font-weight: 600; }
p { margin: 0 0 1em; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--vermelho); outline-offset: 3px; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: fixed; left: 16px; top: -60px; z-index: 200; background: var(--vermelho); color: #fff; padding: 10px 16px; font: 600 14px var(--titulo); transition: top .2s; }
.pular:focus { top: 16px; }

.container { width: 100%; max-width: calc(var(--largura) + 2 * var(--lateral)); margin: 0 auto; padding: 0 var(--lateral); }
.secao { padding: clamp(72px, 10vw, 130px) 0; position: relative; }
.sobrelinha { display: block; font: 600 12px/1.4 var(--titulo); letter-spacing: .22em; text-transform: uppercase; color: var(--vermelho); margin-bottom: 14px; }
.titulo-secao { font-size: clamp(26px, 3.4vw, 40px); font-weight: 300; letter-spacing: -.01em; }
.titulo-secao strong { font-weight: 700; }
.centro { text-align: center; }
.botao {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 12px/1 var(--titulo); letter-spacing: .16em; text-transform: uppercase;
  padding: 17px 34px; border-radius: 40px; border: 2px solid var(--vermelho);
  background: var(--vermelho); color: #fff; transition: background .3s, color .3s, transform .3s var(--ease);
}
.botao:hover { background: transparent; color: var(--vermelho); }
.botao--claro { border-color: #fff; background: transparent; color: #fff; }
.botao--claro:hover { background: #fff; color: var(--vermelho); }

/* ---------- Cabeçalho ---------- */
.cab {
  position: fixed; inset: 0 0 auto 0; z-index: 100; height: var(--cab);
  display: flex; align-items: center;
  transition: background .4s, height .4s var(--ease), box-shadow .4s;
}
.cab.solido { background: rgba(14, 14, 14, .96); height: 66px; box-shadow: 0 6px 30px rgba(0,0,0,.25); }
@supports (backdrop-filter: blur(8px)) { .cab.solido { background: rgba(14,14,14,.86); backdrop-filter: blur(10px); } }
.cab .container { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cab__logo img { width: 190px; height: auto; transition: width .4s var(--ease); }
.cab.solido .cab__logo img { width: 160px; }
.menu { display: flex; gap: clamp(18px, 2.6vw, 38px); list-style: none; margin: 0; padding: 0; }
.menu a {
  position: relative; display: block; padding: 8px 0;
  font: 600 12px/1 var(--titulo); letter-spacing: .14em; text-transform: uppercase; color: #fff;
}
.menu a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--vermelho);
  transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease);
}
.menu a:hover::after, .menu a.ativo::after { transform: scaleX(1); transform-origin: left; }
.burger { display: none; width: 44px; height: 44px; border: 0; background: none; position: relative; z-index: 120; }
.burger span, .burger span::before, .burger span::after {
  position: absolute; left: 10px; width: 24px; height: 2px; background: #fff; content: ""; transition: transform .35s var(--ease), background .2s;
}
.burger span { top: 21px; }
.burger span::before { left: 0; top: -7px; }
.burger span::after { left: 0; top: 7px; }
.menu-aberto .burger span { background: transparent; }
.menu-aberto .burger span::before { transform: translateY(7px) rotate(45deg); }
.menu-aberto .burger span::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 900px) {
  .burger { display: block; }
  .menu {
    position: fixed; inset: 0; z-index: 110; background: var(--vermelho);
    flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s;
  }
  .menu a { font-size: 22px; letter-spacing: .1em; padding: 12px 0; transform: translateY(20px); opacity: 0; transition: transform .5s var(--ease), opacity .5s; }
  .menu a::after { background: #fff; }
  .menu-aberto .menu { opacity: 1; visibility: visible; }
  .menu-aberto .menu a { transform: none; opacity: 1; }
  .menu-aberto .menu li:nth-child(2) a { transition-delay: .05s; }
  .menu-aberto .menu li:nth-child(3) a { transition-delay: .1s; }
  .menu-aberto .menu li:nth-child(4) a { transition-delay: .15s; }
  .menu-aberto .menu li:nth-child(5) a { transition-delay: .2s; }
  .menu-aberto { overflow: hidden; }
  .cab__logo { position: relative; z-index: 120; }
}

/* ---------- Topo com vídeo ---------- */
.topo {
  position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center;
  overflow: hidden; background: var(--preto) center/cover no-repeat; color: #fff; text-align: center;
}
.topo__video { position: absolute; inset: 0; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity 1.4s; }
.topo__video.pronto { opacity: 1; }
.topo__video iframe, .topo__video video {
  position: absolute; top: 50%; left: 50%; border: 0;
  width: max(100%, 177.78vh); height: max(100%, 56.25vw);
  transform: translate(-50%, -50%);
}
.topo__video video { object-fit: cover; width: 100%; height: 100%; }
.topo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.6) 100%); }
.topo__conteudo { position: relative; z-index: 2; padding: 0 var(--lateral); max-width: 1120px; }
.topo h1 { color: #fff; font-weight: 300; font-size: clamp(30px, 5.2vw, 62px); line-height: 1.15; letter-spacing: -.02em; margin-bottom: 40px; }
.topo h1 strong { font-weight: 700; }
.topo h1 .linha { display: block; overflow: hidden; }
.topo h1 .linha span { display: inline-block; transform: translateY(105%); animation: subir 1.1s var(--ease) forwards; }
.topo h1 .linha:nth-child(2) span { animation-delay: .15s; }
.topo h1 .linha:nth-child(3) span { animation-delay: .3s; }
@keyframes subir { to { transform: none; } }
.rolar {
  display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 50%;
  background: var(--vermelho); color: #fff; opacity: 0; animation: aparecer .8s .9s forwards, quicar 2.4s 1.8s infinite;
}
.rolar svg { width: 18px; height: 18px; }
@keyframes aparecer { to { opacity: 1; } }
@keyframes quicar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(8px); } }

/* ---------- Sobre (vermelho) ---------- */
.sobre { background: var(--vermelho); color: rgba(255,255,255,.88); }
.sobre .sobrelinha { color: #fff; opacity: .75; }
.sobre__grade { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(40px, 7vw, 100px); align-items: start; }
.sobre h2 { color: #fff; font-size: clamp(32px, 4vw, 48px); font-weight: 300; line-height: 1.1; }
.sobre h2 strong { font-weight: 700; }
.sobre__texto { font-size: 15px; }
.unidades { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 34px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.25); }
.unidades strong { display: block; font: 600 12px/1.4 var(--titulo); letter-spacing: .16em; text-transform: uppercase; color: #fff; margin-bottom: 4px; }
.unidades span { font-size: 14px; line-height: 1.6; }
.diferenciais { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 50px; }
.diferencial svg { width: 40px; height: 40px; color: #fff; margin-bottom: 18px; transition: transform .5s var(--ease); }
.diferencial:hover svg { transform: translateY(-4px) scale(1.06); }
.diferencial h3 { color: #fff; font-size: 16px; font-weight: 600; margin-bottom: 10px; }
.diferencial p { font-size: 14px; line-height: 1.7; margin: 0; }

/* ---------- Fotos da agência ---------- */
.agencia { position: relative; padding: clamp(60px, 8vw, 100px) 0; overflow: hidden; }
.agencia__fundo { position: absolute; inset: -15% 0; background-position: center; background-size: cover; opacity: .08; }
.agencia__fotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; position: relative; }
.foto { position: relative; display: block; overflow: hidden; aspect-ratio: 3 / 2; background: var(--claro); }
.foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.foto:hover img { transform: scale(1.07); }
.foto::after { content: ""; position: absolute; inset: 0; background: var(--vermelho); opacity: 0; transition: opacity .5s; mix-blend-mode: multiply; }
.foto:hover::after { opacity: .35; }

/* ---------- Segmentos (escuro) ---------- */
.segmentos { background: var(--grafite); color: #a9a9a9; }
.segmentos .titulo-secao { color: #fff; max-width: 520px; margin: 0 auto 70px; }
.segmentos__grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(30px, 5vw, 70px); }
.segmento__topo { display: flex; align-items: center; gap: 18px; margin-bottom: 22px; }
.segmento__numero { font: 200 58px/1 var(--titulo); color: #fff; letter-spacing: -.03em; }
.segmento h3 { color: #fff; font-size: 17px; font-weight: 500; margin: 0; line-height: 1.3; }
.segmento p { font-size: 14.5px; }
.segmento__linha { display: block; width: 40px; height: 2px; background: var(--vermelho); margin-top: 26px; transition: width .6s var(--ease); }
.segmento:hover .segmento__linha { width: 90px; }

/* ---------- Portfólio ---------- */
.portfolio { background: var(--claro); }
.portfolio .titulo-secao { margin-bottom: 60px; }
.grade-portfolio { columns: 3 280px; column-gap: 18px; }
.projeto { position: relative; display: block; overflow: hidden; margin-bottom: 18px; break-inside: avoid; background: #ddd; }
.projeto img { width: 100%; transition: transform 1.1s var(--ease); }
.projeto__info {
  position: absolute; inset: auto 0 0 0; padding: 60px 26px 24px; color: #fff;
  background: linear-gradient(0deg, rgba(0,0,0,.82), rgba(0,0,0,0));
  transform: translateY(30%); opacity: 0; transition: transform .6s var(--ease), opacity .5s;
}
.projeto__info strong { display: block; font: 600 15px/1.35 var(--titulo); text-transform: uppercase; letter-spacing: .06em; }
.projeto__info span { font-size: 13px; color: rgba(255,255,255,.75); }
.projeto__info em { display: flex; align-items: center; gap: 8px; margin-top: 10px; font: 600 11px var(--titulo); letter-spacing: .16em; text-transform: uppercase; font-style: normal; color: #fff; }
.projeto__info em svg { width: 14px; transition: transform .4s var(--ease); }
.projeto::before { content: ""; position: absolute; inset: 0; z-index: 1; border: 0 solid var(--vermelho); transition: border-width .4s var(--ease); pointer-events: none; }
.projeto:hover img { transform: scale(1.06); }
.projeto:hover .projeto__info, .projeto:focus-visible .projeto__info { transform: none; opacity: 1; }
.projeto:hover::before { border-width: 6px; }
.projeto:hover em svg { transform: translateX(5px); }
@media (hover: none) { .projeto__info { transform: none; opacity: 1; } }

/* ---------- Marcas ---------- */
.marcas { padding: clamp(70px, 9vw, 110px) 0 clamp(70px, 9vw, 110px); position: relative; }
.marcas__faixa { position: absolute; inset: 0 0 45% 0; background: var(--vermelho); overflow: hidden; }
.marcas__faixa::before { content: ""; position: absolute; inset: 0; background-position: center; background-size: cover; opacity: .12; mix-blend-mode: luminosity; background-image: var(--fundo); }
.marcas .titulo-secao { color: #fff; position: relative; margin-bottom: 44px; }
.marcas__cartao { position: relative; background: #fff; box-shadow: 0 30px 70px rgba(0,0,0,.12); padding: clamp(20px, 3vw, 40px); }
.marcas__grade { display: grid; grid-template-columns: repeat(6, 1fr); }
.marca {
  display: grid; place-items: center; min-height: 112px; padding: 14px;
  border-right: 1px solid var(--linha); border-bottom: 1px solid var(--linha);
  transition: background .3s;
}
.marca:nth-child(6n) { border-right: 0; }
.marca:nth-last-child(-n + 6) { border-bottom: 0; }
.marca img { width: 100%; max-width: 160px; opacity: .72; transition: opacity .35s, transform .5s var(--ease); }
.marca:hover img { opacity: 1; transform: scale(1.06); }
.marca--texto span { font: 700 12.5px/1.3 var(--titulo); text-transform: uppercase; letter-spacing: .08em; color: #575757; text-align: center; opacity: .8; }
.marca:hover { background: #fafafa; }
@media (max-width: 1000px) {
  .marcas__grade { grid-template-columns: repeat(3, 1fr); }
  .marca:nth-child(n) { border-right: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
  .marca:nth-child(3n) { border-right: 0; }
  .marca:nth-last-child(-n + 3) { border-bottom: 0; }
}
@media (max-width: 560px) {
  .marcas__grade { grid-template-columns: repeat(2, 1fr); }
  .marca { min-height: 92px; }
  .marca:nth-child(n) { border-right: 1px solid var(--linha); border-bottom: 1px solid var(--linha); }
  .marca:nth-child(2n) { border-right: 0; }
  .marca:nth-last-child(-n + 2) { border-bottom: 0; }
}

/* ---------- Faixa de vídeo ---------- */
.faixa-video { position: relative; overflow: hidden; padding: clamp(110px, 16vw, 200px) 0; text-align: center; color: #fff; background: var(--preto); }
.faixa-video::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.faixa-video .container { position: relative; z-index: 2; }
.faixa-video h2 { color: #fff; font-weight: 400; font-size: clamp(22px, 3vw, 34px); margin: 34px 0 0; letter-spacing: .02em; }
.play {
  position: relative; display: inline-grid; place-items: center; width: 96px; height: 96px; border-radius: 50%;
  border: 2px solid #fff; background: transparent; color: #fff; transition: background .35s, transform .5s var(--ease);
}
.play svg { width: 30px; height: 30px; margin-left: 5px; }
.play::before, .play::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid rgba(255,255,255,.6); animation: pulso 2.6s infinite; }
.play::after { animation-delay: 1.3s; }
.play:hover { background: var(--vermelho); border-color: var(--vermelho); transform: scale(1.08); }
@keyframes pulso { from { transform: scale(1); opacity: .8; } to { transform: scale(1.7); opacity: 0; } }

/* ---------- Fundos com movimento (parallax) ---------- */
.parallax { position: absolute; inset: -20% 0; background-position: center; background-size: cover; will-change: transform; }

/* ---------- Depoimentos ---------- */
.depoimentos { background: var(--claro); }
.carrossel { position: relative; max-width: 820px; margin: 0 auto; }
.carrossel__janela { overflow: hidden; }
.carrossel__trilho { display: flex; transition: transform .8s var(--ease); touch-action: pan-y; }
.depoimento { flex: 0 0 100%; min-width: 0; text-align: center; padding: 0 clamp(10px, 6vw, 70px); }
.depoimento img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; margin: 0 auto 26px; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.depoimento blockquote { margin: 0 0 24px; font: 400 clamp(15px, 1.6vw, 17.5px)/1.8 var(--texto); color: #555; position: relative; }
.depoimento blockquote::before { content: "“"; display: block; font: 700 70px/0.6 Georgia, serif; color: var(--vermelho); margin-bottom: 18px; }
.depoimento strong { display: block; font: 600 13px var(--titulo); letter-spacing: .16em; text-transform: uppercase; color: var(--grafite); }
.depoimento small { font-size: 13px; }
.carrossel__seta {
  position: absolute; top: 40%; width: 46px; height: 46px; border-radius: 50%; border: 1px solid #d5d5d5; background: #fff;
  display: grid; place-items: center; color: var(--grafite); transition: background .3s, color .3s, border-color .3s;
}
.carrossel__seta:hover { background: var(--vermelho); border-color: var(--vermelho); color: #fff; }
.carrossel__seta svg { width: 16px; height: 16px; }
.carrossel__seta--ant { left: -40px; }
.carrossel__seta--prox { right: -40px; }
.carrossel__pontos { display: flex; justify-content: center; gap: 10px; margin-top: 34px; }
.carrossel__pontos button { width: 28px; height: 3px; padding: 0; border: 0; background: #cfcfcf; transition: background .3s, width .4s var(--ease); }
.carrossel__pontos button[aria-current="true"] { background: var(--vermelho); width: 46px; }
@media (max-width: 960px) { .carrossel__seta { display: none; } }

/* ---------- Contato ---------- */
.contato { display: grid; grid-template-columns: 1fr 1fr; background: var(--grafite); overflow: hidden; }
.contato__imagem { position: relative; overflow: hidden; min-height: 360px; }
.contato__form { padding: clamp(60px, 8vw, 110px) clamp(24px, 6vw, 90px); color: #a9a9a9; }
.contato h2 { color: #fff; font-size: clamp(26px, 3vw, 36px); font-weight: 700; letter-spacing: .02em; }
.contato__intro { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 36px; }
.campos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.campo { position: relative; }
.campo--largo { grid-column: 1 / -1; }
.campo input, .campo textarea {
  width: 100%; padding: 22px 16px 10px; border: 1px solid #3c3c3c; border-radius: 0; background: rgba(255,255,255,.03);
  color: #fff; font: 400 15px var(--texto); transition: border-color .3s, background .3s;
}
.campo textarea { min-height: 140px; resize: vertical; }
.campo label { position: absolute; left: 17px; top: 17px; font-size: 14px; color: #8a8a8a; pointer-events: none; transition: transform .25s var(--ease), font-size .25s, color .25s; transform-origin: left top; }
.campo input:focus, .campo textarea:focus { outline: none; border-color: var(--vermelho); background: rgba(255,255,255,.05); }
.campo input:focus + label, .campo input:not(:placeholder-shown) + label,
.campo textarea:focus + label, .campo textarea:not(:placeholder-shown) + label { transform: translateY(-11px); font-size: 11px; color: var(--vermelho); letter-spacing: .06em; }
.armadilha { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contato__acoes { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 26px; }
.contato__acoes .botao[disabled] { opacity: .6; pointer-events: none; }
.aviso { font-size: 14px; margin: 0; }
.aviso.ok { color: #6fd08c; }
.aviso.erro { color: #ff8a8a; }

/* ---------- Trabalhe conosco ---------- */
.time { background: var(--vermelho); color: #fff; text-align: center; padding: clamp(60px, 8vw, 100px) 0; overflow: hidden; position: relative; }
.time h2 { color: #fff; font-size: clamp(26px, 3.4vw, 40px); font-weight: 700; }
.time p { font: 500 clamp(15px, 1.6vw, 18px) var(--titulo); margin: 0; }
.time a { border-bottom: 2px solid rgba(255,255,255,.5); transition: border-color .3s; }
.time a:hover { border-color: #fff; }

/* ---------- Rodapé ---------- */
.rodape { background: var(--preto); color: #8a8a8a; padding: 56px 0; font-size: 13.5px; }
.rodape .container { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; }
.rodape__logo img { width: 170px; }
.rodape__contato { text-align: center; line-height: 1.8; }
.rodape__contato a:hover { color: #fff; }
.redes { display: flex; gap: 10px; justify-content: flex-end; }
.redes a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #1d1d1d; color: #fff; transition: background .3s, transform .4s var(--ease); }
.redes a:hover { background: var(--vermelho); transform: translateY(-3px); }
.redes svg { width: 17px; height: 17px; }
.voltar-topo {
  position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 46px; height: 46px; border-radius: 50%; border: 0;
  background: var(--vermelho); color: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.25);
  opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .4s, visibility .4s, transform .4s var(--ease);
}
.voltar-topo.visivel { opacity: 1; visibility: visible; transform: none; }
.voltar-topo svg { width: 16px; height: 16px; }

/* ---------- Páginas de portfólio ---------- */
.titulo-pagina {
  position: relative; min-height: 64vh; display: flex; align-items: flex-end; overflow: hidden; color: #fff;
  padding: calc(var(--cab) + 60px) 0 clamp(50px, 7vw, 90px); background: var(--preto);
}
.titulo-pagina::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.35) 40%, rgba(0,0,0,.8)); }
.titulo-pagina .container { position: relative; z-index: 2; }
.titulo-pagina h1 { color: #fff; font-size: clamp(32px, 5.4vw, 66px); font-weight: 700; letter-spacing: -.02em; line-height: 1.08; margin: 0; max-width: 900px; }
.migalhas { display: flex; gap: 10px; font: 600 11px var(--titulo); letter-spacing: .18em; text-transform: uppercase; margin-bottom: 18px; color: rgba(255,255,255,.75); }
.migalhas a:hover { color: #fff; }
.migalhas span[aria-hidden] { color: var(--vermelho); }
.intro-projeto { display: grid; grid-template-columns: 4fr 8fr; gap: clamp(30px, 6vw, 90px); align-items: start; }
.intro-projeto h2 { font-size: clamp(26px, 3.2vw, 40px); font-weight: 700; }
.intro-projeto h2::after { content: ""; display: block; width: 50px; height: 3px; background: var(--vermelho); margin-top: 22px; }
.intro-projeto p { font-size: 16.5px; line-height: 1.85; margin: 0; }
.galeria { columns: 2 340px; column-gap: 16px; }
.galeria a { display: block; overflow: hidden; margin-bottom: 16px; break-inside: avoid; position: relative; cursor: zoom-in; background: var(--claro); }
.galeria img { width: 100%; transition: transform 1.1s var(--ease), opacity .5s; }
.galeria a:hover img { transform: scale(1.04); }
.galeria--unica { columns: 1; }
.videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-top: 16px; }
.yt { position: relative; aspect-ratio: 16 / 9; background: #000 center/cover no-repeat; overflow: hidden; }
.yt button { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(0,0,0,.25); display: grid; place-items: center; transition: background .3s; }
.yt button:hover { background: rgba(0,0,0,.05); }
.yt button span { width: 78px; height: 78px; border-radius: 50%; background: var(--vermelho); display: grid; place-items: center; color: #fff; transition: transform .4s var(--ease); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.yt button:hover span { transform: scale(1.1); }
.yt button svg { width: 26px; height: 26px; margin-left: 4px; }
.yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.outros { background: var(--claro); }
.outros__grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 42vw), 1fr)); gap: 16px; }
.outro { position: relative; display: block; overflow: hidden; aspect-ratio: 1; background: #ccc; }
.outro img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.outro span {
  position: absolute; inset: auto 0 0 0; padding: 50px 18px 18px; color: #fff; font: 600 13px/1.35 var(--titulo);
  text-transform: uppercase; letter-spacing: .06em; background: linear-gradient(0deg, rgba(0,0,0,.8), transparent);
}
.outro:hover img { transform: scale(1.08); }
.outro::after { content: ""; position: absolute; inset: 0; border: 0 solid var(--vermelho); transition: border-width .35s var(--ease); }
.outro:hover::after { border-width: 5px; }
.navegacao { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 34px 0; border-top: 1px solid var(--linha); }
.navegacao a { display: flex; flex-direction: column; gap: 4px; font: 600 14px var(--titulo); color: var(--grafite); transition: color .3s; }
.navegacao a small svg { width: 13px; height: 13px; }
.navegacao a small { display: inline-flex; align-items: center; gap: 6px; font: 600 10.5px var(--titulo); letter-spacing: .18em; text-transform: uppercase; color: var(--cinza-claro); }
.navegacao a:hover { color: var(--vermelho); }
.navegacao__prox { text-align: right; align-items: flex-end; }
.navegacao__todos { width: 46px; height: 46px; display: grid !important; place-items: center; }
.navegacao__todos svg { width: 20px; height: 20px; }

/* ---------- Lightbox / modal ---------- */
.lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(8,8,8,.95); display: grid; place-items: center; opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; }
.lightbox.aberto { opacity: 1; visibility: visible; }
.lightbox__img { max-width: min(92vw, 1500px); max-height: 86vh; width: auto; box-shadow: 0 20px 60px rgba(0,0,0,.5); transition: opacity .25s; }
.lightbox__video { width: min(92vw, 1200px); aspect-ratio: 16 / 9; }
.lightbox__video iframe, .lightbox__video video { width: 100%; height: 100%; border: 0; background: #000; display: block; }
.lightbox button { position: absolute; border: 0; background: rgba(255,255,255,.08); color: #fff; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; transition: background .3s; }
.lightbox button:hover { background: var(--vermelho); }
.lightbox button svg { width: 18px; height: 18px; }
.lightbox__fechar { top: 18px; right: 18px; }
.lightbox__ant { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox__prox { right: 18px; top: 50%; transform: translateY(-50%); }
.lightbox__contador { position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; color: #aaa; font: 600 12px var(--titulo); letter-spacing: .14em; }

/* ---------- 404 ---------- */
.erro404 { min-height: 100vh; display: grid; place-items: center; text-align: center; background: var(--grafite); color: #aaa; padding: 120px var(--lateral) 60px; }
.erro404 h1 { color: #fff; font-size: clamp(80px, 16vw, 180px); font-weight: 800; line-height: 1; margin: 0; }
.erro404 h1 span { color: var(--vermelho); }

/* ---------- Animações de entrada ---------- */
.js [data-anim] { opacity: 0; transform: translateY(46px); transition: opacity 1s var(--ease), transform 1.1s var(--ease); transition-delay: var(--atraso, 0s); }
.js [data-anim="esquerda"] { transform: translateX(-50px); }
.js [data-anim="direita"] { transform: translateX(50px); }
.js [data-anim="zoom"] { transform: scale(.92); }
.js [data-anim].visivel { opacity: 1; transform: none; }

/* ---------- Responsivo ---------- */
@media (max-width: 1000px) {
  .sobre__grade, .intro-projeto { grid-template-columns: 1fr; }
  .segmentos__grade { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
  .contato { grid-template-columns: 1fr; }
  .contato__imagem { min-height: 280px; }
}
@media (max-width: 700px) {
  :root { --cab: 70px; }
  .cab__logo img { width: 150px; }
  .cab.solido .cab__logo img { width: 140px; }
  .diferenciais, .unidades, .campos { grid-template-columns: 1fr; }
  .agencia__fotos { grid-template-columns: 1fr; }
  .rodape .container { grid-template-columns: 1fr; text-align: center; }
  .rodape__logo img { margin: 0 auto; }
  .redes { justify-content: center; }
  .navegacao { grid-template-columns: 1fr 1fr; }
  .navegacao__todos { display: none !important; }
  .lightbox__ant, .lightbox__prox { top: auto; bottom: 14px; transform: none; }
}