/* ============================================================
   Cota3D — tokens que NAO mudam com o tema.
   As cores ficam em config/theme.php e chegam como --c-<nome>.
   Carregue este arquivo DEPOIS de app.css — assim o :root daqui
   sobrescreve o de la, inclusive --grad-btn, e voce nao precisa editar
   app.css para ativar o tema laranja:
       <link rel="stylesheet" href="/css/app.css?v=...">
       <link rel="stylesheet" href="/css/tokens.css?v=...">
   ============================================================ */

:root {
    /* Espacamento — grade real do app.css */
    --space-4: 4px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-14: 14px;
    --space-16: 16px;
    --space-18: 18px;
    --space-20: 20px;
    --space-22: 22px;
    --space-26: 26px;
    --space-32: 32px;
    --space-36: 36px;
    --space-48: 48px;
    --space-64: 64px;

    /* Raio */
    --radius: 16px;
    --radius-sm: 10px;
    --radius-xs: 8px;
    --radius-pill: 999px;

    /* Layout */
    --maxw: 1180px;
    --maxw-wide: 1440px;
    --header-h: 66px;
    --panel-nav-h: 50px;
    --imp-bar-h: 40px;
    --card-min: 280px;
    --auth-w: 440px;
    --prose-w: 760px;

    /* Sombra */
    --shadow-overlay: 0 18px 50px rgba(0, 0, 0, 0.45);

    /* Familias */
    --font-ui: "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
    --font-brand: "Poppins", "Segoe UI", system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* Gradientes (compostos a partir das cores do tema) */
    --grad: linear-gradient(135deg, var(--c-grad-from), var(--c-grad-mid), var(--c-grad-to));
    --grad-btn: linear-gradient(135deg, var(--c-grad-from), var(--c-grad-to));
}

/* ---------- Escala tipografica ----------
   Os nomes coincidem de proposito com classes que ja existem em app.css
   (.small, .badge, .card-title, .section-title, .price-value, .price-label).
   Os valores foram extraidos de la, entao carregar este arquivo depois de
   app.css nao muda nada na tela — so passa a existir um lugar so com a escala.
   ---------------------------------------- */
/* Títulos */
.hero { font-family: var(--font-ui); font-size: 2.7rem; line-height: 1.08; font-weight: 800; letter-spacing: -1px; }
.detail-title { font-family: var(--font-ui); font-size: 2rem; line-height: 1.15; font-weight: 700; letter-spacing: -0.6px; }
.page-title { font-family: var(--font-ui); font-size: 1.9rem; line-height: 1.2; font-weight: 700; letter-spacing: -0.5px; }
.auth-title { font-family: var(--font-ui); font-size: 1.6rem; line-height: 1.25; font-weight: 700; letter-spacing: -0.4px; }
.block-title { font-family: var(--font-ui); font-size: 1.3rem; line-height: 1.3; font-weight: 700; }
.section-title { font-family: var(--font-ui); font-size: 1.2rem; line-height: 1.3; font-weight: 700; }
.card-title { font-family: var(--font-ui); font-size: 1.05rem; line-height: 1.3; font-weight: 700; }

/* Texto */
.body { font-family: var(--font-ui); font-size: 1rem; line-height: 1.55; font-weight: 400; }
.small { font-family: var(--font-ui); font-size: 0.85rem; line-height: 1.5; font-weight: 400; }
.micro { font-family: var(--font-ui); font-size: 0.82rem; line-height: 1.45; font-weight: 400; }

/* Dados */
.stat-num { font-family: var(--font-ui); font-size: 2.1rem; line-height: 1.15; font-weight: 800; }
.price-big { font-family: var(--font-ui); font-size: 2rem; line-height: 1.15; font-weight: 800; }
.hero-stat-num { font-family: var(--font-ui); font-size: 1.6rem; line-height: 1.2; font-weight: 800; letter-spacing: -0.5px; }
.price-value { font-family: var(--font-ui); font-size: 1.25rem; line-height: 1.2; font-weight: 800; }
.code-sm { font-family: var(--font-mono); font-size: 0.85rem; line-height: 1.5; font-weight: 400; }

/* Interface */
.button-label { font-family: var(--font-ui); font-size: 1rem; line-height: 1.2; font-weight: 600; }
.nav-item { font-family: var(--font-ui); font-size: 0.95rem; line-height: 1.2; font-weight: 600; }
.badge { font-family: var(--font-ui); font-size: 0.74rem; line-height: 1; font-weight: 700; letter-spacing: 0.3px; }
.eyebrow { font-family: var(--font-ui); font-size: 0.72rem; line-height: 1.2; font-weight: 800; letter-spacing: 1.3px; }
.price-label { font-family: var(--font-ui); font-size: 0.7rem; line-height: 1.2; font-weight: 400; letter-spacing: 0.5px; }
.table-head { font-family: var(--font-ui); font-size: 0.82rem; line-height: 1.3; font-weight: 600; letter-spacing: 0.4px; }