/* ==========================================================================
   AJIEL Theme — Design Tokens
   ========================================================================== */

:root {
    /* ── Palette ── */
    --ajiel-navy: #1B5872;
    --ajiel-navy-deep: #103A50;
    --ajiel-teal: #176A86;
    --ajiel-teal-dark: #12495D;
    --ajiel-emerald: #2A7775;
    --ajiel-mint: #E5F0F2;
    --ajiel-green-bright: #48A0A0;
    --ajiel-gold: #C49A3A;
    --ajiel-blue: #2C7895;
    --ajiel-purple: #7555C7;
    --ajiel-orange: #F39A27;
    --ajiel-rose: #E94E77;
    --ajiel-text: #213846;
    --ajiel-muted: #647986;
    --ajiel-border: #D9E4E8;
    --ajiel-surface: #F5F8F8;
    --ajiel-white: #FFFFFF;

    /* ── Typography ── */
    --ajiel-font: 'Source Sans 3', 'Segoe UI', sans-serif;
    --ajiel-font-heading: 'Georgia', 'Times New Roman', serif;

    /* ── Spacing scale (4px base) ── */
    --ajiel-sp-1: 4px;
    --ajiel-sp-2: 8px;
    --ajiel-sp-3: 12px;
    --ajiel-sp-4: 16px;
    --ajiel-sp-5: 20px;
    --ajiel-sp-6: 24px;
    --ajiel-sp-8: 32px;
    --ajiel-sp-10: 40px;
    --ajiel-sp-12: 48px;
    --ajiel-sp-16: 64px;

    /* ── Radii ── */
    --ajiel-radius-sm: 6px;
    --ajiel-radius: 10px;
    --ajiel-radius-lg: 16px;
    --ajiel-radius-xl: 24px;
    --ajiel-radius-pill: 100px;

    /* ── Shadows ── */
    --ajiel-shadow-sm: 0 1px 3px rgba(18, 51, 84, .06);
    --ajiel-shadow: 0 2px 8px rgba(18, 51, 84, .08);
    --ajiel-shadow-md: 0 4px 16px rgba(18, 51, 84, .1);
    --ajiel-shadow-lg: 0 8px 32px rgba(18, 51, 84, .12);

    /* ── Transitions ── */
    --ajiel-ease: cubic-bezier(.4, 0, .2, 1);
    --ajiel-duration: .25s;

    /* ── Layout ── */
    --ajiel-max-width: 1200px;
    --ajiel-content-padding: var(--ajiel-sp-6);
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --ajiel-duration: 0s;
    }
}