/* =========================================================
   KRANTI PREMIUM — Spatial editorial homepage
   The base state is complete and readable. .has-spatial-motion
   is added only when GSAP, ScrollTrigger and motion policy allow
   pinned/scrubbed enhancement.
   ========================================================= */

body.ed {
  --canvas: #f3efe6;
  --surface: #e9e1d2;
  --line: rgba(24, 19, 13, 0.17);
  --ink: #18130d;
  --ink-soft: rgba(24, 19, 13, 0.68);
  --ink-mute: rgba(24, 19, 13, 0.44);
  --accent: #96522b;
  --accent-warm: #7e421f;
  --mono: 'Space Mono', 'SFMono-Regular', Consolas, monospace;
  background: var(--canvas);
  color: var(--ink);
  letter-spacing: -0.006em;
}

body.ed p { color: var(--ink-soft); }
body.ed ::selection { background: var(--accent); color: #f7f3ea; }
body.ed main { overflow: clip; }
body.ed .journey-section { position: relative; }
body.ed .ed-h2 {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(2.7rem, 1.5rem + 4vw, 5.9rem);
  font-weight: 360;
  font-variation-settings: 'opsz' 144;
  letter-spacing: -0.04em;
  line-height: 0.98;
}
body.ed em { font-weight: 310; }
body.ed .ed-meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0;
  font-family: var(--mono);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--ink-mute);
}
body.ed .ed-meta > span:first-child { color: var(--accent); }
body.ed .ed-rule { width: clamp(2rem, 5vw, 4.5rem); height: 1px; background: currentColor; opacity: 0.55; }
body.ed .ed-caption,
body.ed .style-card__note,
body.ed .concept-reveal__label {
  font-family: var(--mono);
  font-size: 0.59rem;
  letter-spacing: 0.13em;
  line-height: 1.45;
  text-transform: uppercase;
}
body.ed .ed-chip {
  display: inline-flex;
  width: fit-content;
  padding: 0.5rem 0.9rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 0.61rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.ed .ed-link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.55rem;
  width: fit-content;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid currentColor;
  font-family: var(--mono);
  font-size: 0.7rem;
  letter-spacing: 0.13em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.35s var(--ease), border-color 0.35s var(--ease);
}
body.ed .ed-link span { transition: transform 0.35s var(--ease); }
body.ed .ed-link:hover { color: var(--accent); }
body.ed .ed-link:hover span { transform: translateX(0.35rem); }
body.ed .ed-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; }
body.ed .btn {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 0.66rem;
  letter-spacing: 0.13em;
}
body.ed .btn--primary { border-color: var(--ink); background: var(--ink); color: var(--canvas); }
body.ed .btn--primary:hover { border-color: var(--accent); background: var(--accent); color: #fff; }
body.ed .btn--light { border-color: var(--ink-mute); background: transparent; color: var(--ink); }
body.ed .btn--light:hover { border-color: var(--ink); background: transparent; color: var(--ink); }
body.ed .header { background: rgba(243, 239, 230, 0.82); border-bottom-color: var(--line); }

/* Brushed-plaster wall: the shade stays --canvas, but the finish changes
   from sandy speckle to a hand-troweled wall. Three whisper-quiet layers:
   broad plaster mottling, a faint directional brush grain, and a fine
   monochrome tooth (stitched, desaturated) instead of the old color noise. */
body.ed .grain {
  opacity: 1;
  mix-blend-mode: normal;
  background-image:
    radial-gradient(60rem 44rem at 16% 8%, rgba(24,19,13,0.024), rgba(24,19,13,0) 62%),
    radial-gradient(54rem 40rem at 86% 26%, rgba(255,252,244,0.1), rgba(255,252,244,0) 64%),
    radial-gradient(66rem 48rem at 46% 92%, rgba(24,19,13,0.02), rgba(24,19,13,0) 66%),
    repeating-linear-gradient(100deg, transparent 0 5px, rgba(24,19,13,0.012) 5px 6px),
    repeating-linear-gradient(175deg, transparent 0 11px, rgba(255,252,244,0.03) 11px 13px),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}

/* ---------- Chapter index ---------- */
body.ed .journey-rail {
  position: fixed;
  right: clamp(0.75rem, 2vw, 2rem);
  top: 50%;
  z-index: 720;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  transform: translateY(-50%);
}
body.ed .journey-rail::before {
  content: '';
  position: absolute;
  top: 0.35rem;
  bottom: 0.35rem;
  left: 50%;
  width: 1px;
  background: var(--line);
  transform: translateX(-50%);
}
body.ed .journey-rail a {
  position: relative;
  display: grid;
  width: 1.65rem;
  height: 1.65rem;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 50%;
  background: var(--canvas);
  color: var(--ink-mute);
  font-family: var(--mono);
  font-size: 0.51rem;
  text-decoration: none;
  transition: color 0.3s var(--ease), border-color 0.3s var(--ease), transform 0.3s var(--ease);
}
body.ed .journey-rail a:hover,
body.ed .journey-rail a[aria-current='step'] { border-color: var(--accent); color: var(--accent); transform: scale(1.12); }

/* ---------- 01 / approaching image plane ---------- */
body.ed .arrival-hero { min-height: 100svh; background: var(--canvas); }
body.ed .arrival-hero__stage { position: relative; min-height: 100svh; overflow: hidden; perspective: 1400px; }
body.ed .arrival-hero__content { position: relative; z-index: 4; display: flex; min-height: 100svh; flex-direction: column; padding-top: clamp(7rem, 15vh, 10rem); padding-bottom: clamp(2rem, 5vh, 4rem); }
body.ed .arrival-hero__meta { width: fit-content; }
body.ed .arrival-hero__title {
  position: relative;
  z-index: 3;
  margin: clamp(2.5rem, 8vh, 6rem) 0 0;
  font-size: clamp(4rem, 11.2vw, 11rem);
  font-weight: 360;
  font-variation-settings: 'opsz' 144;
  letter-spacing: -0.055em;
  line-height: 0.82;
  color: var(--ink);
  pointer-events: none;
}
body.ed .arrival-hero__line { display: block; overflow: hidden; padding: 0.08em 0 0.12em; }
body.ed .arrival-hero__line--offset { padding-left: clamp(3rem, 17vw, 15rem); }
body.ed .arrival-hero__line > span { display: inline-block; transform-origin: left center; will-change: transform; }
body.ed .arrival-hero__visual {
  position: absolute;
  z-index: 1;
  top: clamp(7rem, 14vh, 10rem);
  right: clamp(2rem, 7vw, 8rem);
  width: min(48vw, 760px);
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--surface);
  box-shadow: 0 2rem 6rem rgba(37, 23, 13, 0.13);
  transform-origin: 65% 45%;
  will-change: transform, border-radius;
}
body.ed .arrival-hero__visual img { width: 100%; height: 100%; object-fit: cover; filter: sepia(0.16) saturate(0.88) contrast(1.04); }
body.ed .arrival-hero__wash { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(243,239,230,0.18), transparent 45%, rgba(24,19,13,0.14)); pointer-events: none; }
body.ed .arrival-hero__visual .ed-caption { position: absolute; right: 1rem; bottom: 0.8rem; left: 1rem; color: rgba(255,255,255,0.84); text-shadow: 0 1px 6px rgba(0,0,0,0.4); }
body.ed .arrival-hero__lower { display: grid; grid-template-columns: minmax(0, 34rem) 1fr; gap: 2rem; align-items: end; margin-top: auto; }
body.ed .arrival-hero__copy { position: relative; z-index: 5; }
body.ed .arrival-hero__copy > p { margin: 0 0 1.5rem; font-size: clamp(1rem, 1.1vw, 1.2rem); line-height: 1.65; }
body.ed .arrival-hero__coordinates { justify-self: end; flex-direction: column; align-items: flex-end; gap: 0.25rem; }
body.ed .arrival-hero__drawing { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.55; }
body.ed .arrival-hero__drawing span { position: absolute; background: var(--line); transform-origin: left; }
body.ed .arrival-hero__drawing span:nth-child(1) { top: 27%; right: 0; width: 62%; height: 1px; }
body.ed .arrival-hero__drawing span:nth-child(2) { top: 0; right: 32%; width: 1px; height: 74%; }
body.ed .arrival-hero__drawing span:nth-child(3) { right: 7%; bottom: 18%; width: 34%; height: 1px; }
body.ed .arrival-hero__drawing span:nth-child(4) { right: 7%; bottom: 18%; width: 1px; height: 23%; }
body.ed .arrival-hero__scroll { position: absolute; right: clamp(4rem, 8vw, 9rem); bottom: 2rem; z-index: 6; display: flex; align-items: center; gap: 0.8rem; color: var(--ink-mute); font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.12em; text-transform: uppercase; }
body.ed .arrival-hero__scroll i { position: relative; width: 3rem; height: 1px; overflow: hidden; background: var(--line); }
body.ed .arrival-hero__scroll i::after { content: ''; position: absolute; inset: 0; background: var(--accent); animation: travel-line 2s var(--ease) infinite; transform: translateX(-100%); }
@keyframes travel-line { to { transform: translateX(110%); } }

/* ---------- 02 / land story ---------- */
body.ed .land-story { padding: clamp(6rem, 12vw, 10rem) 0; background: var(--surface); }
body.ed .land-story__stage { position: relative; min-height: 100svh; }
body.ed .land-story__visual { position: relative; width: min(62rem, 88%); margin: 0 auto 4rem; overflow: hidden; }
body.ed .land-story__visual img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; filter: sepia(0.4) saturate(0.6) contrast(1.06); }
body.ed .land-story__visual .ed-caption { margin-top: 0.6rem; color: var(--ink-mute); }
body.ed .land-story__aperture { position: absolute; inset: 0 0 1.8rem; border: 1px solid rgba(243,239,230,0.48); box-shadow: inset 0 0 8rem rgba(24,19,13,0.18); }
body.ed .land-story__meta { margin-bottom: 3rem; }
body.ed .land-story__beats { display: grid; gap: 4rem; }
body.ed .land-beat { max-width: 42rem; }
body.ed .land-beat__index { display: block; margin-bottom: 1rem; color: var(--accent); font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.14em; }
body.ed .land-beat h2 { margin: 0 0 1.5rem; font-size: clamp(3rem, 6.2vw, 7rem); font-weight: 350; letter-spacing: -0.045em; line-height: 0.92; }
body.ed .land-beat p { max-width: 36rem; font-size: clamp(1rem, 1.25vw, 1.2rem); line-height: 1.7; }
body.ed .land-story__footer { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 3rem; }
body.ed .land-story__progress { width: min(18rem, 42vw); height: 1px; overflow: hidden; background: var(--line); }
body.ed .land-story__progress span { display: block; width: 100%; height: 100%; background: var(--accent); transform: scaleX(0); transform-origin: left; }

body.ed.has-spatial-motion .land-story { height: 320svh; padding: 0; }
body.ed.has-spatial-motion .land-story__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; }
body.ed.has-spatial-motion .land-story__visual { position: absolute; top: 13vh; left: 4vw; width: min(57vw, 920px); height: 72vh; margin: 0; }
body.ed.has-spatial-motion .land-story__visual img { width: 100%; height: 100%; aspect-ratio: auto; }
body.ed.has-spatial-motion .land-story__visual .ed-caption { position: absolute; bottom: 1rem; left: 1rem; margin: 0; color: rgba(255,255,255,0.78); }
body.ed.has-spatial-motion .land-story__aperture { inset: 0; }
body.ed.has-spatial-motion .land-story__content { position: relative; height: 100%; }
body.ed.has-spatial-motion .land-story__meta { position: absolute; top: 12vh; right: 0; width: 35%; }
body.ed.has-spatial-motion .land-story__beats { position: absolute; top: 50%; right: 0; width: 38%; transform: translateY(-50%); }
body.ed.has-spatial-motion .land-beat { position: absolute; inset: 0 auto auto 0; opacity: 0; transform: translate3d(0, 5rem, -140px) scale(0.92); pointer-events: none; }
body.ed.has-spatial-motion .land-beat:first-child { opacity: 1; transform: none; }
body.ed.has-spatial-motion .land-story__footer { position: absolute; right: 0; bottom: 10vh; width: 38%; margin: 0; }

/* ---------- 03 / horizontal vocabularies ---------- */
body.ed .style-journey { background: var(--ink); color: var(--canvas); }
body.ed .style-journey__stage { min-height: 100svh; padding: clamp(6.5rem, 12vh, 9rem) 0 3rem; overflow: hidden; }
body.ed .style-journey .ed-meta,
body.ed .style-journey .ed-h2 { color: var(--canvas); }
body.ed .style-journey .ed-meta { opacity: 0.65; }
body.ed .style-journey__heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: clamp(2.5rem, 6vh, 5rem); }
body.ed .style-journey__heading .ed-h2 { max-width: 16ch; font-size: clamp(2.7rem, 5vw, 5.5rem); }
body.ed .style-journey__viewport { width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-snap-type: x mandatory; }
body.ed .style-journey__viewport::-webkit-scrollbar { display: none; }
body.ed .style-journey__track { display: flex; width: max-content; gap: clamp(1rem, 3vw, 3rem); padding: 0 clamp(1.25rem, 5vw, 5rem); }
body.ed .style-card {
  --card-rx: 0deg;
  --card-ry: 0deg;
  position: relative;
  display: grid;
  flex: 0 0 min(74vw, 1050px);
  min-height: min(64vh, 650px);
  grid-template-columns: 1.35fr 0.85fr;
  overflow: hidden;
  border: 1px solid rgba(243,239,230,0.2);
  background: #221b14;
  color: var(--canvas);
  text-decoration: none;
  scroll-snap-align: center;
  transform: perspective(1400px) rotateX(var(--card-rx)) rotateY(var(--card-ry));
  transform-style: preserve-3d;
  transition: border-color 0.45s var(--ease), transform 0.18s ease-out;
}
body.ed .style-card:hover { border-color: rgba(243,239,230,0.62); }
body.ed .style-card__media { position: relative; min-height: 100%; overflow: hidden; }
body.ed .style-card__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 55%, rgba(24,19,13,0.28)); pointer-events: none; }
body.ed .style-card__media img { width: 100%; height: 100%; object-fit: cover; filter: sepia(0.2) saturate(0.76) brightness(0.9); transition: transform 1.2s var(--ease), filter 0.8s var(--ease); }
body.ed .style-card:hover .style-card__media img { transform: scale(1.055); filter: sepia(0.08) saturate(0.94) brightness(0.98); }
body.ed .style-card__body { display: flex; flex-direction: column; justify-content: center; padding: clamp(2rem, 4vw, 4.5rem); transform: translateZ(35px); }
body.ed .style-card__number { margin-bottom: auto; color: #ce8a5e; font-family: var(--mono); font-size: 0.67rem; letter-spacing: 0.14em; }
body.ed .style-card h3 { margin: 2rem 0 1.25rem; color: var(--canvas); font-size: clamp(2.2rem, 4vw, 4.6rem); font-weight: 350; letter-spacing: -0.04em; }
body.ed .style-card p { color: rgba(243,239,230,0.67); line-height: 1.7; }
body.ed .style-card__action { display: flex; justify-content: space-between; margin-top: auto; padding-top: 2rem; border-top: 1px solid rgba(243,239,230,0.18); font-family: var(--mono); font-size: 0.61rem; letter-spacing: 0.11em; text-transform: uppercase; }
body.ed .style-card__action i { font-style: normal; transition: transform 0.4s var(--ease); }
body.ed .style-card:hover .style-card__action i { transform: translate(0.3rem, -0.3rem); }
body.ed .style-card__note { position: absolute; bottom: 1rem; left: 1rem; color: rgba(255,255,255,0.7); writing-mode: vertical-rl; transform: rotate(180deg); }
body.ed .style-journey__footer { display: flex; align-items: center; gap: 1.5rem; margin-top: 2.5rem; }
body.ed .style-journey__progress { flex: 1; height: 1px; overflow: hidden; background: rgba(243,239,230,0.18); }
body.ed .style-journey__progress span { display: block; width: 100%; height: 100%; background: #ce8a5e; transform: scaleX(0); transform-origin: left; }
body.ed .style-journey__footer .ed-meta { white-space: nowrap; }
body.ed.has-spatial-motion .style-journey__viewport { overflow: visible; }
body.ed.has-spatial-motion .style-journey__track { will-change: transform; }

/* ---------- 04 / process instrument ---------- */
body.ed .process-story { padding: clamp(7rem, 14vw, 12rem) 0; background: var(--canvas); }
body.ed .process-story__layout { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(2rem, 5vw, 5rem); }
body.ed .process-story__anchor { grid-column: 1 / 6; position: sticky; top: 16vh; align-self: start; display: grid; gap: 2.5rem; }
body.ed .process-story__steps { grid-column: 7 / 13; list-style: none; }
body.ed .process-card { display: grid; min-height: 66vh; grid-template-columns: 4rem 1fr; gap: clamp(1.5rem, 3vw, 3rem); align-content: center; border-top: 1px solid var(--line); transition: opacity 0.55s var(--ease), transform 0.55s var(--ease); }
body.ed.has-spatial-motion .process-card { opacity: 0.22; transform: translate3d(0, 5rem, -100px) scale(0.92); }
body.ed.has-spatial-motion .process-card.is-active { opacity: 1; transform: none; }
body.ed .process-card:last-child { border-bottom: 1px solid var(--line); }
body.ed .process-card__number { color: var(--accent); font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.14em; }
body.ed .process-card h3 { margin: 0 0 1rem; font-size: clamp(2.2rem, 3.8vw, 4.2rem); font-weight: 350; letter-spacing: -0.035em; }
body.ed .process-card p { max-width: 34rem; font-size: 1.05rem; line-height: 1.72; }
body.ed .process-card__detail { display: block; margin-top: 1.5rem; color: var(--ink-mute); font-family: var(--mono); font-size: 0.61rem; letter-spacing: 0.12em; text-transform: uppercase; }
body.ed .process-instrument { position: relative; display: grid; width: clamp(10rem, 16vw, 14rem); aspect-ratio: 1; place-items: center; border: 1px solid var(--line); border-radius: 50%; }
body.ed .process-instrument::before,
body.ed .process-instrument::after { content: ''; position: absolute; border: 1px solid var(--line); border-radius: 50%; }
body.ed .process-instrument::before { inset: 16%; }
body.ed .process-instrument::after { inset: 32%; }
body.ed .process-instrument__orbit { position: absolute; inset: -1px; border: 1px solid transparent; border-top-color: var(--accent); border-radius: 50%; transform: rotate(45deg); }
body.ed .process-instrument__needle { position: absolute; top: 50%; left: 50%; width: 42%; height: 1px; background: var(--accent); transform: rotate(-90deg); transform-origin: left; }
body.ed .process-instrument strong { font-family: var(--serif); font-size: 2.4rem; font-weight: 350; }
body.ed .process-instrument small { position: absolute; right: 18%; bottom: 22%; font-family: var(--mono); font-size: 0.56rem; color: var(--ink-mute); }

/* ---------- 05 / blueprint to image ---------- */
body.ed .concept-reveal { padding: clamp(6rem, 11vw, 9rem) 0; background: var(--surface); }
body.ed .concept-reveal__stage { position: relative; min-height: 100svh; overflow: hidden; }
body.ed .concept-reveal__media { position: relative; width: min(70rem, 90%); margin: 0 auto 3rem; aspect-ratio: 16 / 9; overflow: hidden; background: #d8cfbe; }
body.ed .concept-reveal__media > img,
body.ed .concept-reveal__render,
body.ed .concept-reveal__render img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.ed .concept-reveal__blueprint { filter: sepia(0.48) saturate(0.55) contrast(1.03); }
body.ed .concept-reveal__render { clip-path: inset(0 50% 0 0); }
body.ed .concept-reveal__render img { filter: sepia(0.14) saturate(0.86) contrast(1.04); }
body.ed .concept-reveal__divider { position: absolute; top: 0; bottom: 0; left: 50%; z-index: 3; width: 1px; background: rgba(243,239,230,0.88); box-shadow: 0 0 0 1px rgba(24,19,13,0.08); }
body.ed .concept-reveal__divider::before { content: ''; position: absolute; top: 50%; left: 50%; width: 0.7rem; height: 0.7rem; border: 1px solid var(--canvas); border-radius: 50%; background: var(--accent); transform: translate(-50%, -50%); }
body.ed .concept-reveal__label { position: absolute; bottom: 1rem; z-index: 4; padding: 0.4rem 0.6rem; background: rgba(24,19,13,0.62); color: rgba(255,255,255,0.84); }
body.ed .concept-reveal__label--left { left: 1rem; }
body.ed .concept-reveal__label--right { right: 1rem; }
body.ed .concept-reveal__copy { position: relative; z-index: 5; display: grid; gap: 1.5rem; }
body.ed .concept-reveal__copy > p:not(.ed-meta):not(.ed-chip) { max-width: 42rem; font-size: 1.05rem; line-height: 1.7; }
body.ed.has-spatial-motion .concept-reveal { height: 240svh; padding: 0; }
body.ed.has-spatial-motion .concept-reveal__stage { position: sticky; top: 0; height: 100svh; }
body.ed.has-spatial-motion .concept-reveal__media { position: absolute; top: 14vh; left: 4vw; width: 64vw; height: 72vh; margin: 0; aspect-ratio: auto; }
body.ed.has-spatial-motion .concept-reveal__copy { position: absolute; top: 50%; right: 5vw; width: min(35vw, 32rem); padding: clamp(1.5rem, 3vw, 3rem); background: rgba(243,239,230,0.91); box-shadow: 0 1.5rem 5rem rgba(24,19,13,0.12); transform: translateY(-50%); backdrop-filter: blur(15px); }

/* ---------- 06 / panel reaches the visitor ---------- */
body.ed .arrival-cta { padding: clamp(3rem, 7vw, 6rem); background: var(--canvas); }
body.ed .arrival-cta__panel { position: relative; display: flex; min-height: 90svh; align-items: center; overflow: hidden; border-radius: clamp(1.5rem, 3vw, 3rem); background: var(--ink); color: var(--canvas); transform-origin: center; }
body.ed .arrival-cta__content { position: relative; z-index: 2; }
body.ed .arrival-cta .ed-meta { margin-bottom: clamp(2.5rem, 6vh, 5rem); color: rgba(243,239,230,0.54); }
body.ed .arrival-cta .ed-meta > span:first-child { color: #ce8a5e; }
body.ed .arrival-cta__title { max-width: 13ch; margin: 0; color: var(--canvas); font-size: clamp(3.8rem, 9vw, 9rem); font-weight: 350; letter-spacing: -0.052em; line-height: 0.9; }
body.ed .arrival-cta__lower { display: grid; grid-template-columns: minmax(0, 38rem) auto; gap: 3rem; align-items: end; margin-top: clamp(3rem, 8vh, 7rem); }
body.ed .arrival-cta__lower p { color: rgba(243,239,230,0.65); font-size: 1.1rem; line-height: 1.7; }
body.ed .arrival-cta .btn--primary { border-color: var(--canvas); background: var(--canvas); color: var(--ink); }
body.ed .arrival-cta .btn--primary:hover { border-color: #ce8a5e; background: #ce8a5e; color: var(--ink); }
body.ed .arrival-cta .btn--light { border-color: rgba(243,239,230,0.38); color: var(--canvas); }
body.ed .arrival-cta .btn--light:hover { border-color: var(--canvas); color: var(--canvas); }
body.ed .arrival-cta__rings { position: absolute; top: 50%; right: -12vw; width: min(62vw, 850px); aspect-ratio: 1; transform: translateY(-50%); }
body.ed .arrival-cta__rings span { position: absolute; border: 1px solid rgba(243,239,230,0.09); border-radius: 50%; }
body.ed .arrival-cta__rings span:nth-child(1) { inset: 0; }
body.ed .arrival-cta__rings span:nth-child(2) { inset: 18%; }
body.ed .arrival-cta__rings span:nth-child(3) { inset: 36%; border-color: rgba(206,138,94,0.24); }

/* ---------- Footer ---------- */
body.ed .footer { border-top: 1px solid var(--line); background: var(--surface); color: var(--ink-soft); }
body.ed .footer h3 { color: var(--ink); }
body.ed .footer h4 { color: var(--ink-mute); font-family: var(--mono); }
body.ed .footer a { color: var(--ink-soft); }
body.ed .footer a:hover { color: var(--accent); }
body.ed .footer__bottom { border-top-color: var(--line); color: var(--ink-mute); }

/* ---------- Responsive / non-pinned experience ---------- */
@media (max-width: 1023px) {
  body.ed .journey-rail { display: none; }
  body.ed .arrival-hero__visual { right: -8vw; width: 66vw; opacity: 0.82; }
  body.ed .arrival-hero__title { font-size: clamp(4rem, 12vw, 8rem); }
  body.ed .arrival-hero__lower { grid-template-columns: minmax(0, 34rem); }
  body.ed .arrival-hero__coordinates { display: none; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story { height: auto; padding: clamp(6rem,12vw,10rem) 0; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__stage { position: relative; height: auto; overflow: visible; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__visual,
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__meta,
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__beats,
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__footer { position: relative; inset: auto; width: auto; transform: none; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__visual { width: min(62rem,88%); height: auto; margin: 0 auto 4rem; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__visual img { height: auto; aspect-ratio: 16/9; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__visual .ed-caption { position: relative; inset: auto; margin-top: 0.6rem; color: var(--ink-mute); }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__beats { display: grid; gap: 4rem; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-beat { position: relative; opacity: 1; transform: none; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .land-story__footer { margin-top: 3rem; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .style-journey__viewport { overflow-x: auto; overflow-y: hidden; }
  body.ed .style-journey__heading { display: grid; }
  body.ed .style-card { flex-basis: 86vw; grid-template-columns: 1.2fr 0.8fr; }
  body.ed .process-story__anchor { grid-column: 1 / 7; }
  body.ed .process-story__steps { grid-column: 7 / 13; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal { height: auto; padding: clamp(6rem,11vw,9rem) 0; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal__stage { position: relative; height: auto; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal__media,
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal__copy { position: relative; inset: auto; width: min(70rem,90%); height: auto; margin: 0 auto 3rem; transform: none; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal__media { aspect-ratio: 16/9; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .concept-reveal__copy { padding: 0; background: none; box-shadow: none; backdrop-filter: none; }
}

@media (max-width: 720px) {
  body.ed .arrival-hero__content { padding-top: 7rem; }
  body.ed .arrival-hero__visual { top: 29vh; right: -20vw; width: 108vw; height: 46vh; opacity: 0.64; }
  body.ed .arrival-hero__title { margin-top: 2.5rem; font-size: clamp(3.5rem, 17vw, 6.2rem); line-height: 0.86; }
  body.ed .arrival-hero__line--offset { padding-left: 0.7em; }
  body.ed .arrival-hero__lower { margin-top: auto; }
  body.ed .arrival-hero__copy { padding: 1rem 0; background: linear-gradient(90deg, var(--canvas) 70%, transparent); }
  body.ed .arrival-hero__scroll { right: 1.25rem; bottom: 1rem; }
  body.ed .arrival-hero__scroll span { display: none; }
  body.ed .land-story__content { padding-inline: 1.25rem; }
  body.ed .land-story__footer { align-items: flex-start; flex-direction: column; }
  body.ed .style-journey__heading { margin-bottom: 2.5rem; }
  body.ed .style-card { flex-basis: 88vw; min-height: 72vh; grid-template-columns: 1fr; grid-template-rows: 45% 55%; }
  body.ed .style-card__body { padding: 1.5rem; }
  body.ed .style-card__number { margin-bottom: 0; }
  body.ed .style-card h3 { margin: 1rem 0 0.75rem; }
  body.ed .style-card__action { margin-top: auto; padding-top: 1rem; }
  body.ed .style-card__note { display: none; }
  body.ed .style-journey__footer .ed-meta { display: none; }
  body.ed .process-story__layout { display: block; }
  body.ed .process-story__anchor { position: relative; top: auto; margin-bottom: 4rem; }
  body.ed .process-instrument { width: 9rem; }
  body.ed .process-card { min-height: 54vh; grid-template-columns: 2.5rem 1fr; }
  body.ed.has-spatial-motion:not(.has-handheld-motion) .process-card { opacity: 1; transform: none; }
  body.ed .concept-reveal__media { width: calc(100% - 2.5rem); }
  body.ed .concept-reveal__copy { width: auto; }
  body.ed .arrival-cta { padding: 1rem; }
  body.ed .arrival-cta__panel { min-height: 86svh; border-radius: 1.25rem; }
  body.ed .arrival-cta__title { font-size: clamp(3.3rem, 15vw, 6rem); }
  body.ed .arrival-cta__lower { grid-template-columns: 1fr; gap: 2rem; }
  body.ed .arrival-cta__rings { right: -55vw; width: 125vw; }
}

@media (prefers-reduced-motion: reduce) {
  body.ed .arrival-hero__scroll i::after { animation: none; transform: none; }
  body.ed .style-card,
  body.ed .style-card__media img,
  body.ed .ed-link span,
  body.ed .btn { transition: none; transform: none !important; }
  body.ed .process-card { opacity: 1 !important; transform: none !important; }
  body.ed .concept-reveal__render { clip-path: inset(0 50% 0 0); }
}

/* =========================================================
   SEAMLESS JOURNEY POLISH
   Chapter boundaries dissolve into the next material rather
   than ending as rectangles. Motion content remains above the
   photographic fade and exits before darker handoffs arrive.
   ========================================================= */
body.ed {
  --next-section-bg: #e9e1d2;
  --journey-paper: #f3efe6;
  --journey-surface: #e9e1d2;
  --journey-dark: #18130d;
  --journey-seam: clamp(10rem, 20vw, 17.5rem);
}

body.ed .journey-section { isolation: isolate; }
body.ed .journey-section::after { pointer-events: none; }

/* The image plane becomes full-bleed during the pin. Its lower edge
   then disappears into exactly the same paper used by #place. */
body.ed .arrival-hero {
  position: relative;
  overflow: hidden;
  --next-section-bg: var(--journey-surface);
}
body.ed .arrival-hero::after {
  content: '';
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: -1px;
  left: 0;
  height: clamp(10rem, 20vw, 17.5rem);
  background: linear-gradient(
    to bottom,
    rgba(233, 225, 210, 0) 0%,
    rgba(233, 225, 210, 0.18) 34%,
    var(--next-section-bg) 100%
  );
}
body.ed .arrival-hero__stage {
  --hero-veil-opacity: 1;
  position: relative;
  overflow: hidden;
}
body.ed .arrival-hero__stage::before {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  opacity: var(--hero-veil-opacity);
  background:
    linear-gradient(90deg, rgba(243,239,230,0.96) 0%, rgba(243,239,230,0.76) 31%, rgba(243,239,230,0.18) 58%, transparent 78%),
    linear-gradient(0deg, rgba(243,239,230,0.84) 0%, transparent 34%);
}
body.ed .arrival-hero__content,
body.ed .arrival-hero__title,
body.ed .arrival-hero__copy,
body.ed .arrival-hero__meta,
body.ed .arrival-hero__scroll { position: relative; z-index: 4; }
body.ed .arrival-hero__visual { transform-origin: 50% 50%; }

/* Every paper change is a long tonal interpolation. The first and
   last colors exactly match the adjoining chapter backgrounds. */
body.ed .land-story { position: relative; background: var(--next-section-bg); }
body.ed .land-story::after {
  content: '';
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -1px;
  left: 0;
  height: var(--journey-seam);
  background: linear-gradient(to bottom, rgba(24,19,13,0) 0%, rgba(24,19,13,0.14) 42%, var(--journey-dark) 100%);
}
body.ed .land-story__stage { z-index: 1; }
body.ed .style-journey { position: relative; }
body.ed .style-journey::after {
  content: '';
  display: none;
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -1px;
  left: 0;
  height: var(--journey-seam);
  background: linear-gradient(to bottom, rgba(243,239,230,0) 0%, rgba(243,239,230,0.12) 44%, var(--journey-paper) 100%);
}
body.ed .style-journey__stage { position: relative; z-index: 1; }
body.ed .process-story { position: relative; }
body.ed .process-story::before {
  content: '';
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  left: 0;
  height: clamp(5rem, 10vw, 8rem);
  pointer-events: none;
  background: linear-gradient(to bottom, var(--journey-dark) 0%, var(--journey-paper) 100%);
}
body.ed .process-story::after {
  content: '';
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -1px;
  left: 0;
  height: var(--journey-seam);
  background: linear-gradient(to bottom, rgba(233,225,210,0) 0%, rgba(233,225,210,0.18) 42%, var(--journey-surface) 100%);
}
body.ed .process-story__layout { position: relative; z-index: 1; }
body.ed .concept-reveal { position: relative; }
body.ed .concept-reveal::after {
  content: '';
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -1px;
  left: 0;
  height: var(--journey-seam);
  background: linear-gradient(to bottom, rgba(243,239,230,0) 0%, rgba(243,239,230,0.16) 42%, var(--journey-paper) 100%);
}
body.ed .concept-reveal__stage { z-index: 1; }
body.ed .arrival-cta { position: relative; }
body.ed .arrival-cta::after {
  content: '';
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -1px;
  left: 0;
  height: clamp(7rem, 14vw, 12rem);
  background: linear-gradient(to bottom, rgba(233,225,210,0) 0%, var(--journey-surface) 100%);
}
body.ed .arrival-cta__panel { z-index: 1; }

/* A fixed beat height prevents crossfade reflow; the moving drawing is
   kept outside the copy column so no contrast overlay is required. */
body.ed.has-spatial-motion .land-story__beats { min-height: clamp(20rem, 42vh, 25rem); }
body.ed.has-spatial-motion .land-beat { width: 100%; }

/* The horizontal chapter is a viewport composition, not a tall card
   overflowing beneath the fold. */
@media (min-width: 1024px) and (min-height: 760px) {
  body.ed.has-spatial-motion .land-story::after,
  body.ed.has-spatial-motion .concept-reveal::after { z-index: 6; }
  body.ed.has-spatial-motion .style-journey::after { display: block; z-index: 6; }
  body.ed.has-spatial-motion .process-story::before { display: none; }

  body.ed .style-journey__stage {
    display: grid;
    height: 100svh;
    min-height: 100svh;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: clamp(1.25rem, 2.6vh, 2rem);
    padding: clamp(6.25rem, 10vh, 7.5rem) 0 clamp(1.5rem, 3vh, 2.25rem);
  }
  body.ed .style-journey__heading { margin-bottom: 0; }
  body.ed .style-journey__viewport { min-height: 0; height: 100%; }
  body.ed .style-journey__track { height: 100%; align-items: stretch; }
  body.ed .style-card { min-height: 0; height: 100%; }
  body.ed .style-journey__footer { margin-top: 0; }
}

body.ed .process-card {
  position: relative;
  min-height: clamp(30rem, 60svh, 38rem);
  padding-inline: clamp(0.75rem, 1.5vw, 1.5rem);
  isolation: isolate;
}
body.ed .process-card::before {
  content: '';
  position: absolute;
  z-index: 0;
  inset: 8% -1rem;
  opacity: 0;
  background: linear-gradient(90deg, rgba(233,225,210,0.76) 0%, rgba(233,225,210,0.34) 66%, rgba(233,225,210,0) 100%);
  transform: scaleX(0.92);
  transform-origin: left;
  transition: opacity 0.55s var(--ease), transform 0.7s var(--ease);
}
body.ed .process-card > * { position: relative; z-index: 1; }
@media (min-width: 1024px) and (min-height: 760px) {
  body.ed.has-spatial-motion .process-card { opacity: 0.14; transform: translate3d(0, 3.5rem, -80px) scale(0.95); }
  body.ed.has-spatial-motion .process-card.is-active { opacity: 1; transform: none; }
  body.ed.has-spatial-motion .process-card.is-active::before { opacity: 1; transform: scaleX(1); }

  body.ed.has-spatial-motion .concept-reveal__copy {
    border: 1px solid rgba(24,19,13,0.1);
    background: linear-gradient(135deg, rgba(243,239,230,0.97), rgba(233,225,210,0.9));
    box-shadow: 0 1.5rem 5rem rgba(24,19,13,0.14);
  }
}

body.ed.journey-on-dark .journey-rail::before { background: rgba(243,239,230,0.24); }
body.ed.journey-on-dark .journey-rail a { background: rgba(24,19,13,0.82); color: rgba(243,239,230,0.62); }
body.ed.journey-on-dark .journey-rail a:hover,
body.ed.journey-on-dark .journey-rail a[aria-current='step'] { border-color: #ce8a5e; color: #f3efe6; }

@media (min-width: 1024px) and (max-height: 860px) {
  body.ed .style-journey__stage { padding-top: 5.8rem; gap: 1rem; }
  body.ed .style-journey__heading .ed-h2 { font-size: clamp(2.5rem, 4.2vw, 4rem); }
  body.ed .style-card__body { padding: clamp(1.5rem, 2.6vw, 2.5rem); }
  body.ed .style-card h3 { margin: 1rem 0 0.75rem; font-size: clamp(2rem, 3.3vw, 3.3rem); }
  body.ed .style-card p { font-size: 0.92rem; line-height: 1.55; }
  body.ed .style-card__action { padding-top: 1rem; }
}

/* Short landscape viewports receive the complete, non-pinned flow.
   This avoids compressing content into an unreadable cinematic frame. */
@media (min-width: 1024px) and (max-height: 759px) {
  body.ed .journey-rail { display: none; }
  body.ed.has-spatial-motion .land-story { height: auto; padding: clamp(6rem,12vw,10rem) 0; }
  body.ed.has-spatial-motion .land-story__stage { position: relative; height: auto; overflow: visible; }
  body.ed.has-spatial-motion .land-story__visual,
  body.ed.has-spatial-motion .land-story__meta,
  body.ed.has-spatial-motion .land-story__beats,
  body.ed.has-spatial-motion .land-story__footer { position: relative; inset: auto; width: auto; transform: none; }
  body.ed.has-spatial-motion .land-story__visual { width: min(62rem,88%); height: auto; margin: 0 auto 4rem; }
  body.ed.has-spatial-motion .land-story__visual img { height: auto; aspect-ratio: 16/9; }
  body.ed.has-spatial-motion .land-story__visual .ed-caption { position: relative; inset: auto; margin-top: 0.6rem; color: var(--ink-mute); }
  body.ed.has-spatial-motion .land-story__beats { display: grid; gap: 4rem; min-height: 0; }
  body.ed.has-spatial-motion .land-beat { position: relative; opacity: 1; transform: none; }
  body.ed.has-spatial-motion .land-story__footer { margin-top: 3rem; }
  body.ed.has-spatial-motion .style-journey__viewport { overflow-x: auto; overflow-y: hidden; }
  body.ed.has-spatial-motion .concept-reveal { height: auto; padding: clamp(6rem,11vw,9rem) 0; }
  body.ed.has-spatial-motion .concept-reveal__stage { position: relative; height: auto; }
  body.ed.has-spatial-motion .concept-reveal__media,
  body.ed.has-spatial-motion .concept-reveal__copy { position: relative; inset: auto; width: min(70rem,90%); height: auto; margin: 0 auto 3rem; transform: none; }
  body.ed.has-spatial-motion .concept-reveal__media { aspect-ratio: 16/9; }
  body.ed.has-spatial-motion .concept-reveal__copy { padding: 0; border: 0; background: none; box-shadow: none; backdrop-filter: none; }
}

@media (max-width: 720px) {
  body.ed { --journey-seam: clamp(8rem, 34vw, 12rem); }
  body.ed .arrival-hero::after { height: clamp(10rem, 42vw, 15rem); }
  body.ed .arrival-hero__stage::before {
    background: linear-gradient(0deg, rgba(243,239,230,0.96) 0%, rgba(243,239,230,0.62) 38%, transparent 72%);
  }
  body.ed .process-card { min-height: 52vh; padding-inline: 0; }
  body.ed .process-card::before { inset-inline: -0.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  body.ed .journey-rail { display: none; }
  body.ed .arrival-hero__stage { --hero-veil-opacity: 0.86; }
  body.ed .land-story::after,
  body.ed .style-journey::after,
  body.ed .concept-reveal::after { z-index: 0 !important; }
}

/* Audit-verified desktop refinements: constrain the pinned gallery to
   viewport width, keep image and copy separated, and begin the final
   dark plane while the concept paper remains visible. */
@media (min-width: 1024px) and (min-height: 760px) {
  body.ed .style-journey__stage {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
  }
  body.ed .style-journey__viewport {
    width: 100%;
    min-width: 0;
  }
  body.ed.has-spatial-motion .land-story__visual { width: min(55vw, 880px); }
  body.ed .arrival-cta { padding-top: 0; }
}

/* =========================================================
   HANDHELD SPATIAL MOTION
   Touch devices (coarse pointer, up to 1023px, usable height)
   run the same six pinned chapters as desktop, driven by a
   native vertical swipe. Everything here is additive: the
   unpinned mobile layout above remains the no-motion and
   compact fallback, and desktop rules are untouched.
   ========================================================= */
@media (max-width: 1023px) {
  /* 01 / arrival: the hero pin reuses the desktop scene; the stage is
     already 100svh and the veil variable is shared. */
  body.ed.has-handheld-motion .arrival-hero__stage { min-height: 100svh; }

  /* 02 / land story, pinned: image plane above, beats crossfading below */
  body.ed.has-handheld-motion .land-story { height: 320svh; padding: 0; }
  body.ed.has-handheld-motion .land-story__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; }
  body.ed.has-handheld-motion .land-story__visual { position: absolute; top: 13vh; left: 5vw; width: 90vw; height: 36vh; margin: 0; }
  body.ed.has-handheld-motion .land-story__visual img { height: 100%; aspect-ratio: auto; }
  body.ed.has-handheld-motion .land-story__visual .ed-caption { position: absolute; bottom: 1rem; left: 1rem; margin: 0; color: rgba(255,255,255,0.78); }
  body.ed.has-handheld-motion .land-story__aperture { inset: 0; }
  body.ed.has-handheld-motion .land-story__content { position: relative; height: 100%; padding-inline: 0; }
  body.ed.has-handheld-motion .land-story__meta { position: absolute; top: 7vh; right: 5vw; left: 5vw; width: auto; margin: 0; }
  body.ed.has-handheld-motion .land-story__beats { position: absolute; top: 56vh; right: 5vw; left: 5vw; width: auto; min-height: 30vh; transform: none; }
  body.ed.has-handheld-motion .land-beat { position: absolute; inset: 0 auto auto 0; width: 100%; max-width: none; opacity: 0; transform: translate3d(0, 3rem, -80px) scale(0.94); pointer-events: none; }
  body.ed.has-handheld-motion .land-beat:first-child { opacity: 1; transform: none; }
  body.ed.has-handheld-motion .land-beat h2 { font-size: clamp(2.3rem, 10.5vw, 3.4rem); }
  body.ed.has-handheld-motion .land-beat p { font-size: 0.98rem; line-height: 1.6; }
  body.ed.has-handheld-motion .land-story__footer { position: absolute; right: 5vw; bottom: 5vh; left: 5vw; width: auto; margin: 0; flex-direction: row; align-items: center; justify-content: space-between; }

  /* 03 / vocabularies, pinned: vertical thumb-swipe carries the
     gallery sideways, mirroring the desktop wheel experience. */
  body.ed.has-handheld-motion .style-journey__stage { display: grid; height: 100svh; min-height: 100svh; grid-template-rows: auto minmax(0, 1fr) auto; gap: 1rem; padding: 5.5rem 0 1.25rem; }
  body.ed.has-handheld-motion .style-journey__heading { margin-bottom: 0; }
  body.ed.has-handheld-motion .style-journey__heading .ed-h2 { font-size: clamp(2rem, 7.5vw, 3.2rem); }
  body.ed.has-handheld-motion .style-journey__viewport { overflow: visible; scroll-snap-type: none; min-height: 0; height: 100%; }
  body.ed.has-handheld-motion .style-journey__track { height: 100%; align-items: stretch; will-change: transform; }
  body.ed.has-handheld-motion .style-card { height: 100%; min-height: 0; }
  body.ed.has-handheld-motion .style-card h3 { font-size: clamp(1.9rem, 6vw, 2.6rem); }
  body.ed.has-handheld-motion .style-journey__footer { margin-top: 0; }

  /* 04 / process: cards dim and advance with the instrument, as on
     desktop, plus the active highlight that was desktop-only. */
  body.ed.has-handheld-motion .process-card.is-active::before { opacity: 1; transform: scaleX(1); }

  /* 05 / concept reveal, pinned: drawing wipes into render above,
     copy docks beneath as a paper card. */
  body.ed.has-handheld-motion .concept-reveal { height: 260svh; padding: 0; }
  body.ed.has-handheld-motion .concept-reveal__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; }
  body.ed.has-handheld-motion .concept-reveal__media { position: absolute; top: 9vh; left: 5vw; width: 90vw; height: 40vh; margin: 0; aspect-ratio: auto; }
  body.ed.has-handheld-motion .concept-reveal__copy { position: absolute; top: 55vh; right: 5vw; left: 5vw; width: auto; margin: 0; padding: 1.25rem 1.25rem 1.5rem; border: 1px solid rgba(24,19,13,0.1); background: linear-gradient(135deg, rgba(243,239,230,0.97), rgba(233,225,210,0.94)); box-shadow: 0 1.5rem 4rem rgba(24,19,13,0.12); transform: none; }
  body.ed.has-handheld-motion .concept-reveal__copy .ed-h2 { font-size: clamp(1.9rem, 7.2vw, 2.6rem); }
  body.ed.has-handheld-motion .concept-reveal__copy > p:not(.ed-meta):not(.ed-chip) { font-size: 0.95rem; line-height: 1.6; }

  /* Touch language: press states mirror the desktop hover language
     (magnetic buttons and card tilt remain fine-pointer only). */
  body.ed.has-handheld-motion .style-card:active .style-card__media img { transform: scale(1.05); filter: sepia(0.08) saturate(0.94) brightness(0.98); }
  body.ed.has-handheld-motion .btn { transition: transform 0.3s var(--ease); }
  body.ed.has-handheld-motion .btn:active { transform: scale(0.94); }
  body.ed.has-handheld-motion .ed-link:active { color: var(--accent); }
  body.ed.has-handheld-motion .ed-link:active span { transform: translateX(0.35rem); }
}

/* Shorter phone screens keep the pinned chapters readable without
   compressing them into an unreadable frame. */
@media (max-width: 1023px) and (max-height: 700px) {
  body.ed.has-handheld-motion .land-story__visual { top: 11vh; height: 32vh; }
  body.ed.has-handheld-motion .land-story__beats { top: 50vh; }
  body.ed.has-handheld-motion .land-beat h2 { font-size: clamp(2rem, 9vw, 2.6rem); }
  body.ed.has-handheld-motion .land-beat p { font-size: 0.9rem; }
  body.ed.has-handheld-motion .concept-reveal__media { top: 7vh; height: 36vh; }
  body.ed.has-handheld-motion .concept-reveal__copy { top: 48vh; padding: 1rem 1rem 1.25rem; }
  body.ed.has-handheld-motion .concept-reveal__copy .ed-h2 { font-size: clamp(1.7rem, 6.5vw, 2.2rem); }
  body.ed.has-handheld-motion .concept-reveal__copy > p:not(.ed-meta):not(.ed-chip) { font-size: 0.88rem; line-height: 1.55; }
}