/* ============================================================
   VOZIQA V2 — "Zardozi Modern" Tokens
   Additive layer over the inlined :root tokens. Same LOCKED hexes;
   this file only adds the new type scale, shape law, motion language,
   and gold-thread variables. See DESIGN_V2.md §5.
   ============================================================ */

:root {
    /* ─── Palette aliases (LOCKED — mirror of variables.css) ─── */
    --vz-plum: #1A0A2E;
    --vz-plum-hover: #2A1548;
    --vz-plum-soft: #3D2A5C;
    --vz-gold: #C9A84C;
    --vz-gold-hover: #B89636;
    --vz-gold-soft: #E6D28F;
    --vz-ivory: #FBF7F2;
    --vz-ivory-dark: #F2EAE0;
    --vz-rose: #E8C4B8;
    --vz-rose-soft: #F5E4DE;
    --vz-ink: #2C2C2C;
    --vz-ink-muted: #6B6B6B;
    --vz-ink-subtle: #767676;
    --vz-line: #E8E2DA;
    --vz-line-strong: #D4CBBF;

    /* On-plum text tiers (ivory room) */
    --vz-on-plum: #FBF7F2;
    --vz-on-plum-muted: rgba(251, 247, 242, 0.68);
    --vz-on-plum-line: rgba(230, 210, 143, 0.22);

    /* ─── Type scale (extends fluid scale) ─── */
    --vz-fs-5xl: clamp(3.2rem, 2.4rem + 4.5vw, 6rem);   /* hero display */
    --vz-tracking-display: -0.02em;
    --vz-tracking-label: 0.14em;                         /* utility labels */
    --vz-lh-display: 1.04;

    /* ─── Shape law (only two radii exist) ─── */
    --vz-sharp: 0;          /* images, cards, buttons, inputs, accordions */
    --vz-pill: 9999px;      /* chips, size selectors, badges, dots ONLY */

    /* ─── The Gold Thread ─── */
    --vz-thread: 1px;
    --vz-thread-color: var(--vz-gold);
    --vz-thread-rule: 24px;  /* short rule length before section titles */

    /* ─── Motion — "Drape" (fabric settles, never bounces) ─── */
    --vz-ease-drape: cubic-bezier(0.22, 1, 0.36, 1);
    --vz-ease-line: cubic-bezier(0.65, 0, 0.35, 1);
    --vz-dur-quick: 200ms;
    --vz-dur-settle: 600ms;
    --vz-dur-thread: 800ms;
    --vz-stagger: 60ms;

    /* ─── Elevation (plum-tinted, never pure black) ─── */
    --vz-shadow-sm: 0 1px 2px rgba(26, 10, 46, 0.05);
    --vz-shadow-md: 0 8px 28px rgba(26, 10, 46, 0.09);
    --vz-shadow-lg: 0 24px 60px rgba(26, 10, 46, 0.14);

    /* ─── Layout ─── */
    --vz-container: 1360px;
    --vz-container-wide: 1560px;
    --vz-gutter: clamp(1rem, 3.5vw, 2.5rem);
    --vz-nav-h: 74px;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --vz-dur-quick: 0ms;
        --vz-dur-settle: 0ms;
        --vz-dur-thread: 0ms;
        --vz-stagger: 0ms;
    }
}