/* ============================================================
   Archivo — servida pelo próprio site.
   Antes vinha do Google Fonts, o que entregava o IP de cada visitante
   ao Google em toda página. Hospedando aqui, esse terceiro sai do site.
   Arquivo variável: um só cobre os pesos 300 a 900.
   Archivo · SIL Open Font License 1.1 · github.com/Omnibus-Type/Archivo
   ============================================================ */
@font-face{
  font-family:"Archivo";
  font-style:normal;
  font-weight:300 900;
  font-display:swap;
  src:url("fonte/archivo-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:"Archivo";
  font-style:normal;
  font-weight:300 900;
  font-display:swap;
  src:url("fonte/archivo-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-20C0,
    U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ============================================================
   DIRAMAK · sistema do site
   Manual de marca v1.0 — cromia 70/20/10, canto zero,
   tudo alinhado à esquerda, uma régua de motion por página.
   ============================================================ */
:root{
  --violeta:#2E1065;
  --violeta-eletrico:#5B21D6;
  --verde:#C7FF1F;
  --tinta:#1A1520;
  --papel:#F4F3F6;

  --v200:#D6C8F3;
  --v300:#B79FE9;
  --v800:#341070;
  --v900:#22074C;

  --fio:rgba(244,243,246,.16);
  --fio-forte:rgba(244,243,246,.32);

  --gut:clamp(20px,5vw,80px);
  --max:1520px;
  --sans:"Archivo","Arial",system-ui,sans-serif;

  /* ritmo vertical */
  --s1:clamp(48px,5.5vw,96px);
  --s2:clamp(28px,3vw,48px);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--violeta);color:var(--papel);
  font-family:var(--sans);font-weight:400;line-height:1.55;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img{display:block;width:100%;height:auto;}
a{color:inherit;}
:focus-visible{outline:3px solid var(--verde);outline-offset:3px;}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.001ms!important;}}

.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut);}
.bleed{max-width:var(--max);margin:0 auto;}
.escuro{background:var(--tinta);}
.pula{
  position:absolute;left:-9999px;top:0;background:var(--verde);color:var(--tinta);
  padding:12px 18px;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;z-index:99;
}
.pula:focus{left:0;}

/* ---------- assinatura ---------- */
.mark{display:block;height:auto;width:var(--sig-w,160px);}
.sig{display:inline-flex;flex-direction:column;align-items:flex-start;text-decoration:none;}
.sig .desc{
  display:flex;align-items:center;gap:.55em;margin-top:.42em;
  font-size:max(10px,calc(var(--sig-w,160px)*.062));
  font-weight:400;letter-spacing:.2em;line-height:1;text-transform:lowercase;
  color:var(--v200);
}
.sig .desc::before{
  content:"";display:block;width:max(18px,calc(var(--sig-w,160px)*.16));height:2px;
  background:var(--verde);flex:none;
}

/* ---------- tipografia ---------- */
.eyebrow{
  margin:0;font-size:11px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--verde);
}
.label{
  margin:0;font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--v300);
}
.display{
  margin:0;font-weight:900;letter-spacing:-.042em;line-height:1.02;
  font-size:clamp(40px,5.4vw,78px);max-width:15ch;text-wrap:balance;
}
.h2{
  margin:0;font-weight:900;letter-spacing:-.038em;line-height:1.08;
  font-size:clamp(25px,2.9vw,40px);max-width:18ch;text-wrap:balance;
}
.h3{margin:0;font-weight:900;letter-spacing:-.02em;line-height:1.15;font-size:clamp(17px,1.5vw,20px);}
.lead{margin:0;font-weight:300;font-size:clamp(17px,1.35vw,20px);line-height:1.5;max-width:44ch;color:var(--v200);}
.body{margin:0;font-size:15px;line-height:1.65;max-width:60ch;font-weight:300;color:var(--v200);}
.body + .body{margin-top:1em;}
.body strong{font-weight:700;color:var(--papel);}

.spec{display:flex;align-items:baseline;gap:.35em;font-variant-numeric:tabular-nums;}
.spec b{font-weight:900;font-size:clamp(28px,3.2vw,44px);letter-spacing:-.035em;line-height:1;color:var(--verde);}
.spec i{font-style:normal;font-weight:400;font-size:14px;color:var(--v200);}

/* dado que ainda não chegou — discreto, nunca decorativo */
.pend{color:var(--v300);font-weight:400;font-style:italic;letter-spacing:0;}
.pend::before{content:"— ";}

.cta{
  display:inline-flex;align-items:center;gap:.7em;
  font-size:12.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  padding:16px 26px;border:0;text-decoration:none;transition:background .18s,color .18s;
}
.cta--verde{background:var(--verde);color:var(--tinta);}
.cta--verde:hover{background:#d8ff5c;}
.cta--linha{background:transparent;color:var(--papel);box-shadow:inset 0 0 0 2px var(--fio-forte);}
.cta--linha:hover{box-shadow:inset 0 0 0 2px var(--verde);color:var(--verde);}
.acoes{display:flex;gap:2px;flex-wrap:wrap;}

/* o botão de download carrega a etiqueta do arquivo na segunda linha */
.cta span{
  display:block;font-size:10px;font-weight:500;letter-spacing:.08em;
  text-transform:none;opacity:.72;margin-top:3px;
}
.cta--verde span{color:var(--tinta);}

/* ---------- lista de materiais para baixar ---------- */
.baixas{margin-top:var(--s2);border-top:2px solid var(--fio);}
.baixa{
  display:grid;grid-template-columns:1fr auto auto;align-items:center;
  gap:clamp(14px,2vw,40px);padding:22px 0;
  border-bottom:2px solid var(--fio);text-decoration:none;
  transition:padding-left .18s,background .18s;
}
.baixa:hover{background:var(--v800);padding-left:18px;}
.baixa-nome{font-size:clamp(16px,1.6vw,20px);font-weight:800;letter-spacing:-.02em;}
.baixa-meta{
  font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--v300);font-variant-numeric:tabular-nums;
}
.baixa-acao{
  display:grid;place-items:center;width:38px;height:38px;flex:none;
  font-size:17px;color:var(--tinta);background:var(--verde);
}
@media (max-width:640px){
  .baixa{grid-template-columns:1fr auto;row-gap:6px;}
  .baixa-meta{grid-column:1;}
  .baixa-acao{grid-row:1 / span 2;grid-column:2;}
}
.link{
  display:inline-flex;align-items:center;gap:.55em;font-size:12px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--verde);
}
.link span{transition:transform .18s;}
.link:hover span{transform:translateX(5px);}

/* ---------- navegação ---------- */
.topo{border-bottom:2px solid var(--fio);background:var(--violeta);position:relative;z-index:20;}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px;}
.topo .sig{--sig-w:146px;}
.topo ul{display:flex;gap:clamp(16px,1.8vw,30px);flex-wrap:wrap;list-style:none;margin:0;padding:0;}
.topo a:not(.sig){
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  text-decoration:none;color:var(--v200);padding-bottom:4px;border-bottom:2px solid transparent;
  transition:color .16s;
}
.topo a:not(.sig):hover{color:var(--verde);}
.topo a[aria-current]{color:var(--verde);border-bottom-color:var(--verde);}

/* ---------- régua de motion ---------- */
.regua{height:88px;}
.regua svg{display:block;width:100%;height:100%;}

/* ---------- hero com foto e véu (manual §12) ---------- */
.capa{position:relative;background:var(--tinta);isolation:isolate;min-height:clamp(460px,52vw,680px);display:flex;align-items:flex-end;}
.capa-foto{position:absolute;inset:0;overflow:hidden;}
.capa-foto img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center);}
.capa-foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,
    rgba(46,16,101,.97) 0%,
    rgba(46,16,101,.93) 30%,
    rgba(46,16,101,.86) 52%,
    rgba(46,16,101,.55) 70%,
    rgba(46,16,101,.16) 88%,
    rgba(46,16,101,0) 100%);
}
.capa .wrap{position:relative;z-index:2;width:100%;padding-top:clamp(120px,16vw,200px);padding-bottom:var(--s1);}
.capa .display{margin:18px 0 22px;}
.capa .acoes{margin-top:34px;}

/* hero de texto, sem foto */
.capa--seca{background:var(--violeta);}
.capa--seca{min-height:0;}
.capa--seca .wrap{padding-top:var(--s1);}

/* ---------- faixa de números ---------- */
.numeros{border-top:2px solid var(--fio);border-bottom:2px solid var(--fio);}
.numeros .wrap{display:grid;grid-template-columns:repeat(var(--n,3),1fr);padding:0;}
.numeros .cel{padding:var(--s2) clamp(18px,2vw,34px);border-right:2px solid var(--fio);}
.numeros .cel:first-child{padding-left:var(--gut);}
.numeros .cel:last-child{border-right:0;padding-right:var(--gut);}
.numeros .label{margin-top:12px;}

/* ---------- cabeçalho de seção ---------- */
.sec{padding-top:var(--s1);padding-bottom:var(--s2);}
.sec-hd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(24px,4vw,72px);align-items:end;}
.sec-hd .h2{margin-top:16px;}

/* ---------- lista de divisões ---------- */
.divisoes{border-top:2px solid var(--fio);}
.divisao{
  display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.15fr) auto;
  gap:clamp(20px,3vw,56px);align-items:center;
  padding:clamp(24px,2.6vw,36px) var(--gut);
  border-bottom:2px solid var(--fio);
  text-decoration:none;color:inherit;transition:background .2s;
  max-width:var(--max);margin:0 auto;
}
.divisao:hover{background:var(--v800);}
.divisao .n{font-size:12px;font-weight:900;color:var(--verde);font-variant-numeric:tabular-nums;letter-spacing:.06em;}
.divisao .nome{
  display:block;font-size:clamp(20px,2vw,27px);font-weight:900;letter-spacing:-.03em;line-height:1.1;margin:0;
}
.divisao .desc-frente{
  display:flex;align-items:center;gap:.55em;margin-top:9px;
  font-size:12px;font-weight:400;letter-spacing:.2em;text-transform:lowercase;color:var(--v300);
}
.divisao .desc-frente::before{content:"";display:block;width:22px;height:2px;background:var(--verde);flex:none;}
.divisao .txt{display:block;font-size:14.5px;font-weight:300;line-height:1.6;color:var(--v200);}
.divisao .seta{font-size:24px;font-weight:900;color:var(--verde);transition:transform .2s;line-height:1;}
.divisao:hover .seta{transform:translateX(7px);}

/* ---------- galeria ---------- */
.galeria{display:grid;grid-template-columns:repeat(var(--n,4),1fr);border-top:2px solid var(--fio);}
.galeria figure{
  margin:0;border-right:2px solid var(--fio);border-bottom:2px solid var(--fio);
  background:var(--tinta);
}
.galeria figure:last-child{border-right:0;}
.galeria .q{aspect-ratio:4/3;overflow:hidden;background:var(--foto-bg,var(--tinta));}
.galeria img{width:100%;height:100%;object-fit:var(--foto-fit,cover);}
.galeria figcaption{padding:14px 18px 18px;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--v200);}

/* ---------- foto de estúdio: fundo branco original, produto inteiro ---------- */
.estudio{--foto-bg:#FEFEFE;--foto-fit:contain;}

/* ---------- foto larga ---------- */
.foto-larga{border-top:2px solid var(--fio);border-bottom:2px solid var(--fio);background:var(--tinta);}
.foto-larga .q{aspect-ratio:16/9;overflow:hidden;max-width:var(--max);margin:0 auto;background:var(--foto-bg,var(--tinta));}
.foto-larga img{width:100%;height:100%;object-fit:var(--foto-fit,cover);object-position:var(--pos,center);}

/* ---------- bloco duplo ---------- */
.duplo{border-top:2px solid var(--fio);}
.duplo .bleed{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;}
.duplo-foto{background:var(--tinta);overflow:hidden;min-height:clamp(300px,34vw,520px);}
.duplo-foto img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,center);}
.duplo-txt{
  padding:var(--s1) clamp(28px,3.4vw,64px);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
}
.duplo .bleed > .duplo-txt:first-child{padding-left:var(--gut);}
.duplo .bleed > .duplo-txt:last-child{padding-right:var(--gut);}
.duplo-txt .h2{margin:16px 0 20px;}
.duplo-txt .acoes{margin-top:30px;}

/* ---------- cartões de modelo ---------- */
.cartoes{display:grid;grid-template-columns:repeat(var(--n,4),1fr);border-top:2px solid var(--fio);}
.cartao{
  border-right:2px solid var(--fio);border-bottom:2px solid var(--fio);
  display:flex;flex-direction:column;background:var(--violeta);
}
.cartao .q{aspect-ratio:4/3;overflow:hidden;background:var(--foto-bg,var(--tinta));}
.cartao .q img{width:100%;height:100%;object-fit:var(--foto-fit,cover);}
.cartao-corpo{padding:26px 24px 28px;display:flex;flex-direction:column;gap:12px;flex:1;}
.cartao .n{font-size:11px;font-weight:600;letter-spacing:.18em;color:var(--v300);}
.cartao p{margin:0;font-size:14px;font-weight:300;line-height:1.6;color:var(--v200);}
.cartao dl{margin:auto 0 0;padding-top:18px;border-top:2px solid var(--fio);display:grid;gap:9px;}
.cartao dl > div{display:flex;justify-content:space-between;gap:14px;font-size:14px;font-variant-numeric:tabular-nums;}
.cartao dt{color:var(--v300);font-weight:400;}
.cartao dd{margin:0;font-weight:800;letter-spacing:-.01em;text-align:right;}

/* ---------- comparativo de modelos ---------- */
.comparativo{width:100%;overflow-x:auto;margin-top:var(--s2);-webkit-overflow-scrolling:touch;}
.comparativo::after{
  content:"Arraste para o lado para ver as três colunas";display:none;
  margin-top:16px;font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--v300);
}
@media (max-width:760px){ .comparativo::after{display:block;} }
.comparativo table{width:100%;min-width:640px;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.comparativo th,.comparativo td{
  text-align:left;padding:16px 20px 16px 0;border-top:2px solid var(--fio);font-size:15px;vertical-align:baseline;
}
.comparativo thead th{
  border-top:0;padding-top:0;padding-bottom:20px;
  font-size:clamp(19px,1.8vw,24px);font-weight:900;letter-spacing:-.03em;color:var(--papel);
}
.comparativo thead th:first-child{
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--v300);
}
.comparativo thead th span{
  display:block;margin-top:6px;font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--verde);
}
.comparativo tbody th{
  font-weight:600;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--v300);
  width:26%;padding-right:24px;
}
.comparativo td{font-weight:800;letter-spacing:-.01em;}
.comparativo td small{display:block;font-weight:400;font-size:13px;color:var(--v200);letter-spacing:0;margin-top:4px;}
.comparativo tbody tr:hover{background:rgba(244,243,246,.03);}

/* variante com um modelo por linha — famílias grandes demais para virar coluna */
.comparativo--linha table{min-width:720px;}
.comparativo--linha caption{
  text-align:left;padding-bottom:18px;color:var(--verde);
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
}
.comparativo--linha thead th{
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--v300);padding-bottom:14px;
}
.comparativo--linha thead th:first-child{color:var(--verde);}
.comparativo--linha tbody th{
  width:auto;font-size:16px;font-weight:900;letter-spacing:-.02em;
  text-transform:none;color:var(--papel);white-space:nowrap;
}
.comparativo--linha td{font-weight:400;color:var(--v200);}

/* ---------- ficha técnica ---------- */
.ficha{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:0 clamp(32px,4.5vw,80px);margin-top:var(--s2);}
.ficha table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.ficha caption{
  text-align:left;padding-bottom:14px;color:var(--verde);
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
}
.ficha th,.ficha td{text-align:left;padding:16px 14px 16px 0;border-top:2px solid var(--fio);font-size:15px;vertical-align:baseline;}
.ficha th{font-weight:600;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--v300);width:50%;}
.ficha td{font-weight:800;letter-spacing:-.01em;}
.ficha td small{display:block;font-weight:400;font-size:13px;color:var(--v200);letter-spacing:0;margin-top:4px;}

.nota{
  margin-top:var(--s2);padding:22px 26px;
  border-left:3px solid var(--verde);background:rgba(199,255,31,.06);
}
.nota p{margin:0;font-size:14px;font-weight:300;line-height:1.65;color:var(--v200);max-width:78ch;}
.nota strong{color:var(--papel);font-weight:700;}

/* ---------- blocos de benefício ---------- */
.beneficios{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));border-top:2px solid var(--fio);}
.beneficio{
  padding:var(--s2) clamp(22px,2.4vw,40px);
  border-right:2px solid var(--fio);border-bottom:2px solid var(--fio);
}
.beneficio:first-child{padding-left:var(--gut);}
.beneficio .h3{margin:12px 0 12px;max-width:22ch;}
.beneficio p{margin:0;font-size:14.5px;font-weight:300;line-height:1.65;color:var(--v200);}
@media (max-width:980px){
  .beneficio{border-right:0;padding-left:var(--gut);padding-right:var(--gut);}
}

/* ---------- colunas de texto ---------- */
.colunas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:clamp(26px,3.4vw,64px);margin-top:var(--s2);}
.colunas p{margin:12px 0 0;font-size:14.5px;font-weight:300;line-height:1.65;color:var(--v200);}
.colunas .label{color:var(--verde);}

/* ---------- etapas numeradas ---------- */
.etapas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));border-top:2px solid var(--fio);}
.etapa{padding:var(--s2) clamp(18px,2vw,34px);border-right:2px solid var(--fio);border-bottom:2px solid var(--fio);}
.etapa:last-child{border-right:0;}
.etapa b{display:block;font-size:clamp(26px,2.6vw,36px);font-weight:900;color:var(--verde);letter-spacing:-.03em;line-height:1;}
.etapa .label{margin-top:14px;}
.etapa p{margin:12px 0 0;font-size:14px;font-weight:300;line-height:1.6;color:var(--v200);}

/* ---------- contato ---------- */
.contatos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));border-top:2px solid var(--fio);}
.contatos > div{padding:var(--s2) clamp(18px,2vw,34px);border-right:2px solid var(--fio);border-bottom:2px solid var(--fio);}
.contatos > div:last-child{border-right:0;}
.contatos b{display:block;margin-top:12px;font-size:19px;font-weight:800;letter-spacing:-.02em;}

/* ---------- fechamento ---------- */
.fecho{background:var(--v900);}
.fecho .regua{margin-bottom:calc(var(--s1) * -0.4);}
.fecho .wrap{padding-top:var(--s1);padding-bottom:var(--s1);}
.fecho .h2{margin:16px 0 20px;}
.fecho .acoes{margin-top:32px;}

/* ---------- rodapé ---------- */
.rodape{background:var(--tinta);}
.rodape .wrap{padding-top:var(--s1);padding-bottom:clamp(30px,3vw,48px);}
.rodape-topo{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;padding-bottom:var(--s2);border-bottom:2px solid var(--fio);}
.rodape .sig{--sig-w:168px;}
.rodape nav{display:flex;gap:clamp(32px,5vw,72px);flex-wrap:wrap;}
.rodape ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.rodape li:first-child{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--v300);margin-bottom:4px;}
.rodape a{font-size:14px;text-decoration:none;font-weight:300;color:var(--v200);}
.rodape a:hover{color:var(--verde);}
.rodape small{display:block;font-size:12px;color:var(--v300);}
.rodape-pe{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:16px 32px;flex-wrap:wrap;margin-top:var(--s2);
}
/* .rodape small já declara display:block e tem especificidade maior —
   por isso o seletor precisa vir qualificado, senão o flex não pega */
.rodape small.rodape-legal{display:flex;gap:24px;flex-wrap:wrap;}
.rodape-legal a{font-size:12px;color:var(--v300);text-decoration:underline;text-underline-offset:3px;}
.rodape-legal a:hover{color:var(--verde);}

/* ---------- aviso de prévia ---------- */
.previa{background:var(--verde);color:var(--tinta);}
.previa .wrap{padding-top:10px;padding-bottom:10px;font-size:12px;font-weight:600;letter-spacing:.03em;}
.previa b{font-weight:900;letter-spacing:.04em;}

/* ============================================================
   RESPONSIVO
   O número de colunas vem de --n definido no HTML (style inline), que tem
   precedência sobre a folha. Nos pontos de quebra ele é sobrescrito à força —
   é o único lugar do sistema onde isso acontece, e é intencional.
   ============================================================ */
@media (max-width:1180px){
  .galeria,.cartoes{--n:2!important;}
  .numeros .wrap{--n:2!important;}
}
@media (max-width:980px){
  .sec-hd{grid-template-columns:1fr;gap:var(--s2);}
  .numeros .wrap{--n:1!important;}
  .numeros .cel{border-right:0;border-bottom:2px solid var(--fio);padding-left:var(--gut);padding-right:var(--gut);}
  .numeros .cel:last-child{border-bottom:0;}
  .duplo .bleed{grid-template-columns:1fr;}
  .duplo-txt{padding-left:var(--gut)!important;padding-right:var(--gut)!important;}
  .divisao{grid-template-columns:auto minmax(0,1fr) auto;row-gap:14px;}
  .divisao .txt{grid-column:2/4;}
  .foto-larga .q{aspect-ratio:3/2;}
  .etapa{border-right:0;}
  .contatos > div{border-right:0;}
}
@media (max-width:680px){
  .galeria,.cartoes{--n:1!important;}
  .galeria figure,.cartao{border-right:0;}
  .capa{min-height:clamp(400px,88vw,560px);}
  .capa .wrap{padding-top:clamp(90px,26vw,150px);}
  .display{font-size:clamp(32px,8.6vw,46px);}
  .h2{font-size:clamp(22px,6.4vw,30px);}
  .foto-larga .q{aspect-ratio:4/3;}
  .topo .wrap{gap:16px;}
  .topo ul{gap:14px 18px;}
  .rodape nav{gap:28px;}
}


/* ============================================================
   BUSCA DE ASSISTÊNCIA
   O painel flutua sobre o mapa, como num localizador de concessionária:
   campo, lista ordenada e posição de cada ponto na mesma tela. No celular
   ele desce para baixo do mapa — sobrepor painel em tela pequena esconderia
   justamente o que o visitante precisa ver.
   ============================================================ */
.mapa-secao{
  position:relative;background:var(--tinta);
  border-top:2px solid var(--fio);border-bottom:2px solid var(--fio);
}
.mapa{height:clamp(460px,74vh,780px);background:#E9E7EC;}

.painel{
  position:absolute;top:20px;left:20px;z-index:5;
  width:min(410px,calc(100% - 40px));max-height:calc(100% - 40px);
  display:flex;flex-direction:column;
  background:var(--violeta);box-shadow:0 22px 56px rgba(0,0,0,.55);
}
.painel-topo{padding:22px 22px 20px;border-bottom:2px solid var(--fio);flex:none;}
.painel-topo .eyebrow{margin-bottom:14px;}
.painel-pe{
  margin:0;padding:12px 22px;border-top:2px solid var(--fio);flex:none;
  font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--v300);line-height:1.5;
}

.busca-campo label{
  display:block;margin-bottom:10px;
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--verde);
}
.busca-campo input{
  width:100%;padding:15px 16px;border:0;border-radius:0;
  background:var(--v900);color:var(--papel);
  font-family:var(--sans);font-size:16px;font-weight:500;
  box-shadow:inset 0 0 0 2px var(--fio-forte);
}
.busca-campo input::placeholder{color:var(--v300);font-weight:300;}
.busca-campo input:focus{outline:0;box-shadow:inset 0 0 0 2px var(--verde);}

.dica{margin:12px 0 0;font-size:13px;font-weight:300;color:var(--v200);}
.dica button{
  background:none;border:0;padding:0;cursor:pointer;color:var(--verde);
  font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px;
}

/* sugestões de cidade */
.sugestoes{position:relative;}
.sugestoes ul{
  position:absolute;z-index:30;left:0;right:0;top:2px;margin:0;padding:0;list-style:none;
  background:var(--tinta);box-shadow:0 18px 40px rgba(0,0,0,.5);max-height:290px;overflow-y:auto;
}
.sugestoes li button{
  display:flex;justify-content:space-between;gap:14px;width:100%;
  padding:11px 16px;background:none;border:0;cursor:pointer;text-align:left;
  font-family:var(--sans);font-size:14.5px;color:var(--papel);
  border-bottom:1px solid var(--fio);
}
.sugestoes li button:hover,.sugestoes li button:focus-visible{background:var(--v800);outline:0;}
.sugestoes li button b{font-weight:600;}
.sugestoes li button span{color:var(--v300);font-size:11.5px;font-weight:600;letter-spacing:.1em;}

/* seletor de como medir */
.modo{display:flex;align-items:center;gap:2px;flex-wrap:wrap;margin-top:16px;}
.modo > span{
  font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--v300);margin-right:8px;
}
.modo button{
  padding:9px 14px;border:0;cursor:pointer;font-family:var(--sans);
  font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  background:transparent;color:var(--v200);box-shadow:inset 0 0 0 2px var(--fio-forte);
  transition:background .16s,color .16s;
}
.modo button:hover{color:var(--verde);box-shadow:inset 0 0 0 2px var(--verde);}
.modo button[aria-pressed="true"]{background:var(--verde);color:var(--tinta);box-shadow:none;}

/* resultado, rolando dentro do painel */
.resultado{overflow-y:auto;flex:1 1 auto;min-height:0;}
.resultado-topo{
  padding:14px 22px;border-bottom:2px solid var(--fio);background:var(--v900);
  position:sticky;top:0;z-index:2;
}
.resultado-topo p{margin:0;font-size:12.5px;font-weight:300;color:var(--v200);line-height:1.5;}
.resultado-topo p:last-child{
  margin-top:3px;font-size:10px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--v300);
}
.resultado-topo b{font-weight:800;color:var(--papel);}

.autorizadas{list-style:none;margin:0;padding:0;}
.autorizada{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;
  padding:16px 22px;border-bottom:1px solid var(--fio);cursor:pointer;
  transition:background .14s;
}
.autorizada:hover{background:var(--v800);}
.autorizada .dist{
  grid-row:1 / span 2;font-variant-numeric:tabular-nums;text-align:right;min-width:52px;
  font-weight:900;font-size:17px;letter-spacing:-.03em;color:var(--verde);line-height:1.1;margin:0;
}
.autorizada .dist span{
  display:block;font-size:9px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--v300);margin-top:2px;
}
.autorizada .dist .tempo{text-transform:none;letter-spacing:.02em;color:var(--v200);font-size:10.5px;}
.autorizada .nome{margin:0;font-size:13.5px;font-weight:800;letter-spacing:-.01em;line-height:1.32;}
.autorizada .onde{margin:4px 0 0;font-size:12px;font-weight:300;line-height:1.5;color:var(--v200);}
.autorizada .acoes{grid-column:2;display:flex;flex-wrap:wrap;gap:2px;margin-top:10px;}
.autorizada .acoes .cta{padding:8px 12px;font-size:10px;letter-spacing:.08em;}
.autorizada .sem-fone{font-size:11.5px;font-weight:300;color:var(--v300);font-style:italic;}

.aviso-rota{
  margin:0;padding:14px 22px;font-size:12.5px;font-weight:300;line-height:1.55;
  color:var(--v200);background:rgba(183,159,233,.1);border-bottom:1px solid var(--fio);
}
.longe{padding:18px 22px;border-bottom:1px solid var(--fio);background:rgba(199,255,31,.07);}
.longe p{margin:0;font-size:12.5px;font-weight:300;line-height:1.6;color:var(--v200);}
.longe p + p{margin-top:.7em;}
.longe strong{color:var(--papel);font-weight:700;}

/* pinos — desenhados para um mapa claro: violeta com anel branco.
   Os três mais próximos viram verde-limão, que é o destaque da marca. */
.pino{
  width:15px;height:15px;border-radius:50%;cursor:pointer;
  background:var(--violeta-eletrico);
  box-shadow:0 0 0 3px #fff,0 0 0 4px rgba(46,16,101,.38),0 2px 6px rgba(0,0,0,.28);
}
.pino--perto{
  width:19px;height:19px;margin:-2px;background:var(--verde);
  box-shadow:0 0 0 3px var(--violeta),0 0 0 7px rgba(199,255,31,.55),0 2px 8px rgba(0,0,0,.3);
}
.pino--voce{
  width:21px;height:21px;margin:-3px;background:var(--violeta);
  box-shadow:0 0 0 3px #fff,0 0 0 7px rgba(46,16,101,.4),0 2px 8px rgba(0,0,0,.32);
}

/* O CSS do MapLibre entra depois do nosso, então estes seletores precisam de
   dois níveis para vencer no empate de especificidade. */
.mapa-secao .maplibregl-map{font-family:var(--sans);}
.mapa-secao .maplibregl-popup-content{
  background:var(--tinta);color:var(--papel);border-radius:0;padding:18px 20px;
  box-shadow:0 14px 36px rgba(0,0,0,.55);font-size:13.5px;line-height:1.5;max-width:250px;
}
.mapa-secao .maplibregl-popup-content b{
  display:block;font-weight:800;margin-bottom:6px;letter-spacing:-.01em;
  font-size:14px;color:var(--papel);
}
.mapa-secao .maplibregl-popup-content a{color:var(--verde);font-weight:700;}
.mapa-secao .maplibregl-popup-close-button{
  color:var(--v300);font-size:20px;padding:2px 9px;background:none;
}
.mapa-secao .maplibregl-popup-close-button:hover{background:none;color:var(--verde);}
.mapa-secao .maplibregl-popup-anchor-top .maplibregl-popup-tip{border-bottom-color:var(--tinta);}
.mapa-secao .maplibregl-popup-anchor-bottom .maplibregl-popup-tip{border-top-color:var(--tinta);}
.mapa-secao .maplibregl-popup-anchor-left .maplibregl-popup-tip{border-right-color:var(--tinta);}
.mapa-secao .maplibregl-popup-anchor-right .maplibregl-popup-tip{border-left-color:var(--tinta);}
.mapa-secao .maplibregl-ctrl-attrib{background:rgba(255,255,255,.82);}
.mapa-secao .maplibregl-ctrl-attrib,
.mapa-secao .maplibregl-ctrl-attrib a{color:#5a5364;font-size:10px;}
.mapa-secao .maplibregl-ctrl-group{border:0;box-shadow:0 2px 10px rgba(46,16,101,.24);}

.so-js{display:none;}
.tem-js .so-js{display:block;}
.tem-js .sem-js{display:none;}

/* ---------- celular: o painel desce para baixo do mapa ---------- */
@media (max-width:900px){
  .mapa{height:clamp(300px,46vh,420px);}
  .painel{
    position:static;width:100%;max-height:none;box-shadow:none;
    border-top:2px solid var(--fio);
  }
  .resultado{overflow:visible;max-height:none;}
  .resultado-topo{position:static;}
}

/* Os pisos das grades acima usam min(Npx,100%) de propósito: com
   minmax(320px,1fr) puro, uma tela de 320px — onde sobram 280px depois das
   margens — não consegue encolher a coluna, e a PÁGINA INTEIRA ganha rolagem
   lateral. Com o min(), o piso cede e a coluna passa a caber. */

/* ============================================================
   Cookies · faixa de consentimento e painel de preferências
   Aparece só quando existe terceiro para consentir. Fica no rodapé da
   tela, não cobre o conteúdo inteiro: recusar não pode ser mais difícil
   do que aceitar — os dois botões têm o mesmo peso.
   ============================================================ */
.cookies{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  background:var(--tinta);border-top:2px solid var(--verde);
  box-shadow:0 -12px 40px rgba(26,21,32,.5);
}
.cookies-in{
  display:flex;align-items:center;gap:clamp(20px,3vw,48px);
  flex-wrap:wrap;padding-top:20px;padding-bottom:20px;
}
.cookies-txt{flex:1 1 420px;min-width:0;}
.cookies-txt p:not(.eyebrow){
  margin:8px 0 0;font-size:14px;line-height:1.6;font-weight:300;
  color:var(--v200);max-width:78ch;
}
.cookies-txt a{color:var(--verde);}
.cookies-acoes{display:flex;align-items:center;gap:2px;flex-wrap:wrap;}
.cookies-acoes .cta{border:0;font:inherit;cursor:pointer;}
.cookies-link{
  background:none;border:0;cursor:pointer;font:inherit;color:var(--v200);
  font-size:13px;font-weight:700;text-decoration:underline;
  text-underline-offset:3px;padding:0 16px;
}
.cookies-link:hover{color:var(--verde);}

.cookies-modal{
  position:fixed;inset:0;z-index:90;background:rgba(10,4,26,.72);
  display:flex;align-items:center;justify-content:center;padding:20px;
  overflow:auto;
}
.cookies-cx{
  background:var(--violeta);border:2px solid var(--fio-forte);
  padding:clamp(24px,3vw,40px);max-width:640px;width:100%;
}
.cookies-cx .h2{margin:14px 0 24px;}
.cookies-op{
  display:flex;gap:14px;align-items:flex-start;
  padding:18px 0;border-top:2px solid var(--fio);
}
.cookies-op input{
  flex:none;width:20px;height:20px;margin:2px 0 0;
  accent-color:var(--verde);cursor:pointer;
}
.cookies-op input:disabled{cursor:default;opacity:.55;}
.cookies-op span{font-size:13.5px;line-height:1.6;font-weight:300;color:var(--v200);}
.cookies-op b{display:block;font-size:15px;font-weight:800;color:var(--papel);margin-bottom:4px;letter-spacing:-.01em;}
.cookies-cx .acoes{margin-top:24px;}
.cookies-cx .cta{border:0;font:inherit;cursor:pointer;}

/* ============================================================
   Páginas de texto legal
   Coluna estreita, hierarquia clara e tabela para o que é lista de
   fatos — política que ninguém consegue ler não informa ninguém.
   ============================================================ */
.legal{padding-top:var(--s2);padding-bottom:var(--s1);}
/* a coluna é estreita, mas ancorada na mesma margem esquerda do resto do
   site — o manual não admite bloco centralizado no meio da página */
.legal h2,.legal h3{max-width:26ch;}
.legal .rolo{max-width:1080px;}
.legal .atual{max-width:72ch;}
.legal h2{
  margin:var(--s1) 0 16px;font-weight:900;letter-spacing:-.025em;
  line-height:1.15;font-size:clamp(22px,2.2vw,30px);
}
.legal h2:first-of-type{margin-top:var(--s2);}
.legal h3{
  margin:32px 0 10px;font-weight:800;letter-spacing:-.015em;
  font-size:clamp(16px,1.5vw,18px);
}
.legal p,.legal li{
  font-size:15px;line-height:1.7;font-weight:300;color:var(--v200);
  max-width:72ch;
}
.legal p{margin:0 0 1em;}
.legal strong{font-weight:700;color:var(--papel);}
.legal a{color:var(--verde);}
.legal ul{margin:0 0 1.4em;padding-left:1.1em;}
.legal li{margin-bottom:.5em;}
.legal li::marker{color:var(--verde);}
.legal table{
  width:100%;border-collapse:collapse;margin:0 0 1.6em;
  font-size:13.5px;line-height:1.55;
}
.legal th,.legal td{
  text-align:left;vertical-align:top;padding:12px 16px 12px 0;
  border-bottom:2px solid var(--fio);font-weight:300;color:var(--v200);
}
.legal thead th{
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  font-weight:900;color:var(--papel);border-bottom-color:var(--fio-forte);
}
.legal tbody th{font-weight:800;color:var(--papel);width:30%;}
.legal .rolo{overflow-x:auto;}
.legal .atual{
  border-left:4px solid var(--verde);padding:16px 0 16px 20px;
  margin:0 0 var(--s2);
}
.legal .atual p{margin:0;font-size:14px;}

/* ---------- celular: a tabela da política vira pilha de blocos ---------- */
@media (max-width:760px){
  .legal .rolo,.legal table,.legal thead,.legal tbody,
  .legal tr,.legal th,.legal td{display:block;width:auto;}
  .legal thead{position:absolute;left:-9999px;}      /* o rótulo volta em ::before */
  .legal tr{
    border-bottom:2px solid var(--fio);
    padding:18px 0;
  }
  .legal tbody tr:first-child{border-top:2px solid var(--fio-forte);}
  .legal th,.legal td{border:0;padding:0;}
  .legal tbody th{font-size:16px;margin-bottom:10px;}
  .legal td{margin-top:10px;}
  .legal td[data-r]::before{
    content:attr(data-r);display:block;
    font-size:10px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:900;color:var(--v300);margin-bottom:3px;
  }
}

/* ============================================================
   Contato fixo
   Quem entra num site de máquina decide falar com alguém antes de
   terminar de ler. A barra segue a página inteira para que esse impulso
   não dependa de rolar até o rodapé.
   No celular ocupa a largura toda, na altura do polegar.
   ============================================================ */
.cta-fixa{
  position:fixed;right:clamp(16px,2.5vw,32px);z-index:70;
  bottom:calc(clamp(16px,2.5vw,28px) + var(--pe-cookies,0px));
  display:flex;gap:2px;transition:bottom .2s;
}
.cta-fixa .cta{
  box-shadow:0 6px 24px rgba(10,4,26,.45);
  padding:15px 22px;
}
/* o span aqui é parte da frase, não a etiqueta de arquivo do botão de download */
.cta-fixa .cta span:not(.so-largo),
.cta-fixa .cta span.so-largo{
  display:inline;font-size:inherit;font-weight:inherit;letter-spacing:inherit;
  text-transform:inherit;opacity:1;margin:0;color:inherit;
}
.cta--whats{background:#25D366;color:#0B2E18;display:inline-flex;align-items:center;gap:.6em;}
.cta--whats:hover{background:#3ae47a;}
.cta--whats svg{flex:none;}

@media (max-width:760px){
  .cta-fixa{
    left:0;right:0;bottom:var(--pe-cookies,0px);gap:0;
    border-top:2px solid var(--fio-forte);
  }
  .cta-fixa .cta{
    flex:1;justify-content:center;box-shadow:none;
    padding:17px 12px;font-size:11.5px;letter-spacing:.08em;
  }
  /* precisa da mesma qualificação da regra que solta o span acima,
     senão aquela vence por especificidade e o texto longo volta */
  .cta-fixa .cta span.so-largo{display:none;}
  /* a barra não pode cobrir o fim do rodapé */
  body{padding-bottom:78px;}
}