/* Página Sobre — Gabster · v1 · 06/11/2026
   Escopo: .sb (não afeta o resto do site).
   Gerado por scripts/pacote-sobre.mjs a partir de docs/sobre-pacote/public/sobre/sobre.css (não edite à mão).
   Variáveis já mapeadas para os tokens reais do styles.css (06/11/2026); os valores depois da vírgula são a
   reserva do design system Site Gabster v4, e o que não tem token no site fica literal. */

.sb{
  --sb-papel: var(--paper, #F0EEE9);
  --sb-cartao: var(--card, #F8F7F4);
  --sb-bege: var(--beige, #E6DDCD);
  --sb-linha: var(--line, #DCD6CC);
  --sb-tinta: var(--black, #000000);
  --sb-suave: var(--muted, #57534B);
  --sb-abissal: var(--ink, #192D38);
  --sb-abissal-cartao: #223A46;
  --sb-abissal-linha: #2F4552;
  --sb-abissal-suave: #C8BFAF;
  --sb-menta: var(--mint, #A3FFA1);
  --sb-lima: #F9FF3E;
  --sb-tom-menta: var(--mint-tone, #DCF3D6);
  --sb-tom-terracota: var(--terra-tone, #F5E0CC);
  --sb-terracota-escura: #9E4600;
  --sb-titulo: var(--font-title);
  --sb-texto: var(--font-body);
  --sb-sombra-1: var(--shadow);
  --sb-margem: clamp(16px, 4vw, 64px);
  --sb-secao: clamp(64px, 9vw, 128px);

  background: var(--sb-papel);
  color: var(--sb-tinta);
  font-family: var(--sb-texto);
  -webkit-font-smoothing: antialiased;
}
.sb *{box-sizing:border-box}
.sb h1,.sb h2,.sb h3,.sb p,.sb ol,.sb ul,.sb blockquote{margin:0;hyphens:none}
.sb h1,.sb h2{color:inherit}
.sb ol,.sb ul{padding:0}
:where(.sb) a{color:inherit;text-decoration:underline}
.sb a:focus-visible{outline:2px solid var(--sb-abissal);outline-offset:2px;border-radius:4px}
.sb [hidden]{display:none !important}

/* Estrutura */
.sb-secao{padding:var(--sb-secao) var(--sb-margem)}
.sb-secao--filete{border-top:1px solid var(--sb-linha)}
.sb-secao--sem-topo{padding-top:0}
.sb-wrap{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:48px}
.sb-malha{background-color:var(--sb-papel);background-image:radial-gradient(var(--sb-linha) 1.25px, var(--sb-papel) 1.3px);background-size:24px 24px}
.sb-cabeca{display:flex;flex-direction:column;gap:16px;max-width:760px}

/* Tipografia */
.sb-sobretitulo{font-size:12px;line-height:16px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--sb-suave)}
.sb-display{font-family:var(--sb-titulo);font-weight:700;font-size:clamp(38px,5vw,56px);line-height:1.04;letter-spacing:-.01em;max-width:900px}
.sb-titulo{font-family:var(--sb-titulo);font-weight:700;font-size:clamp(30px,3.4vw,36px);line-height:1.12}
.sb-titulo--menor{font-size:clamp(26px,3vw,30px);line-height:1.15}
.sb-tom{color:var(--sb-suave)}
.sb-lead{font-size:20px;line-height:30px;color:var(--sb-suave);max-width:680px}
.sb-apoio{font-size:17px;line-height:26px;color:var(--sb-suave)}
.sb-corpo{font-size:15px;line-height:22px;color:var(--sb-suave)}
.sb-detalhe{font-size:13px;line-height:18px;color:var(--sb-suave)}
.sb-titulo-cartao{font-size:18px;line-height:24px;font-weight:600}
.sb-rotulo{font-size:12px;letter-spacing:.16em;font-weight:600;color:var(--sb-suave);text-transform:uppercase}

/* Botões */
.sb-botoes{display:flex;gap:12px;flex-wrap:wrap}
.sb-botao{text-decoration:none;font-size:15px;font-weight:600;height:44px;padding:0 20px;border-radius:6px;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent}
.sb-botao--primario{background:var(--sb-tinta);color:var(--sb-papel)}
.sb-botao--primario:hover{background:var(--sb-abissal)}
.sb-botao--secundario{background:var(--sb-cartao);color:var(--sb-tinta);border-color:var(--sb-linha)}
.sb-botao--secundario:hover{box-shadow:var(--sb-sombra-1)}
.sb-tag-lima{background:var(--sb-lima);color:var(--sb-tinta);border-radius:4px;padding:0 6px;font-size:13px;line-height:22px}

/* 1 Abertura */
.sb-abertura{text-align:center;align-items:center;gap:24px}
.sb-abertura .sb-botoes{justify-content:center;padding-top:8px}
.sb-numeros{max-width:1200px;margin:clamp(56px,7vw,96px) auto 0;background:var(--sb-cartao);border:1px solid var(--sb-linha);border-radius:12px;box-shadow:var(--sb-sombra-1);overflow:hidden}
.sb-numeros__grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--sb-linha)}
.sb-numero{background:var(--sb-cartao);padding:28px 28px 24px;display:flex;flex-direction:column;gap:8px}
.sb-numero__valor{font-family:var(--sb-titulo);font-weight:700;font-size:48px;line-height:52px;color:var(--sb-abissal)}
.sb-numero__legenda{font-size:14px;line-height:20px;color:var(--sb-suave)}
.sb-numeros__nota{border-top:1px solid var(--sb-linha);padding:14px 28px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* 2 Etapas */
.sb-etapas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.sb-cartao{background:var(--sb-cartao);border:1px solid var(--sb-linha);border-radius:8px;box-shadow:var(--sb-sombra-1)}
.sb-etapa{padding:24px;display:flex;flex-direction:column;gap:14px}
.sb-ladrilho{width:40px;height:40px;border-radius:6px;display:flex;align-items:center;justify-content:center}
.sb-ladrilho svg{width:24px;height:24px;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sb-ladrilho--neutro{background:var(--sb-bege)}.sb-ladrilho--neutro svg{stroke:var(--sb-tinta)}
.sb-ladrilho--marcenaria{background:var(--sb-tom-terracota)}.sb-ladrilho--marcenaria svg{stroke:var(--sb-terracota-escura)}
.sb-ladrilho--industria{background:var(--sb-tom-menta)}.sb-ladrilho--industria svg{stroke:var(--sb-abissal)}

/* 3 Manifesto */
.sb-manifesto{max-width:1200px;margin:0 auto;background:var(--sb-bege);border-radius:12px;padding:clamp(40px,6vw,80px) clamp(24px,5vw,72px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:center}
.sb-citacao{font-family:var(--sb-titulo);font-style:italic;font-weight:700;font-size:clamp(24px,2.6vw,30px);line-height:1.25}
.sb-manifesto__texto{display:flex;flex-direction:column;gap:16px;font-size:17px;line-height:26px}

/* 4 História */
.sb-historia{list-style:none;padding:0}
.sb-marco{display:flex;flex-wrap:wrap;gap:12px 40px;padding:28px clamp(20px,3vw,40px);border-bottom:1px solid var(--sb-linha)}
.sb-marco:last-child{border-bottom:0}
.sb-marco__ano{flex:0 0 120px;font-family:var(--sb-titulo);font-weight:700;font-size:36px;line-height:40px;color:var(--sb-abissal)}
.sb-marco__ano--futuro{color:var(--sb-suave)}
.sb-marco__corpo{flex:999 1 420px;min-width:0;display:flex;flex-direction:column;gap:8px}
.sb-fontes{display:flex;gap:16px;flex-wrap:wrap}
.sb-fontes a{font-size:13px;line-height:18px;color:var(--sb-suave)}
.sb-selo{align-self:flex-start;background:var(--sb-bege);border-radius:4px;padding:2px 8px;font-size:12px;line-height:18px;font-weight:600}

/* 5 Clientes */
.sb-clientes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--sb-linha);border:1px solid var(--sb-linha);border-radius:8px;overflow:hidden}
.sb-clientes li{list-style:none;background:var(--sb-cartao);height:88px;display:flex;align-items:center;justify-content:center;font-family:var(--sb-titulo);font-weight:700;font-size:18px;text-align:center;padding:0 12px}
.sb-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sb-case{overflow:hidden;display:flex;flex-direction:column;box-shadow:none}
.sb-case__faixa{padding:20px 24px}
.sb-case__faixa--bege{background:var(--sb-bege)}
.sb-case__faixa--marcenaria{background:var(--sb-tom-terracota)}
.sb-case__faixa--marcenaria .sb-rotulo{color:var(--sb-terracota-escura)}
.sb-case__corpo{padding:24px;display:flex;flex-direction:column;gap:10px}
.sb-case__citacao{font-family:var(--sb-titulo);font-style:italic;font-weight:700;font-size:20px;line-height:28px}

/* 6 Imprensa */
.sb-imprensa{list-style:none;padding:0;border-top:1px solid var(--sb-linha)}
.sb-imprensa li{border-bottom:1px solid var(--sb-linha)}
.sb-imprensa a{text-decoration:none;display:flex;flex-wrap:wrap;gap:4px 24px;padding:18px 0;align-items:baseline}
.sb-imprensa a:hover .sb-imprensa__titulo{text-decoration:underline}
.sb-imprensa__veiculo{flex:0 0 180px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--sb-suave)}
.sb-imprensa__titulo{flex:999 1 320px;font-size:17px;line-height:24px}

/* 7 Chamada final (abissal) */
.sb-final{max-width:1200px;margin:0 auto;background:var(--sb-abissal);color:var(--sb-papel);border-radius:12px;padding:clamp(40px,6vw,80px) clamp(24px,5vw,72px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:center}
.sb-final .sb-sobretitulo,.sb-final .sb-apoio,.sb-final .sb-rotulo,.sb-final .sb-detalhe{color:var(--sb-abissal-suave)}
.sb-final a:focus-visible{outline-color:var(--sb-menta)}
.sb-final__texto{display:flex;flex-direction:column;gap:20px}
.sb-botao--menta{background:var(--sb-menta);color:var(--sb-abissal);font-weight:600}
.sb-botao--menta:hover{background:var(--sb-papel)}
.sb-botao--abissal{background:var(--sb-abissal-cartao);color:var(--sb-papel);border-color:var(--sb-abissal-linha)}
.sb-final__cartao{background:var(--sb-abissal-cartao);border:1px solid var(--sb-abissal-linha);border-radius:8px;padding:28px;display:flex;flex-direction:column;gap:20px}
.sb-final__cartao div{display:flex;flex-direction:column;gap:6px}
.sb-final__cartao hr{border:0;height:1px;background:var(--sb-abissal-linha);margin:0}
.sb-final__cartao a{font-size:16px;line-height:24px}
.sb-final__cartao a:hover{color:var(--sb-menta)}

/* Responsivo */
@media (max-width:1199px){
  .sb-numeros__grade,.sb-etapas{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .sb-manifesto,.sb-final,.sb-cases{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:719px){
  .sb-numeros__grade,.sb-etapas{grid-template-columns:minmax(0,1fr)}
  .sb-clientes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sb-marco__ano{flex-basis:100%;font-size:28px;line-height:32px}
  .sb-numero__valor{font-size:40px;line-height:44px}
}
@media (prefers-reduced-motion:reduce){.sb *{scroll-behavior:auto !important}}