/* Prazeria — design tokens */

:root {
    /* Cores */
    --bg:                  #0E0B0F;
    --bg-elevated:         #1B1620;
    --surface:             #16121A;
    --surface-2:           #221C28;
    --text:                #F4EFEA;
    --text-soft:           #C8C0BA;
    --muted:               #8B8190;
    --line:                rgba(244, 239, 234, 0.08);
    --line-strong:         rgba(244, 239, 234, 0.16);
    --accent:              #C8102E;
    --accent-strong:       #E1162F;
    --accent-2:            #E9C46A;
    --accent-2-strong:     #F4D687;
    --success:             #2A9D8F;
    --danger:              #E63946;
    --warning:             #F4A261;

    /* Espaçamento (escala 4/8/12/16/24/32/48/64/96) */
    --sp-1:  4px;
    --sp-2:  8px;
    --sp-3:  12px;
    --sp-4:  16px;
    --sp-5:  24px;
    --sp-6:  32px;
    --sp-7:  48px;
    --sp-8:  64px;
    --sp-9:  96px;
    --sp-10: 128px;

    /* Tipografia (escala fluida) */
    --font-display: "Fraunces", Georgia, "Times New Roman", serif;
    --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --fs-xs:    0.75rem;
    --fs-sm:    0.875rem;
    --fs-base:  1rem;
    --fs-md:    1.125rem;
    --fs-lg:    1.25rem;
    --fs-xl:    1.5rem;
    --fs-2xl:   2rem;
    --fs-3xl:   clamp(2rem, 4vw, 3rem);
    --fs-4xl:   clamp(2.5rem, 6vw, 4.25rem);
    --fs-5xl:   clamp(3rem, 8vw, 5.5rem);

    /* Raios */
    --radius-button:  4px;
    --radius-input:   4px;
    --radius-card:    12px;
    --radius-pill:    999px;
    --radius-image:   0;

    /* Sombras */
    --shadow-sm:  0 1px 2px rgba(0,0,0,.18);
    --shadow-md:  0 8px 24px rgba(0,0,0,.32);
    --shadow-lg:  0 24px 64px rgba(0,0,0,.48);

    /* Easing & timings */
    --ease:        cubic-bezier(.2, .7, .2, 1);
    --t-fast:      150ms;
    --t-base:      250ms;
    --t-slow:      400ms;

    /* Layout */
    --container:    1280px;
    --container-sm: 720px;
    --header-h:     72px;

    /* Z-index */
    --z-header:        50;
    --z-drawer:        80;
    --z-modal:         90;
    --z-cookie-banner: 100;
    --z-age-gate:      200;
}

@media (min-width: 768px) {
    :root {
        --header-h: 84px;
    }
}