* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  background: var(--parchment);
  color: var(--ink-soft);
  font-family: var(--serif-body);
  font-size: clamp(1.05rem, 0.95rem + 0.4vw, 1.2rem);
  line-height: 1.65;
  overflow-x: hidden;
}

::selection { background: var(--ink); color: var(--parchment-light); }

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

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

/* ─── paper grain, felt not seen ─── */

#grain {
  position: fixed;
  inset: 0;
  z-index: 90;
  pointer-events: none;
  opacity: 0.055;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ─── entrance ritual (home only) ─── */

#entrance {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: var(--parchment);
}

#entrance-canvas { display: block; width: 100%; height: 100%; }

#entrance-sub {
  position: absolute;
  left: 50%;
  top: 63%;
  transform: translateX(-50%);
  font-family: var(--serif-quote);
  font-style: italic;
  font-size: clamp(16px, 2.2vw, 28px);
  letter-spacing: 0.28em;
  color: var(--parchment-dark);
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
}

/* ─── page transition overlay ─── */

.page-transition {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: var(--parchment);
  clip-path: circle(0% at 50% 50%);
  pointer-events: none;
  transition: clip-path 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.page-transition.is-active {
  clip-path: circle(150% at var(--tx, 50%) var(--ty, 50%));
}

html.ala-entering .page-transition {
  clip-path: circle(150% at 50% 50%);
}

.page-reveal {
  clip-path: circle(150% at 50% 50%);
  animation: page-reveal 0.45s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

@keyframes page-reveal {
  from { clip-path: circle(150% at 50% 50%); opacity: 1; }
  to   { clip-path: circle(0% at 50% 50%); opacity: 0; }
}

/* ─── manuscript frame ─── */

#manuscript { visibility: hidden; }

/* ─── lenis smooth scroll ─── */

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-smooth iframe { pointer-events: none; }

/* ─── reduced motion ─── */

:root[data-motion="reduced"] { scroll-behavior: auto; }
:root[data-motion="reduced"] #entrance { display: none; }
:root[data-motion="reduced"] #manuscript { visibility: visible; }
:root[data-motion="reduced"] .hero-float { opacity: 1 !important; animation: none !important; }
:root[data-motion="reduced"] .hero-float.is-visible { animation: none; }
:root[data-motion="reduced"] .hero-numeral,
:root[data-motion="reduced"] .hero-title,
:root[data-motion="reduced"] .hero-tagline,
:root[data-motion="reduced"] .hero-cta { opacity: 1 !important; transform: none !important; }
:root[data-motion="reduced"] .hero-rule { transform: scaleX(1) !important; }
:root[data-motion="reduced"] .thread-path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
:root[data-motion="reduced"] .page-transition { display: none; }