/* ==========================================================================
   main.css — the only stylesheet a page links to.
   Load order matters: tokens first, then reset, then everything else.
   Each component below has its own file under /components.

   Shipping note: @import costs one request per file. For production, run
   these through a bundler (see README) — the file split stays the same.
   ========================================================================== */

/* --- Base ---------------------------------------------------------------- */
@import url("base/tokens.css");
@import url("base/reset.css");
@import url("base/typography.css");
@import url("base/layout.css");
@import url("base/utilities.css");

/* --- Components ---------------------------------------------------------- */
@import url("components/nav.css");
@import url("components/footer.css");
@import url("components/button.css");
@import url("components/papel-picado.css");
@import url("components/barbed-wire.css");
@import url("components/marquee.css");
@import url("components/tape.css");
@import url("components/section-head.css");
@import url("components/hero.css");
@import url("components/hero-ocean.css");
@import url("components/framed-photo.css");
@import url("components/work-card.css");
@import url("components/filter-bar.css");
@import url("components/lightbox.css");
@import url("components/offer.css");
@import url("components/social.css");

/* --- Pages ---------------------------------------------------------------
   Two pages: the gallery and the info page. Both stylesheets ship together so
   the browser caches one file.                                              */
@import url("pages/gallery.css");
@import url("pages/info.css");