/* ===========================================================
   base.css — reset, tokens, typography, utilities
   dreamworld-au.org — Australia's Theme Park Guide
   Display: Saira Condensed (heavy narrow uppercase) · Body: Manrope
   =========================================================== */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, picture, svg, video { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; padding: 0; }

:root {
  /* palette */
  --paper:       #ffffff;
  --paper-2:     #f2f3ef;
  --mint:        #aee0c7;
  --green:       #2a835a;   /* primary green (hero/nav — passes AA on white text) */
  --sage:        #67a689;   /* light sage accent */
  --green-mid:   #4bbd7e;
  --green-dark:  #1e6f48;
  --green-deep:  #17271e;   /* footer */
  --ink:         #1c1c1c;
  --ink-2:       #333333;
  --muted:       #5a655e;
  --line:        #e3e6e0;

  /* playful accents (cards / regions) */
  --yellow: #f7d94b;
  --cyan:   #6fd3f2;
  --purple: #9b4bff;
  --orange: #ff7a1a;
  --pink:   #ff8a8a;
  --blue:   #2f6bff;

  /* type */
  --font-display: "Saira Condensed", "Arial Narrow", sans-serif;
  --font-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* spacing scale */
  --sp-1: .5rem;  --sp-2: .75rem; --sp-3: 1rem;  --sp-4: 1.5rem;
  --sp-5: 2rem;   --sp-6: 3rem;   --sp-7: 4.5rem; --sp-8: 6.5rem;

  /* radii */
  --r-sm: 8px; --r-md: 16px; --r-lg: 26px; --r-xl: 34px; --r-pill: 999px;

  /* shadows */
  --shadow-sm: 0 2px 10px rgba(23,39,30,.06);
  --shadow-md: 0 14px 40px rgba(23,39,30,.12);
  --shadow-lg: 0 30px 70px rgba(23,39,30,.18);

  --maxw: 1200px;
  --header-h: 76px;
}

html, body { background: var(--paper); }
body {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--ink-2);
}

/* headings — heavy narrow uppercase display */
h1, h2, h3, .display {
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  line-height: .92;
  letter-spacing: .005em;
  color: var(--ink);
}
h1 { font-size: clamp(2.9rem, 9vw, 6.5rem); }
h2 { font-size: clamp(2.2rem, 6.5vw, 4.5rem); }
h3 { font-size: clamp(1.5rem, 3.2vw, 2.3rem); line-height: 1; }
h4 { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: 1.15rem; letter-spacing: .02em; color: var(--ink); }
p { max-width: 62ch; }

/* layout helpers */
.container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2.25rem); }
.section { padding-block: clamp(3.5rem, 8vw, 7rem); }
.section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }
.center { text-align: center; }
.eyebrow { display: none; }
.lede { font-size: clamp(1.05rem, 1.6vw, 1.25rem); color: var(--muted); max-width: 60ch; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* focus */
:focus-visible { outline: 3px solid var(--green-dark); outline-offset: 3px; border-radius: 4px; }

/* scroll-reveal */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}