/* ==========================================================================
   Mediflare — Global Stylesheet
   Framework layers + brand theme + site-specific styles
   ========================================================================== */

/* Framework layers (order matters) */
@import "./framework/tokens.css";
@import "./framework/colors.css";
@import "./framework/reset.css";
@import "./framework/base.css";
@import "./framework/layout.css";
@import "./framework/components.css";
@import "./framework/animations.css";

/* Brand theme */
@import "./theme-mediflare.css";

/* ==========================================================================
   Site-specific styles & bespoke animations
   Patterns unique to mediflare.com.au that aren't framework-level.
   ========================================================================== */

/* --- Page shell ---------------------------------------------------------
   The warm wash and its dot grid sit behind every page. The wash is fixed so
   it reads as one continuous surface rather than repeating per section. */

body {
  background: var(--page-wash);
  background-attachment: fixed;
  min-block-size: 100vh;
  font-family: var(--font-body);
  color: var(--ink);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: radial-gradient(circle, var(--page-dot) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
  z-index: 0;
}

body > * { position: relative; z-index: 1; }

/* Headings default to the display face across the site */
:where(h1, h2, h3, h4) { font-family: var(--font-display); }

/* The shared gradient defs carry no layout */
.mf-svg-defs { position: absolute; pointer-events: none; }

main { display: block; }
