/* ==========================================================================
   Liga das Engenharias — folha de estilo única
   Recriação em CSS dos protótipos hifi em docs/design/*.dc.html.
   Linguagem "blueprint": cantos retos, hairlines de 1px, marcas de registro.
   Desktop (≥1100px) é a referência pixel-perfect; ver "Responsividade" no fim.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens de tema — transpostos de docs/design/assets/liga-theme.js
   -------------------------------------------------------------------------- */
:root {
  --lg-pg:#ffffff; --lg-alt:#f6f7f8; --lg-foot:#ffffff;
  --lg-tx:#1e222a; --lg-bd:#4a4f58; --lg-soft:#6b7078; --lg-soft2:#5a5f68;
  /* Desvio consciente do protótipo: --lg-mono era #8F949A (3,1:1 sobre branco),
     abaixo do mínimo AA de 4,5:1 para texto pequeno. #6b7078 dá 4,98:1 sobre
     --lg-pg e 4,64:1 sobre --lg-alt. As notas mono seguem distintas pela
     família monoespaçada. Reverter aqui se a fidelidade cromática exata
     prevalecer sobre o critério de Lighthouse >= 95 em acessibilidade. */
  --lg-mono:#6b7078;
  --lg-hair:rgba(29,31,32,.1); --lg-hair2:rgba(29,31,32,.16); --lg-corner:rgba(29,31,32,.55);
  --lg-navline:2px solid #164F72; --lg-navtx:#40454F; --lg-navact:#164F72;
  --lg-kick:#164F72; --lg-kick2:#9D403B; --lg-kickit:#164F72; --lg-accent:#164F72;
  --lg-num:#164F72; --lg-numred:#711514; --lg-mark:#164F72; --lg-year:#164F72; --lg-yearred:#711514;
  --lg-btnbg:#164F72; --lg-btnbgh:#0f3d5a; --lg-btntx:#ffffff;
  --lg-ghosttx:#711514; --lg-ghostbd:rgba(113,21,20,.4);
  --lg-herobg:#ffffff; --lg-heroglow:none; --lg-glow:drop-shadow(0 18px 30px rgba(11,47,71,.22));
  --lg-f1:linear-gradient(180deg,rgba(22,79,114,.05),transparent 40%);
  --lg-f2:linear-gradient(180deg,rgba(157,64,59,.05),transparent 40%);
  --lg-f3:linear-gradient(180deg,rgba(40,115,158,.05),transparent 40%);
  --lg-f4:linear-gradient(180deg,rgba(113,21,20,.05),transparent 40%);
  --lg-tagbg:#f7ecec; --lg-tagtx:#711514; --lg-tagbd:rgba(113,21,20,.25);
  --lg-chipbd:rgba(29,31,32,.2); --lg-chiptx:#40454F;
  --lg-chipabg:#e7f1f5; --lg-chipatx:#164F72; --lg-chipabd:rgba(22,79,114,.3);
  --lg-bandbg:#0b2f47; --lg-bandbtn:#0b2f47;
  --lg-mosbg:#ffffff; --lg-mosbd:rgba(29,31,32,.14); --lg-mline:rgba(29,31,32,.12);
  --lg-m1:#bcd8e3; --lg-m2:#eed7d5; --lg-m3:#e7f1f5; --lg-m4:rgba(22,79,114,.2);
  --lg-part:#40454F; --lg-conf:rgba(157,64,59,.4); --lg-conftx:#9D403B;
  --lg-sunbg:#164F72; --lg-suntx:#ffffff; --lg-moonbg:transparent; --lg-moontx:#8F949A; --lg-moonhole:#ffffff;
  --lg-sl:flex; --lg-sd:none;
  --lg-zebra:rgba(29,31,32,.03); --lg-inputbg:#ffffff;
  --lg-b1:#164F72; --lg-b2:#28739E; --lg-b3:#52A2BA; --lg-b4:#9D403B; --lg-b5:#8F949A;

  /* Tipografia e métrica de página (não dependem do tema) */
  --lg-cond:'Barlow Condensed', system-ui, sans-serif;
  --lg-body:'Barlow', system-ui, sans-serif;
  --lg-monofont: ui-monospace, Menlo, monospace;
  --lg-padx:56px;
}

html[data-theme="escuro"] {
  --lg-pg:#0a2438; --lg-alt:#0d2c44; --lg-foot:#071a29;
  --lg-tx:#ffffff; --lg-bd:rgba(255,255,255,.78); --lg-soft:rgba(255,255,255,.6); --lg-soft2:rgba(255,255,255,.62);
  /* idem: .4 dava 3,7:1 sobre --lg-pg; .55 dá 5,7:1 */
  --lg-mono:rgba(255,255,255,.55);
  --lg-hair:rgba(255,255,255,.1); --lg-hair2:rgba(255,255,255,.2); --lg-corner:rgba(255,255,255,.5);
  --lg-navline:1px solid rgba(255,255,255,.12); --lg-navtx:rgba(255,255,255,.7); --lg-navact:#52A2BA;
  --lg-kick:#52A2BA; --lg-kick2:#d8a6a2; --lg-kickit:#9fd2e2; --lg-accent:#52A2BA;
  --lg-num:#52A2BA; --lg-numred:#d8a6a2; --lg-mark:#52A2BA; --lg-year:#52A2BA; --lg-yearred:#d8a6a2;
  --lg-btnbg:#52A2BA; --lg-btnbgh:#6fb3c8; --lg-btntx:#07202f;
  --lg-ghosttx:#ffffff; --lg-ghostbd:rgba(255,255,255,.35);
  --lg-herobg:linear-gradient(160deg,#0d3552 0%,#164F72 52%,#0a2438 100%);
  --lg-heroglow:radial-gradient(600px 300px at 80% 25%, rgba(82,162,186,.16), transparent 70%);
  --lg-glow:drop-shadow(0 0 46px rgba(82,162,186,.35));
  --lg-f1:linear-gradient(180deg,rgba(40,115,158,.18),transparent 45%);
  --lg-f2:linear-gradient(180deg,rgba(157,64,59,.2),transparent 45%);
  --lg-f3:linear-gradient(180deg,rgba(82,162,186,.16),transparent 45%);
  --lg-f4:linear-gradient(180deg,rgba(113,21,20,.24),transparent 45%);
  --lg-tagbg:linear-gradient(90deg,#711514,#9D403B); --lg-tagtx:#ffffff; --lg-tagbd:transparent;
  --lg-chipbd:rgba(255,255,255,.25); --lg-chiptx:rgba(255,255,255,.8);
  --lg-chipabg:rgba(82,162,186,.2); --lg-chipatx:#9fd2e2; --lg-chipabd:#52A2BA;
  --lg-bandbg:linear-gradient(120deg,#711514,#9D403B); --lg-bandbtn:#711514;
  --lg-mosbg:rgba(255,255,255,.03); --lg-mosbd:rgba(255,255,255,.16); --lg-mline:rgba(255,255,255,.14);
  --lg-m1:rgba(82,162,186,.28); --lg-m2:rgba(157,64,59,.25); --lg-m3:rgba(82,162,186,.14); --lg-m4:rgba(255,255,255,.14);
  --lg-part:rgba(255,255,255,.8); --lg-conf:rgba(216,166,162,.5); --lg-conftx:#d8a6a2;
  --lg-sunbg:transparent; --lg-suntx:rgba(255,255,255,.45); --lg-moonbg:#52A2BA; --lg-moontx:#07202f; --lg-moonhole:#52A2BA;
  --lg-sl:none; --lg-sd:flex;
  --lg-zebra:rgba(255,255,255,.04); --lg-inputbg:rgba(255,255,255,.05);
  --lg-b1:#52A2BA; --lg-b2:#6fb3c8; --lg-b3:#9fd2e2; --lg-b4:#d8a6a2; --lg-b5:rgba(255,255,255,.4);
}

/* --------------------------------------------------------------------------
   2. Base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--lg-body);
  font-size: 15px;
  line-height: 1.55;
  font-weight: 400;
  background: var(--lg-pg);
  color: var(--lg-tx);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: var(--lg-cond);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.015em;
  margin: 0;
}

img, svg { max-width: 100%; }
svg { display: block; }

a { color: var(--lg-accent); }

:focus-visible { outline: 2px solid var(--lg-accent); outline-offset: 2px; }

[id] { scroll-margin-top: 80px; }

/* Definições de gradiente/pattern: o SVG fica fora de fluxo, só serve de <defs> */
.svg-defs { position: absolute; width: 0; height: 0; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  padding: 10px 16px; background: var(--lg-btnbg); color: var(--lg-btntx);
  font-weight: 600; text-decoration: none;
}
.skip-link:focus { left: 0; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

/* --------------------------------------------------------------------------
   3. Utilitários
   -------------------------------------------------------------------------- */
.mono { font-family: var(--lg-monofont); font-size: 10px; color: var(--lg-mono); }
.mono--11 { font-size: 11px; }
.mono--105 { font-size: 10.5px; }

.kicker-row { display: flex; align-items: center; gap: 10px; }
.kicker-row--mb8 { margin-bottom: 8px; }
.kicker {
  font-family: var(--lg-cond); font-weight: 600; font-size: 13px;
  letter-spacing: .14em; color: var(--lg-kick);
}
.kicker--red { color: var(--lg-kick2); }
.kicker--hero { font-size: 14px; letter-spacing: .15em; }
.kicker--soft { color: var(--lg-soft); }
.kicker--12 { font-size: 12.5px; letter-spacing: .12em; }
.kicker--13 { font-size: 13px; letter-spacing: .12em; }
.kicker--14 { font-size: 14px; letter-spacing: .1em; }

.tag {
  align-self: flex-start; font-size: 11px; letter-spacing: .04em; padding: 4px 12px;
  background: var(--lg-tagbg); color: var(--lg-tagtx); border: 1px solid var(--lg-tagbd);
}

.chip {
  font-size: 12px; padding: 4px 12px;
  border: 1px solid var(--lg-chipbd); color: var(--lg-chiptx); text-decoration: none;
}
.chip--sm { font-size: 11.5px; padding: 3px 10px; }
a.chip { transition: color .12s linear, border-color .12s linear; }
a.chip:hover { border-color: var(--lg-accent); color: var(--lg-accent); }
.chip--atual {
  background: var(--lg-chipabg); border-color: var(--lg-chipabd);
  color: var(--lg-chipatx); font-weight: 600;
}
a.chip--atual:hover { border-color: var(--lg-chipabd); color: var(--lg-chipatx); }

.conf-tag {
  font-family: var(--lg-monofont); font-size: 9px; padding: 2px 6px;
  border: 1px solid var(--lg-conf); color: var(--lg-conftx);
}

/* Uma variante do logotipo por tema (--lg-sl/--lg-sd = flex/none) */
.brand--light { display: var(--lg-sl); align-items: center; }
.brand--dark  { display: var(--lg-sd); align-items: center; }
.brand--light img, .brand--dark img { display: block; height: auto; }

.link-accent { color: var(--lg-accent); font-weight: 600; text-decoration: none; }

/* Marcadores triangulares (border trick) */
.tri { width: 0; height: 0; border-left: 9px solid transparent; border-right: 9px solid transparent; }
.tri--up   { border-bottom: 15px solid currentColor; }
.tri--down { border-top: 15px solid currentColor; }
.tri--sm { border-left-width: 7px; border-right-width: 7px; }
.tri--sm.tri--up   { border-bottom-width: 12px; }
.tri--sm.tri--down { border-top-width: 12px; }
.tri--mb { margin-bottom: 14px; }
.c-azul { color: #164F72; } .c-azul-med { color: #28739E; } .c-azul-claro { color: #52A2BA; }
.c-verm { color: #9D403B; } .c-verm-esc { color: #711514; }
.c-mark { color: var(--lg-mark); } .c-num { color: var(--lg-num); }

/* Losango bullet (quadrado rotacionado 45°) */
.losango-bullet { width: 9px; height: 9px; transform: rotate(45deg); }
.bg-azul { background: #164F72; } .bg-azul-med { background: #28739E; }
.bg-azul-claro { background: #52A2BA; } .bg-verm { background: #9D403B; }
.bg-verm-esc { background: #711514; }

/* Frame blueprint com marcas de registro "+" — extraído de industry.css */
.blueprint { position: relative; border-radius: 0; }
.blueprint > .corner {
  position: absolute; width: 11px; height: 11px; color: var(--lg-corner);
}
.blueprint > .corner::before,
.blueprint > .corner::after { content: ""; position: absolute; background: currentColor; }
.blueprint > .corner::before { left: 5px; top: 0; width: 1px; height: 100%; }
.blueprint > .corner::after  { top: 5px; left: 0; width: 100%; height: 1px; }
.blueprint > .corner.tl { top: -6px; left: -6px; }
.blueprint > .corner.tr { top: -6px; right: -6px; }
.blueprint > .corner.bl { bottom: -6px; left: -6px; }
.blueprint > .corner.br { bottom: -6px; right: -6px; }

/* --------------------------------------------------------------------------
   4. Botões
   -------------------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; text-decoration: none; border-radius: 0;
  font-family: var(--lg-cond); font-weight: 600; line-height: 1.2;
  font-size: 15px; padding: 13px 26px;
  border: 1px solid transparent;
  transition: background-color .12s linear, border-color .12s linear, color .12s linear;
}
.btn--primary { background: var(--lg-btnbg); border-color: var(--lg-btnbg); color: var(--lg-btntx); }
.btn--primary:hover { background: var(--lg-btnbgh); border-color: var(--lg-btnbgh); }
.btn--ghost { background: transparent; color: var(--lg-ghosttx); border-color: var(--lg-ghostbd); }
.btn--ghost:hover { border-color: var(--lg-ghosttx); }
.btn--nav { font-size: 13px; padding: 9px 18px; }
.btn--band {
  background: #fff; color: var(--lg-bandbtn); border-color: #fff;
  white-space: nowrap;
}
.btn--band:hover { background: rgba(255,255,255,.88); border-color: rgba(255,255,255,.88); }
.btn--form { font-family: var(--lg-body); font-size: 14px; padding: 12px 26px; }

/* --------------------------------------------------------------------------
   5. Nav
   -------------------------------------------------------------------------- */
.nav {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 24px;
  padding: 14px var(--lg-padx);
  background: var(--lg-pg);
  border-bottom: var(--lg-navline);
}
/* A ordem no DOM é brand · toggle · hambúrguer · botão · links (o combinador
   ~ do hambúrguer exige os links depois dele); `order` devolve a ordem visual. */
.nav__brand { order: 1; display: flex; align-items: center; margin-right: auto; text-decoration: none; }
.nav__links { order: 2; }
.nav .theme-toggle { order: 3; }
.nav .btn--nav { order: 4; }
.nav__links { display: flex; align-items: center; gap: 22px; font-size: 14px; }
.nav__link { color: var(--lg-navtx); text-decoration: none; transition: color .12s linear; }
.nav__link:hover { color: var(--lg-navact); }
.nav__link.is-active { color: var(--lg-navact); font-weight: 600; }

/* Toggle claro/escuro — dois botões num pill de hairline */
.theme-toggle { display: inline-flex; border: 1px solid var(--lg-hair2); }
.theme-toggle__btn {
  cursor: pointer; border: none; margin: 0; padding: 0;
  width: 28px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background-color .12s linear, color .12s linear;
}
.theme-toggle__btn--sun  { background: var(--lg-sunbg);  color: var(--lg-suntx); }
.theme-toggle__btn--moon { background: var(--lg-moonbg); color: var(--lg-moontx); }
.theme-toggle__btn[aria-pressed="false"]:hover { background: var(--lg-hair); }
.theme-toggle__moonhole { fill: var(--lg-moonhole); }

/* Hambúrguer sem JS: checkbox focável com rótulo acessível (só ≤900px) */
.nav__burger { display: none; }

/* --------------------------------------------------------------------------
   6. Hero
   -------------------------------------------------------------------------- */
.hero { position: relative; overflow: hidden; background: var(--lg-herobg); }
.hero__glow { position: absolute; inset: 0; background: var(--lg-heroglow); pointer-events: none; }
.hero__grid {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px;
  padding: 72px var(--lg-padx) 64px; align-items: center; position: relative;
}
.hero__grid--seng { grid-template-columns: 1.2fr 1fr; padding: 64px var(--lg-padx) 56px; }
.hero__copy { display: flex; flex-direction: column; gap: 22px; }
.hero__grid--seng .hero__copy { gap: 18px; }
.hero__title { font-size: 54px; line-height: 1.02; color: var(--lg-tx); font-weight: 700; }
.hero__title--seng { font-size: 48px; line-height: 1.04; }
.hl { color: var(--lg-kick); }
.hero__lead { margin: 0; font-size: 17px; line-height: 1.6; color: var(--lg-bd); max-width: 500px; }
.hero__lead--seng { font-size: 16px; line-height: 1.65; max-width: 560px; }
.hero__ctas { display: flex; gap: 12px; }
.hero__art { display: flex; align-items: center; justify-content: center; position: relative; }
.hero__losango { filter: var(--lg-glow); }
.hero__deco { position: absolute; }
.hero__deco--1 { right: 14px; top: -6px; opacity: .3; }
.hero__deco--2 { left: 26px; bottom: 2px; opacity: .35; }

/* Cabeçalho de página interna (Sobre, PS, Patrocínio, Contato) */
.page-head {
  padding: 64px var(--lg-padx) 48px;
  display: flex; flex-direction: column; gap: 18px; max-width: 860px;
}
.page-head--ps { padding-bottom: 40px; }
.page-head--44 { padding-bottom: 44px; }
.page-head h1 { font-size: 46px; line-height: 1.05; font-weight: 700; color: var(--lg-tx); }
.page-head__lead { margin: 0; font-size: 16px; line-height: 1.65; color: var(--lg-bd); }

/* Faixa de pattern triangular (uma por tema) */
.pat--light, .pat--dark { display: none; }
html:not([data-theme="escuro"]) .pat--light { display: block; }
html[data-theme="escuro"] .pat--dark { display: block; }
.pat svg { width: 100%; }

/* --------------------------------------------------------------------------
   7. Seções e grades de células
   -------------------------------------------------------------------------- */
.section { padding: 64px var(--lg-padx); }
.section--56 { padding: 56px var(--lg-padx); }
.section--alt { background: var(--lg-alt); border-top: 1px solid var(--lg-hair); }
.section--hair { border-top: 1px solid var(--lg-hair); }
.section--nopadtop { padding-top: 0; }
.section--ps { padding: 16px var(--lg-padx) 64px; }
.section__title { font-size: 30px; color: var(--lg-tx); }
.section__title--34 { font-size: 34px; }
.section__title--26 { font-size: 26px; }
.section__title--mb10 { margin-bottom: 10px; }
.section__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 26px; }
.section__head--44 { margin-bottom: 44px; }
.mb-24 { margin-bottom: 24px; }
.mb-34 { margin-bottom: 34px; }

.cells { display: grid; gap: 0; border: 1px solid var(--lg-hair2); }
.cells > * {
  border-right: 1px solid var(--lg-hair);
  border-bottom: 1px solid var(--lg-hair);
}
.cells--4 { grid-template-columns: repeat(4, 1fr); }
.cells--4 > :nth-child(4n) { border-right: 0; }
.cells--4 > :nth-last-child(-n+4) { border-bottom: 0; }
.cells--2 { grid-template-columns: repeat(2, 1fr); }
.cells--2 > :nth-child(2n) { border-right: 0; }
.cells--2 > :nth-last-child(-n+2) { border-bottom: 0; }
.cells--1 { grid-template-columns: 1fr; }
.cells--1 > * { border-right: 0; }
.cells--1 > :last-child { border-bottom: 0; }

.cell { padding: 24px; }
.cell--20 { padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.cell--22 { padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.cell__title { font-family: var(--lg-cond); font-weight: 600; font-size: 21px; color: var(--lg-tx); margin-bottom: 8px; }
.cell__title--18 { font-size: 18px; margin-bottom: 0; }
.cell__title--19 { font-size: 19px; margin-bottom: 0; }
.cell__text { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--lg-soft2); }
.cell__text--125 { font-size: 12.5px; line-height: 1.5; }
.cell__text--1255 { font-size: 12.5px; line-height: 1.55; }

/* Cartões soltos (SENG "O que acontece", cotas, diretoria) */
.cards { display: grid; gap: 20px; }
.cards--4 { grid-template-columns: repeat(4, 1fr); }
.cards--5 { grid-template-columns: repeat(5, 1fr); }
.cards--3 { grid-template-columns: repeat(3, 1fr); }
.card {
  border: 1px solid var(--lg-hair2); background: var(--lg-mosbg);
  display: flex; flex-direction: column;
}
.card--pad { padding: 22px; gap: 8px; }
.card--24 { padding: 24px; gap: 10px; }
.card--26 { padding: 26px; gap: 10px; }
.card__title { font-family: var(--lg-cond); font-weight: 600; font-size: 20px; color: var(--lg-tx); }
.card__title--22 { font-size: 22px; }
.card__text { margin: 0; font-size: 13px; line-height: 1.55; color: var(--lg-soft2); }
.card__text--135 { font-size: 13.5px; }

/* Tints de gradiente no topo das células/cartões */
.f1, .card.f1 { background: var(--lg-f1); }
.f2, .card.f2 { background: var(--lg-f2); }
.f3, .card.f3 { background: var(--lg-f3); }
.f4, .card.f4 { background: var(--lg-f4); }

/* Faixa de nota com hairline (extensão universitária, conselho fiscal, tipos) */
.note-bar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  border: 1px solid var(--lg-hair2); padding: 18px 22px;
}
.note-bar--16 { padding: 16px 20px; background: var(--lg-mosbg); }
.note-bar__text { font-size: 13.5px; color: var(--lg-soft2); }
.note-bar__text--13 { font-size: 13px; }
.mt-20 { margin-top: 20px; }
.mt-14 { margin-top: 14px; }
.mt-12 { margin-top: 12px; }
.mt-22 { margin-top: 22px; }

.chip-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.chip-row--12 { gap: 12px; }
.chip-row--8 { gap: 8px; }
.chip-row--6 { gap: 6px; }

/* --------------------------------------------------------------------------
   8. Home — strip de stats
   -------------------------------------------------------------------------- */
.stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
  border-top: 1px solid var(--lg-hair); border-bottom: 1px solid var(--lg-hair);
}
.stat { padding: 30px var(--lg-padx); display: flex; align-items: center; gap: 16px; }
.stat:not(:last-child) { border-right: 1px solid var(--lg-hair); }
.stat__num {
  font-family: var(--lg-cond); font-weight: 700; font-size: 38px; line-height: 1;
  color: var(--lg-num);
}
.stat__num--red { color: var(--lg-numred); }
.stat__label { font-size: 11.5px; letter-spacing: .1em; color: var(--lg-soft); }

/* --------------------------------------------------------------------------
   9. Home — bloco SENG + mosaico
   -------------------------------------------------------------------------- */
.seng-block {
  display: grid; grid-template-columns: 1.2fr 1fr; gap: 56px;
  padding: 64px var(--lg-padx); align-items: center;
  background: var(--lg-alt); border-top: 1px solid var(--lg-hair);
}
.seng-block__copy { display: flex; flex-direction: column; gap: 16px; }
.seng-block__text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--lg-bd); }
.seng-block__quote { margin: 0; font-size: 15px; line-height: 1.6; color: var(--lg-kickit); font-style: italic; }
.seng-block__insta { font-size: 13px; color: var(--lg-soft); }
.mosaico-wrap { display: flex; flex-direction: column; gap: 8px; }
.mosaico { border: 1px solid var(--lg-mosbd); background: var(--lg-mosbg); }
.mosaico svg { width: 100%; }

/* --------------------------------------------------------------------------
   10. Linhas do tempo
   -------------------------------------------------------------------------- */
.timeline-h { position: relative; }
.timeline-h__rail {
  position: absolute; left: 0; right: 0; top: 6px; height: 1px;
  background: var(--lg-hair2);
}
.timeline-h__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.timeline-h__item { display: flex; flex-direction: column; gap: 10px; }
.timeline-h__item .tri { position: relative; }
.timeline-h__year {
  font-family: var(--lg-cond); font-weight: 700; font-size: 20px; color: var(--lg-year);
}
.timeline-h__year--red { color: var(--lg-yearred); }
.timeline-h__text { font-size: 12.5px; line-height: 1.45; color: var(--lg-soft2); }

.timeline-v { display: flex; flex-direction: column; gap: 0; max-width: 760px; }
.timeline-v__item { display: flex; gap: 18px; }
.timeline-v__rail { display: flex; flex-direction: column; align-items: center; }
.timeline-v__dot { width: 11px; height: 11px; background: var(--lg-mark); transform: rotate(45deg); }
.timeline-v__line { width: 1px; flex: 1; background: var(--lg-hair2); }
.timeline-v__body { padding-bottom: 24px; }
.timeline-v__item:last-child .timeline-v__body { padding-bottom: 0; }
.timeline-v__year {
  font-family: var(--lg-cond); font-weight: 700; font-size: 19px; color: var(--lg-year);
}
.timeline-v__year--red { color: var(--lg-yearred); }
.timeline-v__text { font-size: 13.5px; line-height: 1.55; color: var(--lg-soft2); }
.timeline-v__intro { margin: 0 0 34px; font-size: 15px; line-height: 1.6; color: var(--lg-bd); max-width: 760px; }
.link-more { display: inline-flex; margin-top: 28px; font-size: 14px; color: var(--lg-accent); font-weight: 600; text-decoration: none; }

/* --------------------------------------------------------------------------
   11. Faixa CTA
   -------------------------------------------------------------------------- */
.band { position: relative; background: var(--lg-bandbg); overflow: hidden; margin-top: auto; }
.band__art { position: absolute; right: -56px; top: -36px; opacity: .18; }
.band--home .band__art { right: -60px; top: -40px; }
.band__inner {
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
  padding: 40px var(--lg-padx); position: relative;
}
.band--home .band__inner { padding: 44px var(--lg-padx); }
.band__copy { display: flex; flex-direction: column; gap: 6px; }
.band__title { font-size: 28px; color: #fff; }
.band--home .band__title { font-size: 30px; }
.band__text { margin: 0; font-size: 14px; color: rgba(255,255,255,.8); }
.band--home .band__text { font-size: 14.5px; max-width: 560px; }

/* --------------------------------------------------------------------------
   12. Parceiros
   -------------------------------------------------------------------------- */
.parceiros {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 36px var(--lg-padx); border-top: 1px solid var(--lg-hair);
}
.parceiros__label { margin-right: 12px; }
.parceiro { padding: 14px 26px; border: 1px solid var(--lg-hair2); }
.parceiro span, .parceiro {
  font-family: var(--lg-cond); font-weight: 600; font-size: 16px;
  letter-spacing: .08em; color: var(--lg-part);
}
.parceiros--patro { display: block; padding: 44px var(--lg-padx); }
.parceiros--patro .kicker { display: block; margin-bottom: 16px; }
.parceiros--patro .parceiros__grid { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.parceiros--patro .parceiro { padding: 16px 28px; }

/* --------------------------------------------------------------------------
   13. Footer
   -------------------------------------------------------------------------- */
.footer { border-top: 1px solid var(--lg-hair2); background: var(--lg-foot); }
.footer--simple { margin-top: auto; }
.footer__bar {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 22px var(--lg-padx); flex-wrap: wrap;
}
.footer__legal { font-size: 11.5px; color: var(--lg-mono); }
.footer__links { display: flex; gap: 16px; font-size: 12.5px; }
.footer__links a:last-child { color: var(--lg-soft); text-decoration: none; }
.footer__grid {
  display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 40px;
  padding: 44px var(--lg-padx);
}
.footer__col { display: flex; flex-direction: column; gap: 8px; }
.footer__col--brand { gap: 12px; }
.footer__about { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--lg-soft); max-width: 300px; }
.footer__label {
  font-family: var(--lg-cond); font-weight: 600; font-size: 13px;
  letter-spacing: .12em; color: var(--lg-part);
}
.footer__addr { margin: 0; font-size: 13px; line-height: 1.6; color: var(--lg-soft); }
.footer__mail { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.footer__mail span:first-child { font-size: 13px; color: var(--lg-soft); }
.footer__baseline { padding: 0 var(--lg-padx) 14px; font-size: 11.5px; color: var(--lg-mono); }

/* --------------------------------------------------------------------------
   14. SENG — missão/visão/valores e tabela de edições
   -------------------------------------------------------------------------- */
.mvv {
  display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 0;
  border-bottom: 1px solid var(--lg-hair);
}
.mvv__col { padding: 32px 40px; display: flex; flex-direction: column; gap: 8px; }
.mvv__col:not(:last-child) { border-right: 1px solid var(--lg-hair); }
.mvv__col:first-child { padding-left: var(--lg-padx); }
.mvv__col:last-child { padding-right: var(--lg-padx); gap: 10px; }
.mvv__text { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--lg-soft2); }

.tabela-wrap { border: 1px solid var(--lg-hair2); background: var(--lg-mosbg); }
.tabela { width: 100%; border-collapse: collapse; table-layout: fixed; }
.tabela th, .tabela td { text-align: left; font-weight: 400; }
.tabela thead th {
  padding: 12px 0; border-bottom: 1px solid var(--lg-hair2);
  font-family: var(--lg-cond); font-weight: 600; font-size: 12.5px;
  letter-spacing: .12em; color: var(--lg-kick);
}
.tabela tbody td { padding: 10px 0; border-bottom: 1px solid var(--lg-hair); vertical-align: baseline; }
.tabela th:first-child, .tabela td:first-child { padding-left: 20px; }
.tabela th:last-child,  .tabela td:last-child  { padding-right: 20px; }
.tabela tr.is-zebra { background: var(--lg-zebra); }
.tabela .tabela__num { font-family: var(--lg-cond); font-weight: 700; font-size: 15px; color: var(--lg-year); }
.tabela .tabela__num--red { color: var(--lg-yearred); }
.tabela .tabela__ano { font-size: 13.5px; color: var(--lg-soft2); }
.tabela .tabela__ano a { font-weight: 600; color: var(--lg-accent); text-decoration: underline; }
.tabela .tabela__tema { font-size: 13.5px; color: var(--lg-bd); padding-right: 16px; }
.tabela .tabela__local, .tabela .tabela__part { font-size: 13px; color: var(--lg-soft2); }
.tabela col.c-ed { width: 64px; } .tabela col.c-ano { width: 90px; }
.tabela col.c-local { width: 260px; } .tabela col.c-part { width: 130px; }

/* --------------------------------------------------------------------------
   15. Processo seletivo — stepper e diretoria
   -------------------------------------------------------------------------- */
.stepper { position: relative; }
.stepper__rail {
  position: absolute; left: 0; right: 0; top: 19px; height: 1px; background: var(--lg-hair2);
}
.stepper__grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px;
  list-style: none; margin: 0; padding: 0;
}
.step { display: flex; flex-direction: column; gap: 10px; }
.step__badge {
  width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;
  font-family: var(--lg-cond); font-weight: 700; font-size: 16px; position: relative;
  border: 1px solid var(--lg-hair2); color: var(--lg-year); background: var(--lg-pg);
}
.step__badge--solid { background: var(--lg-btnbg); color: var(--lg-btntx); border-color: var(--lg-btnbg); }
.step__badge--final { background: linear-gradient(120deg,#711514,#9D403B); color: #fff; border-color: transparent; }
.step__title { font-family: var(--lg-cond); font-weight: 600; font-size: 18px; color: var(--lg-tx); }
.step__text { font-size: 12.5px; line-height: 1.5; color: var(--lg-soft2); }

.dir-card__photo {
  height: 150px;
  background: repeating-linear-gradient(45deg, rgba(82,162,186,.14) 0 10px, rgba(82,162,186,.05) 10px 20px);
  display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid var(--lg-hair);
}
.dir-card__photo span { font-family: var(--lg-monofont); font-size: 10px; color: var(--lg-soft); }
.dir-card__body { padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.dir-card__cargo {
  font-family: var(--lg-cond); font-weight: 600; font-size: 17px; line-height: 1.15; color: var(--lg-tx);
}

/* --------------------------------------------------------------------------
   16. Patrocínio — números, barras e cotas
   -------------------------------------------------------------------------- */
.duas-colunas {
  padding: 0 var(--lg-padx) 56px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: start;
}
.duas-colunas__col { display: flex; flex-direction: column; gap: 18px; }
.num-cell { padding: 20px 24px; }
.num-cell__num {
  font-family: var(--lg-cond); font-weight: 700; font-size: 32px; line-height: 1; color: var(--lg-num);
}
.num-cell__num--red { color: var(--lg-numred); }
.num-cell__label { font-size: 11px; letter-spacing: .08em; color: var(--lg-soft); }

.bars { display: flex; flex-direction: column; gap: 12px; }
.bar { display: flex; flex-direction: column; gap: 5px; }
.bar__head { display: flex; justify-content: space-between; font-size: 13px; }
.bar__nome { color: var(--lg-bd); font-weight: 600; }
.bar__pct { font-family: var(--lg-monofont); font-size: 11px; color: var(--lg-soft); }
.bar__track { height: 12px; background: var(--lg-hair); }
.bar__fill { height: 12px; }

.cota--platina { border: 2px solid var(--lg-accent); }
.cota__nome { font-family: var(--lg-cond); font-weight: 700; font-size: 26px; color: var(--lg-tx); }
.cotas-nota { margin-top: 16px; font-size: 13px; color: var(--lg-soft2); }

/* --------------------------------------------------------------------------
   17. Contato — bloco de dados e formulário
   -------------------------------------------------------------------------- */
.contato {
  padding: 0 var(--lg-padx) 64px;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 44px; align-items: start;
}
.contato__col { display: flex; flex-direction: column; gap: 20px; }
.info-cell { padding: 22px 26px; display: flex; flex-direction: column; gap: 6px; }
.info-cell__text { font-size: 14px; line-height: 1.6; color: var(--lg-bd); }
.info-cell__row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.info-cell__links { display: flex; gap: 14px; flex-wrap: wrap; }
.info-cell__links a { font-size: 14px; }
.mapa {
  border: 1px solid var(--lg-mosbd); height: 220px;
  background: repeating-linear-gradient(45deg, rgba(82,162,186,.14) 0 12px, rgba(82,162,186,.05) 12px 24px);
  display: flex; align-items: center; justify-content: center;
}
.mapa span { font-family: var(--lg-monofont); font-size: 11px; color: var(--lg-soft); }

.form { padding: 32px; gap: 16px; }
.form__body { display: flex; flex-direction: column; gap: 16px; }
.form__title { font-size: 24px; color: var(--lg-tx); }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12.5px; font-weight: 600; color: var(--lg-soft);
}
.field input, .field select, .field textarea {
  padding: 11px 12px; font-size: 14px; font-family: var(--lg-body); font-weight: 400;
  background: var(--lg-inputbg); border: 1px solid var(--lg-hair2);
  color: var(--lg-tx); border-radius: 0;
}
.field textarea { resize: vertical; }
.form__actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

/* --------------------------------------------------------------------------
   18. Responsividade — breakpoints 1100 / 900 / 560
   O desktop (≥1100px) é a referência pixel-perfect dos protótipos.
   -------------------------------------------------------------------------- */
/* 1100px é o min-width dos protótipos: o layout desktop vale até esse valor,
   inclusive. 900 e 560 seguem a leitura "≤" do README. */
@media (max-width: 1099.98px) {
  :root { --lg-padx: 40px; }
  .hero__title { font-size: 46px; }
  .hero__title--seng { font-size: 42px; }
  .page-head h1 { font-size: 40px; }
  .section__title--34 { font-size: 30px; }
  .seng-block { gap: 36px; }
  .cards--5 { grid-template-columns: repeat(3, 1fr); }
  .stat { padding: 26px var(--lg-padx); }
}

@media (max-width: 900px) {
  :root { --lg-padx: 28px; }

  /* Nav: ícone + wordmark curto + toggle + hambúrguer */
  .nav { flex-wrap: wrap; gap: 14px; position: relative; }
  .nav__burger {
    display: inline-block; order: 3;
    -webkit-appearance: none; appearance: none;
    width: 30px; height: 28px; margin: 0; padding: 0;
    cursor: pointer; background-color: transparent; border: 1px solid var(--lg-hair2);
    color: var(--lg-navtx);
    background-image:
      linear-gradient(currentColor, currentColor),
      linear-gradient(currentColor, currentColor),
      linear-gradient(currentColor, currentColor);
    background-size: 16px 1.5px;
    background-position: center 8px, center 13px, center 18px;
    background-repeat: no-repeat;
  }
  .nav__links {
    display: none; order: 5; width: 100%;
    flex-direction: column; align-items: flex-start; gap: 2px;
    padding-top: 6px; border-top: 1px solid var(--lg-hair);
  }
  .nav__burger:checked ~ .nav__links { display: flex; }
  .nav__links .nav__link { padding: 9px 0; width: 100%; }
  .nav .theme-toggle { order: 2; }
  /* O botão do processo seletivo entra no menu recolhido, junto dos links,
     para a barra caber numa linha só. */
  .nav .btn--nav { order: 6; width: 100%; display: none; }
  .nav__burger:checked ~ .btn--nav { display: inline-flex; }

  /* Hero empilha; losango vira marca d'água cortada à direita */
  .hero__grid, .hero__grid--seng { grid-template-columns: 1fr; gap: 0; }
  .hero__copy { position: relative; z-index: 1; }
  .hero__art {
    position: absolute; right: -56px; top: 50%; transform: translateY(-50%);
    opacity: .13; pointer-events: none; z-index: 0; display: block;
  }
  html[data-theme="escuro"] .hero__art { opacity: .45; }
  .hero__losango { width: 200px; height: 200px; filter: none; }
  .hero__deco { display: none; }
  .hero__lead, .hero__lead--seng { max-width: none; }
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__ctas .btn { width: 100%; }

  /* Grades de 4 → 2×2 */
  .cells--4 { grid-template-columns: repeat(2, 1fr); }
  .cells--4 > * { border-right: 1px solid var(--lg-hair); border-bottom: 1px solid var(--lg-hair); }
  .cells--4 > :nth-child(2n) { border-right: 0; }
  .cells--4 > :nth-last-child(-n+2) { border-bottom: 0; }
  .cards--4, .cards--3, .cards--5 { grid-template-columns: repeat(2, 1fr); }

  /* Missão/visão/valores empilha */
  .mvv { grid-template-columns: 1fr; }
  .mvv__col { padding: 24px var(--lg-padx); }
  .mvv__col:not(:last-child) { border-right: 0; border-bottom: 1px solid var(--lg-hair); }

  /* Bloco SENG e colunas duplas empilham */
  .seng-block { grid-template-columns: 1fr; gap: 32px; }
  .duas-colunas, .contato { grid-template-columns: 1fr; gap: 32px; }

  /* Linha do tempo horizontal vira vertical */
  .timeline-h__rail { display: none; }
  .timeline-h__grid { grid-template-columns: 1fr; gap: 22px; }

  /* Stepper em 3 colunas */
  .stepper__rail { display: none; }
  .stepper__grid { grid-template-columns: repeat(3, 1fr); gap: 22px 16px; }

  /* Tabela de edições ganha scroll horizontal */
  .tabela-scroll { overflow-x: auto; }
  .tabela { min-width: 820px; }

  /* Faixa CTA empilha */
  .band__inner, .band--home .band__inner { flex-direction: column; align-items: flex-start; gap: 20px; }
  .band__art { right: -70px; }

  /* Footer */
  .footer__grid { grid-template-columns: 1fr; gap: 26px; }
  .stat { padding: 22px var(--lg-padx); gap: 12px; }
  .stat__num { font-size: 30px; }
  .stat__label { font-size: 10.5px; letter-spacing: .08em; }
  .section, .section--56 { padding: 48px var(--lg-padx); }
  .page-head { padding: 48px var(--lg-padx) 32px; }
  .hero__grid { padding: 48px var(--lg-padx) 40px; }
  .hero__grid--seng { padding: 44px var(--lg-padx) 36px; }
}

@media (max-width: 560px) {
  :root { --lg-padx: 20px; }
  .hero__title { font-size: 36px; }
  .hero__title--seng { font-size: 34px; }
  .page-head h1 { font-size: 32px; }
  .section__title, .section__title--34 { font-size: 26px; }
  .section__title--26 { font-size: 22px; }
  .band__title, .band--home .band__title { font-size: 24px; }

  /* Grades de 4 e cartões → 1 coluna */
  .cells--4 { grid-template-columns: 1fr; }
  .cells--4 > * { border-right: 0; }
  .cells--4 > :nth-last-child(-n+2) { border-bottom: 1px solid var(--lg-hair); }
  .cells--4 > :last-child { border-bottom: 0; }
  .cells--2 { grid-template-columns: 1fr; }
  .cells--2 > * { border-right: 0; }
  .cells--2 > :nth-last-child(-n+2) { border-bottom: 1px solid var(--lg-hair); }
  .cells--2 > :last-child { border-bottom: 0; }
  .cards--4, .cards--3, .cards--5 { grid-template-columns: 1fr; }

  /* Stats compactos em 3 colunas (regra do README) */
  .stats { grid-template-columns: repeat(3, 1fr); }
  .stat { flex-direction: column; align-items: flex-start; gap: 8px; padding: 18px 14px; }
  .stat svg { width: 22px; height: 22px; }
  .stat__num { font-size: 24px; }
  .stat__label { font-size: 9.5px; line-height: 1.3; }

  /* Stepper e formulário em 1 coluna */
  .stepper__grid { grid-template-columns: 1fr; }
  .form__row { grid-template-columns: 1fr; }
  .form { padding: 22px; }

  /* Footer central */
  .footer__bar { flex-direction: column; align-items: center; text-align: center; }
  .footer__grid { justify-items: center; text-align: center; }
  .footer__col { align-items: center; }
  .footer__baseline { text-align: center; }
  .footer__about { max-width: none; }

  .parceiros { justify-content: center; }
  .hero__art { right: -80px; }
}