/* ═══════════════════════════════════════════════════════════════
   MAIN — Aggregator stylesheet
   Imports the entire design system in dependency order. Pages can
   either link this single file (simplest) or pick & choose individual
   layer files (smaller payload).

   Cascade order matters:
     1. tokens          (CSS variables — must come first)
     2. base            (reset + element defaults)
     3. layout          (container, section, grid)
     4. utilities       (helper classes — should win over components)
     5. components/*    (component blocks)
     6. pages/*         (page-specific overrides — should win last)
   ═══════════════════════════════════════════════════════════════ */

/* ─── Foundation ─── */
@import url("./tokens.css");
@import url("./base.css");
@import url("./layout.css");
@import url("./utilities.css");

/* ─── Components (alphabetical for navigability) ─── */
@import url("./components/audience.css");
@import url("./components/badge.css");
@import url("./components/button.css");
@import url("./components/card.css");
@import url("./components/case-card.css");
@import url("./components/creator-card.css");
@import url("./components/explainer.css");
@import url("./components/feature.css");
@import url("./components/final-cta.css");
@import url("./components/footer.css");
@import url("./components/form.css");
@import url("./components/geo-map.css");
@import url("./components/hero.css");
@import url("./components/live-reel.css");
@import url("./components/navbar.css");
@import url("./components/rate-card.css");
@import url("./components/section-heading.css");
@import url("./components/stat.css");
@import url("./components/table.css");
@import url("./components/ticker.css");
@import url("./components/tier-card.css");
@import url("./components/trust-band.css");

/* ─── Page-specific overrides (load LAST so they win the cascade) ─── */
@import url("./pages/home.css");