/*
  HORIZON CSS ARCHITECTURE
  /css/main.css

  Single entry point — every page loads only this file.
  Import order matters (later layers override earlier ones):

    1. Tokens     → raw design values (colors, type, spacing, effects)
    2. Themes     → semantic token mappings (foggy light, dark)
    3. Base       → reset, body, headings, links
    4. Layout     → containers, grids, flex, spacing utilities
    5. Components → buttons, cards, badges, navbar, footer, showcase
    6. Modules    → compound page-section components (details, search, skeleton)
    7. Pages      → one-off page-specific styles (inquire, 404, legal)
*/

/* ── 1. TOKENS ────────────────────────────────────────── */
@import 'tokens/colors.css';
@import 'tokens/typography.css';
@import 'tokens/spacing.css';
@import 'tokens/effects.css';

/* ── 2. THEMES ────────────────────────────────────────── */
@import 'themes/foggy.css';
@import 'themes/dark.css';

/* ── 3. BASE ──────────────────────────────────────────── */
@import 'base/reset.css';

/* ── 4. LAYOUT ────────────────────────────────────────── */
@import 'layout/containers.css';

/* ── 5. COMPONENTS ────────────────────────────────────── */
@import 'components/buttons.css';
@import 'components/cards.css';
@import 'components/navbar.css';
@import 'components/footer.css';
@import 'components/showcase.css';
@import 'components/theme-switcher.css';

/* ── 6. MODULES ───────────────────────────────────────── */
@import 'modules/details.css';
@import 'modules/search.css';
@import 'modules/skeleton.css';
@import 'modules/states.css';

/* ── 7. PAGES ─────────────────────────────────────────── */
@import 'pages/index.css';
@import 'pages/inquire.css';
@import 'pages/about.css';
@import 'pages/404.css';
@import 'pages/legal.css';

/* ── 8. MOBILE-ONLY CONSTRAINT ────────────────────────── */
/* Modular mobile styles — see /css/mobile/ for individual files */
@import 'mobile/mobile.css';