/* ==========================================================================
   LiftLink — site styles
   Hand-written. No Tailwind, no build step, no runtime CSS-in-JS.
   ========================================================================== */

/* ---------- Font (self-hosted, variable 400–900, SIL OFL) ---------- */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../font/outfit-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../font/outfit-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- Tokens ---------- */
:root {
  --bg: #0e0e10;
  --gold: #ffd257;
  --gold-hi: #ffcd2c;
  --ink: #181400;
  --card: #181410;

  --text: #ffffff;
  /* Secondary/muted greys are lifted from the original 0.45/0.30 so that body
     copy and the small uppercase labels clear WCAG AA (4.5:1) against the
     painted background. At 0.30 the labels measured 2.66:1 — unreadable. */
  --text-2: rgba(255, 255, 255, 0.52);
  --text-3: rgba(255, 255, 255, 0.54);
  --hair: rgba(255, 255, 255, 0.08);

  --max: 72rem;
  --pad: 1.5rem;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --r-sm: 0.75rem;
  --r-md: 1rem;
  --r-lg: 1.5rem;
  --r-xl: 2.5rem;
}

@media (min-width: 640px) {
  :root { --pad: 2.5rem; }
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Helvetica, Arial, sans-serif;
  font-synthesis-weight: none;
  line-height: 1.5;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, svg { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4, p, figure { margin: 0; }

a { color: inherit; text-decoration: none; }

button { font: inherit; color: inherit; }

ul, ol { margin: 0; padding: 0; }

/* Visible, on-brand focus ring — keyboard only. */
:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Parked above the viewport rather than at left:-9999px — an off-screen
   negative offset inflates document scrollWidth and fights overflow-x. */
.skip-link {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  padding: 0.75rem 1.25rem;
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
  border-radius: 0 0 var(--r-sm) 0;
  transform: translateY(-120%);
  transition: transform 0.2s var(--ease);
}
.skip-link:focus { transform: none; }

.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;
}

/* ---------- Layout primitives ---------- */
/* canvas is a replaced element: `inset:0` alone leaves it at its intrinsic
   300x150, so width/height must be stated explicitly. */
.bg-canvas {
  position: fixed;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.shell { position: relative; z-index: 1; }

.wrap {
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
}

.section {
  position: relative;
  padding: 4rem var(--pad);
}
@media (min-width: 640px) {
  .section { padding-block: 6rem; }
}

/* Hairline divider at the top edge of a section. */
.section--ruled::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--hair), transparent);
}

.eyebrow {
  display: block;
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}

.h2 {
  margin-top: 0.75rem;
  font-size: clamp(1.875rem, 1.2rem + 3vw, 3rem);
  font-weight: 900;
  letter-spacing: -0.025em;
  line-height: 1.1;
}

.lede {
  color: var(--text-2);
  font-size: 1rem;
  line-height: 1.7;
}
@media (min-width: 640px) {
  .lede { font-size: 1.125rem; }
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.875rem 1.25rem;
  border: 0;
  border-radius: var(--r-lg);
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s var(--ease), transform 0.2s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn svg { flex-shrink: 0; width: 1.25rem; height: 1.25rem; }

.btn--light {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 10px 30px -10px rgba(255, 255, 255, 0.25);
}
.btn--light:hover { background: rgba(255, 255, 255, 0.9); }

.btn--ghost {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}
.btn--ghost:hover { background: rgba(255, 255, 255, 0.14); }

.btn--gold {
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
  box-shadow: 0 10px 30px -10px rgba(255, 210, 87, 0.4);
}
.btn--gold:hover { background: var(--gold-hi); }

.btn--lg { padding: 1rem 1.75rem; font-weight: 700; }

/* ---------- Store badges ----------
   Apple and Google both require their OWN unmodified badge artwork. Do not
   restyle, recolour, crop, or rebuild these as CSS buttons — sizing only.
   Google's PNG ships with transparent padding baked in, so it needs a taller
   box than Apple's SVG for the visible buttons to match. --gp-scale is that
   compensation factor, measured from the artwork's opaque bounding box. */
.store-badges {
  --badge-h: 48px;
  /* Measured from the artwork: 646x250 canvas, 564x168 opaque button, i.e.
     41px transparent padding a side. 250/168 = 1.488. */
  --gp-scale: 1.488;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 2rem;
}

.store-badges--lg { --badge-h: 56px; justify-content: center; margin-top: 2.5rem; }

.store-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 0.5rem;
  transition: opacity 0.2s var(--ease), transform 0.2s var(--ease);
}
.store-badge:hover { opacity: 0.85; transform: translateY(-1px); }

.store-badge img { height: var(--badge-h); width: auto; }

/* Scale Google up so its visible button matches Apple's height, then pull the
   vertical padding back out so the two sit on the same baseline. The
   horizontal padding is left in place — both Apple and Google require minimum
   clear space around the badge, and this supplies it. */
.store-badge--google img { height: calc(var(--badge-h) * var(--gp-scale)); }
.store-badge--google {
  margin-block: calc(var(--badge-h) * (1 - var(--gp-scale)) / 2);
  margin-inline: 0;
}

/* 44px floor on every tap target — Apple HIG / WCAG 2.5.5. */
.btn--sm {
  min-height: 44px;
  padding: 0.5rem 1rem;
  border-radius: var(--r-sm);
  font-size: 0.75rem;
  font-weight: 700;
  background: var(--gold);
  color: var(--ink);
}
.btn--sm:hover { background: var(--gold-hi); }

/* ---------- Header ---------- */
.masthead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
  padding-top: 0.5rem;
}

/* The logo link wraps a 40px image; pad it out to the 44px tap-target floor. */
.masthead > a:first-child {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.masthead__logo { height: 2.5rem; width: auto; }

.masthead__nav {
  display: none;
  gap: 0.25rem;
  margin-left: auto;
  margin-right: 0.5rem;
}
@media (min-width: 768px) {
  .masthead__nav { display: flex; }
}

.masthead__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 0.875rem;
  border-radius: var(--r-sm);
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.2s, background-color 0.2s;
}
.masthead__nav a:hover {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.05);
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100svh;
  padding: 2rem var(--pad) 4rem;
  overflow: hidden;
}

.hero__inner {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
  width: 100%;
  max-width: var(--max);
  margin: 3rem auto 0;
}
@media (min-width: 1024px) {
  .hero__inner {
    flex-direction: row;
    gap: 4rem;
    margin-top: 0;
    padding-block: 5rem;
  }
}

.hero__copy { flex: 1; }
@media (min-width: 1024px) {
  .hero__copy { padding-right: 2rem; }
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.75rem;
  padding: 0.375rem 0.75rem;
  border-radius: 999px;
  background: rgba(255, 210, 87, 0.08);
  color: var(--gold);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.pill__dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--gold);
  animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}

.hero__title {
  font-size: clamp(2.25rem, 1.3rem + 4.2vw, 3.75rem);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.hero__title span { color: var(--gold); }

.hero__sub {
  max-width: 26rem;
  margin-top: 1.5rem;
}

.hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

.stats {
  display: flex;
  gap: 2rem;
  margin-top: 2.5rem;
  list-style: none;
}

.stats__value {
  color: var(--gold);
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.stats__label {
  margin-top: 0.125rem;
  color: var(--text-3);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

/* Phone mockups — shared treatment for hero + feature rows. */
.phone {
  position: relative;
  flex-shrink: 0;
  width: 280px;
}
@media (min-width: 640px) { .phone { width: 340px; } }
@media (min-width: 1024px) { .phone { width: 400px; } }

.phone::before {
  content: '';
  position: absolute;
  inset: -15%;
  border-radius: 999px;
  background: rgba(255, 210, 87, 0.12);
  filter: blur(60px);
}

.phone__frame {
  position: relative;
  border-radius: 3rem;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

/* ---------- Platform badges ---------- */
.platforms {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.platforms__label {
  margin-right: 0.5rem;
  color: var(--text-3);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.625rem 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  transition: background-color 0.2s var(--ease), transform 0.2s var(--ease);
}
.chip:hover {
  background: rgba(255, 255, 255, 0.08);
  transform: translateY(-2px);
}

.chip__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: var(--chip-tint, rgba(255, 255, 255, 0.08));
  color: var(--chip-ink, #fff);
}
.chip__icon svg { width: 1.25rem; height: 1.25rem; }

.chip--youtube   { --chip-tint: rgba(255, 0, 0, 0.09);     --chip-ink: #ff0000; }
.chip--instagram { --chip-tint: rgba(225, 48, 108, 0.09);  --chip-ink: #e1306c; }
.chip--tiktok    { --chip-tint: rgba(105, 201, 208, 0.09); --chip-ink: #69c9d0; }

.chip__name { font-size: 0.875rem; font-weight: 600; }

.chip__desc {
  display: none;
  color: var(--text-3);
  font-size: 0.75rem;
}
@media (min-width: 640px) { .chip__desc { display: inline; } }

/* ---------- Features ---------- */
.features__head {
  margin-bottom: 5rem;
  text-align: center;
}

.features__list {
  display: flex;
  flex-direction: column;
  gap: 6rem;
}
@media (min-width: 640px) {
  .features__list { gap: 8rem; }
}

.feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
}
@media (min-width: 1024px) {
  .feature { flex-direction: row; gap: 5rem; }
  .feature--flip { flex-direction: row-reverse; }
}

.feature .phone { width: 240px; }
@media (min-width: 640px) { .feature .phone { width: 300px; } }
@media (min-width: 1024px) { .feature .phone { width: 340px; } }

.feature .phone::before {
  inset: -25%;
  background: rgba(255, 210, 87, 0.08);
  filter: blur(70px);
}
.feature .phone__frame { border-radius: 2.5rem; }

.feature__body { flex: 1; max-width: 32rem; }

.feature__num {
  display: block;
  margin-bottom: 1rem;
  color: var(--gold);
  font-size: clamp(3.75rem, 2rem + 7vw, 6rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.05em;
}

.feature__title {
  margin-bottom: 1rem;
  font-size: clamp(1.5rem, 1rem + 2.2vw, 2.25rem);
  font-weight: 900;
  letter-spacing: -0.025em;
}

/* ---------- How it works ---------- */
.section-head { margin-bottom: 3rem; }

.steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  list-style: none;
}
@media (min-width: 640px) {
  .steps { grid-template-columns: repeat(3, 1fr); }
}

.step {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 2rem;
  border-radius: var(--r-md);
  background: var(--card);
}

.step__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.step__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--r-md);
  background: var(--gold);
  color: var(--ink);
  box-shadow: 0 0 24px rgba(255, 210, 87, 0.3);
}
.step__icon svg { width: 1.25rem; height: 1.25rem; }

.step__num {
  color: rgba(255, 210, 87, 0.2);
  font-size: 1.875rem;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.step__title { font-size: 1.125rem; font-weight: 700; letter-spacing: -0.02em; }

.step__desc {
  margin-top: 0.5rem;
  color: var(--text-2);
  font-size: 0.875rem;
  line-height: 1.7;
}

/* ---------- CTA ---------- */
.cta { overflow: hidden; text-align: center; }

.cta__glow,
.cta__wash {
  position: absolute;
  pointer-events: none;
}
.cta__wash {
  inset: 0;
  background: linear-gradient(to top, rgba(255, 210, 87, 0.08), transparent 60%);
}
.cta__glow {
  bottom: 0;
  left: 50%;
  width: 500px;
  height: 250px;
  max-width: 100%;
  transform: translateX(-50%);
  border-radius: 999px;
  background: rgba(255, 210, 87, 0.08);
  filter: blur(100px);
}

.cta__inner {
  position: relative;
  z-index: 1;
  max-width: 42rem;
  margin-inline: auto;
}

.cta__title {
  font-size: clamp(2.25rem, 1.5rem + 3.4vw, 3rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.03em;
}
.cta__title span { color: var(--gold); }

.cta__sub {
  max-width: 28rem;
  margin: 1.25rem auto 0;
  color: var(--text-2);
}

.cta__ctas {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 2.5rem;
}
.cta__ctas .btn { width: 100%; }
@media (min-width: 640px) {
  .cta__ctas { flex-direction: row; }
  .cta__ctas .btn { width: auto; }
}

/* ---------- Footer ---------- */
.footer {
  position: relative;
  z-index: 1;
  padding: 3rem var(--pad);
  text-align: center;
}

.footer__inner { max-width: 40rem; margin-inline: auto; }

.footer__logo { height: 2.5rem; width: auto; margin-inline: auto; }

.footer__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin-top: 1.5rem;
  list-style: none;
}

.footer__links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  border-radius: var(--r-sm);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.2s, background-color 0.2s;
}
.footer__links a:hover {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.05);
}

.footer__sep { color: rgba(255, 255, 255, 0.2); }

.footer__legal {
  margin-top: 1rem;
  color: var(--text-3);
  font-size: 0.75rem;
}

/* Safety + trademark notices. Small, but must stay legible — see the contrast
   note on --text-3 in :root. */
.footer__disclaimer {
  max-width: 34rem;
  margin: 2rem auto 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--hair);
  color: var(--text-3);
  font-size: 0.6875rem;
  line-height: 1.7;
  text-align: center;
}
.footer__disclaimer p { margin: 0 0 0.625rem; }
.footer__disclaimer p:last-child { margin-bottom: 0; }

/* ---------- Sub-page header + 404 ---------- */
.section--flush-bottom { padding-bottom: 0; }

.doc__cta { margin-top: 1.5rem; }
.doc__note { margin-top: 1.5rem; }

.notfound {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100svh;
  text-align: center;
}

.notfound__inner { max-width: 32rem; }

.notfound__logo {
  height: 2.5rem;
  width: auto;
  margin-inline: auto;
}

.notfound__code {
  margin-top: 2.5rem;
  margin-bottom: 0.5rem;
}

.notfound__title { margin-top: 0; }

.notfound__lede {
  max-width: 24rem;
  margin: 1.25rem auto 0;
}

.notfound__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 2.5rem;
}

/* ---------- Scroll reveal ---------- */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
  transition-delay: var(--reveal-delay, 0s);
}
.reveal.is-in {
  opacity: 1;
  transform: none;
}

/* If JS never runs, content must still be visible. */
.no-js .reveal { opacity: 1; transform: none; }

/* ---------- Document (legal / utility) pages ---------- */
.doc {
  max-width: 46rem;
  margin-inline: auto;
  padding: 2rem var(--pad) 4rem;
}

.doc__title {
  font-size: clamp(2rem, 1.4rem + 2.6vw, 2.75rem);
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.doc__meta {
  margin-top: 0.75rem;
  color: var(--text-3);
  font-size: 0.8125rem;
}

.doc__body { margin-top: 2.5rem; }

.doc__body h2 {
  margin-top: 2.75rem;
  margin-bottom: 0.875rem;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--gold);
}

.doc__body h3 {
  margin-top: 1.75rem;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
}

.doc__body p,
.doc__body li {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.9375rem;
  line-height: 1.8;
}

.doc__body p { margin-bottom: 1rem; }

.doc__body ul {
  margin-bottom: 1rem;
  padding-left: 1.25rem;
  list-style: disc;
}
.doc__body li { margin-bottom: 0.5rem; }

.doc__body a {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.doc__body strong { color: rgba(255, 255, 255, 0.9); font-weight: 600; }

.callout {
  margin: 1.5rem 0;
  padding: 1.25rem 1.5rem;
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: rgba(255, 210, 87, 0.06);
}
.callout p:last-child { margin-bottom: 0; }

/* Emphatic legal blocks (arbitration, class-action waiver, risk assumption). */
.callout--strong p { color: rgba(255, 255, 255, 0.9); font-weight: 500; }

/* Sibling-document link: Privacy <-> Terms. */
.doc__crosslink {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  margin-bottom: 0.5rem;
  color: var(--text-2);
  font-size: 0.875rem;
  transition: color 0.2s;
}
.doc__crosslink:hover { color: var(--gold); }

/* Contact / address card. */
.contact-card {
  margin-top: 1rem;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--hair);
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, 0.03);
}
.contact-card p { margin-bottom: 0.25rem; }
.contact-card p:last-child { margin-bottom: 0; }
.contact-card__name { color: #fff; font-weight: 600; }
.contact-card__mail { color: var(--gold); }
.contact-card__note { font-size: 0.8125rem; color: var(--text-3); }

.doc__table-wrap {
  margin-bottom: 1.5rem;
  overflow-x: auto;
}

.doc__table {
  width: 100%;
  min-width: 32rem;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.doc__table th,
.doc__table td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--hair);
  text-align: left;
  vertical-align: top;
}
.doc__table th {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 600;
  white-space: nowrap;
}
.doc__table td { color: rgba(255, 255, 255, 0.6); line-height: 1.7; }

.back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  margin-bottom: 1.5rem;
  color: var(--text-3);
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.2s;
}
.back-link:hover { color: var(--gold); }

/* ---------- Motion preferences ---------- */
@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;
  }
  .reveal { opacity: 1; transform: none; }
}