/**
 * Bannatyne Digital — Design Tokens
 *
 * All CSS custom properties derived from the Bannatyne Visual Identity
 * guidelines (BANNATYNE_Visual_Identity_260302.pdf).
 *
 * Color proportions (rule of thumb):
 *   Ultramarine 40% | Peach 5% | White 20% | Black 15%
 *   Cobolt/Azure/Sky 5% | Coral/Light Coral/Sand 15%
 */

:root {

	/* ── Primary ─────────────────────────────────────────── */
	--color-ultramarine:   #0d1fe8;

	/* ── Foundations ──────────────────────────────────────── */
	--color-peach:         #fa9482;
	--color-white:         #ffffff;
	--color-black:         #000000;

	/* ── Secondary hues & tints ──────────────────────────── */
	--color-cobolt:        #6794ff;
	--color-azure:         #92b9ff;
	--color-sky:           #c6dfff;
	--color-coral:         #fddfd9;
	--color-light-coral:   #feefec;
	--color-sand:          #fff8f6;

	/* ── Semantic aliases ────────────────────────────────── */
	--color-primary:       var(--color-ultramarine);
	--color-accent:        var(--color-peach);
	--color-bg:            var(--color-white);
	--color-text:          var(--color-black);
	--color-text-muted:    #555555;
	--color-border:        var(--color-sky);

	/* ── Typography ──────────────────────────────────────── */
	--font-primary:        'Source Sans 3', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
	--fw-light:            300;
	--fw-regular:          400;
	--fw-bold:             700;
	--fw-black:            900;

	/* ── Type scale (major third — 1.25) ─────────────────── */
	--text-xs:             0.75rem;    /* 12px */
	--text-sm:             0.875rem;   /* 14px */
	--text-base:           1rem;       /* 16px */
	--text-md:             1.125rem;   /* 18px */
	--text-lg:             1.25rem;    /* 20px */
	--text-xl:             1.5rem;     /* 24px */
	--text-2xl:            2rem;       /* 32px */
	--text-3xl:            2.5rem;     /* 40px */
	--text-4xl:            3rem;       /* 48px */
	--text-5xl:            3.75rem;    /* 60px */
	--text-6xl:            4.5rem;     /* 72px */
	--text-hero:           clamp(3rem, 6vw, 6rem);

	/* ── Line heights ────────────────────────────────────── */
	--leading-tight:       1.1;
	--leading-snug:        1.25;
	--leading-normal:      1.5;
	--leading-relaxed:     1.75;

	/* ── Letter spacing ──────────────────────────────────── */
	--tracking-tight:     -0.02em;
	--tracking-normal:     0;
	--tracking-wide:       0.05em;
	--tracking-wider:      0.1em;
	--tracking-widest:     0.2em;

	/* ── Spacing scale ───────────────────────────────────── */
	--space-1:             0.25rem;    /* 4px  */
	--space-2:             0.5rem;     /* 8px  */
	--space-3:             0.75rem;    /* 12px */
	--space-4:             1rem;       /* 16px */
	--space-5:             1.25rem;    /* 20px */
	--space-6:             1.5rem;     /* 24px */
	--space-8:             2rem;       /* 32px */
	--space-10:            2.5rem;     /* 40px */
	--space-12:            3rem;       /* 48px */
	--space-16:            4rem;       /* 64px */
	--space-20:            5rem;       /* 80px */
	--space-24:            6rem;       /* 96px */
	--space-32:            8rem;       /* 128px */

	/* ── Layout ──────────────────────────────────────────── */
	--container-max:       1440px;
	--container-padding:   clamp(1.25rem, 4vw, 5rem);
	--grid-gap:            var(--space-8);

	/* ── Borders & Radii ─────────────────────────────────── */
	--radius-sm:           4px;
	--radius-md:           8px;
	--radius-lg:           16px;
	--radius-full:         9999px;

	/* ── Shadows ──────────────────────────────────────────── */
	--shadow-sm:           0 1px 2px rgba(0, 0, 0, 0.05);
	--shadow-md:           0 4px 12px rgba(0, 0, 0, 0.08);
	--shadow-lg:           0 12px 40px rgba(0, 0, 0, 0.12);

	/* ── Transitions ─────────────────────────────────────── */
	--ease-out:            cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in-out:         cubic-bezier(0.65, 0, 0.35, 1);
	--duration-fast:       150ms;
	--duration-normal:     300ms;
	--duration-slow:       500ms;

	/* ── Z-index scale ───────────────────────────────────── */
	--z-dropdown:          100;
	--z-sticky:            200;
	--z-header:            300;
	--z-overlay:           400;
	--z-modal:             500;
}