/**
 * Artspod v2 — design tokens
 * Extracted from Figma "Artspod Redesign" (nodes 1-997 desktop, 1-836 mobile).
 * Single source of truth for the new theme. Scoped under .aspv2 so it never
 * leaks into the legacy design.
 */
.aspv2 {
    /* Brand / accent */
    --asp-primary: #2a14b4;        /* indigo — primary CTAs, links */
    --asp-primary-dark: #100069;   /* deep indigo — hovers */
    --asp-primary-soft: #e3dfff;   /* lavender — pills, tints */

    /* Ink / text */
    --asp-ink: #0b1c30;            /* near-black navy — headings */
    --asp-slate: #213145;          /* body strong */
    --asp-muted: #464554;          /* body */
    --asp-gray: #6b7280;           /* secondary text */

    /* Surfaces */
    --asp-bg: #ffffff;
    --asp-bg-soft: #f8f9ff;        /* page tint */
    --asp-bg-blue: #eaf1ff;        /* section background */
    --asp-blue-100: #d3e4fe;       /* subtle blue */
    --asp-line: #e5e7eb;           /* borders */
    --asp-line-strong: #c4c7c9;

    /* Hero */
    --asp-hero-ink: #0b1c30;

    /* Typography */
    --asp-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --asp-fs-hero: clamp(2rem, 4vw, 3rem);   /* ~48px */
    --asp-fs-h2: clamp(1.5rem, 2.4vw, 2rem); /* ~32px */
    --asp-fs-h3: 1.25rem;                    /* 20px */
    --asp-fs-lg: 1.125rem;                   /* 18px */
    --asp-fs-body: 1rem;                     /* 16px */
    --asp-fs-sm: 0.875rem;                   /* 14px */
    --asp-fs-xs: 0.75rem;                    /* 12px */

    /* Radius */
    --asp-radius-sm: 8px;
    --asp-radius: 12px;
    --asp-radius-lg: 20px;
    --asp-radius-pill: 9999px;

    /* Spacing scale */
    --asp-sp-1: 4px;
    --asp-sp-2: 8px;
    --asp-sp-3: 16px;
    --asp-sp-4: 24px;
    --asp-sp-5: 32px;
    --asp-sp-6: 48px;
    --asp-sp-7: 64px;
    --asp-sp-8: 80px;

    /* Layout */
    --asp-container: 1200px;
    --asp-gutter: 24px;

    /* Effects */
    --asp-shadow-sm: 0 1px 3px rgba(11, 28, 48, 0.08);
    --asp-shadow: 0 8px 24px rgba(11, 28, 48, 0.10);
    --asp-shadow-lg: 0 16px 48px rgba(11, 28, 48, 0.14);
    --asp-transition: 160ms ease;
}