/* ============================================================
   alliance.css — Master stylesheet manifest
   TTD Alliance Programme v7.0

   Import order matters:
     1. Tokens first (variables used by everything below)
     2. Reset (base element styles)
     3. Typography scale
     4. Components (order: global → section-specific) —
        these hold mobile-first BASE styles
     5. Layout — moved here (was previously imported in Base,
        above). layout.css's min-width upgrade rules (sm/md/lg)
        must load AFTER components/*, not before: a media query
        adds no specificity, so with equal-specificity selectors
        the LATER rule in source order wins regardless of the
        media condition. Importing layout.css early meant every
        desktop/tablet upgrade was being silently cancelled by
        the component base rules loaded after it — site only
        ever rendered its mobile layout at any width. Moving
        the import (not the file) fixes this.
     6. Responsive overrides last (broadest → narrowest)
   ============================================================ */

/* ── Base ─────────────────────────────────────────────────── */
@import 'base/tokens.css';
@import 'base/reset.css';

/* ── Typography ───────────────────────────────────────────── */
@import 'components/typography.css';

/* ── Global components ────────────────────────────────────── */
@import 'components/buttons.css';
@import 'components/nav.css';

/* ── Gate ─────────────────────────────────────────────────── */
@import 'components/gate.css';

/* ── Page sections ────────────────────────────────────────── */
@import 'components/hero.css';
@import 'components/tiers.css';
@import 'components/sections.css';
@import 'components/calculator.css';

/* ── Widgets & animations ─────────────────────────────────── */
@import 'components/widgets.css';

/* ── Legal pages ──────────────────────────────────────────── */
@import 'components/legal.css';

/* ── Layout (primitives + min-width upgrades — see note above) ── */
@import 'base/layout.css';

/* ── Responsive (broadest first, narrowest last) ──────────── */
@import 'responsive/tablet.css';
@import 'responsive/mobile-md.css';
@import 'responsive/mobile-sm.css';