/* ==========================================================================
   BESSA · TOKENS (23/09/2026 · A1) — contrato ÚNICO de cor, tipo, forma e movimento.
   Importado por wc.css (home) e pelas páginas internas/blog (A2). Nomes ESTÁVEIS: renomear
   quebra as duas frentes. Acrescentar é permitido; mudar valor é permitido; mudar NOME não.

   Tema: claro por padrão; escuro é o ESPELHO (mesmo contraste, mesma hierarquia), por
   prefers-color-scheme ou por escolha salva em <html data-tema="claro|escuro">.

   Gramática do fio (semântica de cor, nunca decoração):
     --ia        tracejado neutro  = a Rafa (IA) agindo
     --vinho     contínuo vinho    = uma pessoa assumiu / ação humana / CTA
     --ouro      linha dupla       = registro, evidência, período, carimbo (SÓ isso)
     --tinta     contínuo de tinta = a clínica decide
   Tipo: serifa = tese, títulos, voz da Rafaela · sans = instrução, interface, dados ·
         mono = SÓ registro/carimbo (hora, hash, trilha).
   ========================================================================== */

/* ---------- fontes (woff2, subconjunto latin, font-display: swap). WC 24/09 · X1: vieram de wc.css para cá,
   para a home (tokens inline) e as internas (tokens.css + wc.css) declararem cada face UMA vez. ---------- */
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/source-serif-4-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:500;font-display:swap;src:url("../fonts/source-serif-4-latin-500-italic.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/source-serif-4-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/inter-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/inter-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/jetbrains-mono-500-6.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}
/* WC 26/09 · v7 · A1 (decisão de tipografia da rodada — ver design/RAFA-SITE-CONTRATO.md): declarada e
   NÃO usada por padrão (zero byte extra: font-display: swap só baixa quando algo pede a família). Os dois
   arquivos abaixo já existem no site (idênticos aos do Google Fonts) e cobrem o H1/tese em itálico e reto.
   Para trocar a decisão, troque só --serif-display no :root — nada mais no site referencia esta família. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 700;font-display:swap;src:url("../fonts/cormorant-garamond-700-5.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500 700;font-display:swap;src:url("../fonts/cormorant-garamond-600-italic-5.woff2") format("woff2")}

:root{
  /* ---------- cor (tema claro) ---------- */
  --bg:#F4F1EA;            /* papel: fundo da página */
  --bg-2:#E5DFD2;          /* mesa: faixa alternada (WC 24/09 · X1: ΔL* 6,2 e ΔHSL 7,7% sobre --bg; antes #EAE5DB, 4,1) */
  --bg-doc:#FFFEFB;        /* documento, cartão, objeto */
  --bg-obj:#FBF9F5;        /* miolo do objeto de produto */
  --bg-sutil:#F1EDE5;      /* bolha do paciente, chip */
  --fg:#1A1917;            /* tinta */
  --fg-2:#48433C;
  --fg-3:#645D53;          /* ≥4.5:1 sobre --bg-2 (4,89:1) */
  --regra:#DCD5C8;
  --regra-forte:#B9AF9E;
  --tinta:#1A1917;         /* código: a clínica decide */
  --ia:#6E675C;            /* código: tracejado da IA */
  --vinho:#A63A50;         /* preenchimento: ação humana e CTA */
  --vinho-hover:#8E2F44;
  --vinho-texto:#8A2A40;   /* vinho como texto/traço sobre o papel */
  --sobre-vinho:#FFF8F5;
  --ouro:#7A5B26;          /* registro e evidência (≥4,5:1 como texto sobre --bg-2: 4,72:1) */
  --ouro-fundo:#F6F0E2;
  --foco:#1A1917;
  --wa:#1FA855;
  --retrato-fundo:#070707; /* casa com o fundo do retrato de estúdio */
  --selecao:rgba(166,58,80,.22);

  /* ---------- sombra (física, curta; duas camadas no objeto) ---------- */
  --sombra-1:0 1px 2px rgba(26,20,14,.06),0 10px 24px -14px rgba(26,20,14,.22);
  --sombra-2:0 1px 1px rgba(26,20,14,.05),0 3px 8px -2px rgba(26,20,14,.10),0 36px 72px -30px rgba(26,20,14,.38);
  --borda-objeto:0 0 0 1px rgba(26,20,14,.09);

  /* ---------- tipo ---------- */
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  /* v7 · A1: UMA serifa (decisão desta rodada) — Source Serif 4 também no H1/tese/.t1, zero byte extra.
     Alternativa avaliada e descartada por ora (custo: 2 requisições + ~77 KB para o H1, o elemento de LCP;
     ver design/RAFA-SITE-CONTRATO.md) — troque só esta linha para comparar, os @font-face já estão prontos: */
  --serif-display:var(--serif);
  /* --serif-display:"Cormorant Garamond",var(--serif); */
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
  --t-display:clamp(2rem,1.1rem + 3.3vw,4.25rem);
  --t-1:clamp(1.75rem,1.2rem + 1.9vw,3rem);
  --t-2:clamp(1.25rem,1.1rem + .6vw,1.625rem);
  --t-lead:clamp(1.0625rem,1rem + .3vw,1.25rem);
  --t-corpo:1rem;
  --t-peq:.875rem;
  --t-mini:.8125rem;
  --t-mono:.75rem;
  --t-num:clamp(2rem,1.5rem + 1.6vw,3rem);

  /* ---------- espaço e grade ---------- */
  --largura:1240px;
  --largura-larga:1320px;
  --calha:clamp(16px,4.2vw,56px);
  --ato:clamp(72px,8vw,128px);
  --topo:64px;

  /* ---------- forma ---------- */
  --r-doc:2px;
  --r-controle:10px;
  --r-objeto:14px;
  --r-pilula:999px;

  /* ---------- movimento (North Star §2; mesmos nomes no cockpit) ---------- */
  --m-fast:120ms;   --e-fast:cubic-bezier(.2,0,0,1);
  --m-base:240ms;   --e-base:cubic-bezier(.2,.7,.2,1);
  --m-slow:700ms;   --e-slow:cubic-bezier(.16,1,.3,1);
  --d-1:8px; --d-2:16px; --d-3:32px;
  --stagger:40ms;

  /* ---------- o fio (um só traço em todo o sistema: site e cockpit) ---------- */
  --fio:2px;                 /* espessura única: tracejado da IA, vinho da pessoa, espinha, margem */
  --fio-traco:4px;           /* tracejado 4/4 */
  --batente-tam:8px;         /* o batente: marca curta perpendicular (8 px) onde a máquina para */
  --fio-ia-h:repeating-linear-gradient(90deg,var(--ia) 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));
  --fio-ia-v:repeating-linear-gradient(180deg,var(--ia) 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));

  color-scheme:light;
}

/* ---------- tema escuro: o espelho ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    --fio-ia-h:repeating-linear-gradient(90deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));--fio-ia-v:repeating-linear-gradient(180deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));
    --bg:#0E0D0C; --bg-2:#171513; --bg-doc:#1C1A17; --bg-obj:#191715; --bg-sutil:#26231F;
    --fg:#F4F1EA; --fg-2:#CFC7B9; --fg-3:#A39B8D;
    --regra:#2C2925; --regra-forte:#4A443D;
    --tinta:#F4F1EA; --ia:#A39B8D;
    --vinho:#B84A61; --vinho-hover:#C75A71; --vinho-texto:#E28FA1; --sobre-vinho:#FFF8F5;
    --ouro:#CDAE72; --ouro-fundo:#221D14;
    --foco:#F4F1EA; --wa:#25D366; --selecao:rgba(226,143,161,.28);
    --sombra-1:0 1px 2px rgba(0,0,0,.35),0 12px 28px -14px rgba(0,0,0,.7);
    --sombra-2:0 1px 0 rgba(255,255,255,.04) inset,0 3px 8px -2px rgba(0,0,0,.5),0 40px 80px -30px rgba(0,0,0,.85);
    --borda-objeto:0 0 0 1px rgba(244,241,234,.10);
    color-scheme:dark;
  }
}
:root[data-tema="escuro"]{
  --fio-ia-h:repeating-linear-gradient(90deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));--fio-ia-v:repeating-linear-gradient(180deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));
  --bg:#0E0D0C; --bg-2:#171513; --bg-doc:#1C1A17; --bg-obj:#191715; --bg-sutil:#26231F;
  --fg:#F4F1EA; --fg-2:#CFC7B9; --fg-3:#A39B8D;
  --regra:#2C2925; --regra-forte:#4A443D;
  --tinta:#F4F1EA; --ia:#A39B8D;
  --vinho:#B84A61; --vinho-hover:#C75A71; --vinho-texto:#E28FA1; --sobre-vinho:#FFF8F5;
  --ouro:#CDAE72; --ouro-fundo:#221D14;
  --foco:#F4F1EA; --wa:#25D366; --selecao:rgba(226,143,161,.28);
  --sombra-1:0 1px 2px rgba(0,0,0,.35),0 12px 28px -14px rgba(0,0,0,.7);
  --sombra-2:0 1px 0 rgba(255,255,255,.04) inset,0 3px 8px -2px rgba(0,0,0,.5),0 40px 80px -30px rgba(0,0,0,.85);
  --borda-objeto:0 0 0 1px rgba(244,241,234,.10);
  color-scheme:dark;
}

/* ---------- faixa de tinta (WC 24/09 · X1 · H1): UMA âncora estrutural por página, de ponta a ponta.
   Leva o espelho escuro para dentro da faixa (mesmos nomes de token): no tema claro é tinta #141210;
   no escuro vira a superfície elevada #211E1A, com fio de borda, para seguir sendo o contraponto. ---------- */
.faixa-tinta{
  --fio-ia-h:repeating-linear-gradient(90deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));--fio-ia-v:repeating-linear-gradient(180deg,#A39B8D 0 var(--fio-traco),transparent var(--fio-traco) calc(2 * var(--fio-traco)));
  --bg:#141210; --bg-2:#1C1916; --bg-doc:#1E1B18; --bg-obj:#1A1815; --bg-sutil:#28241F;
  --fg:#F4F1EA; --fg-2:#CFC7B9; --fg-3:#A39B8D;
  --regra:#2E2A25; --regra-forte:#4A443D;
  --tinta:#F4F1EA; --ia:#A39B8D;
  --vinho:#B84A61; --vinho-hover:#C75A71; --vinho-texto:#E28FA1; --sobre-vinho:#FFF8F5;
  --ouro:#CDAE72; --ouro-fundo:#221D14;
  --foco:#F4F1EA; --selecao:rgba(226,143,161,.28);
  --sombra-1:0 1px 2px rgba(0,0,0,.35),0 12px 28px -14px rgba(0,0,0,.7);
  --sombra-2:0 1px 0 rgba(255,255,255,.04) inset,0 3px 8px -2px rgba(0,0,0,.5),0 40px 80px -30px rgba(0,0,0,.85);
  --borda-objeto:0 0 0 1px rgba(244,241,234,.10);
  color-scheme:dark;background:var(--bg);color:var(--fg);
}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]) .faixa-tinta{--bg:#211E1A;--bg-doc:#26221E;--regra:#38332D;box-shadow:inset 0 1px 0 #38332D,inset 0 -1px 0 #38332D}
}
:root[data-tema="escuro"] .faixa-tinta{--bg:#211E1A;--bg-doc:#26221E;--regra:#38332D;box-shadow:inset 0 1px 0 #38332D,inset 0 -1px 0 #38332D}

/* ---------- movimento reduzido: nada se desloca; o que era narrativa vira estado final ---------- */
@media (prefers-reduced-motion:reduce){
  :root{--m-fast:0ms;--m-base:0ms;--m-slow:0ms;--d-1:0px;--d-2:0px;--d-3:0px;--stagger:0ms}
}