/* ==========================================================================
   BRAND HUB · MARCUS CASTRO · motor v2.0 · NÃO EDITAR POR CLIENTE
   Tudo que é do cliente fica em hub-dados.js (cores do cliente entram
   pelas variáveis --hero-bg, --hero-img, --brand-dark e --brand-light).
   Exceções de propósito: BRAND HUB em mono grande (lockup do cabeçalho) e
   chips de formato (.fmt) só em grades densas.
   ========================================================================== */

@font-face{font-family:"Geist";src:url(fonts/Geist-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist";src:url(fonts/Geist-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Geist";src:url(fonts/Geist-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Geist";src:url(fonts/Geist-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexMono-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexMono-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Plex";src:url(fonts/IBMPlexMono-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  color-scheme:light;
  /* Marcus Castro · fixos */
  --white:#FFFFFF;
  --page:#F7F7F5;           /* fundo cinza claro (cor do site) */
  --box:#F1F1EE;            /* caixas cinza */
  --box-2:#E9E9E5;          /* hover das linhas */
  --line:#E2E1DC;
  --line-2:#BDBCB5;
  --ink:#141414;
  --ink-2:#3A3A38;
  --muted:#6B6B67;
  --steel:#696E6B;          /* BRAND HUB e metadados */
  --mc:#021717;             /* logotipo Marcus Castro */
  --accent:#6C3BFF;         /* roxo Marcus Castro */
  --accent-soft:#B9A4FF;    /* roxo sobre fundo escuro */
  --r:10px;                 /* caixas */
  --r-sm:6px;               /* botões */
  --r-lg:14px;              /* painel e cartões grandes */
  --pad:clamp(16px,2.8vw,40px);
  --max:1440px;
  --text:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Plex",ui-monospace,Menlo,monospace;

  /* ---------- cliente · definido por hub-dados.js ---------- */
  --hero-bg:#FAFAF9;        /* fundo do padrão claro do hero */
  --hero-img:none;
  --brand-dark:#614470;     /* fundo escuro da marca · Púrpura */
  --brand-light:#E7D8B8;    /* fundo claro da marca · Marfim */
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:64px}
body{margin:0;background:var(--white);color:var(--ink);font:400 16px/1.6 var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
p,h1,h2,h3,h4{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Assinatura horizontal ---------- */
.lockup{display:flex;align-items:center;gap:4.6%}
.lockup img:first-child{width:31.6%}
.lockup img:last-child{width:63.8%}

/* ---------- Gate ---------- */
html.locked .app{display:none}
html:not(.locked) .gate{display:none}
.gate{min-height:100vh;background:var(--page);display:grid;place-items:center;padding:24px}
.gate-card{width:min(100%,320px);background:var(--white);border-radius:var(--r-lg);padding:44px 26px 32px;display:grid;justify-items:center;text-align:center;box-shadow:0 1px 0 var(--line)}
.gate-card .lg{width:200px;margin-bottom:22px}
.gate-card .hub{font:600 18px/1 var(--mono);letter-spacing:.32em;margin:0 -.32em 30px 0;color:var(--ink)}
.gate form{width:100%;display:grid;gap:8px;text-align:left}
.gate label{font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.gate input{width:100%;height:42px;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:0 12px;font:500 15px var(--text);background:var(--white)}
.gate input:focus{outline:none;border-color:var(--ink)}
.gate button{height:40px;border-radius:var(--r-sm);background:var(--ink);color:var(--white);font:600 14px var(--text);transition:background .15s}
.gate button:hover{background:var(--accent)}
.gate .err{min-height:18px;font-size:12.5px;font-weight:600;color:var(--ink)}
.gate .fine{margin-top:20px;font-size:11.5px;line-height:1.55;color:var(--muted)}

/* ---------- Cabeçalho ---------- */
.mast .wrap{display:grid;grid-template-columns:372px 374px 1fr;align-items:center;min-height:100px}
.mcmark{display:inline-grid;gap:5px;text-decoration:none;color:var(--mc);justify-self:start}
.mcmark b{font:600 37px/.9 var(--text);letter-spacing:-.05em;white-space:nowrap}
.mcmark b sup{font-size:.32em;font-weight:500;letter-spacing:0;vertical-align:1.3em}
.mcmark span{font:500 10px/1 var(--mono);letter-spacing:.115em;text-transform:uppercase;color:var(--steel);white-space:nowrap}
.hubname{font:600 31px/1 var(--mono);letter-spacing:.3em;color:var(--steel);white-space:nowrap}
.meta{font:500 10px/1.65 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.meta b{font-weight:700}

/* ---------- Hero ---------- */
.hero{background:var(--hero-bg) var(--hero-img) center/cover no-repeat}
.hero .wrap{display:grid;grid-template-columns:1fr auto;align-items:center;min-height:410px;gap:40px}
.hero .lg{width:min(100%,690px)}
.hero ul{list-style:none;margin:0 clamp(0px,17vw,252px) 0 0;padding:0;display:grid;gap:22px}
.hero li a{font:500 25px/1.25 var(--text);letter-spacing:-.02em;color:var(--mc);text-decoration:none;background:linear-gradient(var(--accent),var(--accent)) 0 100%/0 2px no-repeat;transition:background-size .25s}
.hero li a:hover{background-size:100% 2px}

/* ---------- Menu ---------- */
.menu{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.95);backdrop-filter:saturate(1.4) blur(10px);transition:box-shadow .2s}
.menu.stuck{box-shadow:0 1px 0 var(--line)}
.menu nav{display:flex;justify-content:center;gap:clamp(18px,3vw,43px);padding:16px var(--pad) 14px;overflow-x:auto;scrollbar-width:none}
.menu nav::-webkit-scrollbar{display:none}
.menu nav a{font:400 20px/1.2 var(--text);letter-spacing:-.02em;color:var(--mc);text-decoration:none;white-space:nowrap;padding-bottom:4px;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.menu nav a:hover{color:var(--muted)}
.menu nav a.on{border-color:var(--accent)}
.stats{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 14px;padding:0 var(--pad) 22px;font-size:13px;color:var(--muted)}
.stats b{font-weight:600;color:var(--ink)}
.stats i{font-style:normal;color:var(--line-2)}

/* ---------- Seções ---------- */
section{padding:clamp(56px,7vw,96px) 0;border-top:1px solid var(--line)}
section.gray{background:var(--page);border-top:0}
section.gray+section{border-top:0}
#inicio{padding-top:52px}
.eyebrow{font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.head{display:grid;grid-template-columns:1fr 1fr;gap:18px 0;align-items:end;margin-bottom:clamp(32px,4vw,52px)}
.head .eyebrow{grid-column:1/-1}
.head h2{font:700 clamp(40px,6vw,88px)/.98 var(--text);letter-spacing:-.045em;text-transform:uppercase}
.head p{font-size:18px;line-height:1.62;color:var(--ink-2);max-width:34em;padding:0 0 8px 24px}
.head p strong{font-weight:600;color:var(--ink)}
h3{font:600 clamp(22px,2.1vw,27px)/1.12 var(--text);letter-spacing:-.025em}
.lede{font-size:15px;color:var(--muted);line-height:1.6}

.block{display:grid;grid-template-columns:1fr 3fr;gap:20px 0;padding:40px 0;border-top:1px solid var(--line)}
.block:first-of-type{border-top:0;padding-top:0}
.block.flush{padding-bottom:0}
.block .info{display:grid;align-content:start;gap:12px;padding-right:40px}
.mt1{margin-top:12px}.mt2{margin-top:24px}.mt3{margin-top:40px}

/* ---------- Botões ---------- */
.btns{display:flex;flex-wrap:wrap;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 15px;border-radius:var(--r-sm);background:var(--ink);color:var(--white);text-decoration:none;font:600 13.5px/1 var(--text);letter-spacing:-.005em;white-space:nowrap;transition:background .15s,color .15s,box-shadow .15s}
.btn:hover{background:var(--accent)}
.btn.line{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.line:hover{background:var(--ink);color:var(--white);box-shadow:none}
.btn.sm{min-height:32px;padding:0 11px;font-size:12.5px}
.btn .k{font:600 10.5px/1 var(--mono);letter-spacing:.06em;opacity:.7}
.on-dark .btn{background:var(--white);color:var(--ink)}
.on-dark .btn:hover{background:var(--accent);color:var(--white)}
.on-dark .btn.line{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.on-dark .btn.line:hover{background:var(--white);color:var(--ink);box-shadow:none}

/* ---------- Caixas ---------- */
.box{background:var(--box);border-radius:var(--r);padding:clamp(20px,2.2vw,28px);display:grid;align-content:start;gap:10px;min-width:0}
.box.w{background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.box h4{font:600 17px/1.2 var(--text);letter-spacing:-.015em}
.box p{font-size:15px;line-height:1.6;color:var(--ink-2)}
.label{font:600 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.g5{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
figure{margin:0;min-width:0}
figure .im{background:var(--box);border-radius:var(--r);overflow:hidden}
figure .im img{width:100%}
figcaption{display:flex;justify-content:space-between;align-items:flex-start;gap:12px 16px;flex-wrap:wrap;padding-top:14px}
figcaption b{display:block;font-weight:600;font-size:15px}
figcaption small{display:block;font-size:13.5px;color:var(--muted);line-height:1.5}
.checker{background-color:#fff!important;background-image:linear-gradient(45deg,var(--box) 25%,transparent 25%,transparent 75%,var(--box) 75%),linear-gradient(45deg,var(--box) 25%,transparent 25%,transparent 75%,var(--box) 75%);background-size:20px 20px;background-position:0 0,10px 10px}
.mult img{mix-blend-mode:multiply}
.ar-16x9 img{aspect-ratio:16/9;object-fit:cover}
.ar-1 img{aspect-ratio:1/1;object-fit:cover}
.stage{aspect-ratio:4/3;display:grid;place-items:center}
.stage img{width:min(56%,300px)!important}
.half{max-width:calc(50% - 6px)}
.box p b{font-weight:600;color:var(--ink)}

/* ---------- Tarefas ---------- */
.tasks{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.task{position:relative;text-align:left;background:var(--white);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);padding:24px 24px 22px;min-height:200px;display:flex;flex-direction:column;gap:8px;text-decoration:none;transition:background .18s,color .18s,box-shadow .18s}
.task .n{font:600 12px/1 var(--mono);letter-spacing:.06em;color:var(--accent);margin-bottom:10px}
.task strong{font:600 22px/1.15 var(--text);letter-spacing:-.025em}
.task span.d{font-size:15px;line-height:1.55;color:var(--muted);transition:color .18s}
.task .go{margin-top:auto;padding-top:14px;font:600 13.5px/1 var(--text);color:var(--ink-2)}
.task:hover{background:var(--ink);color:var(--white);box-shadow:none}
.task:hover .n{color:var(--accent-soft)}
.task:hover span.d,.task:hover .go{color:rgba(255,255,255,.75)}

/* ---------- Pastas da marca ---------- */
.folders{background:var(--white);border-radius:var(--r-lg);box-shadow:inset 0 0 0 1px var(--line);padding:8px}
.folder{width:100%;display:grid;grid-template-columns:52px 1fr auto auto;align-items:center;gap:18px;padding:14px 16px;border-radius:var(--r);text-align:left;transition:background .15s}
.folder:hover{background:var(--ink);color:var(--white)}
.folder:hover small,.folder:hover .ct,.folder:hover .ar{color:rgba(255,255,255,.72)}
.folder+.folder{margin-top:2px}
.folder .num{width:52px;height:52px;border-radius:var(--r);background:var(--box);display:grid;place-items:center;font:600 14px/1 var(--mono);color:var(--ink);transition:background .15s,color .15s}
.folder:hover .num{background:rgba(255,255,255,.12);color:var(--white)}
.folder b{display:block;font:600 18px/1.25 var(--text);letter-spacing:-.02em}
.folder small{display:block;font-size:14.5px;color:var(--muted);line-height:1.45;margin-top:2px}
.folder .ct{font-size:14px;color:var(--muted);white-space:nowrap}
.folder .ar{font-size:18px;color:var(--muted);transition:transform .15s,color .15s}
.folder:hover .ar{transform:translateX(3px)}

/* ---------- Painel lateral ---------- */
.scrim{position:fixed;inset:0;z-index:50;background:rgba(20,20,20,.28);opacity:0;transition:opacity .2s}
.scrim.on{opacity:1}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:51;width:min(100%,480px);background:var(--white);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1);box-shadow:-1px 0 0 var(--line)}
.drawer.on{transform:none}
.dw-head{display:grid;grid-template-columns:1fr auto;gap:6px 16px;align-items:start;padding:24px 24px 20px;border-bottom:1px solid var(--line)}
.dw-head .label{grid-column:1}
.dw-head h3{grid-column:1;font-size:24px}
.dw-head p{grid-column:1;font-size:14.5px;color:var(--muted)}
.dw-close{grid-column:2;grid-row:1/4;width:40px;height:40px;border-radius:50%;background:var(--box);font-size:18px;line-height:1;color:var(--ink);transition:background .15s}
.dw-close:hover{background:var(--box-2)}
.dw-body{flex:1;overflow-y:auto;padding:20px 24px 28px}
.dw-note{font-size:14px;line-height:1.55;color:var(--ink-2);background:var(--box);border-radius:var(--r);padding:12px 14px;margin-bottom:18px}
.dw-group+.dw-group{margin-top:22px}
.dw-group>.label{display:block;margin-bottom:8px}
.item{display:grid;gap:10px;padding:14px 0;border-top:1px solid var(--line)}
.item:first-of-type{border-top:0}
.item b{display:block;font:600 15.5px/1.3 var(--text);letter-spacing:-.01em}
.item small{display:block;font-size:13.5px;color:var(--muted);line-height:1.45;margin-top:2px}
.dw-foot{padding:16px 24px 20px;border-top:1px solid var(--line)}
.dw-foot .btn{width:100%;min-height:46px;font-size:14.5px}

/* ---------- Guia ---------- */
.guide{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.guide .im{box-shadow:inset 0 0 0 1px var(--line);background:var(--white)}

/* ---------- Conceito ---------- */
.cols{columns:2;column-gap:40px}
.cols p{font-size:16.5px;line-height:1.68;color:var(--ink-2);break-inside:avoid;margin-bottom:1.1em}
.construct{background:var(--white);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);padding:clamp(16px,2vw,24px)}
.parts{margin-top:12px}

/* ---------- Logotipo ---------- */
.marks{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:12px}
.markcard{min-height:340px;border-radius:var(--r);padding:clamp(20px,2.2vw,28px);display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-width:0}
.markcard .label{color:inherit;opacity:.7}
.markcard img{margin:auto;max-height:200px;width:auto;max-width:82%}
.markcard.w{background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.markcard.p{background:var(--brand-dark);color:var(--white)}
.markcard.m{background:var(--brand-light)}
.matrix{overflow-x:auto;border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line)}
.matrix table{width:100%;border-collapse:collapse;min-width:820px;table-layout:fixed}
.matrix th,.matrix td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:16px;text-align:left;vertical-align:top}
.matrix tr>*:last-child{border-right:0}
.matrix tbody tr:last-child>*{border-bottom:0}
.matrix thead th{font:600 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:var(--box)}
.matrix thead th:first-child{width:150px}
.matrix tbody th{font:600 15px/1.2 var(--text);letter-spacing:-.01em}
@media (min-width:761px){.matrix tbody th{pointer-events:none}}
.matrix tbody th small{display:block;margin-top:4px;font:400 12.5px/1.3 var(--text);color:var(--muted)}
.cell{display:grid;gap:10px}
.pv{height:100px;display:grid;place-items:center;background:var(--box);border-radius:var(--r-sm);padding:16px}
.pv.dk{background:var(--brand-dark)}
.pv img{max-height:68px;width:auto;max-width:100%}
.fmt{display:flex;flex-wrap:wrap;gap:4px}
.fmt a{font:600 11px/1 var(--mono);letter-spacing:.04em;text-decoration:none;padding:7px 8px;border-radius:5px;box-shadow:inset 0 0 0 1px var(--line-2);transition:background .15s,color .15s,box-shadow .15s}
.fmt a:hover{background:var(--ink);color:var(--white);box-shadow:none}
.fn{font:500 10.5px/1.3 var(--mono);color:var(--muted);overflow-wrap:anywhere}
.none{height:100px;border-radius:var(--r-sm);display:grid;place-items:center;text-align:center;font-size:12.5px;color:var(--muted);background:repeating-linear-gradient(135deg,var(--box) 0 8px,var(--page) 8px 16px)}
.rules ul{margin:0;padding-left:18px;font-size:15px;line-height:1.6;color:var(--ink-2)}
.rules li{margin-bottom:6px}

/* ---------- Paleta ---------- */
.swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.sw{position:relative;border-radius:var(--r);padding:18px;min-height:220px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;text-align:left;font:inherit;transition:transform .15s}
.sw:hover{transform:translateY(-2px)}
.sw b{font:600 18px/1.15 var(--text);letter-spacing:-.02em}
.sw code{font:600 13px/1.2 var(--mono)}
.sw small{font:500 11.5px/1.5 var(--mono)}
.sw .tip{position:absolute;top:16px;left:18px;right:18px;display:flex;justify-content:space-between;font:600 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:0;transition:opacity .15s}
.sw:hover .tip,.sw:focus-visible .tip,.sw.copied .tip{opacity:.85}
.sw .tip .c2{display:none}
.sw.copied .tip .c1{display:none}
.sw.copied .tip .c2{display:inline}
.pairs{display:grid;gap:8px;margin-top:4px}
.pair{display:flex;align-items:center;gap:12px;font-size:14.5px;background:var(--white);border-radius:var(--r-sm);padding:10px 12px}
.pair .dots{display:flex}
.pair i{width:22px;height:22px;border-radius:50%;display:inline-block}
.pair .dots i+i{margin-left:-6px;box-shadow:-2px 0 0 var(--white)}

/* ---------- Tipografia ---------- */
.spec{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,4vw,64px);align-items:center;background:var(--white);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);padding:clamp(24px,3vw,40px)}
.spec img:first-child{width:clamp(200px,24vw,340px)}
.spec img:last-child{width:min(100%,330px)}
.role{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.role b{font:600 17px/1.2 var(--text);letter-spacing:-.015em}
.role span{font-size:14px;color:var(--muted);text-align:right}

/* ---------- Vídeo ---------- */
.track{display:block;text-decoration:none}
.track .im{position:relative;aspect-ratio:16/9;background:var(--box);border-radius:var(--r-sm);overflow:hidden}
.track .im img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.track .im:not([data-hint])::after{display:none}
.track .im::after{content:attr(data-hint);position:absolute;right:8px;bottom:8px;font:600 11.5px/1 var(--text);background:var(--white);color:var(--ink);padding:7px 9px;border-radius:5px;opacity:0;transform:translateY(4px);transition:.2s}
.track:hover .im img{transform:scale(1.035)}
.track:hover .im::after{opacity:1;transform:none}
.track .t{display:flex;gap:8px;padding-top:9px;font-size:13.5px;line-height:1.35}
.track .t span{font:600 12px/1.45 var(--mono);color:var(--accent)}
.letter{display:flex;flex-direction:column}
.letter .fmt{margin-top:auto;padding-top:9px}
.subhead{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap;margin:0 0 18px}
.subhead .lede{margin-top:6px}
.vgroup+.vgroup{margin-top:52px;padding-top:40px;border-top:1px solid var(--line)}
.howto{margin-top:40px}

/* ---------- Em breve · ajuda ---------- */
.soon{border:1px dashed var(--line-2);border-radius:var(--r);padding:22px;display:grid;gap:4px;min-height:120px;align-content:end}
.soon b{font:600 18px/1.2 var(--text);letter-spacing:-.02em}
.soon span{font-size:14px;color:var(--muted)}
.code{font:500 12px/1.75 var(--mono);color:var(--ink-2);overflow-wrap:anywhere}
.mail{font:600 14px var(--mono);text-decoration:none;border-bottom:1px solid var(--line-2)}
.mail:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- Rodapé ---------- */
footer{background:var(--ink);color:var(--white);padding:clamp(48px,6vw,72px) 0 36px}
footer .top{display:grid;grid-template-columns:1fr 1fr;gap:28px 56px;align-items:end;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.14)}
footer .top .btns{justify-content:flex-end}
footer .restrict{font-size:14.5px;line-height:1.65;color:rgba(255,255,255,.72);max-width:38em}
footer .restrict b{color:var(--white);font-weight:600}
footer .bottom{display:grid;grid-template-columns:auto 1fr;gap:20px 40px;align-items:end;padding-top:28px;font-size:13px;line-height:1.7;color:rgba(255,255,255,.6)}
footer .bottom .r{text-align:right}
footer .bottom a{color:var(--white);text-decoration:none}
footer .bottom a:hover{color:var(--accent-soft)}
footer .mcmark{color:var(--white)}
footer .mcmark span{color:rgba(255,255,255,.55)}
footer .mcmark b{font-size:30px}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:24px;z-index:60;transform:translate(-50%,120px);background:var(--ink);color:var(--white);padding:12px 18px;border-radius:var(--r-sm);font:600 13.5px/1 var(--text);transition:transform .25s;visibility:hidden}
.toast.on{visibility:visible;transform:translate(-50%,0)}

/* ---------- Responsivo ---------- */
@media (max-width:1180px){
  .mast .wrap{grid-template-columns:auto 1fr;gap:16px 40px;padding-top:22px;padding-bottom:22px}
  .meta{grid-column:1/-1}
  .hubname{font-size:26px;justify-self:end}
  .hero ul{margin-right:0}
  .head{grid-template-columns:1fr}
  .head p{padding-left:0}
  .block{grid-template-columns:1fr}
  .block .info{padding-right:0}
  .marks{grid-template-columns:1fr 1fr}
  .marks .markcard:first-child{grid-column:1/-1}
  .menu nav{gap:20px}
  .menu nav a{font-size:17px}
  .refig{max-width:100%}
}
@media (max-width:1000px){
  .menu nav{justify-content:flex-start;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .tasks{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .mast .wrap{grid-template-columns:1fr;gap:12px}
  .hubname{justify-self:start;font-size:20px;letter-spacing:.28em}
  .meta{display:none}
  .mcmark b{font-size:30px}
  .hero .wrap{grid-template-columns:1fr;min-height:0;padding-top:48px;padding-bottom:44px;gap:28px}
  .hero ul{display:flex;flex-wrap:wrap;gap:8px 22px}
  .hero li a{font-size:18px}
  .menu nav{padding-top:12px;padding-bottom:10px}
  .menu nav a{font-size:16px}
  .stats{font-size:12px;padding-bottom:16px}
  .head p{font-size:16.5px}
  .tasks,.g2,.g3,.g4,.guide,.marks{grid-template-columns:1fr}
  .marks .markcard:first-child{grid-column:auto}
  .task{min-height:0}
  .folder{grid-template-columns:44px 1fr auto;gap:14px;padding:12px}
  .folder .num{width:44px;height:44px}
  .folder .ct{display:none}
  .g5,.swatches{grid-template-columns:1fr 1fr}
  .sw{min-height:160px}
  .cols{columns:1}
  .spec{grid-template-columns:1fr}
  .role{flex-direction:column;align-items:flex-start;gap:2px}
  .role span{text-align:left}
  footer .top,footer .bottom{grid-template-columns:1fr}
  footer .top .btns{justify-content:flex-start}
  footer .bottom .r{text-align:left}
  .matrix{box-shadow:none;overflow:visible}
  .matrix table,.matrix tbody,.matrix tr,.matrix td,.matrix tbody th{display:block;min-width:0;width:auto;border-right:0}
  .matrix thead{display:none}
  .matrix tr{border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--line);margin-bottom:12px;overflow:hidden}
  .matrix tbody tr:last-child>*{border-bottom:1px solid var(--line)}
  .matrix tbody th{background:var(--box);cursor:pointer;position:relative;padding-right:44px}
  .matrix tbody th::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);font:500 20px/1 var(--text)}
  .matrix tr.open th::after{content:"−"}
  .matrix tr:not(.open) td{display:none}
  .matrix td::before{content:attr(data-col);display:block;font:600 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- v2 · peças do motor ---------- */
.hero.plain{background-image:none}
.cards-w .box{background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.g1{display:grid;gap:12px}
.fig-note{font-size:13px;color:var(--muted);margin-top:8px}
.sec-gap{margin-top:40px}