@charset "UTF-8";
/* ═══════════════════════════════════════════════════════════════════
   modoLAR · apresentação a investidores
   Folha única. Ordem: tokens → base → utilitários → blocos → responsivo.
   Nada aqui depende de JavaScript.
   ═══════════════════════════════════════════════════════════════════ */

/* ── FONTE DE TÍTULO ────────────────────────────────────────────────
   A Garet é licenciada e não vem neste pacote. Coloque os .woff2 em
   assets/fonts/ com os nomes abaixo e ela entra automaticamente.
   Sem os arquivos, o navegador cai na Poppins e o layout não quebra.
   ─────────────────────────────────────────────────────────────────── */
@font-face{
  font-family:"Garet";
  src:url("../assets/fonts/Garet-Book.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Garet";
  src:url("../assets/fonts/Garet-Medium.woff2") format("woff2");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Garet";
  src:url("../assets/fonts/Garet-Heavy.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}

/* ═══ TOKENS ═══════════════════════════════════════════════════════ */
:root{
  /* cor */
  --c-concreto:#E9E7E0;   /* fundo da página            */
  --c-papel:#F6F5F2;      /* superfícies claras         */
  --c-preto:#000000;      /* títulos e traço            */
  --c-tinta:#1C1C18;      /* texto corrido              */
  --c-aco:#B4B8B5;        /* cartões de ícone, vazios   */
  --c-fio:#CFCFC9;        /* filetes e malha            */
  --c-cobalto:#1622D8;    /* único acento               */
  --c-claro:#FFFFFF;

  /* tipografia */
  --f-titulo:"Garet","Poppins","Helvetica Neue",Arial,sans-serif;
  --f-texto:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --f-mono:"Space Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;

  /* escala — referência: viewport de 1920px, como no mockup aprovado */
  --t-titulo:clamp(28px, 4.95vw, 95px);
  --t-linha:clamp(34px, 7.55vw, 145px);
  --t-serif:clamp(20px, 3.12vw, 60px);
  --t-tagline:clamp(19px, 2.60vw, 50px);
  --t-nome:clamp(19px, 2.08vw, 40px);
  --t-pilar:clamp(16px, 1.56vw, 30px);
  --t-texto:clamp(15px, 1.30vw, 25px);
  --t-legenda:clamp(13px, 1.15vw, 22px);
  --t-mono:clamp(10px, 1.04vw, 20px);
  --t-mono-g:clamp(11px, 1.20vw, 23px);
  --t-num:clamp(22px, 2.60vw, 50px);

  /* malha: 8 colunas de 12,5%. A margem é de 4% e o texto começa
     na primeira prumada (4% + 9,5% = 12,5%). */
  --m-lateral:max(20px, 4vw);
  --m-recuo:max(44px, 9.5vw);
  --m-coluna:12.5%;

  /* ritmo vertical */
  --v-secao:clamp(34px, 4.4vw, 84px);
  --v-junta:clamp(48px, 6.2vw, 120px);
  --v-bloco:clamp(20px, 2.5vw, 48px);
  --v-media:clamp(22px, 2.8vw, 54px);
}

/* ═══ BASE ═════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--c-concreto);
  color:var(--c-preto);
  font-family:var(--f-texto);
  font-weight:300;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{display:block;max-width:100%;height:auto}
svg{display:block}
a{color:inherit;text-decoration:none}
ul,ol,dl,dd{margin:0;padding:0}
li{list-style:none}
h1,h2,h3,p,figure,blockquote{margin:0}
hr{border:0;margin:0}

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

.pular{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--c-preto);color:var(--c-concreto);
  padding:12px 18px;font-family:var(--f-mono);font-size:12px;
}
.pular:focus{left:0}

.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* malha estrutural — prumadas fixas atrás de todo o conteúdo */
.malha{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:repeating-linear-gradient(
    to right, var(--c-fio) 0 1px, transparent 1px var(--m-coluna));
  opacity:.9;
}

/* ═══ CABEÇALHO ════════════════════════════════════════════════════ */
.topo{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:clamp(10px,.9vw,18px) var(--m-lateral);
  border-bottom:1px solid var(--c-fio);
  background:var(--c-concreto);
}
.topo__marca img{height:clamp(17px,1.5vw,29px);width:auto}

.botao{
  font-family:var(--f-mono);
  font-size:var(--t-mono);
  letter-spacing:.05em;
  border:1px solid var(--c-preto);
  border-radius:999px;
  padding:.6em 1.3em;
  white-space:nowrap;
  transition:background .18s ease,color .18s ease;
}
.botao:hover,.botao:focus-visible{background:var(--c-preto);color:var(--c-concreto)}

/* ═══ CAPA ═════════════════════════════════════════════════════════ */
.capa{
  position:relative;
  min-height:clamp(440px,56vw,980px);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:var(--m-lateral);
  color:var(--c-claro);
  overflow:hidden;
  isolation:isolate;
}
.capa__foto{
  position:absolute;inset:0;z-index:-2;
  width:100%;height:100%;object-fit:cover;object-position:center 58%;
}
.capa::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,
    rgba(0,0,0,.42) 0%, rgba(0,0,0,.08) 34%, rgba(0,0,0,.66) 100%);
}
.capa__topo{
  position:absolute;top:var(--m-lateral);left:var(--m-lateral);right:var(--m-lateral);
  display:flex;justify-content:space-between;gap:16px;
  font-family:var(--f-mono);font-size:var(--t-mono);letter-spacing:.06em;
}
.capa__marca{margin:0 0 clamp(14px,1.6vw,30px)}
.capa__marca img{width:min(66vw,1000px);height:auto}

.capa__tagline{
  font-family:var(--f-texto);
  font-weight:700;
  font-size:var(--t-tagline);
  line-height:1.2;
  letter-spacing:-.015em;
  max-width:24ch;
}
.capa__tagline span{display:block}
.capa__tagline .serif{
  font-family:var(--f-serif);font-style:italic;font-weight:400;
  font-size:1.14em;letter-spacing:0;
}
.capa__seta{
  width:clamp(18px,1.3vw,26px);height:auto;
  margin-top:clamp(18px,2.4vw,46px);
  color:var(--c-claro);opacity:.85;
}

/* ═══ ESTRUTURA DAS SEÇÕES ═════════════════════════════════════════ */
.sec{padding:var(--v-secao) var(--m-lateral) 0}

/* filete de junta entre seções, com os pontos de fixação nas pontas */
.junta{
  position:relative;
  height:0;
  margin:var(--v-junta) var(--m-lateral) 0;
  border-top:1px solid var(--c-preto);
}
.junta::before,.junta::after{
  content:"";position:absolute;top:-3.5px;
  width:7px;height:7px;border-radius:50%;background:var(--c-preto);
}
.junta::before{left:-3.5px}
.junta::after{right:-3.5px}

/* grade de duas colunas: índice numérico + conteúdo recuado */
.sec__cab,
.sec__corpo{
  display:grid;
  grid-template-columns:var(--m-recuo) minmax(0,1fr);
}
.sec__cab{margin-bottom:var(--v-bloco);align-items:start}

.indice{
  font-family:var(--f-mono);
  font-size:var(--t-mono);
  letter-spacing:.06em;
  line-height:1;
  padding-top:.9em;
  color:var(--c-preto);
}

.tit{
  font-family:var(--f-titulo);
  font-weight:700;
  font-size:var(--t-titulo);
  line-height:1.06;
  letter-spacing:-.025em;
  max-width:18ch;
}
.tit span{display:block}
.tit--caixa-alta{text-transform:uppercase;letter-spacing:-.015em}
.tit--sub{
  margin-top:clamp(12px,1.4vw,26px);
  font-weight:700;
}
.tit--sub em{
  font-family:var(--f-serif);font-style:italic;font-weight:400;
  letter-spacing:0;
}

.texto p{
  font-size:var(--t-texto);
  line-height:1.6;
  color:var(--c-tinta);
  max-width:46ch;
  margin-bottom:1em;
}
.texto p:last-child{margin-bottom:0}

.destaque,
.texto .destaque{
  font-family:var(--f-serif);
  font-style:italic;
  font-weight:400;
  font-size:var(--t-serif);
  line-height:1.2;
  color:var(--c-preto);
  max-width:28ch;
  margin-bottom:.8em;
}


.duas{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(24px,4vw,80px);
  align-items:start;
}
.duas--equipe{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}

/* imagens de faixa, da margem à margem do container */
.faixa{margin-top:var(--v-media)}
.faixa img{width:100%;height:clamp(200px,26vw,500px);object-fit:cover}
.faixa--alta img{height:clamp(230px,30vw,580px)}

/* ═══ 03 · PILARES ═════════════════════════════════════════════════ */
.pilares{display:grid;gap:clamp(10px,1vw,20px)}
.pilares li{
  display:flex;align-items:baseline;gap:clamp(12px,1.4vw,28px);
  color:var(--c-cobalto);
}
.pilares__num{
  font-family:var(--f-mono);
  font-size:var(--t-num);
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.pilares__nome{
  font-family:var(--f-titulo);
  font-weight:700;
  font-size:var(--t-pilar);
  letter-spacing:-.01em;
  line-height:1.1;
}

/* ═══ 04 · SUSTENTABILIDADE ════════════════════════════════════════ */
.eco{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(8px,1.1vw,22px);
  margin-top:clamp(14px,1.6vw,30px);
}
.eco__item{
  background:var(--c-aco);
  color:var(--c-cobalto);
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  gap:clamp(10px,1.2vw,24px);
  padding:clamp(14px,1.6vw,32px) clamp(8px,1vw,18px);
  min-height:clamp(132px,10.5vw,205px);
  text-align:center;
}
.eco__ico{width:clamp(52px,5.4vw,104px);height:auto;color:var(--c-cobalto)}
.eco__item span{
  font-family:var(--f-texto);
  font-weight:300;
  font-size:var(--t-texto);
  line-height:1.3;
}

/* ═══ 05 · ÍNDICE DAS LINHAS ═══════════════════════════════════════ */
.indiceLinhas{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(10px,1.3vw,26px);
  margin-top:var(--v-media);
}
.indiceLinhas__caixa{
  display:grid;place-items:center;
  aspect-ratio:7/6;
  background:var(--c-claro);
  border:1px solid var(--c-fio);
  transition:border-color .2s ease;
}
.indiceLinhas__caixa svg{
  width:clamp(96px,13vw,260px);height:auto;color:var(--c-preto);
}
.indiceLinhas a:hover .indiceLinhas__caixa,
.indiceLinhas a:focus-visible .indiceLinhas__caixa{
  border-color:var(--c-cobalto);
}
.indiceLinhas__rotulo{
  display:block;
  margin-top:clamp(8px,.8vw,16px);
  font-family:var(--f-mono);
  font-size:var(--t-texto);
  letter-spacing:.07em;
  color:var(--c-cobalto);
}

/* ═══ 06-08 · LINHAS DE PRODUTO ════════════════════════════════════ */
.linha__topo{
  display:flex;align-items:center;gap:clamp(10px,1.3vw,26px);
  flex-wrap:wrap;
}
.linha__ico{width:clamp(44px,4.6vw,90px);height:auto;color:var(--c-preto);flex:none}
.linha__nome{
  font-family:var(--f-titulo);
  font-weight:700;
  font-size:var(--t-linha);
  line-height:1;
  letter-spacing:-.035em;
}
.linha__sub{
  font-family:var(--f-serif);
  font-style:italic;
  font-size:var(--t-serif);
  line-height:1.2;
  margin-top:clamp(8px,1vw,20px);
}

.duplas{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(10px,1.3vw,26px);
  margin-top:var(--v-media);
}
.duplas img{width:100%;aspect-ratio:16/9;object-fit:cover}
.duplas figcaption{
  position:relative;
  margin-top:clamp(10px,1vw,20px);
  padding-top:clamp(9px,.8vw,16px);
  border-top:1px solid var(--c-fio);
  font-size:var(--t-legenda);
  font-weight:200;
  line-height:1.45;
  color:var(--c-tinta);
  max-width:52ch;
}
.duplas figcaption::before{
  content:"";position:absolute;top:-3.5px;left:0;
  width:7px;height:7px;border-radius:50%;background:var(--c-cobalto);
}

/* ═══ 09 · EQUIPE ══════════════════════════════════════════════════ */
.parceiros{
  display:grid;
  gap:clamp(22px,3vw,58px);
  justify-items:center;
  align-content:start;
  padding-top:clamp(4px,1vw,22px);
}
.parceiros img{width:auto;max-height:clamp(42px,4.6vw,92px);object-fit:contain}
.parceiros li:last-child img{max-height:clamp(62px,6.6vw,130px)}

.pessoas{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(18px,3vw,60px);
  margin-top:var(--v-media);
}
.pessoa img,
.pessoa .vazio{
  width:100%;aspect-ratio:3/2;object-fit:cover;
  margin-bottom:clamp(12px,1.3vw,26px);
}
.pessoa .vazio{
  background:var(--c-aco);
  display:grid;place-items:center;
  font-family:var(--f-mono);font-size:var(--t-mono);
  letter-spacing:.08em;color:#5E6260;
}
.pessoa h3{
  font-family:var(--f-texto);
  font-weight:900;
  font-size:var(--t-nome);
  letter-spacing:-.02em;
  line-height:1.1;
  margin-bottom:clamp(8px,.8vw,16px);
}
.pessoa p{
  font-size:var(--t-legenda);
  line-height:1.5;
  color:var(--c-tinta);
  max-width:48ch;
}

/* ═══ 10 · DETALHES TÉCNICOS ═══════════════════════════════════════ */
.tecnico{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.82fr);
  gap:clamp(24px,4vw,80px);
  align-items:start;
  margin-top:var(--v-bloco);
}
.tecnico__lista > div{
  padding:clamp(11px,1.1vw,22px) 0;
  border-top:1px solid var(--c-fio);
}
.tecnico__lista > div:first-child{border-top:1px solid var(--c-preto)}
.tecnico__lista dt{
  display:flex;align-items:baseline;gap:clamp(8px,.7vw,14px);
  font-weight:700;
  font-size:var(--t-legenda);
  letter-spacing:-.005em;
  margin-bottom:clamp(5px,.5vw,10px);
}
.tecnico__lista dt::before{
  content:"";flex:none;
  width:clamp(5px,.4vw,8px);aspect-ratio:1;border-radius:50%;
  background:var(--c-cobalto);transform:translateY(-.15em);
}
.tecnico__lista dd{
  font-size:var(--t-legenda);
  line-height:1.5;
  color:var(--c-tinta);
  max-width:54ch;
}

.diagrama{
  background:var(--c-claro);
  border:1px solid var(--c-fio);
  padding:clamp(12px,1.2vw,26px);
}
.diagrama img{width:100%;height:auto}
.diagrama figcaption{
  margin-top:clamp(10px,1vw,20px);
  font-family:var(--f-mono);
  font-size:var(--t-mono);
  letter-spacing:.06em;
  color:#5E6260;
}

/* ═══ 11 · FECHAMENTO ══════════════════════════════════════════════ */
.fim{
  position:relative;
  margin-top:var(--v-junta);
  min-height:clamp(520px,52vw,940px);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:var(--v-secao) 0 clamp(22px,2.4vw,46px);
  color:var(--c-claro);
  overflow:hidden;
  isolation:isolate;
}
.fim__foto{
  position:absolute;inset:0;z-index:-2;
  width:100%;height:100%;object-fit:cover;
}
.fim::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(90deg,rgba(0,0,0,.48) 0%,rgba(0,0,0,.22) 46%,rgba(0,0,0,0) 74%),
    linear-gradient(180deg,rgba(0,0,0,.26) 0%,rgba(0,0,0,.44) 34%,rgba(0,0,0,.80) 80%);
}
.fim__conteudo{padding-inline:var(--m-lateral)}
.fim .tit{color:var(--c-claro)}
.fim .indice{color:rgba(255,255,255,.8)}
.fim .texto p{color:rgba(255,255,255,.92)}

.fim__assinatura{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:clamp(18px,3vw,56px);flex-wrap:wrap;
  margin-top:clamp(26px,4vw,76px);
}
.fim__assinatura img{width:min(52vw,760px);height:auto}
.fim__assinatura p{
  font-size:var(--t-texto);
  line-height:1.35;
  color:rgba(255,255,255,.94);
  max-width:24ch;
}

.fim__contatos{
  margin-top:clamp(16px,1.8vw,34px);
  border:1px dashed rgba(255,255,255,.5);
  background:rgba(255,255,255,.07);
  padding:clamp(14px,1.4vw,28px);
  text-align:center;
  font-family:var(--f-mono);
  font-size:var(--t-mono);
  letter-spacing:.08em;
  color:rgba(255,255,255,.82);
}

/* ═══ RODAPÉ ═══════════════════════════════════════════════════════ */
.rodape{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;
  border-top:1px solid var(--c-preto);
  margin-inline:var(--m-lateral);
  padding:clamp(12px,1.2vw,24px) 0 clamp(28px,3vw,56px);
  font-family:var(--f-mono);
  font-size:var(--t-mono-g);
  letter-spacing:.05em;
  color:#4A4A48;
}

/* ═══ RESPONSIVO ═══════════════════════════════════════════════════ */

/* tablet: o recuo do índice some, o conteúdo ocupa a largura toda */
@media (max-width:900px){
  :root{--m-recuo:0px}
  .sec__cab,.sec__corpo{grid-template-columns:minmax(0,1fr)}
  .indice{padding-top:0;margin-bottom:10px}
  .sec__corpo > .indice:empty{display:none}
  .malha{background-image:repeating-linear-gradient(
    to right, var(--c-fio) 0 1px, transparent 1px 25%)}
  .duas,.duas--equipe{grid-template-columns:minmax(0,1fr);gap:clamp(22px,4vw,40px)}
  .tecnico{grid-template-columns:minmax(0,1fr)}
  .eco{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
  .parceiros{justify-items:start;grid-auto-flow:column;justify-content:start;gap:clamp(26px,5vw,60px)}
  .tit,.texto p,.destaque{max-width:34ch}
}

/* celular */
@media (max-width:620px){
  :root{
    --t-titulo:clamp(26px,7.4vw,40px);
    --t-linha:clamp(32px,9.4vw,52px);
    --t-serif:clamp(19px,5.2vw,28px);
    --t-tagline:clamp(18px,5vw,27px);
    --t-texto:15px;
    --t-legenda:14px;
    --t-mono:10px;
    --t-mono-g:10px;
    --t-num:24px;
    --t-pilar:18px;
    --t-nome:21px;
  }
  .malha{display:none}
  .indiceLinhas,.duplas,.pessoas{grid-template-columns:minmax(0,1fr)}
  .eco{grid-template-columns:repeat(2,minmax(0,1fr))}
  .eco__item:last-child{grid-column:1 / -1}
  .eco__ico{width:74px}
  .indiceLinhas__caixa svg{width:52vw}
  .capa__marca img{width:86vw}
  .fim__assinatura img{width:72vw}
  .tit,.texto p,.destaque,.pessoa p{max-width:100%}
  .topo{position:sticky;top:0;z-index:20}
}

/* impressão: a apresentação também é distribuída em PDF */
@media print{
  .malha,.topo,.pular{display:none}
  body{background:#fff}
  .sec{break-inside:avoid}
  .junta{break-after:avoid}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
}