/* =============================================================================
   Rosathon — tokens da identidade visual

   Nenhum hex solto nos outros arquivos. Qualquer cor da marca sai daqui.
   ========================================================================== */

:root {
    /* ---- Cores ---------------------------------------------------------- */

    /* Background principal, header, hero, footer, seções de alto contraste. */
    --color-black: #0A0A0A;

    /* Cards, containers, modais, blocos internos. */
    --color-black-secondary: #111111;

    --color-gray-dark: #181818;

    /* THON, textos secundários, labels, informações complementares. */
    --color-gray: #8A8A8A;

    --color-gray-light: #C7C7C7;

    --color-white: #F5F5F5;

    /* ROSA, botões principais, links, destaques, ícones, estados ativos. */
    --color-pink: #FF3B9D;

    /* Hover, gradientes, sombras, detalhes. */
    --color-pink-dark: #D91F7A;

    /* Acento neon — usar com moderação. */
    --color-pink-neon: #FF4FB0;

    /* ---- Derivadas ------------------------------------------------------ */

    --border-subtle: #252525;
    --border-strong: #383838;
    --border-pink: rgba(255, 59, 157, .65);
    --border-pink-faint: rgba(255, 59, 157, .15);

    --glow-pink: 0 0 25px rgba(255, 59, 157, .35);
    --glow-pink-soft: 0 8px 30px rgba(255, 59, 157, .25);
    --glow-pink-card: 0 15px 50px rgba(255, 59, 157, .15);

    --color-success: #2ED47A;
    --color-danger: #FF4D4D;

    /* ---- Tipografia ----------------------------------------------------- */

    --font-display: 'Sora', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;

    /* Escala do §3. O H1 é responsivo: 64 desktop, 48 tablet, 38 mobile. */
    --fs-h1: 64px;
    --lh-h1: 72px;
    --fs-h2: 44px;
    --lh-h2: 52px;
    --fs-h3: 28px;
    --lh-h3: 36px;
    --fs-h4: 22px;
    --lh-h4: 30px;
    --fs-body: 16px;
    --lh-body: 26px;
    --fs-small: 14px;
    --lh-small: 20px;

    /* ---- Espaçamento e forma -------------------------------------------- */

    --radius-sm: 8px;
    --radius: 12px;
    /* Cards do §58. Cantos contidos: a estética é tecnológica, não amigável. */
    --radius-card: 16px;
    --radius-pill: 999px;

    --container: 1200px;
    --header-height: 76px;

    --section-gap: 120px;

    /* ---- Movimento ------------------------------------------------------ */

    --transition: 250ms ease;
    --transition-slow: 600ms cubic-bezier(.22, 1, .36, 1);

    /* Grid do background. */
    --grid-size: 40px;
    --grid-line: rgba(255, 255, 255, .025);
}

@media (max-width: 991px) {
    :root {
        --fs-h1: 48px;
        --lh-h1: 56px;
        --fs-h2: 34px;
        --lh-h2: 42px;
        --fs-h3: 24px;
        --lh-h3: 32px;
        --section-gap: 88px;
    }
}

@media (max-width: 575px) {
    :root {
        --fs-h1: 38px;
        --lh-h1: 44px;
        --fs-h2: 28px;
        --lh-h2: 36px;
        --fs-h4: 20px;
        --section-gap: 64px;
        --header-height: 64px;
    }
}