/* ============================================================================
   ADVANTAGE FOODS — CORE STYLES (design system)
   ----------------------------------------------------------------------------
   Sections:  RESET · BASE TYPE · LAYOUT · BACKDROP/GLOW · UTILITIES ·
              HEADER · FOOTER · BUTTONS · CARDS · FORMS · MOTION ·
              CURSOR · PAGE-TRANSITION · RESPONSIVE · REDUCED-MOTION
   Page-specific section styles live in pages.css.
   ========================================================================== */

/* ---------------------------------------------------------------- RESET --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
[id] { scroll-margin-top: 6rem; } /* offset anchor jumps for the fixed header */
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--t-body);
  line-height: var(--lh-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip; /* clip (not hidden) so body doesn't become a scroll container */
}
/* Lenis smooth-scroll hook */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
ul { list-style: none; }
::selection { background: var(--blue-300); color: var(--on-accent); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 4px; }

/* ------------------------------------------------------------ BASE TYPE --- */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 380; line-height: var(--lh-snug); letter-spacing: -0.015em; color: var(--ink); text-wrap: balance; }
h1 { font-size: var(--t-h1); line-height: var(--lh-tight); letter-spacing: -0.03em; text-wrap: balance; }
h2 { font-size: var(--t-h2); letter-spacing: -0.02em; text-wrap: balance; }
h3 { font-size: var(--t-h3); }
h4 { font-size: var(--t-h4); }
p  { color: var(--ink-dim); }
strong, b { font-weight: 600; color: var(--ink); }
em { font-style: italic; }

.display { font-family: var(--font-display); font-size: var(--t-display); line-height: 0.96; letter-spacing: -0.035em; font-weight: 340; }
.lead { font-size: var(--t-lead); line-height: 1.5; color: var(--ink-dim); font-weight: 380; text-wrap: pretty; }
p { text-wrap: pretty; }
.serif-em { font-family: var(--font-display); font-style: italic; font-weight: 380; }

/* ------------------------------------------------------------- LAYOUT ----- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.wrap-wide { max-width: var(--maxw-wide); }
.section { position: relative; padding-block: var(--section-y); }
.section--tight { padding-block: clamp(3rem, 2rem + 4vw, 5rem); }

/* eyebrow / kicker */
.eyebrow {
  display: inline-flex; align-items: center; gap: 0.6em;
  font-family: var(--font-mono);
  font-size: var(--t-eyebrow); font-weight: 500;
  letter-spacing: var(--tracking-eyebrow); text-transform: uppercase;
  color: var(--blue-200);
}
.eyebrow::before { content: ""; width: 1.6em; height: 1px; background: linear-gradient(90deg, transparent, var(--blue-300)); }
.eyebrow--center::before { display: none; }

.section-head { max-width: 56ch; margin-bottom: clamp(2rem, 1rem + 3vw, 3.5rem); }
.section-head h2 { margin-top: 0.6rem; }
.section-head p { margin-top: 1rem; color: var(--mut); max-width: 50ch; }

/* ------------------------------------------------------ BACKDROP / GLOW --- */
/* Layered, fixed cinematic blue light + a subtle film grain over everything. */
.backdrop { position: fixed; inset: 0; z-index: -2; pointer-events: none; overflow: hidden; background:
    radial-gradient(120% 80% at 50% -10%, var(--ink-blue-700) 0%, transparent 55%),
    radial-gradient(90% 60% at 85% 110%, var(--backdrop-tint) 0%, transparent 60%),
    var(--bg);
}
.backdrop::before, .backdrop::after { content: ""; position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.7; }
.backdrop::before { width: 60vw; height: 60vw; top: -20vw; left: -10vw; background: radial-gradient(circle, var(--glow-soft), transparent 70%); }
.backdrop::after  { width: 50vw; height: 50vw; bottom: -15vw; right: -12vw; background: radial-gradient(circle, var(--glow-core), transparent 70%); }
/* film grain */
.grain { position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.05; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* a reusable local glow you can drop inside any section */
.glow { position: absolute; border-radius: 50%; filter: blur(90px); pointer-events: none; z-index: 0; background: radial-gradient(circle, var(--glow-core), transparent 70%); }

/* glass surface */
.glass { background: var(--glass); -webkit-backdrop-filter: blur(22px) saturate(150%); backdrop-filter: blur(22px) saturate(150%); border: 1px solid var(--line); }

/* hairline divider */
.hr { height: 1px; border: 0; background: linear-gradient(90deg, transparent, var(--line-strong), transparent); }

/* ---------------------------------------------------------- UTILITIES ----- */
.tnum { font-variant-numeric: tabular-nums; }
.mono { font-family: var(--font-mono); }
.center { text-align: center; }
.relative { position: relative; }
.z1 { position: relative; z-index: 1; }
.muted { color: var(--mut); }
.faint { color: var(--faint); }
.maxw-prose { 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; }

/* =============================================================== HEADER === */
/* Centered white logo, nav split symmetrically left/right (desktop). */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: var(--z-header);
  transition: background var(--dur-slow) var(--ease-out), border-color var(--dur-slow), backdrop-filter var(--dur-slow); border-bottom: 1px solid transparent; }
.site-header.is-stuck { background: var(--glass-strong); -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%); border-bottom-color: var(--line); }
.site-header.is-hidden { transform: translateY(-100%); }
.site-header { will-change: transform; transition: transform var(--dur-base) var(--ease-out), background var(--dur-slow) var(--ease-out), border-color var(--dur-slow); }

.nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  max-width: var(--maxw-wide); margin-inline: auto; padding: clamp(0.7rem, 0.4rem + 0.8vw, 1.15rem) var(--gutter); gap: clamp(1.2rem, 3vw, 3.4rem); }
.nav-side { display: flex; align-items: center; gap: clamp(0.6rem, 0.3rem + 1vw, 1.6rem); }
.nav-side--left  { justify-content: flex-end; }    /* clusters hug the centred logo, not the corners */
.nav-side--right { justify-content: flex-start; }
.nav-logo { justify-self: center; display: inline-flex; align-items: center; }
.nav-logo img { height: clamp(26px, 2.2vw, 34px); width: auto; }

.nav-link { position: relative; font-size: 0.86rem; font-weight: 450; letter-spacing: 0.01em; color: var(--mut); padding: 0.4rem 0.2rem; transition: color var(--dur-base) var(--ease-out); white-space: nowrap; }
.nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px; background: var(--blue-200); transform: scaleX(0); transform-origin: right; transition: transform var(--dur-base) var(--ease-out); }
.nav-link:hover { color: var(--ink); }
.nav-link:hover::after, .nav-link[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.nav-link[aria-current="page"] { color: var(--ink); }

.nav-cta { font-size: 0.84rem; }
.nav-toggle { display: none; }

/* mobile drawer */
.nav-drawer { position: fixed; inset: 0; z-index: var(--z-header); background: var(--glass-strong); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
  display: flex; flex-direction: column; justify-content: center; gap: 0.4rem; padding: var(--gutter);
  opacity: 0; visibility: hidden; transition: opacity var(--dur-slow) var(--ease-out), visibility var(--dur-slow); }
.nav-drawer.is-open { opacity: 1; visibility: visible; }
.nav-drawer a { font-family: var(--font-display); font-size: clamp(2rem, 8vw, 3.2rem); font-weight: 340; color: var(--ink-dim); padding: 0.3rem 0; letter-spacing: -0.02em;
  opacity: 0; transform: translateY(14px); transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out), color var(--dur-base); }
.nav-drawer.is-open a { opacity: 1; transform: none; }
.nav-drawer a:nth-child(1){transition-delay:.05s}.nav-drawer a:nth-child(2){transition-delay:.10s}.nav-drawer a:nth-child(3){transition-delay:.15s}.nav-drawer a:nth-child(4){transition-delay:.20s}.nav-drawer a:nth-child(5){transition-delay:.25s}.nav-drawer a:nth-child(6){transition-delay:.30s}
.nav-drawer a:hover { color: var(--blue-200); }
.nav-drawer-close { position: absolute; top: 1.4rem; right: var(--gutter); width: 44px; height: 44px; border: 1px solid var(--line-strong); border-radius: var(--r-pill); font-size: 1.2rem; color: var(--ink); }

/* =============================================================== FOOTER === */
.site-footer { position: relative; border-top: 1px solid var(--line); padding-block: clamp(3.5rem, 2rem + 5vw, 6rem) 2.2rem; margin-top: var(--sp-7); overflow: hidden; }
.site-footer .glow { width: 50vw; height: 30vw; left: 50%; bottom: -22vw; transform: translateX(-50%); opacity: 0.5; }
.foot-top { display: grid; grid-template-columns: 1fr auto; gap: clamp(1.5rem, 1rem + 3vw, 3.5rem); align-items: end; position: relative; z-index: 1; }
.foot-brand img { height: 38px; margin-bottom: 1.1rem; }
.foot-brand p { color: var(--mut); max-width: 34ch; font-size: 0.95rem; }
.foot-contact { text-align: right; }
.foot-contact a, .foot-contact p { display: block; color: var(--ink-dim); font-size: 0.95rem; margin-bottom: 0.6rem; transition: color var(--dur-base) var(--ease-out); }
.foot-contact p { margin-bottom: 0; }
.foot-contact a:hover { color: var(--blue-200); }
.foot-bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: clamp(2.5rem, 1.5rem + 3vw, 4rem); padding-top: 1.6rem; border-top: 1px solid var(--line); position: relative; z-index: 1; }
.foot-bottom .cp { font-size: 0.78rem; color: var(--faint); letter-spacing: 0.02em; }
.foot-bottom .pb { font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--faint); }

/* ============================================================== BUTTONS === */
/* All pill buttons share ONE height (3rem) and box so every CTA matches across
   the site. The transparent 1px border keeps borderless (primary) and bordered
   (ghost) buttons the exact same height (box-sizing: border-box). */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.55em; height: 3rem; padding: 0 1.8em; border-radius: var(--r-pill); border: 1px solid transparent;
  font-family: var(--font-sans); font-size: 0.92rem; font-weight: 500; letter-spacing: 0.005em; white-space: nowrap; isolation: isolate;
  transition: transform var(--dur-fast) var(--ease-out), background var(--dur-base) var(--ease-out), border-color var(--dur-base), color var(--dur-base); }
.btn:active { transform: scale(0.97); }
.btn .ico { transition: transform var(--dur-base) var(--ease-out); }
.btn:hover .ico { transform: translateX(3px); }

.btn--primary { background: var(--accent); color: var(--on-accent); font-weight: 600; box-shadow: var(--shadow-glow); }
.btn--primary:hover { background: var(--accent-hover); }
.btn--ghost { background: rgba(255,255,255,0.02); color: var(--ink); border: 1px solid var(--line-strong); }
.btn--ghost:hover { border-color: var(--blue-300); background: rgba(77,159,230,0.08); }
.btn--quiet { height: auto; padding-inline: 0.2em; color: var(--blue-200); }
.btn--quiet::after { content: ""; position: absolute; left: 0.2em; right: 0.2em; bottom: 0.1em; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform var(--dur-base) var(--ease-out); }
.btn--quiet:hover::after { transform: scaleX(1); transform-origin: left; }
/* --lg keeps the shared 3rem height; it only reads a touch wider */
.btn--lg { padding-inline: 2em; }

/* magnetic wrapper (JS adds translate) */
.magnetic { display: inline-flex; will-change: transform; }

/* =============================================================== CARDS ==== */
.card { position: relative; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(1.4rem, 1rem + 1.5vw, 2.2rem); overflow: hidden;
  transition: transform var(--dur-slow) var(--ease-out), border-color var(--dur-slow), background var(--dur-slow); }
.card:hover { border-color: var(--line-strong); }
.card__glow { position: absolute; inset: 0; opacity: 0; background: radial-gradient(420px circle at var(--mx,50%) var(--my,50%), var(--glow-soft), transparent 60%); transition: opacity var(--dur-slow) var(--ease-out); pointer-events: none; }
.card:hover .card__glow { opacity: 1; }

/* image frame with mask-reveal + zoom-on-hover */
.frame { position: relative; overflow: hidden; border-radius: var(--r-md); background: var(--panel-raised); }
.frame img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { a:hover > .frame img, .frame:hover img { transform: scale(1.06); } }
.frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(3,7,15,0.55)); pointer-events: none; }
.frame__caption { position: absolute; left: 1.1rem; bottom: 0.95rem; z-index: 1; font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink); text-shadow: 0 1px 10px rgba(3, 7, 15, 0.9), 0 0 2px rgba(3, 7, 15, 0.7); }

/* chips / tags */
.chip { display: inline-flex; align-items: center; gap: 0.5em; font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--blue-150); border: 1px solid var(--line-strong); border-radius: var(--r-pill); padding: 0.4em 0.9em; background: rgba(77,159,230,0.06); }

/* =============================================================== FORMS ==== */
.field { margin-bottom: 1.1rem; }
.field > label { display: block; font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--faint); margin-bottom: 0.55rem; }
.field input, .field select, .field textarea { width: 100%; padding: 0.85rem 1rem; background: var(--ink-blue-800); border: 1px solid var(--line); border-radius: var(--r-sm); color: var(--ink);
  transition: border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), background var(--dur-base); }
.field input::placeholder, .field textarea::placeholder { color: var(--faint); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue-300); box-shadow: 0 0 0 3px rgba(77,159,230,0.18); background: var(--ink-blue-700); }
.field select option { background: var(--panel); color: var(--ink); }
.field input[type=file] { padding: 0.7rem 1rem; color: var(--mut); cursor: pointer; }
.field input[type=file]::file-selector-button { margin-right: 0.9rem; padding: 0.5rem 1rem; background: var(--panel-raised); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--r-sm); cursor: pointer; font-size: 0.82rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; }

/* segmented control */
.seg { display: inline-flex; width: 100%; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--ink-blue-800); }
.seg > div { flex: 1; position: relative; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg label { display: block; text-align: center; padding: 0.7rem; border-radius: calc(var(--r-sm) - 3px); font-size: 0.85rem; color: var(--mut); cursor: pointer; transition: background var(--dur-base) var(--ease-out), color var(--dur-base); }
.seg input:checked + label { background: var(--accent-grad); color: var(--on-accent); font-weight: 600; }
.seg input:focus-visible + label { outline: 2px solid var(--focus); outline-offset: 2px; }

.form-note { font-size: 0.78rem; color: var(--faint); margin-top: 0.8rem; }
.form-status { font-size: 0.85rem; margin-top: 0.9rem; min-height: 1.2em; }
.form-status.ok { color: var(--blue-150); }
.form-status.err { color: var(--err); }

/* Upload feedback + spinners (transform-only animation) --------------------- */
@keyframes af-spin { to { transform: rotate(360deg); } }

.file-feedback { margin-top: 0.55rem; font-size: 0.85rem; line-height: 1.4; display: flex; align-items: center; gap: 0.5em; color: var(--ink-dim); }
.file-feedback[hidden] { display: none; }
.file-feedback.ok  { color: var(--blue-150); }
.file-feedback.err { color: var(--err); }
.file-feedback .ff-spin { flex: none; width: 0.95em; height: 0.95em; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: af-spin 0.7s linear infinite; }
.file-feedback .ff-tick { flex: none; font-weight: 700; }

.btn.is-loading { color: transparent !important; pointer-events: none; }
.btn.is-loading .ico { visibility: hidden; }
.btn.is-loading::after {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 1.15em; height: 1.15em; margin: -0.575em 0 0 -0.575em;
  border: 2px solid var(--ink); border-top-color: transparent; border-radius: 50%;
  animation: af-spin 0.7s linear infinite;
}
.btn--primary.is-loading::after { border-color: var(--on-accent); border-top-color: transparent; }
@media (prefers-reduced-motion: reduce) {
  .file-feedback .ff-spin, .btn.is-loading::after { animation-duration: 1.4s; }
}

/* map */
.map-card { border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-md); background: var(--panel); }
.map-card iframe { width: 100%; height: clamp(280px, 40vh, 420px); border: 0; display: block; filter: grayscale(1) invert(0.92) hue-rotate(190deg) brightness(0.9) contrast(0.9); }

/* =============================================================== MOTION === */
/* Scroll-reveal primitives. JS adds .is-in when element enters viewport.     */
[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out); will-change: opacity, transform; }
[data-reveal="fade"] { transform: none; }
[data-reveal="left"]  { transform: translateX(-28px); }
[data-reveal="right"] { transform: translateX(28px); }
[data-reveal="scale"] { transform: scale(0.94); }
[data-reveal].is-in { opacity: 1; transform: none; }
/* stagger children */
[data-reveal-group] > * { opacity: 0; transform: translateY(20px); transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out); }
[data-reveal-group].is-in > * { opacity: 1; transform: none; }
[data-reveal-group].is-in > *:nth-child(1){transition-delay:.00s}
[data-reveal-group].is-in > *:nth-child(2){transition-delay:.07s}
[data-reveal-group].is-in > *:nth-child(3){transition-delay:.14s}
[data-reveal-group].is-in > *:nth-child(4){transition-delay:.21s}
[data-reveal-group].is-in > *:nth-child(5){transition-delay:.28s}
[data-reveal-group].is-in > *:nth-child(6){transition-delay:.35s}
[data-reveal-group].is-in > *:nth-child(7){transition-delay:.42s}
[data-reveal-group].is-in > *:nth-child(8){transition-delay:.49s}
[data-reveal-group].is-in > *:nth-child(9){transition-delay:.56s}
[data-reveal-group].is-in > *:nth-child(10){transition-delay:.63s}

/* line-by-line display reveal (clip mask) */
.reveal-lines { }
.reveal-lines .line { display: block; overflow: hidden; }
.reveal-lines .line > span { display: block; transform: translateY(110%); transition: transform var(--dur-reveal) var(--ease-out); }
.reveal-lines.is-in .line > span { transform: none; }
.reveal-lines.is-in .line:nth-child(2) > span { transition-delay: 0.08s; }
.reveal-lines.is-in .line:nth-child(3) > span { transition-delay: 0.16s; }
.reveal-lines.is-in .line:nth-child(4) > span { transition-delay: 0.24s; }

/* image mask-reveal (clip-path wipe upward) */
[data-img-reveal] { clip-path: inset(0 0 100% 0); transition: clip-path var(--dur-reveal) var(--ease-in-out); }
[data-img-reveal].is-in { clip-path: inset(0 0 0 0); }

/* parallax element — JS sets --py */
[data-parallax] { will-change: transform; transform: translate3d(0, var(--py, 0px), 0); }

/* (Custom cursor removed — the site uses the native pointer.) */

/* ===================================================== PAGE-TRANSITION ==== */
/* Curtain overlay that wipes between pages (works everywhere). */
.page-transition { position: fixed; inset: 0; z-index: var(--z-transition); pointer-events: none; background: var(--ink-blue-900);
  transform: translateY(100%); }
.page-transition.cover { animation: curtain-in 560ms var(--ease-in-out) forwards; }
.page-transition.reveal { transform: translateY(0); animation: curtain-out 620ms var(--ease-in-out) forwards; }
@keyframes curtain-in  { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes curtain-out { from { transform: translateY(0); } to { transform: translateY(-100%); } }

/* Native cross-document view transitions where supported (progressive). */
@view-transition { navigation: auto; }

/* ============================================================ RESPONSIVE == */
@media (max-width: 900px) {
  .nav { grid-template-columns: auto 1fr; }
  .nav-side--left, .nav-side--right .nav-link { display: none; }
  .nav-logo { justify-self: start; }
  .nav-side--right { justify-content: flex-end; gap: 0.5rem; } /* pin the menu button to the right edge */
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--line-strong); border-radius: var(--r-pill); color: var(--ink); }
}
@media (max-width: 560px) {
  .field-row { grid-template-columns: 1fr; }
  .foot-top { grid-template-columns: 1fr; align-items: start; }
  .foot-contact { text-align: left; }
  .foot-bottom { flex-direction: column; align-items: flex-start; }
}

/* ============================================ QA / STATIC PREVIEW MODE ==== */
/* Activated by adding ?static to the URL (see motion.js). Reveals everything
   and removes motion so a page can be reviewed/captured without animation. */
html.qa-static [data-reveal],
html.qa-static [data-reveal-group] > *,
html.qa-static .reveal-lines .line > span { opacity: 1 !important; transform: none !important; }
html.qa-static [data-img-reveal] { clip-path: none !important; }
html.qa-static [data-parallax] { transform: none !important; }

/* ====================================================== REDUCED MOTION ==== */
@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; }
  [data-reveal], [data-reveal-group] > *, .reveal-lines .line > span { opacity: 1 !important; transform: none !important; }
  [data-img-reveal] { clip-path: none !important; }
  [data-parallax] { transform: none !important; }
  .page-transition { display: none !important; }
}