/* =========================================================
   Gigaclima — site institucional
   Tipografia: Plus Jakarta Sans (mesma família e escala do
   referencial marinexpress.com.br)
   Cor: azuis do site atual + verde e amarelo do logo oficial
   ========================================================= */

:root{
  color-scheme: light;

  --azul-900:#062537;
  --azul-800:#0B3D5C;
  --azul-700:#0F537D;
  --azul-600:#15699C;
  --verde:#007B15;
  --verde-claro:#12A02A;
  --amarelo:#FFEF00;

  --tinta:#0C1D28;
  --tinta-2:#42586A;
  --tinta-3:#6E8394;
  --gelo:#EEF3F7;
  --gelo-2:#E2EAF1;
  --linha:#D5E0E9;
  --branco:#FFFFFF;

  --shell:1240px;
  --pad-y:clamp(64px,6.5vw,96px);
  --pad-y-topo:clamp(28px,3vw,40px);
  --r:3px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth; scroll-padding-top:110px}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background:var(--branco);
  color:var(--tinta);
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit}
ul,ol{margin:0; padding:0; list-style:none}

.shell{width:100%; max-width:var(--shell); margin:0 auto; padding:0 28px}
@media (max-width:640px){ .shell{padding:0 20px} }

:focus-visible{outline:2px solid var(--verde-claro); outline-offset:3px}

.skip{position:absolute; left:-9999px; top:0; z-index:200; background:var(--azul-800); color:#fff; padding:12px 18px; font-weight:700}
.skip:focus{left:0}

/* ---------- tipografia ---------- */
h1,h2,h3,h4{margin:0; line-height:1.14; letter-spacing:-.025em; font-weight:800; text-wrap:balance}
h1{font-size:clamp(32px,4.4vw,52px); line-height:1.06; letter-spacing:-.033em}
h1 em{font-style:normal; font-weight:300; display:block}
h2{font-size:clamp(25px,3vw,36px); letter-spacing:-.028em}
h2 em{font-style:normal; font-weight:300; color:var(--tinta-2)}
h3{font-size:19px; letter-spacing:-.02em; font-weight:700}
p{margin:0}

.eyebrow{
  display:flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--azul-700); margin:0 0 16px;
}
.eyebrow--light{color:rgba(255,255,255,.86)}

.swoosh{width:34px; height:4px; flex:0 0 34px; background:linear-gradient(90deg,var(--amarelo) 0 42%,var(--verde) 42% 100%)}

.h-sec{font-size:clamp(21px,2.2vw,27px); letter-spacing:-.025em; margin-bottom:20px}
.h-sec + .lead-note{margin-top:-10px}
.lead-note{font-size:15.5px; color:var(--tinta-2); margin-bottom:26px; max-width:66ch}
.lead-note--rodape{margin-top:var(--pad-y-topo)}
.lead-note a{color:var(--azul-700); font-weight:600; text-decoration:underline}
.prose{font-size:16.5px; color:var(--tinta-2); line-height:1.7; max-width:64ch; margin-bottom:18px}

/* ---------- botões ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:13px 25px; border:2px solid transparent; border-radius:var(--r);
  font-size:15px; font-weight:700; cursor:pointer;
  transition:background .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease), transform .22s var(--ease);
}
.btn--lg{padding:16px 30px; font-size:16px}
.btn--block{width:100%}
.btn--primary{background:var(--azul-700); border-color:var(--azul-700); color:#fff}
.btn--primary:hover{background:var(--azul-800); border-color:var(--azul-800); transform:translateY(-1px)}
.btn--ghost{border-color:rgba(255,255,255,.55); color:#fff}
.btn--ghost:hover{background:#fff; border-color:#fff; color:var(--azul-800)}
.btn--light{background:#fff; border-color:#fff; color:var(--azul-800)}
.btn--light:hover{background:transparent; color:#fff}
.btn--outline{border-color:var(--azul-700); color:var(--azul-700)}
.btn--outline:hover{background:var(--azul-700); color:#fff}

.link-arrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:14.5px; font-weight:700; color:var(--azul-700);
  border-bottom:2px solid transparent; padding-bottom:2px;
  transition:border-color .2s var(--ease), gap .2s var(--ease);
}
.link-arrow svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.link-arrow:hover{border-color:var(--azul-700); gap:14px}

/* ---------- barra utilitária ---------- */
.utility{background:var(--azul-900); color:rgba(255,255,255,.82); font-size:13px; position:relative; z-index:60}
.utility__in{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:42px; flex-wrap:wrap}
.utility a{display:inline-flex; align-items:center; gap:7px; padding:5px 0; transition:color .2s var(--ease)}
.utility a:hover{color:#fff}
.utility__contact{display:flex; gap:22px; flex-wrap:wrap}
.utility__links{display:flex; align-items:center; gap:16px}
.utility__sep{width:1px; height:14px; background:rgba(255,255,255,.22)}
.utility svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.social{display:flex; gap:12px}
.social svg{width:17px; height:17px}

/* ---------- cabeçalho ---------- */
.head{
  position:sticky; top:0; z-index:80;
  background:var(--azul-800);
  border-bottom:1px solid rgba(255,255,255,.1);
  transition:box-shadow .3s var(--ease);
}
.head.is-stuck{box-shadow:0 8px 30px rgba(6,37,55,.24)}
.head__in{display:flex; align-items:center; gap:22px; min-height:78px}
.head__logo img{width:166px; height:auto}
.head__cta{margin-left:auto}
.head__cta .btn--primary{background:var(--verde); border-color:var(--verde)}
.head__cta .btn--primary:hover{background:#fff; border-color:#fff; color:var(--azul-800)}

.nav{display:flex; align-items:center; gap:2px}
.nav > a, .nav__trigger{
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 13px; background:none; border:0; cursor:pointer;
  color:rgba(255,255,255,.86); font-size:14.5px; font-weight:600;
  border-bottom:2px solid transparent;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.nav > a:hover, .nav__trigger:hover{color:#fff; border-bottom-color:var(--amarelo)}
.nav .is-on{color:#fff}
.nav__trigger svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s var(--ease)}
.nav__trigger[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav__drop{position:static}

.mega{position:absolute; left:0; right:0; top:100%; background:#fff; border-bottom:3px solid var(--azul-700); box-shadow:0 24px 50px rgba(6,37,55,.18)}
.mega__in{display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:20px 28px 24px}
.mega__item{display:flex; align-items:center; gap:14px; padding:11px 12px; border:1px solid transparent; transition:border-color .2s var(--ease), background .2s var(--ease)}
.mega__item:hover{border-color:var(--linha); background:var(--gelo)}
.mega__item img{width:60px; height:48px; object-fit:cover; flex:0 0 60px}
.mega__item span{display:flex; flex-direction:column; font-size:12.5px; color:var(--tinta-3); line-height:1.4}
.mega__item b{font-size:14.5px; color:var(--tinta); font-weight:700; margin-bottom:2px; letter-spacing:-.01em}
.mega__item--alt{background:var(--azul-800); flex-direction:column; align-items:flex-start; justify-content:center; gap:7px}
.mega__item--alt span{color:rgba(255,255,255,.75)}
.mega__item--alt b{color:#fff}
.mega__item--alt em{font-style:normal; font-size:13px; font-weight:700; color:var(--amarelo)}
.mega__item--alt:hover{background:var(--azul-700); border-color:transparent}

.burger{display:none; margin-left:auto; background:none; border:0; padding:10px; cursor:pointer}
.burger span{display:block; width:26px; height:2px; background:#fff; margin:5px 0; transition:transform .25s var(--ease), opacity .2s var(--ease)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- migalha ---------- */
.crumb{border-bottom:1px solid var(--linha); background:#fff}
.crumb ol{display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:13px 0; font-size:13px; color:var(--tinta-3)}
.crumb li + li::before{content:"/"; margin-right:8px; color:var(--linha)}
.crumb a{transition:color .2s var(--ease)}
.crumb a:hover{color:var(--azul-700)}
.crumb [aria-current]{color:var(--tinta); font-weight:600}

/* ---------- hero: carrossel de banners (só na home) ----------
   Os banners ficam empilhados na mesma célula de grade: a altura é a do
   maior deles, sem salto na troca. A rotação é feita em main.js. */
.hero{position:relative; isolation:isolate; display:grid; background:var(--azul-900); overflow:hidden}
.hero__slide{grid-area:1/1; position:relative; isolation:isolate; opacity:0; visibility:hidden; transition:opacity .6s var(--ease), visibility .6s}
.hero__slide.is-on{opacity:1; visibility:visible}
.hero__bg{position:absolute; inset:0; z-index:-2}
.hero__bg img{width:100%; height:100%; object-fit:cover; object-position:center 62%}
.hero__veil{
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(90deg, rgba(6,37,55,.94) 0%, rgba(6,37,55,.84) 40%, rgba(6,37,55,.40) 74%, rgba(6,37,55,.28) 100%),
    linear-gradient(180deg, rgba(6,37,55,.5) 0%, rgba(6,37,55,0) 42%);
}
.hero__in{position:relative; z-index:1; color:#fff; padding:clamp(66px,8vw,104px) 28px clamp(88px,10vw,128px); max-width:var(--shell)}
.hero h1, .hero h2{max-width:16ch; font-size:clamp(34px,4.2vw,52px); line-height:1.06; letter-spacing:-.033em; font-weight:800; margin:0}
.hero h1 em, .hero h2 em{display:block; color:rgba(255,255,255,.7); font-style:normal; font-weight:300}
.hero__lede{margin-top:22px; max-width:56ch; font-size:clamp(16.5px,1.4vw,18.5px); color:rgba(255,255,255,.84); line-height:1.62}
.hero__actions{display:flex; gap:13px; margin-top:32px; flex-wrap:wrap}

.hero__nav{
  grid-area:1/1; align-self:end; position:relative; z-index:3;
  display:flex; align-items:center; gap:10px;
  padding-bottom:clamp(22px,3vw,34px); pointer-events:none;
}
.hero__nav > *{pointer-events:auto}
.hero__seta, .hero__play{
  width:36px; height:36px; display:grid; place-items:center; cursor:pointer;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.28); color:#fff;
  transition:background .2s var(--ease), border-color .2s var(--ease);
}
.hero__seta:hover, .hero__play:hover{background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.55)}
.hero__seta svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.hero__dots{display:flex; align-items:center; gap:7px; margin:0 4px}
.hero__dot{
  width:26px; height:4px; padding:0; cursor:pointer; border:0;
  background:rgba(255,255,255,.34); transition:background .2s var(--ease), width .3s var(--ease);
}
.hero__dot:hover{background:rgba(255,255,255,.6)}
.hero__dot.is-on{width:44px; background:var(--amarelo)}
.hero__play-ic{width:11px; height:12px; border-left:3px solid currentColor; border-right:3px solid currentColor}
.hero__play[aria-pressed="true"] .hero__play-ic{width:0; height:0; border:0; border-left:11px solid currentColor; border-top:7px solid transparent; border-bottom:7px solid transparent; margin-left:3px}
@media (prefers-reduced-motion:reduce){
  .hero__slide{transition:none}
}

/* ---------- acesso rápido ---------- */
.quick{background:var(--azul-800); border-bottom:1px solid rgba(255,255,255,.12)}
.quick__in{display:grid; grid-template-columns:repeat(3,1fr); gap:0}
.quick__card{
  display:flex; align-items:center; gap:16px; padding:26px 26px 26px 0; color:#fff;
  transition:background .22s var(--ease), padding-left .22s var(--ease);
}
.quick__card:first-child{padding-left:0}
.quick__card:hover{background:rgba(255,255,255,.06); padding-left:14px}
.quick__ic{flex:0 0 44px}
.quick__ic svg{width:40px; height:40px; fill:none; stroke:var(--amarelo); stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round}
.quick__txt{display:flex; flex-direction:column; font-size:13.5px; color:rgba(255,255,255,.7); line-height:1.4; flex:1}
.quick__txt b{font-size:16.5px; color:#fff; font-weight:700; letter-spacing:-.015em; margin-bottom:3px}
.quick__go{width:20px; height:20px; fill:none; stroke:rgba(255,255,255,.55); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:0 0 20px}

/* ---------- cabeçalho de página interna ---------- */
.pagehead{padding:clamp(46px,5vw,68px) 0 clamp(34px,4vw,46px); border-bottom:1px solid var(--linha)}
.pagehead__lede{margin-top:20px; font-size:17.5px; color:var(--tinta-2); max-width:64ch; line-height:1.62}

/* ---------- blocos genéricos ---------- */
.block{padding:var(--pad-y) 0}
.block--gelo{background:var(--gelo)}
.block--colado{padding:0}
.block--curto{padding:var(--pad-y-topo) 0}
.block--colado .steps-wide li:first-child{border-top:0}
/* primeira seção após o cabeçalho da página: topo curto em todas as rotas */
.pagehead + .block, .pagehead + .seg{padding-top:var(--pad-y-topo)}
/* o último elemento não soma margem ao padding inferior do bloco */
.block .shell > :last-child{margin-bottom:0}
.block__cols{display:grid; grid-template-columns:1fr 340px; gap:clamp(32px,5vw,64px); align-items:start}

.shead{margin-bottom:clamp(32px,4vw,46px)}
.shead--split{display:flex; align-items:flex-end; justify-content:space-between; gap:26px; flex-wrap:wrap}

.aside{background:var(--gelo); border-top:3px solid var(--azul-700); padding:26px 24px 28px}
.block--gelo .aside{background:#fff}
.aside h3{font-size:17px; margin-bottom:10px}
.aside__h2{margin-top:26px; padding-top:22px; border-top:1px solid var(--linha)}
.aside__note{font-size:14.5px; color:var(--tinta-2); line-height:1.6; margin-bottom:16px}
.aside__note a{color:var(--azul-700); font-weight:600; text-decoration:underline}
.aside__list{display:flex; flex-direction:column; gap:9px; margin-bottom:18px}
.aside__list li{font-size:15px; color:var(--tinta-2); padding-left:16px; position:relative}
.aside__list li::before{content:""; position:absolute; left:0; top:11px; width:6px; height:6px; background:var(--verde)}
.aside__facts{display:flex; flex-direction:column; gap:0; margin-bottom:18px}
.aside__facts li{padding:13px 0; border-bottom:1px solid var(--linha)}
.aside__facts li:last-child{border-bottom:0}
.aside__facts b{display:block; font-size:22px; font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.aside__facts span{font-size:13.5px; color:var(--tinta-3)}

/* listas */
.ticks{display:flex; flex-direction:column; gap:14px}
.ticks li{position:relative; padding-left:30px; font-size:16px; color:var(--tinta-2); line-height:1.6}
.ticks li::before{
  content:""; position:absolute; left:0; top:8px; width:15px; height:9px;
  border-left:2.5px solid var(--verde); border-bottom:2.5px solid var(--verde); transform:rotate(-45deg);
}
.ticks b{color:var(--tinta)}
.ticks--warn li::before{
  border:0; width:16px; height:16px; top:5px; transform:none;
  background:var(--amarelo); clip-path:polygon(50% 0,100% 100%,0 100%);
}

.numbered{display:flex; flex-direction:column; counter-reset:n}
.numbered li{counter-increment:n; padding:22px 0 22px 52px; border-top:1px solid var(--linha); position:relative}
.numbered li:last-child{border-bottom:1px solid var(--linha)}
.numbered li::before{
  content:"0" counter(n); position:absolute; left:0; top:24px;
  font-size:13px; font-weight:800; color:var(--azul-600); letter-spacing:.06em;
}
.numbered h3{margin-bottom:6px}
.numbered p{font-size:15.5px; color:var(--tinta-2); line-height:1.6; max-width:60ch}

/* ---------- grades ---------- */
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}

/* cartão de produto */
.pcard{display:flex; flex-direction:column; background:#fff; border:1px solid var(--linha); overflow:hidden; transition:box-shadow .28s var(--ease), transform .28s var(--ease)}
.pcard:hover{box-shadow:0 18px 40px rgba(11,61,92,.15); transform:translateY(-3px)}
.pcard__media{aspect-ratio:4/3; overflow:hidden; background:var(--azul-900)}
.pcard__media img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease)}
.pcard:hover .pcard__media img{transform:scale(1.05)}
.pcard__body{padding:20px 20px 22px; display:flex; flex-direction:column; flex:1}
.pcard h3{font-size:17px; margin-bottom:9px}
.pcard p{font-size:13.5px; color:var(--tinta-2); line-height:1.55}
.pcard__hl{margin-top:11px !important; padding-left:11px; border-left:2px solid var(--verde); font-size:13px !important; color:var(--tinta) !important; font-weight:600}
.pcard__go{display:inline-flex; align-items:center; gap:8px; margin-top:auto; padding-top:15px; font-size:13px; font-weight:700; color:var(--azul-700); transition:gap .2s var(--ease)}
.pcard__go svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.pcard:hover .pcard__go{gap:13px}

/* cartão de rota (por condição) */
.route__card{display:flex; flex-direction:column; background:#fff; padding:26px 22px 22px; border:1px solid var(--linha); border-top:3px solid var(--azul-700); transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-top-color .25s var(--ease)}
.route__card:hover{transform:translateY(-4px); box-shadow:0 16px 36px rgba(11,61,92,.13); border-top-color:var(--verde)}
.route__ic{display:block; margin-bottom:16px}
.route__ic svg{width:40px; height:40px; fill:none; stroke:var(--azul-700); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.route__card h3{font-size:17px; margin-bottom:9px; line-height:1.28}
.route__card p{font-size:14px; color:var(--tinta-2); line-height:1.55; flex:1}
.route__card em{font-style:normal; margin-top:18px; padding-top:14px; border-top:1px solid var(--linha); font-size:12.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--azul-700)}

/* cartão pequeno */
.mini{display:flex; flex-direction:column; background:#fff; border:1px solid var(--linha); overflow:hidden; transition:box-shadow .25s var(--ease)}
.mini:hover{box-shadow:0 14px 32px rgba(11,61,92,.13)}
.mini__media{aspect-ratio:16/10; overflow:hidden; background:var(--azul-900)}
.mini__media img{width:100%; height:100%; object-fit:cover}
.mini__body{padding:18px 20px 20px}
.mini h3{font-size:16px; margin-bottom:5px}
.mini p{font-size:13.5px; color:var(--tinta-3); line-height:1.5}

/* post */
.post{display:flex; flex-direction:column; background:#fff; border:1px solid var(--linha); overflow:hidden; transition:box-shadow .25s var(--ease), transform .25s var(--ease)}
.post:hover{box-shadow:0 16px 36px rgba(11,61,92,.13); transform:translateY(-2px)}
.post__media{aspect-ratio:16/9; overflow:hidden; background:var(--azul-900)}
.post__media img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease)}
.post:hover .post__media img{transform:scale(1.04)}
.post__body{padding:18px 20px 22px; display:flex; flex-direction:column; flex:1}
.post__cat{font-size:11.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--azul-600); margin-bottom:9px}
.post h3{font-size:17px; line-height:1.32; margin-bottom:8px}
.post p{font-size:14px; color:var(--tinta-2); line-height:1.55}

/* ---------- institucional na home ---------- */
.inst{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,62px); align-items:center}
.inst__media{aspect-ratio:4/3; overflow:hidden; background:var(--azul-900)}
.inst__media img{width:100%; height:100%; object-fit:cover}
.inst__body p{font-size:16.5px; color:var(--tinta-2); line-height:1.68; margin-top:16px; max-width:54ch}
.inst__facts{display:flex; flex-direction:column; margin:26px 0}
.inst__facts li{display:flex; align-items:baseline; gap:14px; padding:12px 0; border-top:1px solid var(--linha)}
.inst__facts li:last-child{border-bottom:1px solid var(--linha)}
.inst__facts b{font-size:17px; font-weight:800; letter-spacing:-.02em; min-width:130px; flex:0 0 130px}
.inst__facts span{font-size:14.5px; color:var(--tinta-3)}

/* ---------- lista de segmentos (home) ---------- */
.seg-list{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
/* segmentos com ícone (13/10, no lugar das fotos) */
.seg-list a{
  position:relative; display:flex; flex-direction:column; justify-content:space-between; gap:26px;
  height:100%; min-height:176px; padding:22px 20px 18px;
  background:#fff; border:1px solid var(--linha); border-radius:var(--r);
  transition:background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.seg-list__ic{display:grid; place-items:center; width:62px; height:62px; border-radius:50%; background:var(--gelo); transition:background .25s var(--ease)}
.seg-list__ic svg{width:36px; height:36px; fill:none; stroke:var(--azul-700); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; transition:stroke .25s var(--ease)}
.seg-list__nome{padding-right:30px; color:var(--tinta); font-size:16px; font-weight:700; letter-spacing:-.015em; line-height:1.25; transition:color .25s var(--ease)}
.seg-list__go{position:absolute; right:18px; bottom:18px}
.seg-list__go svg{width:20px; height:20px; fill:none; stroke:var(--azul-700); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:stroke .25s var(--ease), transform .25s var(--ease)}
.seg-list a:hover{background:var(--azul-800); border-color:var(--azul-800); transform:translateY(-2px); box-shadow:0 14px 30px rgba(11,61,92,.18)}
.seg-list a:hover .seg-list__ic{background:rgba(255,255,255,.08)}
.seg-list a:hover .seg-list__ic svg{stroke:var(--amarelo)}
.seg-list a:hover .seg-list__nome{color:#fff}
.seg-list a:hover .seg-list__go svg{stroke:var(--amarelo); transform:translateX(3px)}
.seg-list a:focus-visible{outline:2px solid var(--azul-600); outline-offset:2px}
@media (max-width:640px){
  .seg-list a{min-height:150px; padding:18px 16px 16px; gap:20px}
  .seg-list__ic{width:52px; height:52px}
  .seg-list__ic svg{width:30px; height:30px}
  .seg-list__nome{font-size:14.5px; padding-right:22px}
  .seg-list__go{right:14px; bottom:14px}
}
@media (prefers-reduced-motion:reduce){
  .seg-list a, .seg-list a:hover{transform:none}
}

/* ---------- segmento detalhado (página aplicações) ---------- */
.seg{padding:clamp(44px,5vw,68px) 0; border-bottom:1px solid var(--linha)}
.seg--alt{background:var(--gelo)}
.seg__in{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4.5vw,58px); align-items:center}
.seg--alt .seg__in{direction:rtl}
.seg--alt .seg__in > *{direction:ltr}
.seg__media{aspect-ratio:16/10; overflow:hidden; background:var(--azul-900)}
.seg__media img{width:100%; height:100%; object-fit:cover}
.seg__n{font-size:13px; font-weight:800; color:var(--azul-600); letter-spacing:.1em; margin-bottom:10px; font-variant-numeric:tabular-nums}
.seg__body p{font-size:16.5px; color:var(--tinta-2); line-height:1.65; margin-top:14px; max-width:52ch}
.seg__h3{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--tinta-3); margin:26px 0 12px}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px}
.chips li{font-size:13px; font-weight:600; background:#fff; border:1px solid var(--linha); color:var(--azul-800)}
.seg--alt .chips li{background:#fff}
.chips li a, .chips li{display:inline-block; padding:7px 14px}
.chips li a{padding:0; color:inherit}
.chips li:has(a):hover{border-color:var(--azul-700); background:var(--azul-700)}
.chips li:has(a):hover a{color:#fff}

/* ---------- passos largos (tecnologia) ---------- */
.steps-wide{display:flex; flex-direction:column}
.steps-wide li{display:grid; grid-template-columns:88px 1fr; gap:16px; padding:30px 0; border-top:1px solid var(--linha)}
.steps-wide li:last-child{border-bottom:1px solid var(--linha)}
.steps-wide__n{font-size:15px; font-weight:800; color:var(--azul-600); letter-spacing:.08em; font-variant-numeric:tabular-nums}
.steps-wide h2{font-size:clamp(20px,2.1vw,25px); margin-bottom:10px}
.steps-wide p{font-size:16px; color:var(--tinta-2); line-height:1.68; max-width:62ch}

/* ---------- arquivos ---------- */
.files{display:flex; flex-direction:column}
.files a{display:flex; align-items:center; gap:18px; padding:20px 0; border-top:1px solid var(--linha); transition:padding-left .22s var(--ease)}
.files li:last-child a{border-bottom:1px solid var(--linha)}
.files a:hover{padding-left:8px}
.files__ic{flex:0 0 42px; height:42px; display:grid; place-items:center; border:1px solid var(--linha); background:var(--gelo)}
.files__ic svg{width:20px; height:20px; fill:none; stroke:var(--azul-700); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.files__txt{display:flex; flex-direction:column; flex:1; font-size:14px; color:var(--tinta-3); line-height:1.45}
.files__txt b{font-size:16.5px; color:var(--tinta); font-weight:700; letter-spacing:-.015em; margin-bottom:3px}
.files__fmt{font-style:normal; font-size:11.5px; font-weight:700; letter-spacing:.1em; border:1px solid var(--linha); padding:5px 10px; color:var(--tinta-3); flex:0 0 auto}
.files a:hover .files__fmt{border-color:var(--azul-700); color:var(--azul-700)}

/* ---------- página de produto ---------- */
.phead{padding:clamp(38px,4vw,58px) 0 clamp(44px,5vw,64px)}
.phead__in{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,60px); align-items:center}
.phead__media{aspect-ratio:4/3; overflow:hidden; background:var(--azul-900)}
.phead__media img{width:100%; height:100%; object-fit:cover}
.phead__lede{margin-top:18px; font-size:17px; color:var(--tinta-2); line-height:1.65; max-width:52ch}
.phead__hl{margin-top:16px; padding-left:13px; border-left:3px solid var(--verde); font-size:15.5px; font-weight:700}
.phead__actions{display:flex; gap:12px; margin-top:28px; flex-wrap:wrap}
.phead__meta{display:flex; gap:0; margin:30px 0 0; border-top:1px solid var(--linha); flex-wrap:wrap}
.phead__meta > div{padding:16px 24px 0 0; flex:1 1 190px}
.phead__meta dt{font-size:11.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--tinta-3); margin-bottom:4px}
.phead__meta dd{margin:0; font-size:15px; font-weight:600; line-height:1.45}

/* ---------- destaque (caso na home) ---------- */
.feature{background:var(--azul-900); color:#fff; padding:var(--pad-y) 0}
.feature__in{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,62px); align-items:center}
.feature__media{aspect-ratio:4/3; overflow:hidden}
.feature__media img{width:100%; height:100%; object-fit:cover}
.feature__body .eyebrow{color:rgba(255,255,255,.86)}
.feature__body h2{color:#fff}
.feature__body p{margin-top:16px; font-size:16.5px; color:rgba(255,255,255,.78); line-height:1.68; max-width:54ch}
.feature__body strong{color:#fff}
.feature__body .btn--outline{border-color:rgba(255,255,255,.5); color:#fff; margin-top:26px}
.feature__body .btn--outline:hover{background:#fff; border-color:#fff; color:var(--azul-800)}

/* ---------- foto larga ---------- */
.figure-wide{margin:0}
.figure-wide img{width:100%; height:clamp(240px,34vw,440px); object-fit:cover}
.figure-wide__cap{max-width:var(--shell); margin:0 auto; padding:12px 28px 0; font-size:13px; color:var(--tinta-3)}

/* ---------- fabricantes ---------- */
.brands{border-top:1px solid var(--linha); border-bottom:1px solid var(--linha); background:#fff}
.brands__in{display:flex; align-items:center; gap:clamp(28px,6vw,80px); padding:34px 28px; flex-wrap:wrap}
.brands__label{font-size:14px; color:var(--tinta-3); line-height:1.45; flex:0 0 auto}
.brands__label strong{display:block; color:var(--tinta); font-weight:700}
.brands__list{display:flex; align-items:center; gap:clamp(30px,5vw,64px); flex-wrap:wrap; flex:1}
.brands__list img{height:28px; width:auto; opacity:.55; filter:grayscale(1); transition:opacity .25s var(--ease), filter .25s var(--ease)}
.brands__list li:hover img{opacity:1; filter:grayscale(0)}

/* ---------- faixa de chamada ---------- */
.strip{background:var(--azul-800); color:#fff}
.strip__in{display:flex; align-items:center; justify-content:space-between; gap:28px; padding:38px 28px; flex-wrap:wrap}
.strip h2{font-size:clamp(21px,2.3vw,28px); color:#fff}
.strip p{margin-top:8px; color:rgba(255,255,255,.76); font-size:15.5px; max-width:60ch}

/* ---------- contato ---------- */
.contato{display:grid; grid-template-columns:1fr 340px; gap:clamp(32px,5vw,60px); align-items:start}
.contato__side{background:var(--gelo); border-top:3px solid var(--azul-700); padding:28px 24px 30px}
.chan{display:flex; flex-direction:column; margin-bottom:30px}
.chan li{display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--linha)}
.chan li:last-child{border-bottom:0}
.chan__ic{flex:0 0 48px; height:48px; display:grid; place-items:center}
.chan__ic svg{width:32px; height:32px; fill:none; stroke:var(--azul-700); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.chan b{display:block; font-size:11.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--tinta-3); margin-bottom:2px}
.chan a{font-size:16px; font-weight:600; transition:color .2s var(--ease)}
.chan a:hover{color:var(--azul-700)}
.chan__addr{font-size:15px; color:var(--tinta-2); line-height:1.55; margin-bottom:10px}
.chan__hours{font-size:14px; color:var(--tinta-3); margin-bottom:16px}

/* ---------- formulário ---------- */
.grp{border:0; padding:0; margin:0 0 26px; min-width:0}
.grp:last-of-type{margin-bottom:0}
.grp legend{display:flex; align-items:center; gap:11px; padding:0; margin-bottom:16px; font-size:12.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--azul-800)}
.grp__n{display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; background:var(--azul-700); color:#fff; font-size:12px; font-weight:800; letter-spacing:0}
.grp__hint{font-size:13.5px; color:var(--tinta-3); line-height:1.5; margin:-8px 0 16px; max-width:60ch}
.form__grid{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.fld{display:flex; flex-direction:column; gap:7px}
.fld--full{grid-column:1/-1}
.fld > span{font-size:13px; font-weight:700; color:var(--tinta-2)}
.fld i{font-style:normal; color:var(--verde)}
.fld input, .fld select, .fld textarea{
  font-family:inherit; font-size:16px; color:var(--tinta);
  padding:13px 14px; border:1px solid var(--linha); border-radius:var(--r);
  background:var(--gelo); width:100%; transition:border-color .2s var(--ease), background .2s var(--ease);
}
.fld textarea{resize:vertical; line-height:1.5}
.fld input::placeholder, .fld textarea::placeholder{color:#9DB0BE}
.fld input:focus, .fld select:focus, .fld textarea:focus{outline:none; border-color:var(--azul-700); background:#fff; box-shadow:0 0 0 3px rgba(15,83,125,.12)}
.fld.is-bad input, .fld.is-bad select, .fld.is-bad textarea{border-color:#C0392B; background:#FDF3F2}
.check{display:flex; gap:11px; align-items:flex-start; margin:22px 0; font-size:13.5px; color:var(--tinta-2); line-height:1.5}
.check input{margin-top:3px; width:17px; height:17px; accent-color:var(--verde); flex:0 0 17px}
.check a{color:var(--azul-700); text-decoration:underline}
.form__msg{margin-top:14px; font-size:14px; font-weight:600; min-height:21px}
.form__msg.is-ok{color:var(--verde)}
.form__msg.is-bad{color:#C0392B}

/* ---------- rodapé ---------- */
.foot{background:var(--azul-900); color:rgba(255,255,255,.72); padding-top:clamp(50px,5.5vw,72px); font-size:14.5px}
.foot__in{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(26px,4vw,52px); padding-bottom:48px}
/* height:auto é obrigatório: o <img> traz height="207" no atributo e,
   sem isso, a altura trava e o logo estica */
.foot__brand img{width:186px; height:auto; margin-bottom:20px}
.foot__brand p{max-width:38ch; line-height:1.6; margin-bottom:22px}
.foot__brand .social svg{width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.foot__brand .social a{transition:color .2s var(--ease)}
.foot__brand .social a:hover{color:var(--amarelo)}
.foot__col h4{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#fff; margin-bottom:18px}
.foot__col ul{display:flex; flex-direction:column; gap:11px}
.foot__col a{transition:color .2s var(--ease)}
.foot__col a:hover{color:var(--amarelo)}
.foot__addr{line-height:1.55; color:rgba(255,255,255,.55)}
.foot__legal{display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; padding:20px 28px; border-top:1px solid rgba(255,255,255,.14); font-size:13px; color:rgba(255,255,255,.5)}
.foot__legal a:hover{color:#fff}

/* ---------- flutuantes ---------- */
.wa{position:fixed; right:22px; bottom:22px; z-index:70; width:54px; height:54px; border-radius:50%; background:var(--verde); color:#fff !important; display:grid; place-items:center; box-shadow:none; transition:transform .22s var(--ease)}
.wa:hover{transform:scale(1.06); color:#fff !important}
.wa, .wa:visited, .wa:hover, .wa:active{color:#fff !important}
.wa svg{width:30px; height:30px; fill:#fff !important; color:#fff !important; stroke:none !important}
.wa svg path{fill:#fff !important; stroke:none !important}
.ic-wa, svg.ic-wa{fill:currentColor !important; stroke:none !important}
.btn svg.ic-wa{width:18px; height:18px; flex:none}
.wa svg.ic-wa, .wa svg.ic-wa path{fill:#fff !important; stroke:none !important}
.mobar{display:none}

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width:1180px){
  .grid-4{grid-template-columns:repeat(3,1fr)}
  .seg-list{grid-template-columns:repeat(3,1fr)}
  .block__cols, .contato{grid-template-columns:1fr 300px}
}

@media (max-width:1190px){
  .head__cta,
  .orc{align-self:center}
  .orc__trigger{height:52px; max-height:52px}
}

@media (max-width:1080px){
  .head__in{min-height:70px}
  .head__cta{display:none}
  .burger{display:block}
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(360px,86vw);
    background:var(--azul-800); flex-direction:column; align-items:stretch; gap:0;
    padding:88px 24px 32px; transform:translateX(100%); transition:transform .32s var(--ease);
    overflow-y:auto; z-index:90; box-shadow:-20px 0 50px rgba(6,37,55,.3);
  }
  .nav.is-open{transform:none}
  .nav > a, .nav__trigger{width:100%; justify-content:space-between; padding:16px 4px; font-size:17px; border-bottom:1px solid rgba(255,255,255,.14)}
  .nav > a:hover, .nav__trigger:hover{border-bottom-color:rgba(255,255,255,.14)}
  .nav .is-on{border-bottom-color:rgba(255,255,255,.14)}
  .mega{position:static; box-shadow:none; background:transparent; border:0}
  .mega__in{grid-template-columns:1fr; padding:8px 0 14px; gap:2px}
  .mega__item{padding:10px 4px}
  .mega__item b{color:#fff}
  .mega__item span{color:rgba(255,255,255,.6)}
  .mega__item:hover{background:rgba(255,255,255,.06); border-color:transparent}
  .mega__item--alt{padding:0}
  .quick__in{grid-template-columns:1fr}
  .quick__card{border-bottom:1px solid rgba(255,255,255,.14); padding:20px 0}
  .quick__card:last-child{border-bottom:0}
  .quick__card:hover{padding-left:10px}
}

@media (max-width:900px){
  .block__cols, .contato{grid-template-columns:1fr}
  .inst, .feature__in, .seg__in, .phead__in{grid-template-columns:1fr}
  .seg--alt .seg__in{direction:ltr}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  /* 3 colunas abaixo de 900px espremem o cartão e deixam um órfão na
     última linha; 2 colunas fecham a grade de 8 itens em 4 linhas cheias */
  .grid-4, .seg-list{grid-template-columns:repeat(2,1fr)}
  .foot__in{grid-template-columns:1fr 1fr}
  .foot__brand{grid-column:1/-1}
  .steps-wide li{grid-template-columns:1fr; gap:6px}
}

@media (max-width:760px){
  body{font-size:16px}
  .u-hide-md, .utility .u-hide-md{display:none}
  .wa{display:none}

  /* área de toque: no dedo, um link de 18px de altura é alvo pequeno */
  .foot__col ul{gap:1px}
  .foot__col a{display:block; padding:9px 0}
  .foot__addr{padding:9px 0}
  .link-arrow{padding:7px 0}
  .utility a{padding:8px 0}
  .utility__in{flex-wrap:nowrap}
  .mobar{
    display:grid; grid-template-columns:1fr 1.3fr; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:75;
    background:rgba(255,255,255,.97); backdrop-filter:blur(10px);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--linha);
  }
  .mobar a{display:grid; place-items:center; padding:14px; font-size:14.5px; font-weight:700; border:2px solid var(--verde); color:var(--verde); border-radius:var(--r)}
  .mobar .mobar__cta{background:var(--azul-700); border-color:var(--azul-700); color:#fff}
  .foot{padding-bottom:78px}
  .brands__in{gap:22px; padding:26px 20px}
  .brands__list{gap:26px}
  .brands__list img{height:calc(var(--h,30px) * .8)}
  .brands__list{flex-wrap:wrap; justify-content:flex-start}
}

@media (max-width:600px){
  .u-hide-sm, .utility .u-hide-sm{display:none}
  .utility__in{min-height:38px; font-size:12.5px; justify-content:space-between}
  .utility__contact{gap:14px}
  .hero__actions{flex-direction:column; align-items:stretch}
  .hero__actions .btn{width:100%}
  .grid-3, .grid-4{grid-template-columns:1fr}
  .form__grid{grid-template-columns:1fr}
  .foot__in{grid-template-columns:1fr}
  .shead--split{align-items:flex-start}
  .strip__in{padding:30px 20px}
  .phead__meta > div{flex:1 1 100%}
}

/* ---------- entrada do hero ---------- */
@keyframes rise{ from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none} }
@keyframes wipe{ from{transform:scaleX(0)} to{transform:scaleX(1)} }
.js-anim .hero__in > *{animation:rise .68s var(--ease) backwards}
.js-anim .hero__in > .eyebrow{animation-delay:.05s}
.js-anim .hero__in > h1{animation-delay:.14s}
.js-anim .hero__in > .hero__lede{animation-delay:.26s}
.js-anim .hero__in > .hero__actions{animation-delay:.36s}
.js-anim .hero .swoosh{animation:wipe .5s var(--ease) backwards; animation-delay:.12s; transform-origin:left}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; animation-delay:0 !important; transition-duration:.001ms !important}
  .pcard:hover, .route__card:hover, .post:hover{transform:none}
}

/* =========================================================
   V2 — ajustes da call de 04/09
   Grade de 12, depoimentos, mapa de presença, par de CTAs
   de orçamento e pop-up de cadastro nos downloads.
   ========================================================= */

/* ---------- par de CTAs (WhatsApp | e-mail) ---------- */
.cta-par{display:flex; gap:10px; flex-wrap:wrap}
.cta-par .btn{gap:9px}
.cta-par svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.pagehead__cta{margin-top:26px; margin-bottom:12px; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-3)}
.phead__actions .btn{gap:9px}
.phead__actions svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}

/* ---------- orçamento no cabeçalho: duas portas ---------- */
.orc{position:relative}
.orc__trigger{display:inline-flex; align-items:center; gap:8px; cursor:pointer; background:var(--verde); border:1px solid var(--verde); color:#fff}
.orc__trigger:hover{background:#fff; border-color:#fff; color:var(--azul-800)}
.orc__trigger svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s var(--ease)}
.orc__trigger[aria-expanded="true"] svg{transform:rotate(180deg)}
.orc__menu{position:absolute; right:0; top:calc(100% + 10px); z-index:80; width:300px; background:#fff; border-bottom:3px solid var(--verde); box-shadow:0 24px 50px rgba(6,37,55,.22)}
.orc__menu a{display:flex; align-items:flex-start; gap:12px; padding:14px 16px; border-bottom:1px solid var(--linha); transition:background .2s var(--ease)}
.orc__menu a:last-child{border-bottom:0}
.orc__menu a:hover{background:var(--gelo)}
.orc__menu svg{width:19px; height:19px; flex:0 0 19px; margin-top:3px; fill:none; stroke:var(--verde); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.orc__menu span{display:flex; flex-direction:column; font-size:12.5px; color:var(--tinta-3); line-height:1.4}
.orc__menu b{font-size:14.5px; color:var(--tinta); font-weight:700; letter-spacing:-.01em; margin-bottom:2px}

/* ---------- grade de 12: linhas novas e vaga ---------- */
.pcard--novo .pcard__media{position:relative}
.pcard__tag{position:absolute; left:0; top:0; background:var(--amarelo); color:var(--tinta); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:5px 10px}
.pcard--vaga{border-style:dashed; background:var(--gelo); box-shadow:none}
.pcard--vaga:hover{transform:none; box-shadow:none}
.pcard--vaga .pcard__body{justify-content:center; min-height:190px}
.pcard--vaga h3{color:var(--tinta-3)}
.pcard--vaga .pcard__hl{border-left-color:var(--tinta-3); color:var(--tinta-3) !important}
.nota-pend{margin:16px 0 0; padding:13px 15px; background:#FFFCE0; border-left:3px solid var(--amarelo); font-size:14px; line-height:1.55; color:var(--tinta-2)}
.nota-pend b{color:var(--tinta)}

/* ---------- depoimentos ---------- */
.dep__aviso{max-width:34ch; font-size:13.5px; line-height:1.5; color:var(--tinta-3); border-left:2px solid var(--amarelo); padding-left:13px}
.dep__card{margin:0; display:flex; flex-direction:column; background:#fff; border:1px dashed var(--linha); padding:26px 24px 24px}
.dep__card blockquote{margin:0 0 20px; font-size:16px; line-height:1.6; color:var(--tinta-3); flex:1}
.dep__card blockquote::before{content:"”"; display:block; font-size:52px; line-height:.6; color:var(--gelo-2); margin-bottom:12px}
.dep__card figcaption{border-top:1px solid var(--linha); padding-top:14px; display:flex; flex-direction:column}
.dep__card b{font-size:15px; color:var(--tinta)}
.dep__card figcaption span{font-size:13px; color:var(--tinta-3)}

/* ---------- mapa de presença ---------- */
.mapa__in{display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:clamp(28px,4vw,56px); align-items:center}
.mapa__fig{display:grid; place-items:center}
.mapa__fig svg{width:100%; max-width:420px; height:auto; overflow:visible}
.mapa__sombra{fill:var(--gelo-2); transform:translate(9px,10px)}
.mapa__br{fill:url(#gBr); stroke:#fff; stroke-width:1.5}
.pin__halo{fill:var(--amarelo); opacity:.25}
.pin__dot{fill:var(--amarelo); stroke:var(--azul-900); stroke-width:1.5}
.pin--sede .pin__dot{fill:var(--verde-claro); stroke:#fff; stroke-width:2}
.mapa__lista{display:flex; flex-direction:column; border-top:1px solid var(--linha)}
.mapa__lista li{display:flex; flex-direction:column; padding:14px 0 14px 16px; border-bottom:1px solid var(--linha); border-left:3px solid transparent; background:#fff}
.mapa__lista b{font-size:15.5px}
.mapa__lista span{font-size:13.5px; color:var(--tinta-3)}
.mapa__lista a{font-size:14px; font-weight:700; color:var(--azul-700); margin-top:3px}
.mapa__lista .is-sede{border-left-color:var(--verde)}

/* ---------- catálogos por setor ---------- */
.cat__card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--linha); border-top:3px solid var(--azul-700); padding:24px 22px 22px; transition:box-shadow .28s var(--ease), transform .28s var(--ease)}
.cat__card:hover{box-shadow:0 18px 40px rgba(11,61,92,.15); transform:translateY(-3px)}
.cat__card--full{border-top-color:var(--verde); background:var(--gelo)}
.cat__tag{font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--verde); margin-bottom:8px}
.cat__card h3{font-size:19px; margin-bottom:10px}
.cat__card p{font-size:14px; color:var(--tinta-2); line-height:1.55; flex:1}
.cat__fmt{display:block; margin-top:16px; padding-top:14px; border-top:1px solid var(--linha); font-style:normal; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-3)}

/* ---------- pop-up de cadastro ---------- */
.modal{position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:24px}
.modal[hidden]{display:none}
.modal__veu{position:absolute; inset:0; background:rgba(6,37,55,.66)}
.modal__cx{position:relative; width:100%; max-width:470px; background:#fff; border-top:4px solid var(--verde); padding:30px 30px 32px; max-height:90vh; overflow-y:auto; box-shadow:0 30px 70px rgba(6,37,55,.4)}
.modal__x{position:absolute; right:12px; top:12px; background:none; border:0; padding:8px; cursor:pointer; color:var(--tinta-3)}
.modal__x svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round}
.modal__cx h2{font-size:24px; letter-spacing:-.025em; margin:0 0 10px}
.modal__lede{font-size:15px; color:var(--tinta-2); line-height:1.55; margin-bottom:22px}
.modal__lede b{color:var(--tinta)}
.modal .form__grid{grid-template-columns:1fr}
body.is-travado{overflow:hidden}

@media (max-width:1080px){
  .orc{display:none}
  .mapa__in{grid-template-columns:1fr}
  .mapa__fig svg{max-width:330px}
}
@media (max-width:760px){
  .dep__aviso{max-width:none}
  .cta-par .btn{flex:1 1 auto; justify-content:center}
  .modal__cx{padding:26px 20px 28px}
  .modal{padding:14px}
}

/* =========================================================
   Ajustes pedidos pelo cliente (set/2026)
   ========================================================= */

/* Grade de linhas da home: nome + a condição de campo, sem o texto
   longo. O cliente pediu página mais limpa, com imagem e link. */
.linhas{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.linha{
  display:flex; align-items:center; gap:13px; height:100%;
  padding:11px 13px; background:#fff; border:1px solid var(--linha);
  transition:border-color .2s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.linha:hover{border-color:var(--azul-600); box-shadow:0 12px 26px rgba(11,61,92,.12); transform:translateY(-2px)}
.linha img{width:58px; height:46px; object-fit:cover; flex:0 0 58px; background:var(--gelo)}
.linha__txt{display:flex; flex-direction:column; flex:1; font-size:12.5px; color:var(--tinta-3); line-height:1.4}
.linha__txt b{font-size:14.5px; color:var(--tinta); font-weight:700; letter-spacing:-.01em; margin-bottom:2px}
.linha__go{flex:0 0 18px}
.linha__go svg{width:18px; height:18px; fill:none; stroke:var(--azul-600); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.linha--alt{background:var(--azul-800); border-color:var(--azul-800); flex-direction:column; align-items:flex-start; justify-content:center; gap:7px; padding:15px}
.linha--alt .linha__txt{color:rgba(255,255,255,.75)}
.linha--alt .linha__txt b{color:#fff}
.linha--alt em{font-style:normal; font-size:13px; font-weight:700; color:var(--amarelo)}
.linha--alt:hover{background:var(--azul-700); border-color:var(--azul-700)}

/* Megamenu com o portfólio completo: mais linhas, quatro colunas */
.mega__in{grid-template-columns:repeat(4,1fr)}
.mega__item img{width:52px; height:42px; flex:0 0 52px}

/* Marcas coloridas, como pedido no item 8 */
.brands__in{gap:clamp(22px,3.4vw,48px)}
.brands__list{gap:clamp(18px,2.6vw,38px); justify-content:space-between; flex-wrap:nowrap}
.brands__list img{height:var(--h,30px); opacity:1; filter:none}
.brands__list li:hover img{opacity:1}

/* Fachada da fábrica: o corte padrão pegava só o telhado */
.figure-wide--fachada img{height:clamp(300px,42vw,540px); object-position:50% 84%}

/* Menu de modelos com busca — linhas Indoor e Outdoor */
.busca{position:relative; display:flex; align-items:center; min-width:min(320px,100%)}
.busca__lbl{position:absolute; left:-9999px}
.busca__ic{position:absolute; left:13px; display:grid; place-items:center; pointer-events:none}
.busca__ic svg{width:18px; height:18px; fill:none; stroke:var(--tinta-3); stroke-width:2; stroke-linecap:round}
.busca input{
  width:100%; font:inherit; font-size:15px; color:var(--tinta);
  padding:13px 14px 13px 40px; background:#fff; border:1px solid var(--linha); border-radius:0;
  transition:border-color .2s var(--ease);
}
.busca input:focus{outline:none; border-color:var(--azul-600); box-shadow:0 0 0 3px rgba(21,105,156,.14)}
.modelos{display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-top:6px}
.modelo a{
  display:flex; flex-direction:column; gap:2px; height:100%;
  padding:15px 16px; background:#fff; border:1px solid var(--linha);
  transition:border-color .2s var(--ease), box-shadow .25s var(--ease);
}
.modelo a:hover{border-color:var(--azul-600); box-shadow:0 12px 26px rgba(11,61,92,.12)}
.modelo b{font-size:19px; font-weight:800; letter-spacing:-.02em; color:var(--tinta)}
.modelo span{font-size:13px; color:var(--tinta-2)}
.modelo em{font-style:normal; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--tinta-3); margin-top:6px}
.modelo svg{width:16px; height:16px; margin-top:10px; fill:none; stroke:var(--azul-600); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.modelo[hidden]{display:none}
.modelos__vazio{margin-top:16px; font-size:15px; color:var(--tinta-2)}
.modelos__nota{margin-top:20px; max-width:78ch; font-size:13.5px; color:var(--tinta-2); line-height:1.6}
.modelos__nota b{color:var(--tinta)}

/* Rodapé: cada telefone com o rótulo certo (item 18) */
.foot__contato li{display:flex; flex-direction:column; gap:1px}
.foot__contato span{font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.45)}

/* Espaço reservado para conteúdo que o cliente ainda vai enviar */
.reservado{max-width:74ch; padding:20px 22px; background:var(--gelo); border-left:3px solid var(--amarelo); font-size:15px; color:var(--tinta-2); line-height:1.6}
.reservado b{color:var(--tinta)}

/* Linha do tempo da fábrica */
.tempo{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.tempo__item{display:flex; flex-direction:column; background:#fff; border:1px solid var(--linha)}
.tempo__media{aspect-ratio:4/3; overflow:hidden; background:var(--azul-900)}
.tempo__media img{width:100%; height:100%; object-fit:cover}
.tempo__body{padding:16px 18px 20px}
.tempo__body b{display:block; font-size:22px; font-weight:800; letter-spacing:-.02em; color:var(--azul-700); margin-bottom:6px}
.tempo__body p{font-size:14px; color:var(--tinta-2); line-height:1.55; margin:0}

@media (max-width:1080px){
  .linhas{grid-template-columns:repeat(3,1fr)}
  .modelos{grid-template-columns:repeat(4,1fr)}
  .tempo{grid-template-columns:repeat(3,1fr)}
  .mega__in{grid-template-columns:1fr}
}
@media (max-width:760px){
  .linhas{grid-template-columns:repeat(2,1fr)}
  .modelos{grid-template-columns:repeat(2,1fr)}
  .tempo{grid-template-columns:1fr}
  .hero__in{padding-bottom:clamp(96px,18vw,120px)}
  .hero__nav{padding-bottom:18px}
  .shead--split .busca{width:100%}
  .brands__list img{height:calc(var(--h,30px) * .8)}
}
@media (max-width:480px){
  .linhas{grid-template-columns:1fr}
}

/* =========================================================
   Rodada 22/09
   ========================================================= */

/* ---------- banners: fotos sem escurecer (item 7) ---------- */
.hero__veil{background:linear-gradient(90deg, rgba(6,37,55,.78) 0%, rgba(6,37,55,.5) 34%, rgba(6,37,55,0) 62%)}
.hero__bg--produto{background:#005083 url(../img/banner-fundo.jpg) center/cover no-repeat}
.hero__in--produto{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); align-items:center; gap:clamp(20px,3vw,48px); width:100%; margin-inline:auto; padding-top:clamp(40px,5vw,64px); padding-bottom:clamp(84px,8vw,104px); min-height:clamp(420px,38vw,540px)}
.hero{grid-template-columns:minmax(0,1fr); overflow:clip}
.hero__nav{min-width:0}
.hero__dots{flex-wrap:wrap; min-width:0}
.hero__slide, .hero__rotulo, .hero__produto{min-width:0}
.hero__rotulo{align-self:center}
.hero__slide--produto h2{max-width:18ch; font-size:clamp(28px,3.3vw,44px); font-weight:800; font-style:italic; text-transform:uppercase; letter-spacing:-.01em; line-height:1.04}
.hero__sub{margin-top:14px; font-size:clamp(15px,1.3vw,17.5px); color:rgba(255,255,255,.9)}
.hero__saiba{margin-top:26px; gap:10px}
.hero__saiba svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.hero__produto{display:grid; place-items:center; height:100%}
.hero__produto img{width:100%; max-height:clamp(260px,30vw,430px); object-fit:contain; filter:drop-shadow(0 22px 26px rgba(0,20,40,.35))}

/* ---------- busca da home (item 14) ---------- */
.busca-home{background:var(--azul-800); padding:18px 0 4px}
.busca--home{max-width:760px}
.busca--home input{font-size:16px; padding:15px 16px 15px 44px; border-color:transparent}
.busca__res{position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:30; background:#fff; border:1px solid var(--linha); box-shadow:0 18px 40px rgba(11,61,92,.18); max-height:380px; overflow:auto}
.busca__res a{display:flex; flex-direction:column; padding:11px 16px; border-bottom:1px solid var(--gelo-2)}
.busca__res a b{font-size:15px; color:var(--tinta)}
.busca__res a span{font-size:13px; color:var(--tinta-3)}
.busca__res a:hover, .busca__res a.is-on{background:var(--gelo)}
.busca__res .busca__nada{padding:13px 16px; font-size:14px; color:var(--tinta-2)}

/* ---------- cards da home no tamanho original (item 1) ---------- */
.pcard__media--recorte{background:linear-gradient(180deg,#F6F9FB,var(--gelo-2))}
.pcard__media--recorte img{object-fit:contain; padding:14px}
.pcard--todas{background:var(--azul-800); border-color:var(--azul-800); color:#fff}
.pcard--todas .pcard__body{justify-content:center}
.pcard--todas h3{color:#fff}
.pcard--todas p{color:rgba(255,255,255,.75)}
.pcard--todas .pcard__go{color:var(--amarelo)}

/* ---------- logos dos fornecedores com link (item 11) ---------- */
.brands__list a{display:block}

/* ---------- página de produto: lógica de e-commerce (01/10) ----------
   Fotos à esquerda (miniaturas + foto grande, fixa ao rolar),
   nome e especificações técnicas à direita. */
.pbanner{background:#03101c; line-height:0}
.pbanner img{display:block; width:100%; max-width:2400px; height:auto; margin-inline:auto}
.pdp{padding:clamp(24px,3vw,40px) 0 clamp(48px,5vw,72px); border-bottom:1px solid var(--linha)}
.pdp__in{display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:clamp(28px,4vw,60px); align-items:start}

.pdp__galeria{position:sticky; top:110px; display:grid; grid-template-columns:76px minmax(0,1fr); gap:14px}
.pdp__galeria--uma{grid-template-columns:minmax(0,1fr)}
.pdp__thumbs{display:flex; flex-direction:column; gap:10px; max-height:min(620px,calc(100vh - 150px)); overflow-y:auto; scrollbar-width:none}
.pdp__thumbs::-webkit-scrollbar{display:none}
.pdp__thumb{display:block; width:76px; aspect-ratio:1; padding:6px; background:#fff; border:1px solid var(--linha); border-radius:var(--r); cursor:pointer; transition:border-color .2s var(--ease), box-shadow .2s var(--ease)}
.pdp__thumb img{width:100%; height:100%; object-fit:contain}
.pdp__thumb:hover{border-color:var(--tinta-3)}
.pdp__thumb.is-on{border-color:var(--azul-700); box-shadow:inset 0 0 0 1px var(--azul-700)}
.pdp__thumb:focus-visible, .pdp__chip:focus-visible, .pdp__seta:focus-visible{outline:2px solid var(--azul-600); outline-offset:2px}

.pdp__palco{position:relative; aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--linha); border-radius:var(--r); overflow:hidden}
.pdp__foto{width:100%; height:100%; object-fit:cover; transition:opacity .18s var(--ease)}
.pdp__foto.is-trocando{opacity:0}
.pdp__seta{position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; display:grid; place-items:center; background:rgba(255,255,255,.92); color:var(--tinta); border:1px solid var(--linha); border-radius:50%; cursor:pointer; opacity:0; transition:opacity .2s var(--ease), background .2s var(--ease), color .2s var(--ease)}
.pdp__palco:hover .pdp__seta, .pdp__seta:focus-visible{opacity:1}
.pdp__seta:hover{background:var(--azul-700); border-color:var(--azul-700); color:#fff}
.pdp__seta--ant{left:12px}
.pdp__seta--prox{right:12px}
.pdp__seta svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.pdp__conta{position:absolute; right:12px; bottom:12px; padding:3px 10px; font-size:12.5px; color:var(--tinta-2); background:var(--gelo); border-radius:20px; font-variant-numeric:tabular-nums}
.pdp__conta b{color:var(--tinta)}

.pdp__nome{font-size:clamp(30px,3.4vw,44px); line-height:1.08; letter-spacing:-.03em; font-weight:800; margin:0}
.pdp__cond{margin-top:8px; font-size:14px; color:var(--tinta-3)}
.pdp__lede{margin-top:18px; font-size:16.5px; color:var(--tinta-2); line-height:1.65}
.pdp__info .phead__hl{margin-top:14px}

.pdp__ficha{margin-top:26px; padding:22px 22px 20px; background:var(--gelo); border-radius:var(--r)}
.pdp__h{font-size:18px; font-weight:800; letter-spacing:-.01em; color:var(--azul-800); margin:0 0 14px}
.pdp__grupo{padding-bottom:18px; margin-bottom:16px; border-bottom:1px solid var(--linha)}
.pdp__rot{font-size:13px; font-weight:700; color:var(--tinta); margin-bottom:9px}
.pdp__rot span{font-weight:500; color:var(--tinta-3)}
.pdp__chips{display:flex; flex-wrap:wrap; gap:7px}
.pdp__chip{padding:7px 12px; font:inherit; font-size:13.5px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--tinta); background:#fff; border:1px solid var(--linha); border-radius:var(--r); cursor:pointer; transition:background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), transform .12s var(--ease)}
.pdp__chip:hover{border-color:var(--azul-700); color:var(--azul-700)}
.pdp__chip:active{transform:scale(.97)}
.pdp__chip[aria-pressed="true"]{background:var(--azul-700); border-color:var(--azul-700); color:#fff}
.pdp__mais{display:inline-flex; align-items:center; gap:6px; margin-top:12px; font-size:13.5px; font-weight:700; color:var(--azul-700)}
.pdp__mais svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.pdp__mais:hover{text-decoration:underline}
.pdp__specs li{position:relative; padding:9px 0 9px 22px; font-size:14.5px; line-height:1.55; color:var(--tinta-2); border-top:1px solid var(--linha)}
.pdp__specs li:first-child{border-top:0; padding-top:0}
.pdp__specs li::before{content:""; position:absolute; left:2px; top:17px; width:8px; height:5px; border-left:2px solid var(--verde); border-bottom:2px solid var(--verde); transform:rotate(-45deg)}
.pdp__specs li:first-child::before{top:8px}
.pdp__nota{margin-top:12px; font-size:12.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--tinta-3)}

.pdp__cta{margin-top:22px; display:flex; flex-direction:column; gap:10px}
.pdp__cta .btn{gap:9px}
.pdp__cta svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.pdp__cta2{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.pdp__cta2 .btn{padding-inline:14px}
.pdp__sla{font-size:13px; color:var(--tinta-3); text-align:center}

@media (max-width:900px){
  .pdp__in{grid-template-columns:1fr}
  .pdp__galeria{position:static; grid-template-columns:minmax(0,1fr)}
  .pdp__thumbs{order:2; flex-direction:row; max-height:none; overflow-x:auto}
  .pdp__thumb{flex:0 0 64px; width:64px}
  .pdp__palco{aspect-ratio:4/3}
  .pdp__seta{opacity:1}
}
@media (max-width:480px){
  .pdp__cta2{grid-template-columns:1fr}
  .pdp__ficha{padding:18px 16px}
}
@media (prefers-reduced-motion:reduce){
  .pdp__foto, .pdp__chip, .pdp__thumb{transition:none}
}

.ticks__nota{margin-top:22px; font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--tinta-3)}

.seo__in{max-width:860px}
.seo h2{font-size:clamp(21px,2vw,26px); line-height:1.25; letter-spacing:-.02em; margin:34px 0 12px}
.seo h2:first-of-type{margin-top:26px}
.seo h3{font-size:17px; margin:22px 0 6px}
.seo p{font-size:16px; color:var(--tinta-2); line-height:1.7; margin:0 0 12px}
.seo a{color:var(--azul-700); font-weight:600; text-decoration:underline}
.seo ul{margin:6px 0 14px; display:flex; flex-direction:column; gap:8px}
.seo li{position:relative; padding-left:20px; font-size:15.5px; color:var(--tinta-2); line-height:1.6}
.seo li::before{content:""; position:absolute; left:0; top:.68em; width:8px; height:2px; background:var(--verde)}
.seo b{color:var(--tinta)}
.seo__tabela{overflow-x:auto; margin:8px 0 14px}
.seo table{width:100%; min-width:520px; border-collapse:collapse; background:#fff; font-size:14.5px}
.seo td{padding:12px 14px; border:1px solid var(--linha); color:var(--tinta-2); vertical-align:top}
.seo tr:first-child td{background:var(--azul-800); color:#fff}
.seo tr:first-child b{color:#fff}

.dif__grade{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.dif__item{display:grid; grid-template-columns:96px 1fr; gap:16px; align-items:start; background:#fff; border:1px solid var(--linha); padding:18px}
.dif__item--sem-img{grid-template-columns:1fr}
.dif__img{width:96px; height:96px; display:flex; align-items:center; justify-content:center; background:#fff}
/* Tamanho explícito: imagens lazy com sizes="auto" recebem do WP um placeholder de 3000x1500 */
.dif__img img{width:100%; height:100%; object-fit:contain}
.dif__item h3{font-size:15.5px; line-height:1.3; margin:0 0 6px}
.dif__item p{font-size:13.5px; color:var(--tinta-2); line-height:1.55; margin:0}
.dif__item .dif__selo{display:inline-block; margin-top:10px; padding:8px 12px; background:var(--azul-700); color:#fff; font-size:12.5px; font-weight:700; line-height:1.35; text-transform:uppercase; letter-spacing:.02em}
.block--gelo + .block--gelo{padding-top:0}

/* ---------- cronologia (item 15) ---------- */
.tempo{display:flex; gap:0; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:14px; scrollbar-color:var(--azul-600) var(--gelo-2)}
.tempo__item{flex:0 0 auto; scroll-snap-align:start; display:flex; flex-direction:column; background:none; border:0; padding-right:18px; position:relative}
.tempo__item::before{content:""; position:absolute; left:0; right:0; top:19px; height:2px; background:var(--linha)}
.tempo__ano{position:relative; align-self:flex-start; font-size:22px; font-weight:800; letter-spacing:-.02em; color:var(--azul-700); background:#fff; padding-right:12px; line-height:40px}
.tempo__ano::before{content:""; display:inline-block; width:12px; height:12px; border-radius:50%; background:var(--verde-claro); box-shadow:0 0 0 4px #fff, 0 0 0 5px var(--linha); margin-right:10px; vertical-align:2px}
.tempo__fotos{display:flex; gap:8px; margin-top:10px}
.tempo__fotos img{height:clamp(170px,17vw,220px); width:auto; max-width:none; object-fit:cover; background:var(--gelo)}
.tempo__txt{margin-top:10px; max-width:34ch; font-size:14px; color:var(--tinta-2); line-height:1.55}

/* ---------- mapa de representantes (item 10) ---------- */
.mapa__fig svg{max-width:460px}
.mapa__uf{fill:#DCE6EE; stroke:#fff; stroke-width:.9; stroke-linejoin:round; transition:fill .2s var(--ease)}
.mapa__uf.is-on{fill:var(--azul-700)}
.mapa__uf.is-on:hover{fill:var(--azul-600)}
.pin__gota{fill:var(--amarelo); stroke:var(--azul-900); stroke-width:1.2}
.pin__furo{fill:var(--azul-900)}
.pin--sede .pin__gota{fill:var(--verde-claro); stroke:#fff; stroke-width:1.6}
.pin--sede .pin__furo{fill:#fff}
.mapa__leg{display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin-top:14px; font-size:13px; color:var(--tinta-2)}
.mapa__leg span{display:inline-block; width:12px; height:12px; margin-right:-10px; vertical-align:-1px}
.mapa__leg-sede{background:var(--verde-claro); border-radius:50%}
.mapa__leg-pin{background:var(--amarelo); border:1px solid var(--azul-900); border-radius:50% 50% 50% 0}
.mapa__leg-uf{background:var(--azul-700)}
.mapa__lado{display:flex; flex-direction:column}
.mapa__sede{display:flex; flex-direction:column; padding:14px 16px; background:#fff; border-left:3px solid var(--verde); margin-bottom:22px}
.mapa__sede b{font-size:15.5px}
.mapa__sede span{font-size:13.5px; color:var(--tinta-3)}
.mapa__sede a{font-size:14px; font-weight:700; color:var(--azul-700); margin-top:3px}
.mapa__h{font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--tinta-3); margin:0 0 8px}
.mapa__lista{display:grid; grid-template-columns:1fr 1fr; gap:0 18px; border-top:0; margin-bottom:22px}
.mapa__lista li{padding:9px 0; border-left:0; background:none}
.mapa__lista b{font-size:14.5px}

@media (max-width:1080px){
  .dif__grade{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .hero__in--produto{grid-template-columns:1fr; gap:6px; min-height:0; padding-top:34px}
  .hero__dot{width:12px}
  .hero__dot.is-on{width:24px}
  .hero__dots{gap:5px}
  .hero__produto{order:-1}
  .hero__produto img{max-height:210px}
  .dif__grade{grid-template-columns:1fr}
  .tempo__fotos img{height:170px}
  .mapa__lista{grid-template-columns:1fr}
}
.tempo__nav{display:flex; gap:8px}
.tempo__seta{position:static; transform:none; background:var(--azul-800); border-color:var(--azul-800)}
.mapa__lado .btn{gap:10px}
.mapa__lado .btn svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.tempo__fotos img{width:280px; height:200px; object-fit:cover}
@media (max-width:760px){ .tempo__fotos img{width:230px; height:165px} }

/* ---------- banner de arte pronta na home (02/10) ----------
   A peça já traz logo e texto: entra inteira, na proporção dela. */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.hero__slide--arte{display:block}
.hero__arte{display:block; line-height:0}
.hero__arte img{display:block; width:100%; height:auto; aspect-ratio:3400/687}

/* =========================================================
   Vitrine 3D da home (13/10)
   O palco fica preso na tela enquanto a seção rola; o JS
   (assets/vitrine3d.js) escreve data-etapa (0 a 5) e posiciona
   os pinos. O HTML sai com .v3d--estatico (sem JS, sem WebGL
   ou com "menos movimento" ela continua assim: imagem ou modelo
   ao lado e etapas em lista).
   ========================================================= */
.v3d{position:relative; height:540vh; background:#04131d; color:#fff}
.v3d__stage{
  position:sticky; top:0; height:100vh; height:100svh; overflow:hidden;
  background:radial-gradient(120% 85% at 64% 64%, #11486a 0%, #0a2c42 34%, #061a27 62%, #030d15 100%);
}
/* ambientes por etapa: camadas sobre o estúdio, a opacidade de cada uma
   é escrita pelo JS conforme a rolagem (troca suave entre etapas) */
.v3d__amb{position:absolute; inset:0; pointer-events:none}
.v3d__amb-l{position:absolute; inset:0; opacity:0; will-change:opacity}
.v3d__amb-l[data-amb="frio"]{
  background:
    radial-gradient(45% 45% at 0% 0%, rgba(215,245,255,.20), transparent 70%),
    radial-gradient(45% 45% at 100% 0%, rgba(215,245,255,.16), transparent 70%),
    radial-gradient(60% 55% at 64% 52%, rgba(120,225,255,.30), transparent 72%),
    radial-gradient(120% 90% at 64% 64%, #12607f 0%, #0a3550 38%, #051c2c 72%, #020b13 100%);
}
.v3d__amb-l[data-amb="planta"]{
  background:
    linear-gradient(rgba(170,215,255,.13) 1px, transparent 1px) 0 0/64px 64px,
    linear-gradient(90deg, rgba(170,215,255,.13) 1px, transparent 1px) 0 0/64px 64px,
    linear-gradient(rgba(170,215,255,.05) 1px, transparent 1px) 0 0/16px 16px,
    linear-gradient(90deg, rgba(170,215,255,.05) 1px, transparent 1px) 0 0/16px 16px,
    radial-gradient(110% 85% at 62% 55%, #15558e 0%, #0c3d6b 45%, #072646 100%);
}
.v3d__amb-l[data-amb="rua"]{
  background:linear-gradient(180deg, #0a1130 0%, #1c2452 16%, #3d3363 27%, #7a4864 35%, #b46a5c 42%, #e29a64 50%, #f3bd7e 58%, #b46a5c 70%, #3a2a30 100%);
}
.v3d__amb-l[data-amb="chuva"]{
  background:
    radial-gradient(70% 40% at 50% 0%, rgba(160,180,200,.18), transparent 70%),
    linear-gradient(180deg, #161e26 0%, #26323d 40%, #3a4653 58%, #1a222a 61%, #0e1419 100%);
}
.v3d__flash{
  position:absolute; inset:0; opacity:0;
  background:radial-gradient(80% 60% at 40% 0%, rgba(225,238,255,.95), rgba(190,210,240,.35) 45%, transparent 80%);
}

.v3d__glow{
  position:absolute; left:64%; bottom:-30vh; width:110vw; height:70vh; transform:translateX(-50%);
  background:radial-gradient(50% 50% at 50% 50%, rgba(140,205,255,.14), transparent 70%);
  pointer-events:none;
}
.v3d__canvas{
  position:absolute; inset:0; width:100%; height:100%; display:block;
  cursor:grab; touch-action:pan-y; outline:none;
  opacity:0; transition:opacity 1s var(--ease);
}
.v3d.is-ready .v3d__canvas{opacity:1}
.v3d__canvas.is-dragging{cursor:grabbing}
.v3d__fallback{display:none}
.v3d__ui{position:relative; height:100%; pointer-events:none}
.v3d__ui a{pointer-events:auto}

.v3d__intro{
  position:absolute; left:28px; top:calc(78px + 8vh); max-width:480px;
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.v3d__intro h2{color:#fff; font-size:clamp(34px,4.4vw,60px); line-height:1.02; letter-spacing:-.035em; margin:0 0 18px}
.v3d__intro h2 em{color:var(--amarelo); font-weight:300}
.v3d__lead{color:rgba(255,255,255,.72); font-size:16.5px; line-height:1.6; max-width:38ch}
/* dica de rolagem (15/10): ícone no lugar do texto "Role a página..." — mouse no desktop, dedo no celular */
.v3d__dica{display:flex; align-items:center; gap:14px; margin:14px 0 0; color:rgba(255,255,255,.78)}
.v3d__mouse{position:relative; width:28px; height:44px; border:2px solid currentColor; border-radius:15px}
.v3d__mouse i{position:absolute; left:50%; top:7px; width:4px; height:8px; margin-left:-2px; border-radius:2px; background:var(--amarelo); animation:v3dRoda 1.8s var(--ease) infinite}
.v3d__dedo{display:none; width:34px; height:34px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; animation:v3dDedo 1.8s var(--ease) infinite}
.v3d__setas{display:flex; flex-direction:column; gap:2px}
.v3d__setas i{display:block; width:10px; height:10px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); opacity:.35; animation:v3dSeta 1.8s var(--ease) infinite}
.v3d__setas i+i{animation-delay:.25s}
@keyframes v3dRoda{0%{transform:translateY(0); opacity:0} 15%{opacity:1} 60%{transform:translateY(12px); opacity:1} 80%,100%{transform:translateY(14px); opacity:0}}
@keyframes v3dSeta{0%,100%{opacity:.35} 40%{opacity:1}}
@keyframes v3dDedo{0%,100%{transform:translateY(4px)} 50%{transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){ .v3d__mouse i, .v3d__dedo, .v3d__setas i{animation:none; opacity:1} }

.v3d__steps{list-style:none; margin:0; padding:0}
.v3d__step{
  position:absolute; left:28px; bottom:14vh; max-width:400px;
  opacity:0; transform:translateY(22px);
  transition:opacity .55s var(--ease), transform .55s var(--ease);
}
.v3d__step h3{color:#fff; font-size:clamp(25px,2.6vw,36px); letter-spacing:-.03em; line-height:1.08; margin:14px 0 12px}
.v3d__step p{color:rgba(255,255,255,.74); font-size:16px; line-height:1.6}
.v3d__num{display:inline-block; font-size:12px; font-weight:800; letter-spacing:.16em; color:#04131d; background:var(--amarelo); padding:4px 8px; border-radius:2px}

.v3d__cta{
  position:absolute; left:28px; bottom:14vh; display:flex; flex-wrap:wrap; gap:12px;
  opacity:0; transform:translateY(22px); visibility:hidden;
  transition:opacity .55s var(--ease), transform .55s var(--ease), visibility 0s .55s;
}

.v3d__cta{flex-direction:column; align-items:flex-start}
.v3d__cta-txt{max-width:400px; margin-bottom:10px}
.v3d__cta-txt h3{color:#fff; font-size:clamp(25px,2.6vw,36px); letter-spacing:-.03em; line-height:1.08; margin:0 0 10px}
.v3d__cta-txt p{color:rgba(255,255,255,.7); font-size:15.5px; line-height:1.6}
.v3d__cta .btn{min-width:250px}

.v3d__rail{
  position:absolute; left:28px; top:calc(78px + 6vh);
  list-style:none; margin:0; padding:0; display:flex; gap:26px;
  font-size:12.5px; font-weight:600; color:rgba(255,255,255,.4);
  opacity:0; transition:opacity .5s var(--ease);
}
.v3d[data-etapa="1"] .v3d__rail, .v3d[data-etapa="2"] .v3d__rail,
.v3d[data-etapa="3"] .v3d__rail, .v3d[data-etapa="4"] .v3d__rail{opacity:1}
.v3d__rail li{position:relative; display:flex; gap:8px; padding-top:14px; transition:color .4s var(--ease)}
.v3d__rail li::after{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:rgba(255,255,255,.14)}
.v3d__rail li::before{
  content:""; position:absolute; left:0; right:0; top:0; height:2px; z-index:1;
  background:var(--amarelo); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease);
}
.v3d__rail span{font-variant-numeric:tabular-nums; opacity:.7}

.v3d__hint{
  position:absolute; left:64%; bottom:5vh; transform:translateX(-50%);
  display:flex; align-items:center; gap:8px; margin:0;
  font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.55);
  transition:opacity .5s var(--ease);
}
.v3d__hint svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}

/* pinos ancorados em peças do modelo (posição escrita pelo JS) */
.v3d__pins{position:absolute; inset:0; pointer-events:none}
.v3d__pin{
  position:absolute; left:0; top:0; display:flex; align-items:center;
  opacity:0; transition:opacity .45s var(--ease);
  font-size:13px; font-weight:700; color:#fff; white-space:nowrap; will-change:transform;
}
.v3d__pin.is-on{opacity:1}
.v3d__pin i{position:relative; flex:0 0 12px; width:12px; height:12px; margin-left:-6px; border-radius:50%; background:var(--amarelo); box-shadow:0 0 0 4px rgba(255,239,0,.2)}
.v3d__pin i::after{content:""; position:absolute; inset:-4px; border-radius:50%; border:1px solid rgba(255,239,0,.7); animation:v3dPulso 2.2s var(--ease) infinite}
.v3d__pin s{flex:0 0 28px; height:1px; background:rgba(255,255,255,.55)}
.v3d__pin b{padding:7px 11px; border-radius:3px; background:rgba(4,19,29,.74); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px)}
.v3d__pin--esq{flex-direction:row-reverse}
.v3d__pin--esq i{margin:0 -6px 0 0}
@keyframes v3dPulso{0%{transform:scale(.6); opacity:1} 100%{transform:scale(2.2); opacity:0}}

/* estados por etapa */
.v3d:not([data-etapa="0"]) .v3d__intro{opacity:0; transform:translateY(-18px)}
.v3d[data-etapa="1"] .v3d__step[data-etapa="1"],
.v3d[data-etapa="2"] .v3d__step[data-etapa="2"],
.v3d[data-etapa="3"] .v3d__step[data-etapa="3"],
.v3d[data-etapa="4"] .v3d__step[data-etapa="4"]{opacity:1; transform:none}
.v3d[data-etapa="5"] .v3d__cta{opacity:1; transform:none; visibility:visible; transition-delay:0s}
.v3d[data-etapa="1"] .v3d__rail li[data-etapa="1"],
.v3d[data-etapa="2"] .v3d__rail li[data-etapa="2"],
.v3d[data-etapa="3"] .v3d__rail li[data-etapa="3"],
.v3d[data-etapa="4"] .v3d__rail li[data-etapa="4"]{color:#fff}
.v3d[data-etapa="1"] .v3d__rail li[data-etapa="1"]::before,
.v3d[data-etapa="2"] .v3d__rail li[data-etapa="2"]::before,
.v3d[data-etapa="3"] .v3d__rail li[data-etapa="3"]::before,
.v3d[data-etapa="4"] .v3d__rail li[data-etapa="4"]::before{transform:scaleX(1)}
.v3d.is-dragged .v3d__hint, .v3d:not([data-etapa="0"]):not([data-etapa="5"]) .v3d__hint{opacity:0}

/* estático: seção de altura normal, mídia à direita, etapas em lista */
.v3d--estatico{height:auto}
.v3d--estatico .v3d__stage{position:relative; height:auto; padding:calc(var(--pad-y) + 8px) 0 var(--pad-y)}
.v3d--estatico .v3d__canvas{left:46%; width:54%; top:50%; height:min(82vh,700px); transform:translateY(-50%)}
.v3d--estatico .v3d__fallback{display:block; position:absolute; left:52%; top:50%; transform:translateY(-50%); width:min(42%,560px); height:auto; border-radius:6px; box-shadow:0 40px 80px rgba(0,0,0,.45)}
.v3d--estatico.is-ready .v3d__fallback{display:none}
.v3d--estatico .v3d__ui{height:auto}
.v3d--estatico .v3d__intro, .v3d--estatico .v3d__step, .v3d--estatico .v3d__cta{position:static; opacity:1; transform:none; visibility:visible; max-width:440px}
.v3d--estatico .v3d__steps{display:grid; gap:24px; margin:34px 0 34px}
.v3d--estatico .v3d__step h3{font-size:22px; margin:10px 0 6px}
.v3d--estatico .v3d__step p{font-size:15px}
.v3d--estatico .v3d__rail, .v3d--estatico .v3d__pins{display:none}
.v3d--estatico .v3d__hint{left:73%; bottom:24px}
.v3d--estatico:not(.is-ready) .v3d__hint{display:none}
.v3d--estatico .v3d__dica{display:none}

@media (max-width:900px){
  .v3d{height:480vh}
  .v3d__intro{left:20px; right:20px; top:calc(78px + 3vh)}
  .v3d__intro h2{font-size:clamp(30px,8.4vw,42px); margin-bottom:12px}
  .v3d__lead{font-size:15px}
  .v3d__mouse{display:none}
  .v3d__dedo{display:block}
  .v3d__step, .v3d__cta{left:20px; right:20px; bottom:calc(84px + 2vh); max-width:none}
  .v3d__step{padding:18px 18px 20px; background:rgba(4,19,29,.6); border:1px solid rgba(255,255,255,.1); border-radius:4px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
  .v3d__step h3{font-size:22px; margin:10px 0 8px}
  .v3d__step p{font-size:14.5px}
  .v3d__cta .btn{min-width:0; width:100%}
  .v3d__cta{padding:18px 18px 20px; background:rgba(4,19,29,.6); border:1px solid rgba(255,255,255,.1); border-radius:4px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
  .v3d__cta-txt h3{font-size:22px}
  .v3d__cta-txt p{font-size:14.5px}
  .v3d__rail, .v3d__hint{display:none}
  .v3d__pin{font-size:11.5px}
  .v3d__pin b{padding:5px 8px}
  .v3d__pin s{flex-basis:12px}
  .v3d--estatico .v3d__stage{padding-top:0}
  .v3d--estatico .v3d__canvas{position:relative; left:auto; top:auto; transform:none; width:100%; height:92vw}
  .v3d--estatico .v3d__fallback{position:relative; left:auto; top:auto; transform:none; width:calc(100% - 40px); margin:32px auto 0}
  .v3d--estatico .v3d__intro{padding-top:28px}
  .v3d--estatico .v3d__intro, .v3d--estatico .v3d__step, .v3d--estatico .v3d__cta{max-width:none}
  .v3d--estatico .v3d__step{padding:0; background:none; border:0; backdrop-filter:none; -webkit-backdrop-filter:none}
}
@media (prefers-reduced-motion:reduce){
  .v3d__pin i::after{animation:none}
}

/* Ajuste para barra de administração do WordPress */
body.admin-bar .head { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .head { top: 46px; }
}
