/* ============================================================
   Stella — stylesheet entry point

   Organised the way Mantine organises its styles: a token layer
   first, then base/reset, then layout primitives, then reusable
   components, then page sections. @layer fixes the cascade order
   so a later file can never accidentally out-specify an earlier
   one — section styles always win over components, components
   always win over base, regardless of selector weight.

   Add a new file? Import it into the layer it belongs to.
   ============================================================ */

@layer tokens, base, layout, components, sections;

@import url('./tokens.css') layer(tokens);
@import url('./base.css') layer(base);
@import url('./layout.css') layer(layout);

@import url('./components/buttons.css') layer(components);
@import url('./components/forms.css') layer(components);
@import url('./components/lightbox.css') layer(components);
@import url('./components/modal.css') layer(components);
@import url('./components/scroll-cue.css') layer(components);

@import url('./sections/hero.css') layer(sections);
@import url('./sections/about.css') layer(sections);
@import url('./sections/pricing.css') layer(sections);
@import url('./sections/details.css') layer(sections);
@import url('./sections/gallery.css') layer(sections);
@import url('./sections/touring.css') layer(sections);
@import url('./sections/footer.css') layer(sections);