/* Design tokens do site Manda Pra Clínica.
   Extraídos do protótipo aprovado (Site/prototipo/index.html, 29/10/2026) e da seção 2 do GUIA DE POSTS.
   Cores da marca: azul-marinho #1E3E61, laranja #FFA84A, creme #F7F3E8 / #FFF1CE, azul médio #4776AB, grafite #2B3026. */

:root{
  /* Marca */
  --navy:#1E3E61;
  --navy-deep:#0F2742;
  --navy-mid:#4776AB;
  --orange:#FFA84A;
  --orange-deep:#E8891F;
  --cream:#F7F3E8;
  --cream-2:#FFF1CE;
  --graphite:#2B3026;

  /* Cor por formato (como no feed): Express = laranja, Atualização = azul médio, Caso = amarelo */
  --kind-express:var(--orange);
  --kind-atualizacao:var(--navy-mid);
  --kind-caso:#E6B422;
  --caso-from:#7A5A00;
  --caso-to:#3E2F00;
  --caso-top-from:#8A6500;

  /* Quadro "Pegadinhas" */
  --attn-from:#FFE3B8;
  --attn-to:#FFC983;
  --attn-fg:#3A2600;
  --attn-eyebrow:#8A4B00;

  /* Superfícies e texto (modo claro) */
  --bg:var(--cream);
  --surface:#FFFFFF;
  --surface-2:#EFE9DA;
  --fg:var(--graphite);
  --muted:#5C6675;
  --line:#DDD5C2;
  --primary:var(--navy);
  --on-primary:#FFFFFF;
  --accent:var(--orange);
  --link:#2F5F94;
  --heading-on-surface:var(--navy);
  --ok:#24724A;          /* acerto nas questões */
  --ok-bg:#E3F2E8;
  --erro:#B4410C;        /* erro nas questões e ações destrutivas */
  --erro-bg:#FBE5DA;
  --shadow:0 1px 2px rgba(30,62,97,.08),0 8px 24px rgba(30,62,97,.08);

  /* Tipografia: Noto Sans para texto e títulos; Noto Serif itálica só em títulos de destaque */
  --font-sans:"Noto Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-serif:"Noto Serif",Georgia,"Times New Roman",serif;
  --fw-regular:400;
  --fw-semibold:600;
  --fw-black:800;
  --fs-label:.8125rem;   /* rótulos em maiúsculas (eyebrow, etiquetas): 13 px */
  --fs-meta:.875rem;     /* metadados, selos, contadores: 14 px */
  --fs-small:.9375rem;   /* botões, filtros e rótulos de formulário: 15 px */
  --fs-body:1rem;        /* texto corrido: mínimo 16 px */
  --fs-lead:1.125rem;
  --fs-h3:1.1875rem;
  --fs-h2:1.5rem;
  --fs-h1-hero:clamp(2rem,1.2rem + 4vw,3.2rem);
  --fs-h1-page:clamp(1.7rem,1.1rem + 3vw,2.6rem);
  --lh-body:1.55;
  --lh-heading:1.15;
  --tracking-label:.1em;

  /* Espaçamento */
  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.25rem;
  --space-6:1.5rem;
  --space-8:2rem;
  --space-10:2.5rem;
  --space-12:3rem;

  /* Layout */
  --maxw:1100px;
  --gutter:16px;
  --header-h:64px;
  --nav-w:264px;        /* menu lateral (comunidades), fixo a partir de 1200 px */
  --nav-w-mini:72px;    /* menu lateral recolhido: só ícones */
  --rail-w-mini:48px;   /* coluna da direita recolhida: só o botão */
  --rail-w:316px;       /* coluna da direita da página de guia (calculadora, autoria), a partir de 960 px */
  --cols-max:none;      /* feed + coluna da direita ocupam toda a largura disponível (pedido do usuário: sem faixas vazias nas laterais) */

  /* Forma */
  --r-sm:8px;
  --r-md:10px;
  --r:12px;
  --r-lg:16px;
  --r-pill:999px;
}

/* Modo escuro: azul-marinho em degradê para preto, como as capas. Segue o sistema, salvo escolha do usuário. */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B1B2E;
    --surface:#14294A;
    --surface-2:#1B3559;
    --fg:#F2EEE4;
    --muted:#A9B6C8;
    --line:#2B4A73;
    --primary:#2D5A8E;
    --link:#9CC2F0;
    --heading-on-surface:var(--cream-2);
    --ok:#7FD3A4;
    --ok-bg:rgba(127,211,164,.14);
    --erro:#FFA98A;
    --erro-bg:rgba(255,169,138,.14);
    --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B1B2E;
  --surface:#14294A;
  --surface-2:#1B3559;
  --fg:#F2EEE4;
  --muted:#A9B6C8;
  --line:#2B4A73;
  --primary:#2D5A8E;
  --link:#9CC2F0;
  --heading-on-surface:var(--cream-2);
  --ok:#7FD3A4;
  --ok-bg:rgba(127,211,164,.14);
  --erro:#FFA98A;
  --erro-bg:rgba(255,169,138,.14);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);
  color-scheme:dark;
}