/* ==========================================================================
   AHA — Base
   Reset, document defaults, typography, layout primitives, motion primitives.
   Contains nothing section-specific.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. RESET
   -------------------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

* { margin: 0; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  /* Anchor targets clear the fixed header */
  scroll-padding-top: calc(var(--aha-header-h) + 1.5rem);
}

/* Lenis smooth scroll compatibility */
html.lenis, html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

body {
  min-height: 100vh;
  background-color: var(--aha-bg);
  color: var(--aha-ink);
  font-family: var(--aha-font-body);
  font-size: var(--aha-fs-body);
  font-weight: var(--aha-fw-regular);
  line-height: var(--aha-lh-body);
  letter-spacing: var(--aha-ls-body);
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
}

img { height: auto; }

input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
}

button { background: none; border: 0; }

p,
li,
figcaption { text-wrap: pretty; }

ul[class],
ol[class] {
  list-style: none;
  padding: 0;
}

/* Hide content visually while keeping it available to assistive tech */
.aha-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* --------------------------------------------------------------------------
   2. FOCUS — always visible, never removed
   -------------------------------------------------------------------------- */
:focus-visible {
  outline: 3px solid var(--aha-focus);
  outline-offset: 3px;
  border-radius: var(--aha-radius-xs);
}

/* Only suppress the ring for pointer users who did not tab */
:focus:not(:focus-visible) { outline: none; }

::selection {
  background-color: var(--aha-green-200);
  color: var(--aha-blue-900);
}

.aha-skip-link {
  position: absolute;
  top: 0;
  left: var(--aha-gutter);
  z-index: var(--aha-z-skiplink);
  padding: 0.75rem 1.25rem;
  background-color: var(--aha-blue-900);
  color: #fff;
  font-size: var(--aha-fs-sm);
  font-weight: var(--aha-fw-semibold);
  text-decoration: none;
  border-radius: 0 0 var(--aha-radius-sm) var(--aha-radius-sm);
  transform: translateY(-110%);
  transition: transform var(--aha-dur-fast) var(--aha-ease-out);
}

.aha-skip-link:focus { transform: translateY(0); }

/* --------------------------------------------------------------------------
   3. TYPOGRAPHY
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--aha-font-heading);
  font-weight: var(--aha-fw-semibold);
  line-height: var(--aha-lh-heading);
  letter-spacing: var(--aha-ls-heading);
  color: var(--aha-ink);
  text-wrap: balance;
}

h1 { font-size: var(--aha-fs-h1); }
h2 { font-size: var(--aha-fs-h2); }
h3 { font-size: var(--aha-fs-h3); }
h4 { font-size: var(--aha-fs-h4); }

a {
  color: var(--aha-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
}

strong, b { font-weight: var(--aha-fw-semibold); }

/* Type utilities ---------------------------------------------------------- */
.aha-display {
  font-family: var(--aha-font-heading);
  font-size: var(--aha-fs-display);
  font-weight: var(--aha-fw-bold);
  line-height: var(--aha-lh-tight);
  letter-spacing: var(--aha-ls-display);
  text-wrap: balance;
}

.aha-lead {
  font-size: var(--aha-fs-lead);
  line-height: var(--aha-lh-snug);
  color: var(--aha-ink-muted);
  max-width: var(--aha-measure);
  letter-spacing: var(--aha-ls-snug);
}

.aha-body-lg {
  font-size: var(--aha-fs-lead);
  line-height: var(--aha-lh-loose);
  color: var(--aha-ink-muted);
}

.aha-prose {
  max-width: var(--aha-measure);
  color: var(--aha-ink-muted);
}

.aha-prose > * + * { margin-top: 1.15em; }

.aha-measure-narrow { max-width: var(--aha-measure-narrow); }
.aha-measure-wide   { max-width: var(--aha-measure-wide); }

/* Uppercase tracked label used above every section heading */
.aha-eyebrow {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-family: var(--aha-font-heading);
  font-size: var(--aha-fs-eyebrow);
  font-weight: var(--aha-fw-semibold);
  letter-spacing: var(--aha-ls-eyebrow);
  text-transform: uppercase;
  color: var(--aha-accent);
  margin-bottom: var(--aha-space-sm);
}

.aha-eyebrow::before {
  content: "";
  flex: none;
  width: 26px;
  height: 2px;
  background-color: currentColor;
}

.aha-eyebrow--plain::before { display: none; }

/* A refined serif, reserved for large editorial statements only */
.aha-serif {
  font-family: var(--aha-font-serif);
  font-weight: var(--aha-fw-regular);
  font-style: italic;
  letter-spacing: -0.012em;
}

.aha-text-accent { color: var(--aha-accent); }
.aha-text-muted  { color: var(--aha-ink-muted); }
.aha-text-subtle { color: var(--aha-ink-subtle); }

/* Numerals in data contexts must be tabular so counters do not jitter */
.aha-tnum {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* --------------------------------------------------------------------------
   4. LAYOUT PRIMITIVES
   -------------------------------------------------------------------------- */
.aha-container {
  width: 100%;
  max-width: calc(var(--aha-container) + var(--aha-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--aha-gutter);
}

.aha-container--wide {
  max-width: calc(var(--aha-container-wide) + var(--aha-gutter) * 2);
}

.aha-container--narrow {
  max-width: calc(var(--aha-container-narrow) + var(--aha-gutter) * 2);
}

.aha-section {
  position: relative;
  padding-block: var(--aha-section-y);
}

.aha-section--tight { padding-block: var(--aha-section-y-tight); }
.aha-section--loose { padding-block: var(--aha-section-y-loose); }
.aha-section--flush-top { padding-block-start: 0; }
.aha-section--flush-bottom { padding-block-end: 0; }

/* Section surface treatments */
.aha-section--paper { background-color: var(--aha-paper); }
.aha-section--muted { background-color: var(--aha-bg-muted); }
.aha-section--blue  { background-color: var(--aha-bg-tint-blue); }
.aha-section--green { background-color: var(--aha-bg-tint-green); }
.aha-section--deep  { background-color: var(--aha-bg-deep); }
.aha-section--deepest { background-color: var(--aha-bg-deepest); }

/* Hairline separators between same-coloured sections */
.aha-section--rule-top { border-top: 1px solid var(--aha-line); }
.aha-section--rule-bottom { border-bottom: 1px solid var(--aha-line); }

/* 12-column grid */
.aha-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--aha-grid-gap);
}

.aha-stack { display: flex; flex-direction: column; }
.aha-stack--xs { gap: var(--aha-space-xs); }
.aha-stack--sm { gap: var(--aha-space-sm); }
.aha-stack--md { gap: var(--aha-space-md); }
.aha-stack--lg { gap: var(--aha-space-lg); }
.aha-stack--xl { gap: var(--aha-space-xl); }

.aha-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--aha-space-sm);
}

/* Standard section intro block: eyebrow + heading + lead */
.aha-section-head {
  max-width: var(--aha-measure-wide);
  margin-bottom: clamp(2.5rem, 1.6rem + 3vw, 4.5rem);
}

.aha-section-head__title { font-size: var(--aha-fs-h2); }

.aha-section-head__lead {
  margin-top: var(--aha-space-md);
  font-size: var(--aha-fs-lead);
  line-height: var(--aha-lh-snug);
  color: var(--aha-ink-muted);
  max-width: var(--aha-measure);
  letter-spacing: var(--aha-ls-snug);
}

.aha-section-head--center {
  margin-inline: auto;
  text-align: center;
}

.aha-section-head--center .aha-eyebrow { justify-content: center; }
.aha-section-head--center .aha-section-head__lead { margin-inline: auto; }

/* Split intro: heading left, supporting copy right */
.aha-section-head--split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--aha-space-md);
  max-width: none;
  align-items: end;
}

@media (min-width: 900px) {
  .aha-section-head--split {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: var(--aha-grid-gap);
  }
  .aha-section-head--split .aha-section-head__lead { margin-top: 0; }
}

/* Spacing utilities — the only approved alternative to inline styles */
.aha-mt-md { margin-top: var(--aha-space-md); }
.aha-mt-lg { margin-top: var(--aha-space-lg); }
.aha-mt-xl { margin-top: var(--aha-space-xl); }

/* Decorative hairline used to divide editorial rows */
.aha-rule {
  height: 1px;
  border: 0;
  background-color: var(--aha-line);
}

/* --------------------------------------------------------------------------
   5. MEDIA PRIMITIVES
   -------------------------------------------------------------------------- */
.aha-figure { margin: 0; }

/* Fixed-ratio frame prevents layout shift before images decode */
.aha-media {
  position: relative;
  overflow: hidden;
  background-color: var(--aha-blue-100);
  border-radius: var(--aha-radius-md);
}

.aha-media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--aha-dur-xslow) var(--aha-ease-soft);
}

.aha-media--3-2  { aspect-ratio: 3 / 2; }
.aha-media--4-5  { aspect-ratio: 4 / 5; }
.aha-media--1-1  { aspect-ratio: 1 / 1; }
.aha-media--16-9 { aspect-ratio: 16 / 9; }
.aha-media--5-4  { aspect-ratio: 5 / 4; }

/* Subtle zoom on hover, only where the frame is interactive */
.aha-media--zoom:hover > img,
a:hover .aha-media--zoom > img { transform: scale(1.045); }

.aha-figure__caption {
  margin-top: var(--aha-space-xs);
  font-size: var(--aha-fs-xs);
  line-height: 1.5;
  color: var(--aha-ink-subtle);
}

/* --------------------------------------------------------------------------
   6. MOTION PRIMITIVES
   --------------------------------------------------------------------------
   Reveal elements are only hidden when JS has confirmed that the animation
   engine is running and the user has not requested reduced motion. Without
   that class every element renders in its final state, so the site is fully
   readable with JS disabled or GSAP unavailable.
   -------------------------------------------------------------------------- */
.aha-anim [data-aha-reveal],
.aha-anim [data-aha-reveal-group] > * {
  opacity: 0;
  will-change: opacity, transform;
}

.aha-anim [data-aha-reveal="fade"] { transform: none; }
.aha-anim [data-aha-reveal="up"],
.aha-anim [data-aha-reveal-group] > * { transform: translate3d(0, 28px, 0); }
.aha-anim [data-aha-reveal="right"] { transform: translate3d(-28px, 0, 0); }
.aha-anim [data-aha-reveal="left"]  { transform: translate3d(28px, 0, 0); }
.aha-anim [data-aha-reveal="scale"] { transform: scale(0.965); }

/* Masked line-by-line heading reveals */
.aha-anim [data-aha-split] { visibility: hidden; }
.aha-split__line { display: block; overflow: hidden; padding-bottom: 0.08em; }
.aha-split__inner { display: block; will-change: transform; }

/* Image clip reveal */
.aha-anim [data-aha-clip] { clip-path: inset(0 0 100% 0); }

/* Elements finish in their natural state; will-change is dropped on complete */
.aha-anim .is-revealed { will-change: auto; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  /* Guarantee content is visible even if the class was applied */
  .aha-anim [data-aha-reveal],
  .aha-anim [data-aha-reveal-group] > * {
    opacity: 1 !important;
    transform: none !important;
  }
  .aha-anim [data-aha-split] { visibility: visible !important; }
  .aha-anim [data-aha-clip] { clip-path: none !important; }
}

/* --------------------------------------------------------------------------
   7. PRINT
   -------------------------------------------------------------------------- */
@media print {
  .aha-header,
  .aha-footer__base,
  .aha-nav-toggle,
  .aha-cta { display: none !important; }

  body { background: #fff; color: #000; }
  .aha-anim [data-aha-reveal] { opacity: 1 !important; transform: none !important; }
}