:root {
  --paper: #f1f1ed;
  --ink: #0b0b0b;
  --muted: #989891;
  --line: rgba(11,11,11,.2);
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--paper); }
button, a { color: inherit; font: inherit; }
button { border: 0; padding: 0; background: none; }
a { text-decoration: none; }

.topbar {
  position: fixed;
  z-index: 30;
  top: 0;
  left: 0;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 2rem;
  align-items: center;
  padding: 1.15rem 1.25rem;
  color: #fff;
  font-size: .78rem;
  line-height: 1.05;
  mix-blend-mode: normal;
  text-shadow: 0 1px 5px rgba(0,0,0,.35);
}
.identity { display: block; width: max-content; }
.identity img { display: block; width: clamp(6.8rem, 8.5vw, 8.6rem); height: auto; filter: drop-shadow(0 1px 4px rgba(0,0,0,.25)); }
.view-controls { display: flex; gap: .35rem; }
.view-button, .filter { cursor: pointer; opacity: .85; transition: opacity .25s ease; }
.view-button:hover, .view-button:focus-visible, .view-button.is-active, .filter:hover, .filter:focus-visible, .filter.is-active { opacity: 1; }
nav { display: grid; justify-items: start; gap: .1rem; text-transform: uppercase; }
nav sup { font-size: .55rem; margin-left: .2rem; }
.utility { display: flex; gap: 1.4rem; justify-self: end; }

.timeline-view { position: relative; background: var(--paper); }
.timeline-intro {
  position: sticky;
  top: 0;
  isolation: isolate;
  min-height: 100svh;
  height: 100svh;
  overflow: hidden;
  background: var(--paper);
}
.hero-reel { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: calc(1 - var(--timeline-dim, 0)); }
.hero-shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.08) 35%, rgba(0,0,0,.62) 100%); opacity: calc(1 - var(--timeline-dim, 0)); }
.hero-copy { position: absolute; left: 50%; bottom: calc(min(15vw, 14rem) * .65 + 2.5rem); width: min(92vw, 78rem); color: #fff; opacity: calc(1 - var(--timeline-dim, 0)); text-align: center; transform: translate3d(-50%, var(--hero-lift, 0px), 0); }
.timeline-intro h1 { margin: 0; font-size: clamp(3.1rem, 6.3vw, 7.5rem); line-height: .86; letter-spacing: -.075em; font-weight: 500; white-space: nowrap; animation: hero-title-in .9s cubic-bezier(.16,1,.3,1) both; }
.timeline-intro h1 em { display: inline-block; font-family: Georgia, "Times New Roman", serif; font-weight: 400; animation: hero-accent-in .9s .14s cubic-bezier(.16,1,.3,1) both; }
.hero-title-data, .hero-title-foot { display: flex; align-items: center; gap: 1.35rem; color: rgba(255,255,255,.68); font-size: .56rem; line-height: 1.2; letter-spacing: .08em; text-transform: uppercase; font-variant-numeric: tabular-nums; }
.hero-title-data { position: relative; width: max-content; margin: 0 auto 1.05rem; padding-top: .7rem; }
.hero-title-data::before { content: ""; position: absolute; top: 0; left: 50%; width: 2.2rem; height: 1px; background: currentColor; opacity: .75; transform: translateX(-50%); }
.hero-title-data.is-cut::before { animation: data-cut .48s cubic-bezier(.16,1,.3,1); }
.hero-title-foot { justify-content: center; margin-top: 1.15rem; }
.hero-title-data p, .hero-title-foot p { display: flex; gap: .45rem; margin: 0; white-space: nowrap; }
.hero-title-data p span, .hero-title-foot p span { opacity: .48; }
.hero-title-data b, .hero-title-foot b { font: inherit; font-weight: 400; }
.reel-time { min-width: 5.7rem; }
.hero-work-menu { position: absolute; z-index: 4; left: 50%; bottom: calc(min(15vw, 14rem) * -.35); width: min(62vw, 52rem); color: #fff; opacity: calc(1 - var(--timeline-dim, 0)); transform: translateX(-50%); }
.hero-menu-title { visibility: hidden; height: 0; }
.timeline-intro h1 { display: flex; justify-content: center; gap: .22em; }
.timeline-intro h1 .hero-changing-word { flex: 0 0 auto; text-align: left; animation: none; transition: none; }
.hero-changing-word { white-space: pre; }
.hero-word-letter { display: inline-block; }
.hero-title-foot .hero-shot { min-width: 4em; }
.hero-title-foot .hero-motion { min-width: 7em; }
.hero-menu-title { display: block; width: max-content; max-width: 90%; margin: 0 auto .55rem; font-size: clamp(1.15rem, 1.7vw, 1.8rem); line-height: .9; letter-spacing: -.055em; }
.hero-menu-deck { position: relative; height: min(15vw, 14rem); perspective: 1200px; transform-style: preserve-3d; }
.hero-menu-card { position: absolute; top: 50%; display: block; overflow: hidden; aspect-ratio: 21 / 9; background: rgba(255,255,255,.12); box-shadow: 0 .8rem 2rem rgba(0,0,0,.2); transform-style: preserve-3d; transition: transform .55s cubic-bezier(.16,1,.3,1), filter .45s ease, opacity .45s ease; }
.hero-menu-card img, .hero-menu-card video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-menu-card.is-center { z-index: 8; left: 50%; width: min(34vw, 34rem); transform: translate(-50%, -50%) translateZ(45px); }
.hero-menu-card.is-left, .hero-menu-card.is-right { z-index: 4; width: min(24vw, 24rem); opacity: .82; filter: saturate(.78) brightness(.9); }
.hero-menu-card.is-left { left: 8%; transform: translateY(-50%) translateZ(-55px) rotateY(8deg); transform-origin: right center; }
.hero-menu-card.is-right { right: 8%; transform: translateY(-50%) translateZ(-55px) rotateY(-8deg); transform-origin: left center; }
.hero-menu-card.is-far-left, .hero-menu-card.is-far-right { z-index: 1; width: min(17vw, 17rem); opacity: .62; filter: blur(.45px) saturate(.65) brightness(.84); }
.hero-menu-card.is-far-left { left: 0; transform: translateY(-50%) translateZ(-130px) rotateY(13deg); transform-origin: right center; }
.hero-menu-card.is-far-right { right: 0; transform: translateY(-50%) translateZ(-130px) rotateY(-13deg); transform-origin: left center; }
.hero-menu-card:hover, .hero-menu-card:focus-visible { z-index: 20; opacity: 1; filter: none; outline: none; transform: translateY(-50%) translateZ(150px) rotateY(0) scale(1.04); }
.hero-menu-card.is-center:hover, .hero-menu-card.is-center:focus-visible { transform: translate(-50%, -50%) translateZ(150px) scale(1.025); }
.scroll-note { margin: 0; color: #fff; font-size: .58rem; line-height: 1.15; text-transform: uppercase; letter-spacing: .06em; }
.scroll-note { position: absolute; left: 50%; bottom: .9rem; opacity: calc(1 - var(--timeline-dim, 0)); transform: translateX(-50%); white-space: nowrap; }
.hero-reel, .hero-shade, .hero-copy, .hero-work-menu, .scroll-note { transition: opacity .12s linear; }
.hero-copy { margin-bottom: -50px; opacity: calc((1 - var(--timeline-dim, 0)) * var(--word-opacity, 1)); transition: none; }
.timeline-intro h1 { color: rgba(255,255,255,.88); }

.projects { position: relative; z-index: 4; margin-top: 0; padding: 0 4vw 10rem; color: var(--ink); }
.timeline-rail { position: absolute; z-index: 3; left: 50%; top: 100svh; bottom: 2rem; width: 1px; background: var(--line); pointer-events: none; transform: rotate(-1.2deg); transform-origin: top; }
.timeline-rail i { display: block; width: 1px; height: 100%; background: var(--ink); transform: scaleY(0); transform-origin: top; }

.project-step {
  --scale: .94;
  --shift: 0px;
  --wave-x: 0px;
  --track-x: 0px;
  --rise: 0px;
  --tilt: 0deg;
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: clamp(6.8rem, 12svh, 9rem);
  opacity: .42;
  transition: opacity .65s ease;
}
.project-step.is-active { opacity: 1; }
.project-step.is-hidden { display: none; }
.project-deck {
  position: relative;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 100vw;
  height: min(37vw, 34rem);
  perspective: 1900px;
  transform-style: flat;
  isolation: isolate;
  overflow: visible;
  transform: translate3d(calc(var(--track-x) + var(--wave-x)), var(--rise), 0) scale(var(--scale));
  transition: transform .22s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}
.project-media {
  position: relative;
  z-index: 20;
  display: block;
  width: min(53vw, 72rem);
  height: auto;
  aspect-ratio: 21 / 9;
  overflow: hidden;
  cursor: none;
  background: #d7d7d2;
  box-shadow: 0 .9rem 1.75rem rgba(20,20,18,.18);
  transform: translateZ(40px);
  transition: transform .6s cubic-bezier(.16,1,.3,1), filter .45s ease, opacity .45s ease;
}
.portrait-project .project-media { width: min(53vw, 72rem); }
.deck-card {
  position: absolute;
  top: 50%;
  overflow: hidden;
  background: #d7d7d2;
  box-shadow: 0 .65rem 1.35rem rgba(20,20,18,.14);
  aspect-ratio: 21 / 9;
  transform-style: preserve-3d;
  pointer-events: auto;
  cursor: none;
  opacity: .9;
  transition: transform .65s cubic-bezier(.16,1,.3,1), filter .5s ease, opacity .5s ease, box-shadow .5s ease;
}
.deck-card img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: blur(.35px) saturate(.76) brightness(.91);
  transform: scale(1.008);
  transition: filter .55s ease, transform .65s cubic-bezier(.16,1,.3,1);
}
.deck-card.is-far-left, .deck-card.is-far-right { opacity: .78; }
.deck-card.is-far-left img, .deck-card.is-far-right img {
  filter: blur(.7px) saturate(.68) brightness(.86);
  transform: scale(1.015);
}
.deck-card.is-far-left { z-index: 1; left: 3.1vw; width: 27vw; transform-origin: right center; transform: translateY(-50%) translateZ(-210px) scale(.9); }
.deck-card.is-left { z-index: 4; left: 13.7vw; width: 38vw; transform-origin: right center; transform: translateY(-50%) translateZ(-95px) scale(.96); }
.deck-card.is-right { z-index: 4; right: 13.7vw; width: 38vw; transform-origin: left center; transform: translateY(-50%) translateZ(-95px) scale(.96); }
.deck-card.is-far-right { z-index: 1; right: 3.1vw; width: 27vw; transform-origin: left center; transform: translateY(-50%) translateZ(-210px) scale(.9); }
@media (hover: hover) and (pointer: fine) {
  .deck-card:hover {
    z-index: 40;
    opacity: 1;
    filter: brightness(1.03) saturate(1.06);
    box-shadow: 0 1.35rem 3rem rgba(20,20,18,.24);
  }
  .deck-card:hover img {
    filter: blur(0) saturate(1) brightness(1);
    transform: scale(1);
  }
.deck-card.is-far-left:hover {
    transform: translate(85px, -50%) translateZ(80px) scale(1.03);
  }
  .deck-card.is-left:hover {
    transform: translateY(-50%) translateZ(240px) scale(1.07);
  }
  .deck-card.is-right:hover {
    transform: translateY(-50%) translateZ(240px) scale(1.07);
  }
.deck-card.is-far-right:hover {
    transform: translate(-85px, -50%) translateZ(80px) scale(1.03);
  }
}
.project-media img, .project-media video {
  width: 100%;
  height: 116%;
  display: block;
  object-fit: cover;
  transform: translate3d(0, var(--shift), 0) scale(1.015);
  filter: saturate(.9);
  transition: filter .55s ease;
  will-change: transform;
}
.project-media:hover img, .project-media:hover video { filter: saturate(1.04); }
.project-copy {
  position: relative;
  z-index: 5;
  top: auto;
  width: min(31rem, 42vw);
  min-height: clamp(8.4rem, 17svh, 11rem);
  margin: 0;
  pointer-events: none;
  transform: none;
  text-align: center;
}
.align-right .project-copy, .align-left .project-copy { left: auto; right: auto; text-align: center; }
.project-copy span, .project-copy p { margin: 0; color: var(--muted); font-size: .62rem; text-transform: uppercase; letter-spacing: .07em; }
.project-copy span { display: block; width: 100%; padding-right: 8%; text-align: right; }
.project-copy h2 { margin: .45rem 0 .65rem; font-size: clamp(2.9rem, 4.15vw, 5.25rem); font-weight: 500; line-height: .77; letter-spacing: -.075em; }
.project-step.is-active .project-copy h2 { animation: title-in .8s cubic-bezier(.16,1,.3,1) both; }

.index-view { min-height: 100svh; padding: 8.5rem 1.25rem 5rem; }
.index-head, .index-row { display: grid; grid-template-columns: 7vw 1fr 22vw 6vw; gap: 1rem; align-items: baseline; width: 100%; text-align: left; }
.index-head { padding-bottom: .75rem; color: var(--muted); font-size: .65rem; text-transform: uppercase; border-bottom: 1px solid var(--ink); }
.index-row { padding: 1.15rem 0; border-bottom: 1px solid var(--line); cursor: pointer; transition: padding .3s ease; }
.index-row strong { font-size: clamp(1.8rem, 4.5vw, 5.5rem); font-weight: 400; letter-spacing: -.06em; }
.index-row span { font-size: .72rem; text-transform: uppercase; }
.index-row:hover, .index-row:focus-visible { color: #5c5c57; }
.index-row.is-hidden { display: none; }

.about { min-height: 100svh; padding: 8rem 4vw 2rem; display: flex; flex-direction: column; justify-content: space-between; background: #0b0b0b; color: var(--paper); }
.kicker { margin: 0; color: #777; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.about-lead { max-width: 14ch; margin: 5rem 0; font-size: clamp(3rem, 7.5vw, 9rem); line-height: .91; letter-spacing: -.07em; }
.about-foot { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 3rem; padding-top: 1rem; border-top: 1px solid #444; }
.about-foot p { width: min(34rem, 100%); margin: 0; color: #aaa; line-height: 1.35; }
.about-foot a { justify-self: end; }
.contact-cta { justify-self: end; align-self: start; margin-right: 5vw; display: block; line-height: 1.35; }
.contact-title { display: inline-block; position: relative; font-size: 1.375rem; }
.contact-title::after { content: ''; position: absolute; left: 0; right: 0; bottom: -.15em; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.contact-cta:hover .contact-title::after, .contact-cta:focus-visible .contact-title::after { transform: scaleX(1); }
.contact-support { display: block; margin-top: .85rem; font-size: .75rem; color: #888; }
.index-preview { position: fixed; z-index: 25; right: 2vw; top: 38vh; bottom: auto; width: 23vw; aspect-ratio: 16 / 9; pointer-events: none; opacity: 0; transition: opacity .3s ease; overflow: hidden; background: #151515; }
.index-preview.is-visible { opacity: 1; }
.index-preview video, .index-preview img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.index-preview [hidden] { display: none; }
@media (max-width: 760px) { .index-preview { display: none; } .contact-cta { justify-self: start; } }
@media (min-width: 1101px) {
  .index-view { padding-right: 28vw; }
  .index-head, .index-row { grid-template-columns: 3vw minmax(0, 1fr) 11vw 4vw; }
  .index-row strong { font-size: clamp(1.8rem, 3.3vw, 5.5rem); }
}
@media (max-width: 1100px) { .index-preview { display: none; } }

.cursor-orb { position: fixed; z-index: 40; left: 0; top: 0; display: grid; place-items: center; width: 5.4rem; height: 5.4rem; border-radius: 50%; background: var(--paper); color: var(--ink); pointer-events: none; opacity: 0; transform: translate(-50%,-50%) scale(.65); transition: opacity .25s ease, transform .25s ease; }
.cursor-orb span { font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; }
.cursor-orb.is-visible { opacity: 1; transform: translate(-50%,-50%) scale(1); }

.viewer { position: fixed; z-index: 60; inset: 0; display: grid; place-items: center; padding: 5rem 4vw 3rem; background: rgba(8,8,8,.97); color: #fff; }
.viewer[hidden], .viewer img[hidden], .viewer video[hidden] { display: none; }
.viewer img, .viewer video { max-width: 90vw; max-height: 80vh; object-fit: contain; }
.viewer-close { position: absolute; top: 1.3rem; right: 1.3rem; color: #fff; cursor: pointer; }
.viewer p { position: absolute; left: 4vw; bottom: 1.6rem; margin: 0; }

@keyframes title-in { from { opacity: 0; transform: translateY(2rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes hero-title-in { from { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(1.5rem); } to { opacity: 1; clip-path: inset(0 0 0 0); transform: translateY(0); } }
@keyframes hero-accent-in { from { opacity: 0; transform: translateY(1.1rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes data-cut { 0%, 100% { width: 2.2rem; } 42% { width: 3.8rem; } }

@media (max-width: 760px) {
  .topbar { position: absolute; grid-template-columns: 1fr auto 1fr; gap: .5rem; padding: 1rem; font-size: .65rem; }
  .topbar .identity img { width: 4.5rem; }
  .utility { gap: .55rem; }
  .identity img { width: 6.5rem; }
  .timeline-intro { min-height: 100svh; padding: 0; }
  .hero-copy { left: 50%; top: auto; bottom: 4.6rem; width: calc(100vw - 2rem); }
  .timeline-intro h1 { max-width: none; font-size: 13vw; white-space: normal; }
  .hero-title-data, .hero-title-foot { gap: .8rem; font-size: .52rem; }
  .hero-title-foot { flex-wrap: wrap; }
  .hero-work-menu { display: none; }
  .hero-copy { bottom: calc(5rem + 30px); }
  .timeline-intro h1 { flex-wrap: wrap; }
  .timeline-intro h1 .hero-changing-word { text-align: center; }
  .timeline-intro h1 { flex-direction: column; align-items: center; gap: .15em; }
  .scroll-note { right: auto; bottom: 1rem; }
  .projects { padding: 2rem 1rem 8rem; }
  .timeline-rail { left: 1rem; }
  .project-step { min-height: 78svh; padding-top: 5rem; }
  .project-deck { width: 100vw; height: 50vw; }
  .project-media, .portrait-project .project-media { width: 78vw; height: auto; aspect-ratio: 21 / 9; margin: 0; cursor: pointer; }
  .deck-card.is-left, .deck-card.is-right { width: 50vw; height: auto; }
  .deck-card.is-left { left: -12vw; transform: translateY(-50%) translateZ(-70px) scale(.9); }
  .deck-card.is-right { right: -12vw; transform: translateY(-50%) translateZ(-70px) scale(.9); }
  .deck-card.is-far-left, .deck-card.is-far-right { display: none; }
  .project-copy { width: 76vw; min-height: 8.7rem; margin: 0; }
  .project-copy h2 { font-size: 12vw; }
  .index-head, .index-row { grid-template-columns: 2rem 1fr auto; }
  .index-head span:nth-child(3), .index-row span:nth-child(3) { display: none; }
  .about { padding: 6rem 1rem 1.2rem; }
  .about-foot { grid-template-columns: 1fr; }
  .about-foot a { justify-self: start; }
  .cursor-orb { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .project-deck, .project-media { transform: none !important; }
  .project-media img, .project-media video { transform: none !important; height: 100%; }
}

/* Keep each exposed card reachable, including its original hover area. */
.deck-card { overflow: visible; }
.deck-card img { clip-path: inset(0); pointer-events: none; }
.deck-card::before { content: ''; position: absolute; inset: 0; }
.deck-card.is-far-left:hover::before { left: -120px; }
.deck-card.is-far-right:hover::before { right: -120px; }
.project-copy { width: min(90vw, 65rem); min-height: 0; margin-bottom: clamp(2rem, 5vh, 4rem); }
.project-copy h2 { white-space: nowrap; line-height: 1.05; margin: 0; }
#project-01 .project-copy h2 { font-size: clamp(1.5rem, 4.15vw, 5.25rem); }
@media (max-width: 760px) {
  .project-copy { width: 94vw; min-height: 0; margin-bottom: 2rem; }
  .project-copy h2 { font-size: clamp(1.7rem, 8vw, 3.7rem); }
}

/* Supporting statement and studio actions, centered on the headline. */
.hero-copy { padding-bottom: 1.822rem; }
.hero-heading-block { position: relative; width: max-content; max-width: 100%; margin-inline: auto; }
.hero-support { position: absolute; top: 100%; left: 50%; width: 760px; max-width: 90vw; margin-top: 24px; transform: translateX(-50%); text-align: center; }
.hero-description { margin: 0; color: rgba(255,255,255,.88); font-size: clamp(1.5625rem, 1.875vw, 1.71875rem); line-height: 1.5; font-weight: 400; letter-spacing: -.01em; text-wrap: balance; }
.hero-actions { display: flex; justify-content: center; align-items: center; gap: 32px; margin-top: 24px; }
.hero-actions a { color: rgba(255,255,255,.9); font-size: .875rem; font-weight: 400; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,.4); transition: color .2s, border-color .2s; }
.hero-actions a:hover, .hero-actions a:focus-visible { color: #fff; border-color: #fff; }
.hero-actions a:focus-visible { outline: 1px solid #fff; outline-offset: 6px; }
@media (max-width: 760px) {
  .hero-copy { bottom: 190px; }
  .hero-support { width: calc(100vw - 2rem); max-width: calc(100vw - 2rem); }
  .hero-description { font-size: 1.40625rem; }
  .hero-actions { gap: 24px; }
  .hero-actions a { font-size: .75rem; letter-spacing: .055em; }
}

/* Reel-linked motion with a stationary supporting block. */
.hero-heading-block { width: 100%; }
.timeline-intro h1 .hero-changing-word { transition: width 650ms cubic-bezier(.22,1,.36,1); }
.hero-word-letter { display: inline-block; }
.hero-actions { gap: 28px; }
.hero-actions a { display: inline-flex; align-items: center; gap: 10px; height: 50px; padding: 0; border: 0; font-size: .75rem; letter-spacing: .09em; }
.hero-actions .hero-project-button { padding-inline: 27px; background: rgba(245,243,238,.89); color: #171716; border-radius: 3px; border: 0; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background-color 220ms ease; }
.hero-actions .hero-project-button:hover, .hero-actions .hero-project-button:focus-visible { background: rgba(250,249,246,.98); color: #171716; }
.hero-work-link { position: relative; }
.hero-work-link::after { content: ''; position: absolute; left: 0; right: 22px; bottom: 10px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.hero-work-link span { transition: transform .3s ease; }
.hero-work-link:hover::after, .hero-work-link:focus-visible::after { transform: scaleX(1); }
.hero-work-link:hover span { transform: translateY(3px); }
@media (max-width: 760px) {
  .hero-actions { gap: 18px; }
  .hero-actions .hero-project-button { padding-inline: 23px; }
  .hero-actions a { font-size: .6875rem; letter-spacing: .055em; gap: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  .timeline-intro h1 .hero-changing-word, .hero-work-link span, .hero-work-link::after { transition: none; }
}

/* Each complete phrase appears already centered, without positional motion. */
.timeline-intro h1 { animation: none; }
.timeline-intro h1 .hero-changing-word { width: auto; transition: none; animation: none; }
.scroll-note { opacity: calc((1 - var(--timeline-dim, 0)) * .75); bottom: .9rem; display: grid; place-items: center; width: 44px; height: 44px; }
.scroll-note svg { width: 15px; height: 19px; animation: scroll-breathe 2.8s ease-in-out infinite; }
@keyframes scroll-breathe { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
@media (prefers-reduced-motion: reduce) { .scroll-note svg { animation: none; } }

/* The content stack and bottom scroll indicator have separate reserved space. */
.hero-copy { bottom: 112px; margin-bottom: 0; padding-bottom: 0; }
.hero-support { position: static; width: 760px; max-width: 90vw; margin: 24px auto 0; transform: none; }
.hero-actions { margin-top: 32px; justify-content: center; }
.scroll-note { bottom: 32px; width: 44px; height: 44px; }
@media (max-width: 760px) {
  .hero-copy { bottom: 112px; }
  .hero-support { width: calc(100vw - 2rem); max-width: 100%; }
}

/* First film: editorial context follows the existing deck. */
#project-01 .project-copy { margin-bottom: 56px; }
#project-01 .project-eyebrow { margin: 0 0 22px; padding: 0; text-align: center; font-size: 11px; line-height: 1.4; letter-spacing: .16em; color: rgba(0,0,0,.6); }
#project-01 .creative-thought { position: relative; z-index: 4; width: 100%; margin-top: 128px; padding-bottom: 48px; text-align: left; }
.thought-label { margin: 0 0 24px; font-size: 11px; line-height: 1.4; letter-spacing: .16em; text-transform: uppercase; color: rgba(0,0,0,.6); }
.thought-statement { width: 65%; font-size: clamp(2rem, 2.64vw, 2.375rem); line-height: 1.22; font-weight: 400; letter-spacing: -.035em; }
.thought-statement p { margin: 0; }
.thought-statement .thought-manifesto { margin-top: 24px; }
.thought-manifesto em { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.thought-footer { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 44px; }
.thought-credits { margin: 0; font-size: 11px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; color: rgba(0,0,0,.5); }
.project-text-link { position: relative; display: inline-flex; align-items: center; gap: 9px; flex-shrink: 0; font-size: 11px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.project-text-link::after { content: ''; position: absolute; bottom: -5px; left: 0; right: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.project-text-link:hover::after, .project-text-link:focus-visible::after { transform: scaleX(1); }
.project-text-link:focus-visible { outline: 1px solid currentColor; outline-offset: 8px; }
@media (max-width: 760px) {
  #project-01 .project-copy { margin-bottom: 48px; }
  #project-01 .creative-thought { margin-top: 110px; }
  .thought-statement { width: 100%; font-size: clamp(1.5rem, 5.5vw, 2rem); }
  .thought-footer { align-items: flex-start; gap: 24px; flex-wrap: wrap; }
  .thought-credits { max-width: 100%; }
}

/* Desktop proportions: dimensional changes preserve the existing deck motion. */
@media (min-width: 761px) {
  .projects { padding-inline: clamp(60px, 5vw, 80px); }
  .project-copy h2, #project-01 .project-copy h2 { font-size: clamp(1.365rem, 3.7765vw, 4.7775rem); }
  .project-deck { width: 91vw; height: min(33.67vw, 30.94rem); }
  .project-media, .portrait-project .project-media { width: min(48.23vw, 65.52rem); }
  .deck-card.is-far-left, .deck-card.is-far-right { width: 24.57vw; }
  .deck-card.is-left, .deck-card.is-right { width: 34.58vw; }
  .deck-card.is-far-left { left: 2.821vw; }
  .deck-card.is-far-right { right: 2.821vw; }
  .deck-card.is-left { left: 12.467vw; }
  .deck-card.is-right { right: 12.467vw; }
  #project-01 .project-copy { margin-bottom: 51px; }
  #project-01 .creative-thought { margin-top: 103px; }
  .thought-statement { width: 62%; max-width: 880px; font-size: clamp(1.88rem, 2.4816vw, 2.2325rem); line-height: 1.22; }
  .thought-footer { align-items: baseline; }
}
.thought-credits { font-size: 12px; color: rgba(0,0,0,.6); }

/* Refine the first film's thought block without moving its footer links. */
@media (min-width: 761px) {
  #project-01 .thought-label, #project-01 .thought-statement { margin-left: clamp(120px, 9.72vw, 160px); }
  #project-01 .thought-statement { width: 69.5%; max-width: 986px; text-wrap: pretty; }
}
.thought-credits { color: rgba(0,0,0,.66); }
.thought-break { display: none; }
@media (min-width: 1200px) { .thought-break { display: inline; } }
.timeline-rail { -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 var(--thought-fade-start, 100%), rgba(0,0,0,.12) var(--thought-fade-end, 100%), #000 var(--thought-fade-return, 100%), #000 100%); mask-image: linear-gradient(to bottom, #000 0, #000 var(--thought-fade-start, 100%), rgba(0,0,0,.12) var(--thought-fade-end, 100%), #000 var(--thought-fade-return, 100%), #000 100%); }

/* Wide, low editorial statement anchored to the viewport grid. */
@media (min-width: 761px) {
  #project-01 .creative-thought { width: calc(100vw - 136px); align-self: center; }
  #project-01 .thought-label, #project-01 .thought-statement { margin-left: 0; }
  #project-01 .thought-statement { width: 64vw; max-width: none; font-size: clamp(1.75rem, 2.1vw, 2rem); line-height: 1.16; font-weight: 400; text-wrap: pretty; }
  #project-01 .thought-manifesto { margin-top: 26px; }
  #project-01 .thought-footer { margin-top: 38px; align-items: baseline; }
}
#project-01 .thought-label { font-size: 11px; letter-spacing: .13em; color: rgba(0,0,0,.55); }
#project-01 .thought-credits { font-size: 11px; letter-spacing: .12em; color: rgba(0,0,0,.55); }


/* A second room, connected by the Selected Work spine. */
.timeline-rail { transform: none; }
#project-02 { --room: #191816; --room-white: 245,240,231; width: calc(100% + 2 * clamp(60px,5vw,80px)); margin-left: calc(-1 * clamp(60px,5vw,80px)); padding: 54px 3vw 46px; align-items: stretch; opacity: 1; color: rgb(var(--room-white)); background: var(--room); isolation: isolate; }
.place-spine { position: absolute; z-index: 0; top: 0; bottom: 0; left: 50%; width: 1px; pointer-events: none; background: rgba(var(--room-white),.12); }
.place-spine i { position: absolute; top: 56px; left: -3px; width: 7px; height: 7px; border-radius: 50%; border: 1px solid rgba(var(--room-white),.48); background: var(--room); }
#project-02 .project-copy { position: relative; z-index: 2; width: 100%; min-height: 0; margin: 0 0 10px; padding: 0; text-align: center; }
#project-02 .project-eyebrow { display: block; margin: 0 0 12px; padding: 0; font-size: 11px; line-height: 1.4; letter-spacing: .14em; text-align: center; color: rgba(var(--room-white),.6); }
#project-02 .project-copy h2 { margin: 0; font-size: clamp(54px,3.8vw,72px); line-height: 1.08; font-weight: 400; letter-spacing: -.045em; white-space: normal; }
#project-02 .project-copy h2 em { font-family: Georgia,'Times New Roman',serif; font-weight: 400; letter-spacing: -.055em; }
#project-02.is-active .project-copy h2 { animation: none; }
.place-perspective { position: relative; z-index: 1; width: 94vw; height: 33.5vw; align-self: center; }
#project-02 .place-film { position: absolute; z-index: 10; left: 0; top: 0; width: 54vw; height: 33.5vw; margin: 0; aspect-ratio: auto; clip-path: polygon(0 0,100% 11%,100% 95%,0 100%); box-shadow: none; transform: none; filter: none; opacity: 1; cursor: pointer; }
#project-02 .place-film video { width: 100%; height: 100%; object-fit: cover; transform: none; filter: none; will-change: auto; }
.memory-panel { position: absolute; margin: 0; overflow: hidden; clip-path: polygon(0 3%,100% 0,100% 100%,0 96%); box-shadow: 0 12px 30px rgba(0,0,0,.25); }
.memory-panel img { width: 100%; height: 100%; display: block; object-fit: cover; }
.memory-1 { left: 54.5vw; top: 5.4vw; width: 11.4vw; height: 25.5vw; z-index: 9; --panel-opacity: .98; }
.memory-2 { left: 66.3vw; top: 7.4vw; width: 8.6vw; height: 22.4vw; z-index: 8; --panel-opacity: .94; }
.memory-3 { left: 75.3vw; top: 9.3vw; width: 7.6vw; height: 19.4vw; z-index: 7; --panel-opacity: .9; }
.memory-4 { left: 83.3vw; top: 11.3vw; width: 5.6vw; height: 16.6vw; z-index: 6; --panel-opacity: .85; }
.memory-5 { left: 89.3vw; top: 13vw; width: 4.7vw; height: 12.6vw; z-index: 5; --panel-opacity: .78; }
.memory-1 img { object-position: 65% center; }
.memory-2 img { object-position: 65% center; }
.memory-3 img { object-position: 80% center; }
.memory-4 img { object-position: 50% center; }
.memory-5 img { object-position: 75% center; }
#project-02 .creative-thought { position: relative; z-index: 2; width: 100%; margin: 38px 0 0; padding: 0; text-align: left; }
#project-02 .thought-label { margin-bottom: 24px; color: rgba(var(--room-white),.6); }
#project-02 .thought-statement { width: 72vw; max-width: 100%; font-size: clamp(24px,1.5vw,28px); line-height: 1.18; font-weight: 400; }
#project-02 .thought-manifesto { margin-top: 26px; }
#project-02 > .thought-footer { position: relative; z-index: 2; width: 100%; margin-top: 26px; align-items: baseline; }
#project-02 .thought-credits { color: rgba(var(--room-white),.6); }
.project-text-link { gap: 12px; }
.project-text-link::before { content: ''; display: block; width: 70px; height: 1px; background: currentColor; transform-origin: right; transition: transform 240ms ease; }
.project-text-link::after { display: none; }
.project-text-link span { display: inline-block; transition: transform 240ms ease; }
.project-text-link:hover::before,.project-text-link:focus-visible::before { transform: scaleX(1.15); }
.project-text-link:hover span,.project-text-link:focus-visible span { transform: translate(2px,-2px); }
#project-02.has-reveal .place-reveal { opacity: 0; transition: opacity 800ms ease,transform 800ms ease; }
#project-02.has-reveal .place-film { transform: translateY(8px); }
#project-02.has-reveal h2 { transition-delay: 100ms; }
#project-02.has-reveal .place-film { transition-delay: 160ms; }
#project-02.has-reveal .memory-1 { transition-delay: 260ms; }
#project-02.has-reveal .memory-2 { transition-delay: 360ms; }
#project-02.has-reveal .memory-3 { transition-delay: 460ms; }
#project-02.has-reveal .memory-4 { transition-delay: 560ms; }
#project-02.has-reveal .memory-5 { transition-delay: 660ms; }
#project-02.has-reveal .creative-thought { transition-delay: 180ms; }
#project-02.has-reveal .is-revealed { opacity: var(--panel-opacity,1); transform: none; }
@media(max-width:760px) {
  #project-02 { width: calc(100% + 8vw); margin-left: -4vw; padding: 190px 24px 130px; }
  #project-02 .project-copy { margin-bottom: 44px; }
  #project-02 .project-copy h2 { font-size: clamp(44px,9vw,64px); }
  #project-02 .project-eyebrow { font-size: 10px; letter-spacing: .1em; }
  #project-02 .project-copy { width: 100%; }
  .place-perspective { width: 94vw; height: 48vw; }
  #project-02 .place-film { width: 60vw; height: 42vw; }
  .memory-1 { left: 60.5vw; top: 7vw; width: 10vw; height: 33vw; }
  .memory-2 { left: 71vw; top: 10vw; width: 8vw; height: 28vw; }
  .memory-3 { left: 79.5vw; top: 13vw; width: 6vw; height: 24vw; }
  .memory-4 { left: 86vw; top: 16vw; width: 4vw; height: 19vw; }
  .memory-5 { left: 90.5vw; top: 19vw; width: 3.5vw; height: 14vw; }
  #project-02 .creative-thought { margin-top: 90px; }
  #project-02 .thought-statement { width: 100%; font-size: clamp(24px,5.5vw,30px); }
  #project-02 > .thought-footer { flex-wrap: wrap; gap: 26px; }
}
@media(prefers-reduced-motion:reduce) {
  #project-02 .place-reveal,.project-text-link::before,.project-text-link span { transition: none !important; transform: none !important; }
}

#project-02 .place-film { cursor: pointer; }

/* The film is the stable anchor; only memory panels recede. */
#project-02 .place-film { clip-path: none; transform: none; rotate: none; perspective: none; }
#project-02.has-reveal .place-film { transform: none; }

/* Woven Light: one image, one point of view. */
#project-03 { width: calc(100% + 2 * clamp(60px,5vw,80px)); margin-left: calc(-1 * clamp(60px,5vw,80px)); padding: 0; display: grid; grid-template-columns: 56% 44%; align-items: stretch; min-height: 880px; opacity: 1; background: #eeece7; color: #393733; isolation: isolate; overflow: hidden; }
#project-03 .woven-image { width: 100%; height: 100%; min-height: 880px; aspect-ratio: auto; box-shadow: none; transform: none; filter: none; opacity: 1; cursor: pointer; z-index: 1; }
#project-03 .woven-image video { width: 100%; height: 100%; object-fit: cover; object-position: 57% center; transform: none; filter: none; }
.woven-copy { position: relative; z-index: 3; display: flex; flex-direction: column; padding: 78px clamp(32px,3.3vw,64px) 50px; }
#project-03 .project-copy { width: 100%; min-height: 0; margin: 0 0 68px; text-align: left; }
#project-03 .project-eyebrow { margin: 0 0 40px; padding: 0; text-align: left; font-size: 11px; line-height: 1.6; letter-spacing: .14em; color: rgba(57,55,51,.6); }
#project-03 .project-copy h2 { font-size: clamp(72px,5.4vw,86px); line-height: 1.05; letter-spacing: -.055em; font-weight: 400; white-space: normal; }
#project-03 .project-copy h2 em { font-family: Georgia,'Times New Roman',serif; font-weight: 400; }
#project-03.is-active .project-copy h2 { animation: none; }
#project-03 .creative-thought { margin: 0 0 56px; }
#project-03 .thought-label { color: rgba(57,55,51,.6); }
#project-03 .thought-statement { width: 100%; max-width: 530px; font-size: clamp(26px,2.1vw,31px); line-height: 1.22; letter-spacing: -.025em; }
#project-03 .thought-statement p + p { margin-top: 24px; }
#project-03 .thought-footer { margin-top: auto; align-items: baseline; gap: 20px; }
#project-03 .thought-credits { font-size: 10px; max-width: 210px; color: rgba(57,55,51,.6); }
#project-03 .project-text-link { font-size: 10px; gap: 9px; }
#project-03 .project-text-link::before { width: clamp(25px,3vw,60px); }
/* Canvas paints only pointer-generated material; copy stays above it. */
.woven-light-trail { position:absolute; z-index:2; inset:0; width:100%; height:100%; pointer-events:none; }

#project-03.has-reveal .woven-reveal { opacity: 0; transition: opacity 900ms ease,transform 900ms ease; }
#project-03.has-reveal h2 { transition-delay: 100ms; }
#project-03.has-reveal .woven-image { transform: translateY(8px); transition-delay: 160ms; }
#project-03.has-reveal .creative-thought { transition-delay: 260ms; }
#project-03.has-reveal .is-revealed { opacity: 1; transform: none; }
@media(max-width:1100px) and (min-width:761px) { #project-03 .thought-footer { flex-wrap: wrap; } }
@media(max-width:760px) {
  #project-03 { width: calc(100% + 8vw); margin-left: -4vw; display: flex; min-height: 0; }
  #project-03 .woven-image { width: 100%; min-height: 0; height: 66svh; max-height: 600px; }
  .woven-copy { padding: 42px 24px 48px; }
  #project-03 .project-copy { margin-bottom: 42px; }
  #project-03 .project-eyebrow { margin-bottom: 26px; font-size: 10px; }
  #project-03 .project-copy h2 { font-size: clamp(48px,11vw,68px); }
  #project-03 .thought-statement { font-size: 25px; }
  #project-03 .creative-thought { margin-bottom: 40px; }
  #project-03 .thought-footer { flex-wrap: wrap; }
  .woven-light-trail { display: none; }
}
@media(prefers-reduced-motion:reduce) { #project-03 .woven-reveal { transition: none !important; transform: none !important; } .woven-light-trail { display: none; } }


/* The homepage ends in two quiet movements: about, then contact. */
.home-about { background:#efede7; color:#373530; padding:150px 7vw 140px; scroll-margin-top:75px; }
.closing-eyebrow { margin:0; font-size:11px; font-weight:400; letter-spacing:.18em; line-height:1.5; color:#817c73; }
.home-about-statement { max-width:1050px; width:72vw; margin:74px 0 65px; font-size:clamp(36px,3.7vw,56px); line-height:1.14; font-weight:400; letter-spacing:-.035em; }
.home-about-support { width:61vw; max-width:840px; margin-left:12vw; }
.home-about-support p { margin:0; font-size:22px; line-height:1.45; color:#777168; }
.home-about-support p+p { margin-top:30px; }
.home-about-foot { margin-top:85px; display:flex; justify-content:space-between; align-items:flex-end; gap:35px; }
.home-about-foot p { margin:0; color:#817c73; font-size:11px; line-height:2; letter-spacing:.13em; }
.closing-link { font-size:11px; letter-spacing:.14em; line-height:1.5; }
.about-future-link { color:#777168; cursor:default; }
.home-contact { background:#191816; color:#efece4; padding:150px 7vw 38px; min-height:105svh; display:flex; flex-direction:column; align-items:flex-start; scroll-margin-top:75px; }
.home-contact .closing-eyebrow { color:rgba(239,236,228,.5); }
.home-contact h2 { font-size:clamp(52px,6.6vw,100px); font-weight:400; letter-spacing:-.05em; line-height:1.1; margin:90px 0 65px; }
.home-contact h2 em { display:block; font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.045em; margin-top:12px; }
.closing-project-cta { display:inline-flex; align-items:center; gap:30px; font-size:12px; letter-spacing:.14em; border-bottom:1px solid rgba(239,236,228,.5); padding:12px 0; }
.closing-project-cta span { transition:transform 200ms ease; }
.closing-project-cta:hover span { transform:translate(2px,-2px); }
.closing-contact-links { display:flex; flex-direction:column; gap:16px; margin-top:60px; font-size:16px; line-height:1.5; color:rgba(239,236,228,.65); }
.closing-contact-links a:hover { color:#efece4; }
.closing-footer { margin-top:auto; padding-top:130px; font-size:10px; letter-spacing:.14em; color:rgba(239,236,228,.4); }
@media(max-width:760px) {
 .home-about { padding:100px 7vw; }
 .home-about-statement { width:100%; font-size:34px; margin:54px 0 44px; }
 .home-about-support { width:100%; margin-left:0; }
 .home-about-support p { font-size:20px; }
 .home-about-foot { margin-top:60px; align-items:flex-start; flex-direction:column; gap:32px; }
 .home-contact { padding:110px 7vw 32px; min-height:90svh; }
 .home-contact h2 { font-size:clamp(42px,10vw,64px); margin:70px 0 52px; }
 .closing-contact-links { margin-top:48px; }
 .closing-footer { padding-top:100px; }
}
@media(prefers-reduced-motion:reduce) { .closing-project-cta span { transition:none; } }

/* Project 04: a cold, unbroken cinematic pause. */
#project-04 { width:calc(100% + 2 * clamp(60px,5vw,80px)); margin-left:calc(-1 * clamp(60px,5vw,80px)); padding:140px 5vw 150px; min-height:0; background:#171a1b; color:#deded8; opacity:1; isolation:isolate; }
#project-04 .project-copy { width:100%; min-height:0; margin:0 0 82px; text-align:left; }
#project-04 .project-eyebrow { padding:0; text-align:left; color:rgba(222,222,216,.58); font-size:11px; letter-spacing:.16em; margin-bottom:38px; }
#project-04 .project-copy h2 { font-size:clamp(38px,5.05vw,82px); line-height:1.09; letter-spacing:-.045em; font-weight:400; white-space:normal; animation:none; }
#project-04 .horse-film { width:90vw; height:auto; aspect-ratio:2212 / 936; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; transform:none; background:#111415; cursor:pointer; }
#project-04 .horse-film video { width:100%; height:100%; object-fit:contain; transform:none; filter:none; }
.horse-spread { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:4vw; justify-content:space-between; align-items:start; margin:120px 0 115px; }
.horse-spread figure { margin:0; }
.horse-spread .horse-arrival { margin-top:0; }
.horse-spread img { display:block; width:100%; height:auto; aspect-ratio:1104 / 468; object-fit:contain; }
#project-04 .creative-thought { width:100%; margin:0; }
#project-04 .thought-label { color:rgba(222,222,216,.55); }
#project-04 .thought-statement { width:67vw; max-width:1030px; font-size:clamp(26px,2.15vw,32px); line-height:1.2; letter-spacing:-.025em; }
#project-04 .thought-statement p + p { margin-top:24px; }
#project-04 .thought-statement .thought-manifesto { margin-top:38px; }
#project-04 .thought-footer { width:100%; margin-top:50px; align-items:baseline; }
#project-04 .thought-credits { color:rgba(222,222,216,.58); }
#project-04 .project-text-link { color:#deded8; }
.projects { padding-bottom:0; }
@media(max-width:760px) {
 #project-04 { width:calc(100% + 2rem); margin-left:-1rem; padding:90px 5vw 90px; }
 #project-04 .project-copy { margin-bottom:44px; }
 #project-04 .project-copy h2 { font-size:clamp(30px,6.2vw,47px); line-height:1.12; }
 #project-04 .project-eyebrow { font-size:10px; line-height:1.6; margin-bottom:28px; }
 .horse-spread { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:4vw; margin:65px 0 70px; }
 .horse-spread .horse-arrival { margin-top:0; }
 #project-04 .thought-statement { width:100%; font-size:25px; }
 #project-04 .thought-footer { flex-wrap:wrap; gap:28px; }
}
/* AEORON: film, world, human, silence. */
#project-05 { width:calc(100% + 2 * clamp(60px,5vw,80px)); margin-left:calc(-1 * clamp(60px,5vw,80px)); padding:145px 4vw 155px; background:#202628; color:#e0e3df; min-height:0; opacity:1; isolation:isolate; }
#project-05 .project-copy { width:92vw; min-height:0; text-align:left; margin:0 0 75px; }
#project-05 .project-eyebrow { padding:0; text-align:left; font-size:11px; letter-spacing:.16em; color:rgba(224,227,223,.58); margin-bottom:36px; }
#project-05 .project-copy h2 { font-size:clamp(65px,9vw,145px); font-weight:400; letter-spacing:.025em; line-height:1; animation:none; }
#project-05 .aeoron-film { width:92vw; aspect-ratio:3840 / 1640; height:auto; margin:0; padding:0; border:0; border-radius:0; transform:none; box-shadow:none; cursor:pointer; background:#151a1c; }
#project-05 .aeoron-film video { width:100%; height:100%; object-fit:contain; transform:none; filter:none; }
.aeoron-sequence.aeoron-grid { width:86vw; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3vw; align-items:start; margin:110px 0 125px; }
.aeoron-grid figure { margin:0; }
.aeoron-grid img { display:block; width:100%; height:auto; aspect-ratio:21 / 9; object-fit:cover; object-position:center; }
#project-05 .creative-thought { width:100%; margin:0; padding:0 1vw; }
#project-05 .thought-label,#project-05 .thought-credits { color:rgba(224,227,223,.58); }
#project-05 .thought-statement { width:67vw; max-width:1030px; font-size:clamp(26px,2.15vw,32px); line-height:1.2; letter-spacing:-.025em; }
#project-05 .thought-statement p + p { margin-top:26px; }
#project-05 .thought-statement .thought-manifesto { margin-top:38px; }
#project-05 .thought-footer { margin-top:50px; width:100%; align-items:baseline; }
#project-05 .project-text-link { color:#e0e3df; }
@media(max-width:760px) {
 #project-05 { width:calc(100% + 2rem); margin-left:-1rem; padding:90px 4vw; }
 #project-05 .project-copy { margin-bottom:45px; }
 #project-05 .project-copy h2 { font-size:17vw; }
 .aeoron-sequence.aeoron-grid { margin:65px 0 75px; gap:3vw; }
 #project-05 .thought-statement { width:100%; font-size:25px; }
 #project-05 .thought-footer { flex-wrap:wrap; gap:28px; }
}
/* Adorned by Light: luminous vertical editorial. */
#project-06 { width:calc(100% + 2 * clamp(60px,5vw,80px)); margin-left:calc(-1 * clamp(60px,5vw,80px)); padding:140px 5vw 150px; background:#f3f2ef; color:#3a3936; min-height:0; opacity:1; isolation:isolate; }
#project-06 .project-copy { width:100%; min-height:0; text-align:center; margin:0 0 75px; }
#project-06 .project-eyebrow { padding:0; text-align:center; font-size:11px; letter-spacing:.16em; color:rgba(58,57,54,.58); margin-bottom:32px; }
#project-06 .project-copy h2 { font-size:clamp(38px,5.5vw,88px); font-weight:400; letter-spacing:-.025em; line-height:1.08; white-space:normal; animation:none; }
.adorned-composition { width:80vw; display:grid; grid-template-columns:1fr 2.15fr 1fr; gap:3vw; align-items:center; }
.adorned-stills { display:grid; gap:2vw; }
.adorned-stills figure { margin:0; }
.adorned-stills img { display:block; width:100%; height:auto; aspect-ratio:1143 / 2048; object-fit:contain; }
#project-06 .adorned-film { width:100%; height:auto; aspect-ratio:9 / 16; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; transform:none; background:#f3f2ef; cursor:pointer; }
#project-06 .adorned-film video { width:100%; height:100%; object-fit:contain; transform:none; filter:none; }
#project-06 .creative-thought { width:100%; margin:110px 0 0; }
#project-06 .thought-label,#project-06 .thought-credits { color:rgba(58,57,54,.58); }
#project-06 .thought-statement { width:66vw; max-width:1030px; font-size:clamp(26px,2.15vw,32px); line-height:1.2; letter-spacing:-.025em; }
#project-06 .thought-statement p + p { margin-top:26px; }
#project-06 .thought-statement .thought-manifesto { margin-top:38px; }
#project-06 .thought-footer { margin-top:50px; width:100%; align-items:baseline; }
#project-06 .project-text-link { color:#3a3936; }
@media(max-width:760px) {
 #project-06 { width:calc(100% + 2rem); margin-left:-1rem; padding:85px 5vw 90px; }
 #project-06 .project-copy { margin-bottom:42px; }
 #project-06 .project-copy h2 { font-size:8vw; }
 .adorned-composition { width:90vw; gap:2vw; grid-template-columns:1fr 2.15fr 1fr; }
 #project-06 .creative-thought { margin-top:65px; }
 #project-06 .thought-statement { width:100%; font-size:25px; }
 #project-06 .thought-footer { flex-wrap:wrap; gap:28px; }
}
/* Portfolio-only refinement. Header and hero remain locked. */
:root { --portfolio-max:1800px; --portfolio-pad:clamp(28px,4.5vw,80px); --portfolio-gap:clamp(18px,1.6vw,30px); --portfolio-cols:12; --chapter-top:clamp(120px,10vw,190px); --chapter-end:clamp(180px,14vw,260px); --title-media:clamp(64px,6vw,110px); --media-thought:96px; }
.projects .project-step { min-block-size:105svh; padding-block:var(--chapter-top) var(--chapter-end); opacity:1; }
.projects .project-step .project-copy { inline-size:min(calc(100vw - 2 * var(--portfolio-pad)),var(--portfolio-max)); min-block-size:0; margin:0 auto var(--title-media); text-align:left; }
.projects .project-step .project-eyebrow { text-align:left; padding:0; font-size:clamp(10px,.7vw,12px); letter-spacing:.12em; line-height:1.5; margin:0 0 clamp(28px,2.5vw,44px); }
.projects .project-step .project-copy h2 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(52px,5.8vw,108px); font-weight:400; line-height:.94; letter-spacing:-.035em; text-wrap:balance; white-space:normal; margin:0; animation:none; }
.projects .project-step .creative-thought { inline-size:min(calc(100vw - 2 * var(--portfolio-pad)),var(--portfolio-max)); margin:var(--media-thought) auto 0; padding:0; display:grid; grid-template-columns:repeat(var(--portfolio-cols),minmax(0,1fr)); column-gap:var(--portfolio-gap); }
.projects .project-step .thought-label { grid-column:2 / 9; font-size:11px; letter-spacing:.12em; margin:0 0 24px; }
.projects .project-step .thought-statement { grid-column:2 / 9; inline-size:auto; max-inline-size:900px; font-size:clamp(24px,2.1vw,36px); line-height:1.28; letter-spacing:-.018em; text-wrap:pretty; }
.projects .project-step .thought-statement p + p { margin-block-start:24px; }
.projects .project-step .thought-statement .thought-manifesto { margin-block-start:40px; }
.projects .project-step .thought-footer { grid-column:1 / -1; inline-size:100%; display:grid; grid-template-columns:repeat(var(--portfolio-cols),minmax(0,1fr)); gap:var(--portfolio-gap); align-items:baseline; margin-block-start:40px; }
.projects .project-step .thought-credits { grid-column:2 / 9; max-inline-size:none; font-size:11px; line-height:1.6; }
.projects .project-step .project-text-link { grid-column:10 / -1; justify-self:end; min-block-size:44px; font-size:11px; }
@supports(grid-template-columns:subgrid) { .projects .project-step .creative-thought .thought-footer { grid-template-columns:subgrid; } }
.projects #project-02 > .thought-footer { inline-size:min(calc(100vw - 2 * var(--portfolio-pad)),var(--portfolio-max)); margin-inline:auto; }
.projects #project-03 { display:flex; flex-direction:column; padding-block:var(--chapter-top) var(--chapter-end); }
.projects #project-03 .woven-image { inline-size:min(56vw,1008px); min-block-size:0; block-size:auto; aspect-ratio:4 / 5; }
.projects #project-03 .woven-copy { inline-size:100%; padding:0; display:block; }
.projects #project-03 .creative-thought { margin-block-start:var(--media-thought); }
.projects #project-03 .thought-footer { inline-size:min(calc(100vw - 2 * var(--portfolio-pad)),var(--portfolio-max)); margin-inline:auto; }
#project-01 .project-deck { transform:none; transition:none; }
#project-01 .project-media video { height:100%; transform:none; }
.projects #project-04 .horse-film,.projects #project-05 .aeoron-film { inline-size:min(92vw,1680px); margin-inline:auto; }
.projects .project-text-link:focus-visible,.projects .project-media:focus-visible { outline:2px solid currentColor; outline-offset:6px; }
.projects .project-media { cursor:pointer; }
.projects .project-media:hover video { filter:none; }
.home-about { display:grid; grid-template-columns:repeat(var(--portfolio-cols),minmax(0,1fr)); gap:0 var(--portfolio-gap); padding:clamp(160px,14vw,240px) max(var(--portfolio-pad),calc((100vw - var(--portfolio-max)) / 2)); text-align:left; }
.home-about .closing-eyebrow,.home-about-statement,.home-about-support,.home-about-foot { grid-column:3 / 11; inline-size:auto; margin-inline:0; }
.home-about-statement { font-size:clamp(34px,4vw,68px); line-height:1.08; letter-spacing:-.03em; text-wrap:balance; margin-block:64px; }
.home-about-support { font-size:clamp(20px,1.7vw,28px); line-height:1.4; max-inline-size:850px; }
.home-about-foot { margin-block-start:96px; }
.home-contact { min-block-size:105svh; padding-block-start:clamp(150px,12vw,230px); }
@media(max-width:1100px) { :root { --portfolio-cols:8; } .projects .project-step .thought-label,.projects .project-step .thought-statement,.projects .project-step .thought-credits { grid-column:1 / 7; } .projects .project-step .project-text-link { grid-column:7 / -1; } .home-about .closing-eyebrow,.home-about-statement,.home-about-support,.home-about-foot { grid-column:2 / 8; } }
@media(max-width:760px) {
 :root { --portfolio-cols:4; --chapter-top:110px; --chapter-end:clamp(110px,20vw,150px); --title-media:64px; --media-thought:64px; }
 .projects .project-step .project-copy h2 { font-size:clamp(44px,13vw,68px); }
 .projects .project-step .thought-label,.projects .project-step .thought-statement,.projects .project-step .thought-credits,.projects .project-step .project-text-link { grid-column:1 / -1; }
 .projects .project-step .project-text-link { justify-self:start; }
 .projects #project-03 .woven-image { inline-size:calc(100vw - 56px); }
 .aeoron-sequence.aeoron-grid { grid-template-columns:1fr; gap:24px; }
 .adorned-composition { grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px 18px; }
 #project-06 .adorned-film { grid-column:1 / -1; grid-row:1; inline-size:min(100%,360px); justify-self:center; }
 .adorned-stills { grid-column:span 2; }
 .home-about { padding-block:120px; }
 .home-about .closing-eyebrow,.home-about-statement,.home-about-support,.home-about-foot { grid-column:1 / -1; }
 .home-about-foot { margin-block-start:64px; }
}
@media(prefers-reduced-motion:reduce) { .projects *, .home-about * { animation:none !important; transition:none !important; } }
/* Preserve Woven Light's approved split composition. */
.projects #project-03 { display:grid; grid-template-columns:56% 44%; align-items:stretch; }
.projects #project-03 .woven-image { inline-size:100%; block-size:100%; min-block-size:880px; aspect-ratio:auto; }
.projects #project-03 .woven-copy { inline-size:100%; padding-inline:clamp(32px,3.3vw,64px); }
.projects #project-03 .project-copy { inline-size:100%; }
.projects #project-03 .creative-thought { inline-size:100%; margin-block-start:var(--title-media); grid-template-columns:repeat(4,minmax(0,1fr)); }
.projects #project-03 .thought-label,.projects #project-03 .thought-statement { grid-column:1 / -1; }
.projects #project-03 .thought-footer { inline-size:100%; grid-template-columns:1fr; row-gap:24px; }
.projects #project-03 .thought-credits,.projects #project-03 .project-text-link { grid-column:1; }
@media(max-width:760px) { .projects #project-03 { display:flex; } .projects #project-03 .woven-image { inline-size:100%; block-size:65svh; min-block-size:0; } .projects #project-03 .woven-copy { padding:64px 28px 0; } }

/* Woven Light: wide cinematic frame with a bottom-aligned editorial column. */
.projects #project-03 { grid-template-columns:minmax(0,62fr) minmax(0,38fr); align-items:end; }
.projects #project-03 .woven-image { inline-size:100%; block-size:auto; min-block-size:0; min-height:0; height:auto; aspect-ratio:21 / 9; align-self:end; }
.projects #project-03 .woven-image video { object-fit:cover; object-position:center; }
.projects #project-03 .woven-copy { padding-block:0; padding-inline:clamp(28px,3vw,56px); display:flex; flex-direction:column; }
.projects #project-03 .project-copy { margin-block-end:40px; }
.projects #project-03 .creative-thought { margin-block:0 40px; }
.projects #project-03 .thought-footer { margin-block-start:auto; margin-block-end:0; }
@media(max-width:1100px) and (min-width:761px) {
 .projects #project-03 { grid-template-columns:minmax(0,58fr) minmax(0,42fr); }
}
@media(max-width:760px) {
 .projects #project-03 .woven-image { inline-size:100%; block-size:auto; min-block-size:0; aspect-ratio:21 / 9; }
 .projects #project-03 .woven-copy { padding:64px 28px 0; }
}

/* Shared title rhythm and precise film-edge alignments. */
.projects #project-02 .project-copy { margin-block-end:var(--title-media); }
.projects #project-02 .project-copy h2,
.projects #project-04 .project-copy h2,
.projects #project-05 .project-copy h2 { font-size:clamp(52px,5.8vw,108px); line-height:.94; letter-spacing:-.035em; font-weight:400; }
.projects #project-04 .project-copy h2 em,
.projects #project-05 .project-copy h2 em { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.055em; }
.projects #project-04,.projects #project-05 { padding-inline:0; --film-canvas:min(92vw,1680px); }
.projects #project-04 .project-copy,
.projects #project-04 .horse-spread,
.projects #project-04 .creative-thought,
.projects #project-05 .project-copy,
.projects #project-05 .aeoron-sequence.aeoron-grid { inline-size:var(--film-canvas); width:var(--film-canvas); margin-inline:auto; }
.projects #project-04 .thought-label,
.projects #project-04 .thought-statement,
.projects #project-04 .thought-credits { grid-column:1 / 9; }
.projects #project-05 .project-copy,
.projects #project-05 .project-eyebrow { text-align:center; }
/* No cursor layer or pointer-driven light remains in Woven Light. */
.projects #project-03 { align-items:stretch; }
.projects #project-03 .woven-image { align-self:start; }
.projects #project-03 .woven-copy { min-inline-size:0; justify-content:space-between; }
.projects #project-03 .project-copy { margin-block-end:16px; }
.projects #project-03 .project-eyebrow { margin-block-end:16px; }
.projects #project-03 .project-copy h2 { font-size:clamp(44px,4.2vw,72px); line-height:1; }
.projects #project-03 .creative-thought { margin-block:0 16px; }
.projects #project-03 .thought-label { margin-block-end:12px; }
.projects #project-03 .thought-statement { font-size:clamp(19px,1.4vw,25px); line-height:1.18; }
.projects #project-03 .thought-statement p + p { margin-block-start:12px; }
.projects #project-03 .thought-statement .thought-manifesto { margin-block-start:16px; }
.projects #project-03 .thought-footer { grid-template-columns:1fr auto; gap:12px; align-items:end; }
.projects #project-03 .thought-credits { grid-column:1; margin:0; font-size:10px; }
.projects #project-03 .project-text-link { grid-column:2; min-block-size:0; font-size:10px; }
@media(min-width:1201px) {
 .projects #project-03 .woven-copy { block-size:calc((100vw * .62) * 9 / 21); }
}
@media(max-width:1200px) {
 .projects #project-03 { display:flex; flex-direction:column; }
 .projects #project-03 .woven-image { inline-size:100%; }
 .projects #project-03 .woven-copy { padding:64px var(--portfolio-pad) 0; }
 .projects #project-03 .thought-statement { font-size:clamp(24px,2.1vw,32px); max-inline-size:900px; }
 .projects #project-03 .project-copy { margin-block-end:40px; }
 .projects #project-03 .creative-thought { margin-block-end:40px; }
}
@media(max-width:760px) {
 .projects #project-02 .project-copy h2,
 .projects #project-04 .project-copy h2,
 .projects #project-05 .project-copy h2 { font-size:clamp(44px,13vw,68px); }
 .projects #project-04 .thought-label,
 .projects #project-04 .thought-statement,
 .projects #project-04 .thought-credits { grid-column:1 / -1; }
 .projects #project-03 .thought-footer { grid-template-columns:1fr; gap:24px; }
 .projects #project-03 .project-text-link { grid-column:1; justify-self:start; }
}

/* Keep project reflections on the same left edge as their image fields. */
.projects #project-05 .creative-thought { inline-size:var(--film-canvas); width:var(--film-canvas); margin-inline:auto; padding-inline:0; }
.projects #project-05 .thought-label,
.projects #project-05 .thought-statement,
.projects #project-05 .thought-credits { grid-column:1 / 9; }
.projects #project-06 { padding-inline:0; --adorned-canvas:min(80vw,1440px); }
.projects #project-06 .adorned-composition,
.projects #project-06 .creative-thought { inline-size:var(--adorned-canvas); width:var(--adorned-canvas); margin-inline:auto; }
.projects #project-06 .adorned-composition { column-gap:clamp(14px,1.5vw,26px); }
.projects #project-06 .thought-label,
.projects #project-06 .thought-statement,
.projects #project-06 .thought-credits { grid-column:1 / 9; }
.projects #project-06 .project-copy h2 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(52px,5.8vw,108px); line-height:.94; letter-spacing:-.035em; font-weight:400; }
.projects #project-06 .project-copy h2 em { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.055em; }
@media(max-width:1100px) {
 .projects #project-05 .thought-label,.projects #project-05 .thought-statement,.projects #project-05 .thought-credits,
 .projects #project-06 .thought-label,.projects #project-06 .thought-statement,.projects #project-06 .thought-credits { grid-column:1 / 7; }
}
@media(max-width:760px) {
 .projects #project-06 { --adorned-canvas:90vw; }
 .projects #project-06 .project-copy h2 { font-size:clamp(44px,13vw,68px); }
 .projects #project-05 .thought-label,.projects #project-05 .thought-statement,.projects #project-05 .thought-credits,
 .projects #project-06 .thought-label,.projects #project-06 .thought-statement,.projects #project-06 .thought-credits { grid-column:1 / -1; }
}

/* Final chapter alignments and restored immersive Woven Light scale. */
.projects #project-01 .project-copy h2 { font-size:clamp(52px,5.8vw,108px); line-height:.94; letter-spacing:-.035em; font-weight:400; }
.projects #project-01 .project-copy h2 em { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.055em; }
.home-contact { padding-inline:max(4vw,calc((100vw - 1680px) / 2)); text-align:left; align-items:flex-start; }
.projects #project-02 { padding-inline:0; --place-canvas:min(92vw,1680px); }
.projects #project-02 .place-perspective,
.projects #project-02 .creative-thought,
.projects #project-02 > .thought-footer { inline-size:var(--place-canvas); width:var(--place-canvas); margin-inline:auto; }
.projects #project-02 .thought-label,
.projects #project-02 .thought-statement,
.projects #project-02 .thought-credits { grid-column:1 / 9; }
.projects #project-03 { display:grid; grid-template-columns:56% 44%; align-items:stretch; padding-block:0; min-block-size:880px; }
.projects #project-03 .woven-image { inline-size:100%; block-size:100%; height:100%; min-block-size:880px; max-block-size:none; max-height:none; aspect-ratio:auto; align-self:stretch; }
.projects #project-03 .woven-copy { block-size:auto; padding:78px clamp(32px,3.3vw,64px) 50px; justify-content:flex-start; }
.projects #project-03 .project-copy { margin-block-end:64px; }
.projects #project-03 .project-eyebrow { margin-block-end:32px; }
.projects #project-03 .project-copy h2 { font-size:clamp(52px,5.8vw,108px); line-height:.94; }
.projects #project-03 .creative-thought { margin-block:0 48px; }
.projects #project-03 .thought-label { margin-block-end:24px; }
.projects #project-03 .thought-statement { font-size:clamp(26px,2.1vw,32px); line-height:1.22; max-inline-size:530px; }
.projects #project-03 .thought-statement p + p { margin-block-start:24px; }
.projects #project-03 .thought-statement .thought-manifesto { margin-block-start:32px; }
.projects #project-03 .thought-footer { margin-block-start:auto; grid-template-columns:1fr; row-gap:24px; }
.projects #project-03 .thought-credits,.projects #project-03 .project-text-link { grid-column:1; }
@media(max-width:1100px) {
 .projects #project-02 .thought-label,.projects #project-02 .thought-statement,.projects #project-02 .thought-credits { grid-column:1 / 7; }
}
@media(max-width:760px) {
 .projects #project-01 .project-copy h2 { font-size:clamp(44px,13vw,68px); }
 .projects #project-02 .thought-label,.projects #project-02 .thought-statement,.projects #project-02 .thought-credits { grid-column:1 / -1; }
 .projects #project-03 { display:flex; flex-direction:column; min-block-size:0; }
 .projects #project-03 .woven-image { block-size:66svh; height:66svh; min-block-size:0; max-block-size:600px; }
 .projects #project-03 .woven-copy { padding:42px 28px 64px; }
 .projects #project-03 .project-copy h2 { font-size:clamp(44px,13vw,68px); }
 .projects #project-03 .project-copy { margin-block-end:42px; }
 .projects #project-03 .thought-statement { font-size:25px; }
}

/* Matching editorial headers for What Was Calling Us? and Place to Be. */
.projects #project-01 .project-copy,
.projects #project-02 .project-copy,
.projects #project-01 .project-eyebrow,
.projects #project-02 .project-eyebrow { text-align:center; }
.projects #project-01 .project-copy h2,
.projects #project-02 .project-copy h2 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(52px,5.8vw,108px); font-weight:400; line-height:.94; letter-spacing:-.035em; }
.projects #project-01 .project-copy h2 em,
.projects #project-02 .project-copy h2 em { font-family:Georgia,'Times New Roman',serif; font-style:italic; font-weight:400; letter-spacing:-.055em; }
@media(max-width:760px) {
 .projects #project-01 .project-copy h2,
 .projects #project-02 .project-copy h2 { font-size:clamp(44px,13vw,68px); }
}

/* Version B: cinematic index, straight type receding into editorial depth. */
.index-view { background:var(--paper); color:#252522; padding:130px 4vw 100px; min-block-size:100svh; overflow:hidden; }
.index-view[hidden] { display:none; }
.navigator-eyebrow,.navigator-meta,.navigator-hint { text-align:center; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#686863; }
.navigator-eyebrow { margin:0 0 24px; }
.navigator-titles { position:relative; block-size:480px; perspective:1200px; }
.index-view .index-row { position:absolute; inset-inline:0; top:50%; display:block; inline-size:100%; padding:0 3vw; border:0; text-align:center; cursor:pointer; font-family:Arial,Helvetica,sans-serif; font-size:clamp(42px,6.4vw,112px); line-height:1.03; letter-spacing:-.04em; font-weight:400; text-wrap:balance; color:#252522; opacity:var(--row-opacity); filter:blur(var(--row-blur)); transform:translateY(calc(-50% + var(--row-y))) scale(var(--row-scale)); transition:transform 650ms cubic-bezier(.22,.65,.25,1),opacity 650ms ease,filter 650ms ease,color 200ms ease; }
.index-view .index-row.is-current { color:#20201d; }
.index-view .index-row:hover { filter:none; color:#10100f; }
.index-view .index-row.is-hidden { display:none; }
.index-view .index-row:focus-visible { outline:1px solid currentColor; outline-offset:8px; }
.navigator-meta { margin:20px 0 32px; }
.navigator-media { position:relative; display:block; inline-size:min(78vw,1400px); aspect-ratio:21 / 9; margin-inline:auto; padding:0; overflow:hidden; background:#deddd7; cursor:pointer; }
.navigator-media video { position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:contain; background:#171816; opacity:0; transition:opacity 750ms ease; }
.navigator-media video.is-current { opacity:1; }
.navigator-media:focus-visible,.navigator-controls button:focus-visible { outline:2px solid #56564f; outline-offset:6px; }
.navigator-controls { display:flex; justify-content:center; align-items:center; gap:24px; margin-block:28px 12px; }
.navigator-controls button { inline-size:44px; block-size:44px; cursor:pointer; font-size:23px; }
.navigator-controls button:disabled { opacity:.25; cursor:default; }
.navigator-count { font-size:11px; letter-spacing:.14em; color:#676760; }
.navigator-hint { font-size:10px; margin:0; }
.index-preview { display:none !important; }
@media(max-width:760px) {
 .index-view { padding:110px 4vw 80px; }
 .navigator-titles { block-size:460px; touch-action:pan-x; }
 .index-view .index-row { font-size:clamp(34px,8vw,60px); padding-inline:0; }
 .navigator-media { inline-size:92vw; }
 .navigator-meta { font-size:10px; line-height:1.6; }
}
@media(prefers-reduced-motion:reduce) { .index-view .index-row,.navigator-media video { transition:none; } }
.navigator-titles { block-size:560px; }
@media(max-width:760px) { .navigator-titles { block-size:520px; } }

/* Reference-based editorial menu beneath a single central film. */
.index-view { padding:110px 4vw 80px; }
.navigator-eyebrow { margin-block-end:32px; }
.navigator-media { inline-size:min(84vw,1512px); aspect-ratio:21 / 9; isolation:isolate; }
.navigator-media::after { content:''; position:absolute; inset:0; z-index:2; pointer-events:none; background:rgba(0,0,0,.12); }
.navigator-active-title { position:absolute; z-index:3; inset:0; display:grid; place-items:center; padding:3vw; font-family:Arial,Helvetica,sans-serif; font-size:clamp(48px,7vw,124px); font-weight:400; line-height:1.02; letter-spacing:-.045em; text-wrap:balance; text-align:center; color:#f8f6ef; text-shadow:0 2px 24px rgba(0,0,0,.25); }
.navigator-meta { margin:24px 0 36px; }
.navigator-titles { inline-size:min(92vw,1680px); margin-inline:auto; block-size:auto; perspective:1200px; }
.index-view .index-row { position:relative; inset:auto; display:grid; grid-template-columns:6% minmax(0,1fr) 25% 7%; align-items:center; gap:2vw; inline-size:100%; padding:24px 5vw; text-align:left; font-size:11px; line-height:1.3; border-block-end:1px solid rgba(38,38,33,.18); opacity:calc(.76 - var(--row-depth) * .08); transform:scale(calc(.98 - var(--row-depth) * .025)) rotateX(var(--row-angle)); transform-origin:center center; filter:blur(var(--row-blur)); }
.index-view .index-row strong { font-family:Arial,Helvetica,sans-serif; font-size:clamp(26px,3.2vw,56px); font-weight:400; letter-spacing:-.045em; text-wrap:balance; }
.index-view .index-row span { font-size:11px; font-weight:400; letter-spacing:.015em; text-transform:uppercase; }
.index-view .index-row.is-current { display:none; }
.index-view .index-row:hover,.index-view .index-row:focus-visible { opacity:1; filter:none; }
@media(max-width:760px) {
 .index-view { padding-block-start:100px; }
 .navigator-media { inline-size:92vw; }
 .navigator-active-title { font-size:clamp(32px,7.5vw,60px); }
 .navigator-titles { block-size:auto; touch-action:pan-y; }
 .index-view .index-row { grid-template-columns:28px minmax(0,1fr) 38px; gap:12px; padding:22px 0; }
 .index-view .index-row strong { font-size:clamp(22px,5.4vw,34px); }
 .index-view .index-row span:nth-child(3) { display:none; }
 .index-view .index-row span { font-size:10px; }
}

/* Fixed reference composition: one editorial menu, no following sections. */
body.is-index-mode { overflow:hidden; }
body.is-index-mode .home-about,body.is-index-mode .home-contact { display:none; }
body.is-index-mode .site-header { color:#292924; mix-blend-mode:normal; }
.index-view { position:fixed; z-index:10; inset:0; min-block-size:0; block-size:100svh; padding:0; overflow:hidden; background:#f7f6f2; }
.index-view .navigator-eyebrow,.index-view .navigator-meta,.index-view .navigator-hint,.index-view .navigator-active-title { display:none; }
.navigator-titles { position:absolute; inset:80px 0 40px; inline-size:100%; block-size:auto; margin:0; perspective:1200px; }
.index-view .index-row { position:absolute; top:44%; left:4vw; inline-size:92vw; display:grid; grid-template-columns:6% 42% 21% 6%; gap:1.5%; block-size:90px; padding:0 9vw; border-block-end:1px solid rgba(40,40,34,.2); transform:translateY(calc(-50% + var(--row-y))) scale(var(--row-scale)); text-align:left; opacity:var(--row-opacity); filter:blur(var(--row-blur)); }
.index-view .index-row strong { font-size:clamp(24px,2.6vw,48px); line-height:1.05; letter-spacing:-.045em; }
.index-view .index-row span { font-size:clamp(10px,.75vw,14px); }
.index-view .index-row.is-current { display:grid; padding-inline:9vw 1vw; block-size:220px; transform:translateY(-50%); opacity:1; filter:none; }
.index-view .index-row.is-current strong { font-size:clamp(44px,5.2vw,100px); }
.index-view .navigator-media { position:absolute; z-index:25; top:calc(80px + (100svh - 120px) * .44); right:4vw; inline-size:20vw; max-inline-size:410px; aspect-ratio:16 / 9; margin:0; transform:translateY(-50%); }
.index-view .navigator-media::after { display:none; }
.index-view .navigator-media video { object-fit:cover; }
.navigator-controls { position:absolute; z-index:25; bottom:4px; inset-inline:0; margin:0; gap:20px; }
@media(max-width:760px) {
 .navigator-titles { inset:90px 0 55px; }
 .index-view .index-row { left:4vw; inline-size:92vw; grid-template-columns:28px minmax(0,1fr) 36px; gap:12px; padding:0 3vw; }
 .index-view .index-row.is-current { padding:0 3vw; block-size:160px; }
 .index-view .index-row strong { font-size:clamp(20px,4.8vw,32px); }
 .index-view .index-row.is-current strong { font-size:clamp(30px,7vw,48px); padding-inline-end:27vw; }
 .index-view .index-row span:nth-child(3) { display:none; }
 .index-view .navigator-media { top:calc(90px + (100svh - 145px) * .44); inline-size:27vw; right:5vw; }
 .navigator-controls { bottom:8px; }
}

/* One-line index labels with adjacent type and a larger cinematic preview. */
.index-view .index-row,
.index-view .index-row.is-current { grid-template-columns:36px max-content minmax(0,1fr); column-gap:clamp(12px,1.25vw,24px); padding-inline:5vw 32vw; }
.index-view .index-row strong { white-space:nowrap; text-wrap:nowrap; font-size:clamp(22px,2.3vw,44px); }
.index-view .index-row.is-current strong { font-size:clamp(34px,min(4.6vw,calc(70vw / var(--title-length))),92px); padding:0; }
.index-view .index-row span:nth-child(3) { white-space:nowrap; font-size:clamp(9px,.65vw,12px); letter-spacing:0; }
.index-view .navigator-media { inline-size:28vw; max-inline-size:560px; aspect-ratio:21 / 9; right:3vw; }
@media(max-width:1100px) and (min-width:761px) {
 .index-view .index-row,.index-view .index-row.is-current { padding-inline:2vw 31vw; grid-template-columns:24px max-content minmax(0,1fr); gap:10px; }
 .index-view .index-row.is-current strong { font-size:clamp(28px,min(4.2vw,calc(64vw / var(--title-length))),52px); }
 .index-view .index-row span:nth-child(3) { font-size:8px; }
}
@media(max-width:760px) {
 .index-view .index-row,.index-view .index-row.is-current { grid-template-columns:22px max-content; padding:0 1vw; gap:9px; }
 .index-view .index-row strong { font-size:clamp(16px,4vw,26px); }
 .index-view .index-row.is-current strong { font-size:clamp(20px,min(6vw,calc(105vw / var(--title-length))),36px); }
 .index-view .index-row span:nth-child(3) { display:none; }
 .index-view .navigator-media { inline-size:36vw; right:5vw; transform:translateY(28px); }
}

/* Centre the title group and bring the larger preview inward. */
@media(min-width:1101px) {
 .index-view .index-row,.index-view .index-row.is-current { padding-inline:15vw 37vw; column-gap:18px; }
 .index-view .index-row.is-current strong { font-size:clamp(34px,min(4.6vw,calc(55vw / var(--title-length))),92px); }
 .index-view .index-row span:nth-child(3) { margin-inline-start:clamp(30px,3vw,64px); }
 .index-view .navigator-media { inline-size:34vw; max-inline-size:680px; right:3vw; }
}
@media(max-width:1100px) and (min-width:761px) {
 .index-view .index-row,.index-view .index-row.is-current { padding-inline:9vw 37vw; }
 .index-view .index-row.is-current strong { font-size:clamp(26px,min(4vw,calc(49vw / var(--title-length))),48px); }
 .index-view .index-row span:nth-child(3) { margin-inline-start:20px; }
 .index-view .navigator-media { inline-size:34vw; right:3vw; }
}

/* Timeline preview sizing, retaining its cinematic ratio and offset. */
.index-view .navigator-media { inline-size:37.57vw; max-inline-size:751.4px; right:calc(3vw + 50px); aspect-ratio:21 / 9; }
@media(max-width:760px) {
 .index-view .navigator-media { inline-size:39.78vw; right:calc(5vw + 50px); }
}

/* Larger, inset masthead with breathing room above. */
.topbar { padding:calc(1.15rem + 16px) calc(1.25rem + 60px) 1.15rem; font-size:.897rem; }
.topbar .identity img { width:clamp(7.82rem,9.775vw,9.89rem); }
@media(max-width:760px) {
 .topbar { padding:28px 24px 16px; font-size:.7475rem; }
 .topbar .identity img { width:5.175rem; }
 .topbar .utility { gap:clamp(8px,2vw,16px); }
}

/* Timeline study: a centred cinematic frame behind the existing navigator. */
.index-view .navigator-media {
 z-index:1; top:50%; left:50%; right:auto;
 inline-size:min(75vw,175svh); max-inline-size:none; aspect-ratio:21 / 9;
 transform:translate(-50%,-50%);
}
.index-view .navigator-titles { inset:0; z-index:20; pointer-events:none; mix-blend-mode:difference; }
.index-view .index-row,.index-view .index-row.is-current {
 top:50%; left:0; inline-size:100%; padding-inline:4vw;
 grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr);
 column-gap:clamp(18px,2vw,36px); color:#fff;
 border-block-end-color:rgba(255,255,255,.18); pointer-events:auto;
}
.index-view .index-row strong { text-align:center; }
.index-view .index-row span:first-child { justify-self:end; }
.index-view .index-row span:nth-child(3) { justify-self:start; margin-inline-start:0; }
@media(max-width:760px) {
 .index-view .index-row,.index-view .index-row.is-current {
  grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr);
  column-gap:9px; padding-inline:3vw;
 }
}

/* Hybrid cinematic index: the title leads, the film supports. */
.index-view .navigator-media { inline-size:min(72vw,168svh); top:52%; aspect-ratio:21 / 9; }
.index-view .navigator-media::after { display:block; background:rgba(20,20,18,.10); }
.index-view .navigator-titles { mix-blend-mode:normal; block-size:auto; }
.index-view .index-row { mix-blend-mode:difference; block-size:72px; border-block-end-color:rgba(255,255,255,.10); transition:opacity 650ms ease,filter 650ms ease,color 200ms ease; }
.index-view .index-row.is-current { mix-blend-mode:normal; color:#f7f6f2; block-size:160px; border:0; text-shadow:0 2px 18px rgba(0,0,0,.32); }
.index-view .index-row.is-current strong { font-size:clamp(38px,min(6.2vw,calc(88vw / var(--title-length))),112px); }
.index-view .index-row:hover,.index-view .index-row:focus-visible { color:#fff; }
.index-view .index-row span { opacity:.65; }
.index-view .navigator-media video { transition:opacity 800ms ease; }
@media(max-width:760px) {
 .index-view .navigator-media { inline-size:88vw; top:55%; }
 .index-view .index-row,.index-view .index-row.is-current { top:30%; block-size:48px; mix-blend-mode:normal; color:#706f68; border:0; text-shadow:none; }
 .index-view .index-row.is-current { color:#252522; block-size:80px; }
 .index-view .index-row.is-current strong { font-size:clamp(24px,min(8vw,calc(120vw / var(--title-length))),48px); }
 .index-view .index-row span:first-child { font-size:10px; }
 .index-view .index-row:hover,.index-view .index-row:focus-visible { color:#252522; }
}
@media(prefers-reduced-motion:reduce) { .index-view .index-row,.index-view .navigator-media video { transition:none; } }

/* v1.0 usability repairs, preserving the approved composition. */
body.is-index-mode .topbar { color:#292822; text-shadow:none; }
body.is-index-mode .topbar .identity img { filter:invert(1); }
.navigator-controls .navigator-play { inline-size:auto; padding-inline:12px; font-size:12px; }
.navigator-controls .navigator-play[hidden] { display:none; }
.topbar a,.topbar button { min-block-size:44px; display:flex; align-items:center; }
.topbar a:focus-visible,.topbar button:focus-visible,.home-contact a:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
@media(max-width:760px) {
 .projects #project-04 .project-copy h2 { overflow-wrap:anywhere; }
 .projects #project-04 .project-copy h2 br { display:none; }
 .index-view .index-row,.index-view .index-row.is-current { grid-template-columns:minmax(0,1fr) minmax(0,82vw) minmax(0,1fr); }
 .index-view .index-row strong { white-space:normal; text-wrap:balance; }
 .index-view .navigator-titles { touch-action:none; }
 .topbar { position:fixed; }
}

.topbar.is-on-light { color:#292822; text-shadow:none; }
.topbar.is-on-light .identity img { filter:invert(1); }

/* Native scroll supplies progress; the approved visual stage stays stationary. */
body.is-index-mode { overflow-x:clip; overflow-y:visible; }
.index-view { position:relative; inset:auto; block-size:var(--navigator-scroll-size,100svh); min-block-size:100svh; padding:0; overflow:visible; }
.navigator-stage { position:sticky; top:0; block-size:100svh; inline-size:100%; overflow:hidden; background:inherit; }
.index-view .navigator-titles { touch-action:pan-y; }
.navigator-poster { position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:cover; opacity:1; transition:opacity 800ms ease; }
.navigator-poster.is-loaded { opacity:0; }
.index-view .navigator-media video { z-index:1; }
@media(prefers-reduced-motion:reduce) { .navigator-poster { transition:none; } }
/* Preserve continuous menu motion rather than restarting each row reveal. */
.index-view .index-row,.index-view .index-row.is-current { transition:transform 650ms cubic-bezier(.22,.65,.25,1),opacity 650ms ease,filter 650ms ease,color 200ms ease; will-change:transform,opacity; }
@media(prefers-reduced-motion:reduce) { .index-view .index-row,.index-view .index-row.is-current { transition:none; } }

/* Timeline only: native page scroll, short travel, continuously sampled titles. */
body.is-index-mode { overflow:visible; }
.index-view { overflow:visible; }
.navigator-stage { position:sticky; top:0; block-size:100vh; overflow:hidden; }
.index-view .index-row,.index-view .index-row.is-current {
 transform:translateY(calc(-50% + var(--row-y))) scale(var(--row-scale));
 opacity:var(--row-opacity); filter:blur(var(--row-blur));
 block-size:calc(72px + 88px * var(--row-focus,0));
 transition:color 200ms ease;
}
.index-view .index-row strong,.index-view .index-row.is-current strong {
 --inactive-type:clamp(22px,2.3vw,44px);
 --active-type:clamp(38px,min(6.2vw,calc(88vw / var(--title-length))),112px);
 font-size:calc(var(--inactive-type) + (var(--active-type) - var(--inactive-type)) * var(--row-focus,0));
}
.navigator-slot { position:absolute; inset:0; opacity:0; transition:opacity 700ms ease; }
.navigator-peek { position:absolute; inset:0; z-index:2; inline-size:100%; block-size:100%; object-fit:cover; opacity:0; pointer-events:none; transition:opacity 180ms ease; }
@media(max-width:760px) {
 .index-view .index-row,.index-view .index-row.is-current { block-size:calc(48px + 32px * var(--row-focus,0)); }
 .index-view .index-row strong,.index-view .index-row.is-current strong {
  --inactive-type:clamp(16px,4vw,26px);
  --active-type:clamp(24px,min(8vw,calc(120vw / var(--title-length))),48px);
 }
}
@media(prefers-reduced-motion:reduce) { .navigator-slot,.navigator-peek { transition:none; } }

/* One-line supporting statement on desktop; natural wrapping on small screens. */
.hero-description { position:relative; left:50%; transform:translateX(-50%); inline-size:max-content; max-inline-size:92vw; white-space:nowrap; }
@media (min-width:761px) and (max-width:1200px) { .hero-description { font-size:2vw; } }
@media (max-width:760px) { .hero-description { position:static; transform:none; inline-size:auto; max-inline-size:100%; white-space:normal; } }

/* Project 01: clearer editorial separation of credits and project link. */
.projects #project-01 .thought-credits { grid-column:2 / 7; }
.projects #project-01 .project-text-link { grid-column:8 / -1; justify-self:end; color:#262622; font-size:12px; font-weight:500; gap:20px; white-space:nowrap; }
.projects #project-01 .project-text-link::before { inline-size:clamp(100px,12vw,220px); flex-shrink:0; opacity:.7; }
@media (max-width:1100px) { .projects #project-01 .thought-credits { grid-column:1 / 5; } .projects #project-01 .project-text-link { grid-column:5 / -1; } }
@media (max-width:760px) { .projects #project-01 .thought-credits,.projects #project-01 .project-text-link { grid-column:1 / -1; } .projects #project-01 .project-text-link { justify-self:end; } }

/* Hero support: book-weight roman serif, distinct from the headline sans. */
.hero-description { font-family:Georgia,"Times New Roman",serif; font-style:normal; font-weight:400; font-size:clamp(1.75rem,2.1vw,1.925rem); letter-spacing:0; }
@media (min-width:761px) and (max-width:1200px) { .hero-description { font-size:2.24vw; } }
@media (max-width:760px) { .hero-description { font-size:1.575rem; } }

/* Shared credits and CTA row, with a measured 50px separation. */
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-footer { display:flex; justify-content:flex-start; align-items:center; flex-wrap:wrap; column-gap:50px; row-gap:24px; }
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-credits { flex:0 1 auto; max-inline-size:100%; max-width:none; margin:0; }
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .project-text-link { flex:0 0 auto; margin:0; font-size:12px; font-weight:500; gap:20px; white-space:nowrap; }
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .project-text-link::before { inline-size:clamp(100px,12vw,220px); width:clamp(100px,12vw,220px); flex-shrink:0; opacity:.7; }

/* Distinct neo-grotesk support face; preserve all existing sizing and layout. */
@font-face { font-family:"ArsSonic Editorial Sans"; src:url("./assets/nimbus-sans-regular.otf") format("opentype"); font-style:normal; font-weight:400; font-display:swap; }
.hero-description { font-family:"ArsSonic Editorial Sans",Helvetica,sans-serif; font-style:normal; font-weight:400; letter-spacing:.005em; }

/* Shared editorial copy hierarchy; preserve each project composition. */
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement > p { font-size:clamp(20px,1.7vw,25px); font-weight:400; line-height:1.3; }
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement > p:first-child { font-size:clamp(24px,2.2vw,32px); line-height:1.25; }
.projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement > p.thought-manifesto { font-size:clamp(22px,1.9vw,28px); line-height:1.28; }

/* Start the credits/CTA block on the same column as its editorial copy. */
.projects #project-01 .creative-thought > .thought-footer { grid-column:2 / -1; }
@media (max-width:1100px) { .projects #project-01 .creative-thought > .thought-footer { grid-column:1 / -1; } }

/* Woven Light: calmer methodology copy within the shared hierarchy. */
.projects #project-03 .thought-statement > p:not(:first-child):not(.thought-manifesto) { font-size:clamp(20px,1.65vw,24px); line-height:1.3; }

/* Place to Be: measured breathing room around the dark chapter and its copy. */
.projects #project-02 { padding-block-start:calc(var(--chapter-top) + 40px); padding-block-end:calc(var(--chapter-end) + 40px); }
.projects #project-02 .creative-thought { margin-block-start:calc(var(--media-thought) + 32px); }
@media (max-width:760px) {
 .projects #project-02 { padding-block-start:calc(var(--chapter-top) + 24px); padding-block-end:calc(var(--chapter-end) + 24px); }
 .projects #project-02 .creative-thought { margin-block-start:calc(var(--media-thought) + 24px); }
}

/* Horse / Nietzsche: match the measured chapter breathing room. */
.projects #project-04 { padding-block-start:calc(var(--chapter-top) + 40px); padding-block-end:calc(var(--chapter-end) + 40px); }
.projects #project-04 .creative-thought { margin-block-start:calc(var(--media-thought) + 32px); }
@media (max-width:760px) {
 .projects #project-04 { padding-block-start:calc(var(--chapter-top) + 24px); padding-block-end:calc(var(--chapter-end) + 24px); }
 .projects #project-04 .creative-thought { margin-block-start:calc(var(--media-thought) + 24px); }
}

/* AEORON: balanced chapter, media-to-copy and closing rhythm. */
.projects #project-05 { padding-block-start:calc(var(--chapter-top) + 40px); padding-block-end:calc(var(--chapter-end) + 40px); }
.projects #project-05 .creative-thought { margin-block-start:calc(var(--media-thought) + 32px); }
.projects #project-05 .thought-footer { margin-block-start:64px; }
@media (max-width:760px) {
 .projects #project-05 { padding-block-start:calc(var(--chapter-top) + 24px); padding-block-end:calc(var(--chapter-end) + 24px); }
 .projects #project-05 .creative-thought { margin-block-start:calc(var(--media-thought) + 24px); }
 .projects #project-05 .thought-footer { margin-block-start:48px; }
}

/* About: a quiet manifesto and the shared editorial metadata / CTA row. */
.home-about-support .home-about-manifesto { margin-block-start:40px; color:#34312c; font-size:clamp(24px,2vw,30px); line-height:1.28; }
.home-about-foot { justify-content:flex-start; align-items:baseline; flex-direction:row; flex-wrap:wrap; column-gap:50px; row-gap:24px; }
.home-about-foot p { white-space:nowrap; }
.home-about-foot .closing-link { display:inline-flex; align-items:center; gap:20px; flex-shrink:0; color:#34312c; font-size:12px; font-weight:500; white-space:nowrap; }
.home-about-foot .closing-link::before { content:""; display:block; inline-size:clamp(100px,12vw,220px); block-size:1px; background:currentColor; opacity:.7; }
.home-about-foot .closing-link span { transition:transform 200ms ease; }
.home-about-foot .closing-link:hover span { transform:translate(3px,-3px); }
@media (max-width:760px) { .home-about-foot p { white-space:normal; } }
@media (prefers-reduced-motion:reduce) { .home-about-foot .closing-link span { transition:none; } }

/* About-only commercial copy hierarchy, preserving the existing grid. */
.home-about-statement { font-size:clamp(34px,4vw,60px); line-height:1.14; font-weight:400; max-inline-size:1000px; margin-block:64px 80px; }
.home-about-support { max-inline-size:740px; }
.home-about-support > p { font-size:clamp(20px,1.5vw,22px); line-height:1.4; }
.home-about-support > p + p { margin-block-start:32px; }
.home-about-support > p:nth-child(4) { margin-block-start:56px; }
.home-about-support > .home-about-manifesto { font-size:clamp(24px,2vw,30px); line-height:1.28; margin-block-start:40px; }
@media (max-width:760px) {
 .home-about-statement { margin-block:48px 56px; }
 .home-about-support > p + p { margin-block-start:28px; }
 .home-about-support > p:nth-child(4) { margin-block-start:40px; }
 .home-about-support > .home-about-manifesto { margin-block-start:32px; }
}

/* About: three flowing paragraphs and a quieter closing statement. */
.home-about-statement { font-size:clamp(34px,4vw,58px); }
.home-about-support { max-inline-size:760px; }
.home-about-support > p { font-size:clamp(21px,1.6vw,23px); line-height:1.45; }
.home-about-support > p + p { margin-block-start:30px; }
.home-about-support > p.home-about-manifesto { font-size:clamp(26px,2vw,29px); line-height:1.28; margin-block-start:44px; font-weight:400; }
@media (max-width:760px) {
 .home-about-support > p + p { margin-block-start:28px; }
 .home-about-support > p.home-about-manifesto { margin-block-start:36px; }
}

/* Wider About body, retaining the main statement's left grid anchor. */
@media (min-width:1101px) {
 .home-about .home-about-support { grid-column:3 / -1; inline-size:100%; max-inline-size:1100px; }
}

/* About opening: a broad two-line measure on large desktop screens. */
@media (min-width:1101px) {
 .home-about .home-about-statement { grid-column:3 / -1; inline-size:100%; max-inline-size:1280px; text-wrap:balance; }
}

/* Temporary cinematic fragments between the studio introduction and contact. */
.studio-image-trail { position:relative; background:#efede7; min-block-size:85svh; padding-block-end:180px; overflow:hidden; }
.studio-trail-stage { position:relative; block-size:65svh; min-block-size:440px; touch-action:pan-y; }
.studio-trail-frame { position:absolute; margin:0; pointer-events:none; opacity:0; transition:opacity 320ms ease; transform:translate(-50%,-50%) rotate(var(--frame-angle)); }
.studio-trail-frame img { display:block; inline-size:100%; block-size:auto; max-block-size:340px; object-fit:contain; box-shadow:0 6px 24px rgba(40,35,30,.035); }
.studio-trail-caption { margin:40px var(--portfolio-pad) 0; font-family:Georgia,'Times New Roman',serif; font-size:clamp(16px,1.2vw,19px); line-height:1.5; color:#777168; }
.studio-trail-mobile { display:none; }
@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce), (max-width:760px) {
 .studio-image-trail { min-block-size:0; padding-block:40px 110px; }
 .studio-trail-stage { display:none; }
 .studio-trail-mobile { display:flex; gap:24px; overflow-x:auto; padding:12px var(--portfolio-pad) 24px; scrollbar-width:thin; }
 .studio-trail-mobile figure { flex:0 0 auto; margin:0; inline-size:65vw; max-inline-size:420px; align-self:center; }
 .studio-trail-mobile figure:nth-child(3n+1) { inline-size:42vw; max-inline-size:260px; }
 .studio-trail-mobile img { display:block; inline-size:100%; block-size:auto; max-block-size:380px; object-fit:contain; }
 .studio-trail-mobile:focus-visible { outline:2px solid #777168; outline-offset:-3px; }
 .studio-trail-caption { margin-block-start:24px; }
}

/* Reference-inspired spatial spread: steady fragments with pointer-led focus. */
.studio-image-trail { min-block-size:110svh; padding-block-end:160px; }
.studio-trail-stage { block-size:95svh; min-block-size:700px; }
.studio-trail-caption { position:absolute; top:6%; left:8%; margin:0; max-inline-size:230px; font-size:clamp(18px,1.6vw,24px); z-index:30; pointer-events:none; }
.studio-world-note { position:absolute; right:8%; bottom:23%; margin:0; color:#777168; font:clamp(18px,1.6vw,24px)/1.4 Georgia,serif; z-index:30; pointer-events:none; }
.studio-world-fragment { position:absolute; margin:0; opacity:.35; filter:blur(2px); transition:opacity 600ms ease,filter 600ms ease; pointer-events:none; }
.studio-world-fragment img { display:block; width:100%; height:auto; max-height:52svh; object-fit:contain; }
.studio-world-fragment:is(.fragment-0,.fragment-1,.fragment-5) { opacity:.9; filter:none; z-index:2; }
.studio-world-fragment.is-near { opacity:1; filter:none; z-index:3; }
.studio-trail-frame { z-index:10; }
.studio-trail-frame img { max-block-size:420px; }
.studio-trail-marker { position:absolute; width:46px; height:46px; border:1px solid rgba(70,65,55,.4); border-radius:50%; transform:translate(-50%,-50%); pointer-events:none; opacity:0; z-index:40; }
.studio-trail-marker::after { content:""; position:absolute; width:3px; height:3px; background:#706b63; border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); }
@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce), (max-width:760px) {
 .studio-image-trail { min-block-size:0; padding-block:40px 110px; }
 .studio-trail-caption { position:static; margin:24px var(--portfolio-pad) 0; max-inline-size:none; font-size:18px; }
 .studio-trail-caption br { display:none; }
 .studio-world-note { position:static; margin:24px var(--portfolio-pad) 0; font-size:16px; }
}

/* Suspended visual world. Scoped to the interlude between About and Contact. */
.studio-image-trail{min-block-size:0;padding:0 0 clamp(180px,18vw,280px);background:#efede7;overflow:hidden;isolation:isolate}
.studio-trail-stage{display:block;position:relative;block-size:170svh;min-block-size:1000px;max-block-size:1900px;overflow:hidden}
.studio-trail-mobile{display:none!important}
.studio-trail-caption{position:absolute;inset:6% auto auto 7%;max-inline-size:280px;font:400 clamp(16px,1.3vw,20px)/1.5 Georgia,serif;z-index:8;margin:0;color:#68645e}
.studio-world-note{position:absolute;inset:auto 8% 17% auto;font:400 16px/1.4 Georgia,serif;z-index:8;margin:0;color:#858079}
.memory-fragment{position:absolute;margin:0;opacity:0;transform:translateY(var(--reveal-y,24px));filter:blur(var(--reveal-blur,0px));transition:opacity 700ms ease,filter 900ms ease,transform 900ms ease;pointer-events:none}
.memory-fragment.front{z-index:4}.memory-fragment.middle{z-index:3}.memory-fragment.distant{z-index:1}
.memory-surface{--attention:0;transform:translate(var(--attention-x,0px),var(--attention-y,0px)) scale(calc(1 + var(--attention)*.015));transition:transform 650ms ease,filter 650ms ease;filter:blur(calc((1 - var(--attention)) * .6px))}
.distant .memory-surface{filter:blur(calc(6px - var(--attention)*2px))}
.front .memory-surface{filter:none}
.memory-surface img{display:block;inline-size:100%;block-size:auto;max-block-size:48svh;object-fit:contain;animation:memory-suspension var(--float-duration) ease-in-out var(--float-delay) infinite alternate;animation-play-state:paused}
.memory-is-visible .memory-surface img{animation-play-state:running}
@keyframes memory-suspension{from{transform:translate(0,0)}to{transform:translate(var(--float-x),calc(-1 * var(--float-y)))}}
.memory-threads{position:absolute;inset:0;inline-size:100%;block-size:100%;z-index:2;pointer-events:none;transition:opacity 900ms ease;fill:none;stroke:#999084;stroke-width:.5;opacity:.3}
.memory-threads path{vector-effect:non-scaling-stroke}
.studio-trail-marker{inline-size:28px;block-size:28px;z-index:9}
@media(max-width:760px){
 .studio-image-trail{padding-block-end:150px}
 .studio-trail-stage{block-size:1450px;min-block-size:0;max-block-size:none}
 .studio-trail-caption{position:absolute;inset:40px auto auto 7%;max-inline-size:230px;font-size:16px;margin:0}
 .studio-world-note{position:absolute;inset:auto 7% 100px auto;font-size:14px;margin:0}
 .memory-fragment.front{width:38%!important}.memory-fragment.middle{width:29%!important}.memory-fragment.distant{width:37%!important}
 .memory-fragment{left:clamp(3%,var(--mobile-x,30%),65%)!important}
 .memory-fragment:nth-of-type(3n){--mobile-x:58%}.memory-fragment:nth-of-type(3n + 1){--mobile-x:8%}.memory-fragment:nth-of-type(3n + 2){--mobile-x:35%}
 .memory-surface img{max-block-size:290px}
 .studio-trail-marker{display:none}
}
@media(prefers-reduced-motion:reduce){
 .memory-fragment{transition:none;transform:none;filter:none}
 .memory-surface,.memory-surface img{animation:none!important;transform:none!important;transition:none}
 .memory-threads{transition:none}
 .studio-trail-marker{display:none}
}

/* One mobile composition layer. Desktop art direction is unchanged. */
@media(max-width:760px){
 :root{--portfolio-pad:22px;--portfolio-gap:16px;--chapter-top:80px;--chapter-end:100px;--title-media:40px;--media-thought:48px}
 .topbar{padding:18px 20px;gap:12px;grid-template-columns:auto 1fr auto;font-size:11px}
 .topbar .identity img{width:94px}
 .topbar .view-controls{justify-self:center}
 .topbar .utility{gap:12px;align-items:center;font-size:10px;line-height:1.3}
 .topbar .utility a{display:flex;align-items:center;min-height:44px}
 .topbar .utility a[href*="instagram"]{display:none}
 .timeline-intro{position:relative;min-height:100svh;height:100svh}
 .hero-copy{width:calc(100% - 44px);bottom:112px;left:50%;margin:0}
 .hero-heading-block{width:100%;max-width:100%}
 .timeline-intro h1{display:block;white-space:normal!important;font-size:clamp(38px,10.5vw,64px);line-height:1.04;letter-spacing:-.045em;text-wrap:balance;min-height:3.2em}
 .timeline-intro h1 .hero-changing-word{display:inline;white-space:normal;max-width:100%}
 .hero-support{width:100%;max-width:100%;margin-top:20px}
 .hero-description{left:auto;position:static;transform:none;width:100%;inline-size:100%;max-inline-size:100%;white-space:normal;font-size:17px;line-height:1.5;text-wrap:pretty}
 .hero-actions{margin-top:26px}
 .hero-title-data{font-size:9px;margin-bottom:20px}
 .projects{padding:0;width:100%;margin:0}
 .timeline-rail,.place-spine{display:none}
 .projects .project-step{width:100%;inline-size:100%;margin:0;min-height:0;min-block-size:0;padding:80px 22px 100px;display:flex;align-items:stretch;overflow:visible}
 .projects .project-step .project-copy{width:100%;inline-size:100%;min-height:0;margin:0 0 40px;padding:0}
 .projects .project-step .project-copy h2{font-size:clamp(36px,10vw,52px);line-height:1.06;letter-spacing:-.035em;white-space:normal;text-wrap:balance;overflow-wrap:normal}
 .projects .project-step .project-eyebrow{font-size:10px;line-height:1.6;letter-spacing:.1em;margin:0 0 22px;white-space:normal}
 .projects .project-step .project-media{width:100%;inline-size:100%;height:auto;block-size:auto;min-height:0;min-block-size:0;max-height:none;max-block-size:none;position:relative;inset:auto;margin:0;transform:none;clip-path:none;aspect-ratio:21/9;overflow:hidden;box-shadow:none;opacity:1}
 .projects .project-step .project-media video{display:block;width:100%;height:100%;object-fit:contain;transform:none}
 .projects #project-02 .place-perspective{width:100%;inline-size:100%;height:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;perspective:none}
 .projects #project-02 .place-film{grid-column:1/-1}
 .projects #project-02 .memory-panel{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:3/4;clip-path:none;transform:none;box-shadow:none;margin:6px 0 0;opacity:1;filter:none}
 .projects #project-02 .memory-panel img{width:100%;height:100%;object-fit:cover}
 .projects #project-03{display:flex;flex-direction:column;padding:80px 22px 100px;min-height:0}
 .projects #project-03 .woven-copy{display:contents;padding:0;height:auto;block-size:auto}
 .projects #project-03 .project-copy{order:0}
 .projects #project-03 .woven-image{order:1;aspect-ratio:21/9}
 .projects #project-03 .creative-thought{order:2}
 .projects #project-03 .thought-footer{order:3}
 .projects #project-04 .horse-film,.projects #project-05 .aeoron-film{width:100%;inline-size:100%;aspect-ratio:21/9}
 .projects #project-06 .adorned-composition{width:100%;inline-size:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
 .projects #project-06 .adorned-film{grid-column:1/-1;grid-row:1;width:min(100%,300px);inline-size:min(100%,300px);aspect-ratio:9/16;justify-self:center}
 .projects #project-06 .adorned-stills{grid-column:span 1;display:grid;gap:14px}
 .projects #project-06 .adorned-stills img{width:100%;height:auto;object-fit:contain}
 .projects .project-step .creative-thought{width:100%;inline-size:100%;display:block;margin:48px 0 0;padding:0}
 .projects .project-step .thought-label{font-size:10px;letter-spacing:.12em;margin:0 0 22px}
 .projects .project-step .thought-statement{width:100%;inline-size:100%;max-width:none;max-inline-size:none}
 .projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement>p{font-size:17px;line-height:1.5;letter-spacing:-.01em;margin:0}
 .projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement>p:first-child{font-size:22px;line-height:1.3}
 .projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement>p:not(:first-child):not(.thought-manifesto){font-size:17px;line-height:1.5}
 .projects .project-step .thought-statement>p+p{margin-top:24px}
 .projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-statement>p.thought-manifesto{font-size:20px;line-height:1.35;margin-top:32px}
 .projects :is(#project-01,#project-02,#project-03,#project-04,#project-05,#project-06) .thought-footer{width:100%;inline-size:100%;display:flex;flex-direction:column;align-items:flex-start;gap:20px;margin:34px 0 0}
 .projects .project-step .thought-credits{font-size:9px;line-height:1.7;letter-spacing:.08em;white-space:normal;width:100%;margin:0}
 .projects .project-step .project-text-link{font-size:11px;min-height:44px;gap:16px;align-self:flex-start}
 .projects .project-step .project-text-link::before{width:64px;inline-size:64px}
 .projects .place-reveal,.projects .woven-reveal{opacity:1!important;transform:none!important;filter:none!important}
 .home-about{padding:90px 22px;display:block}
 .home-about-statement{width:100%;inline-size:100%;font-size:34px;line-height:1.15;margin:36px 0}
 .home-about-support{width:100%;inline-size:100%;max-inline-size:none}
 .home-about-support p{font-size:17px;line-height:1.5;margin:0}
 .home-about-support p+p{margin-top:24px}
 .home-about-support p.home-about-manifesto{font-size:22px;line-height:1.35;margin-top:34px}
 .home-about-foot{display:flex;flex-direction:column;gap:20px;margin-top:40px;align-items:flex-start}
 .home-about-foot p{font-size:9px;letter-spacing:.08em;line-height:1.8;white-space:normal}
 .home-about-foot .closing-link{font-size:10px;min-height:44px}
 .home-about-foot .closing-link::before{width:50px;inline-size:50px}
 .studio-image-trail{padding:60px 22px 100px;min-height:0}
 .studio-trail-stage{display:none}
 .studio-trail-mobile{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px;padding:60px 0 0;overflow:visible}
 .studio-trail-mobile figure,.studio-trail-mobile figure:nth-child(3n){width:100%;max-width:none;flex:none;margin:0;align-self:center}
 .studio-trail-mobile figure:nth-child(even){transform:translateY(24px)}
 .studio-trail-mobile img{width:100%;height:auto;max-height:260px;object-fit:contain}
 .studio-trail-mobile figure:nth-child(3n){opacity:.55}
 .studio-trail-caption{position:static;font-size:16px;max-width:260px;margin:0;order:0}
 .studio-image-trail{display:flex;flex-direction:column}
 .studio-trail-mobile{order:1}
 .studio-world-note{position:static;font-size:14px;margin:70px 0 0;order:2}
 .home-contact{padding:90px 22px 28px;min-height:85svh;min-block-size:85svh}
 .home-contact h2{font-size:clamp(38px,10vw,52px);line-height:1.1;margin:50px 0 36px;overflow-wrap:normal}
 .closing-contact-links{font-size:16px;margin-top:40px}
 .closing-footer{padding-top:80px}
 .index-view .navigator-media{width:calc(100% - 32px);inline-size:calc(100% - 32px);left:50%;right:auto;top:50%;aspect-ratio:21/9}
 .index-view .index-row,.index-view .index-row.is-current{padding-inline:16px;grid-template-columns:24px minmax(0,1fr);column-gap:10px;max-width:100%}
 .index-view .index-row span:nth-child(3){display:none}
 .index-view .index-row strong,.index-view .index-row.is-current strong{white-space:normal;text-wrap:balance;--inactive-type:18px;--active-type:32px;line-height:1.1;max-width:100%}
 .index-view .index-row span:first-child{font-size:9px}
 .navigator-controls{bottom:30px;gap:18px}
 .navigator-controls button{min-width:44px;min-height:44px}
 .viewer{padding:70px 16px 30px}
 .viewer video,.viewer img{max-width:100%;max-height:75svh;object-fit:contain}
}

.editorial-arrow{display:block;inline-size:14px;block-size:14px;flex:none}
@media(max-width:760px){
 .projects #project-04 .project-copy h2{font-size:clamp(19px,5.25vw,36px);line-height:1.2;letter-spacing:-.035em;text-wrap:initial;white-space:nowrap}
 .projects #project-06 .adorned-stills{display:none}
 .projects #project-06 .adorned-composition{display:block}
 .projects #project-06 .adorned-film{display:block;margin-inline:auto}
 .editorial-arrow{inline-size:13px;block-size:13px}
}

/* Mobile framing corrections, with desktop preserved. */
@media(max-width:760px){
 .hero-copy{bottom:88px}
 .timeline-intro h1{min-height:0}
 .hero-description{font-size:clamp(12px,3.45vw,15px);line-height:1.5;text-wrap:balance}
 .hero-support{margin-top:20px}
 .hero-actions{margin-top:24px}
 .projects #project-01 .deck-card{display:none}
 .projects #project-01 .project-deck{display:block;width:100vw;inline-size:100vw;height:auto;block-size:auto;margin-inline:-22px;perspective:none;transform:none}
 .projects #project-01 .project-media{display:block;width:100%;inline-size:100%;margin:0;aspect-ratio:21/9}
 .projects .project-step .project-text-link::before{display:none;content:none}
 .projects .project-step .project-text-link{justify-content:flex-start;padding:0;align-self:flex-start;margin-inline:0}
 .projects #project-03 .creative-thought{margin-block-start:48px;margin-block-end:0}
 .projects #project-04 .project-copy h2{font-size:clamp(22px,6.5vw,30px);line-height:1.2;letter-spacing:-.035em;white-space:nowrap}
 .projects #project-06 .adorned-composition{width:100vw;inline-size:100vw;margin-inline:-22px}
 .projects #project-06 .adorned-film{width:100%;inline-size:100%;max-width:none;max-inline-size:none;margin:0;aspect-ratio:9/16}
}

@media(max-width:760px){
 .projects #project-04 .project-copy h2{overflow-wrap:normal;word-break:normal;white-space:nowrap}
 .projects #project-04 .project-copy h2 br{display:block}
 .projects #project-06 .adorned-composition{display:block;inline-size:100vw;width:100vw;max-inline-size:none;max-width:none;margin-inline:-22px;padding:0}
 .projects #project-06 .project-media.adorned-film{display:block;width:100vw;inline-size:100vw;min-width:0;min-inline-size:0;max-width:none;max-inline-size:none;margin:0;padding:0;border:0;aspect-ratio:9/16;height:auto;block-size:auto;transform:none;inset:auto}
 .projects #project-06 .project-media.adorned-film video{display:block;inline-size:100%;width:100%;height:100%;object-fit:cover}
}

/* Mobile full-bleed media: reset chapter geometry before breaking out of the text inset. */
@media(max-width:760px){
 .projects #project-02,.projects #project-06{width:100%;inline-size:100%;max-width:none;max-inline-size:none;margin:0;padding:80px 22px 100px;display:flex;flex-direction:column;align-items:stretch;box-sizing:border-box}
 .projects #project-02 .place-perspective,.projects #project-06 .adorned-composition{display:block;width:100vw;inline-size:100vw;max-width:none;max-inline-size:none;height:auto;block-size:auto;margin:0 -22px;padding:0;transform:none;perspective:none}
 .projects #project-02 .memory-panel,.projects #project-06 .adorned-stills{display:none}
 .projects #project-02 .project-media.place-film,.projects #project-06 .project-media.adorned-film{display:block;width:100%;inline-size:100%;max-width:none;max-inline-size:none;margin:0;padding:0;inset:auto;transform:none}
 .projects #project-02 .creative-thought,.projects #project-06 .creative-thought{width:100%;inline-size:100%;margin:48px 0 0;padding:0}
 .projects #project-02 > .thought-footer{width:100%;inline-size:100%;margin:34px 0 0;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
 .projects #project-02 .thought-credits,.projects #project-02 .project-text-link{margin-inline:0;padding-inline:0;align-self:flex-start;text-align:left}
 .projects #project-04 .project-copy h2{font-size:clamp(24px,7vw,48px);line-height:1.16;letter-spacing:-.035em;white-space:nowrap}
}

/* Keep mobile film geometry in flow and preserve a clear copy entrance. */
@media(max-width:760px){
 .projects #project-02 .project-media.place-film{position:relative;inset:auto;left:auto;top:auto;right:auto;bottom:auto;aspect-ratio:21/9;height:auto;block-size:auto;min-height:0;min-block-size:0;max-height:none;max-block-size:none;transform:none}
 .projects #project-02 .place-perspective{position:relative;min-height:0;flex-shrink:0}
 .projects #project-02 .creative-thought{position:relative;inset:auto;transform:none;margin-block-start:56px}
 .projects #project-04 .project-copy h2{font-size:clamp(25px,7.35vw,50px);line-height:1.16;letter-spacing:-.035em;white-space:nowrap}
 .home-about-foot p{white-space:nowrap;font-size:clamp(7px,2.05vw,9px);letter-spacing:.025em;max-inline-size:100%}
}

/* Mobile header baseline and lower hero composition. */
@media(max-width:760px){
 .topbar{grid-template-columns:minmax(0,1fr) auto auto;column-gap:20px;align-items:end}
 .topbar .identity{grid-column:1;grid-row:1;align-items:flex-end}
 .topbar .utility{grid-column:2;grid-row:1;justify-self:end;align-items:flex-end;font-size:11px;line-height:1.05}
 .topbar .view-controls{grid-column:3;grid-row:1;justify-self:end;align-self:end}
 .topbar .utility a,.topbar .view-button{align-items:flex-end;line-height:1.05;padding-block:0;margin:0}
 .hero-copy{bottom:60px}
}

/* Project copy alternatives share the existing hierarchy, without duplicate visible text. */
.projects .creative-thought .thought-statement--mobile{display:none}
@media(max-width:760px){
 .projects .creative-thought .thought-statement--desktop{display:none}
 .projects .creative-thought .thought-statement--mobile{display:block}
}

/* Mobile hero detail alignment and unified chapter credits. */
@media(max-width:760px){
 .topbar .view-controls{grid-column:2;grid-row:1}
 .topbar .utility{grid-column:3;grid-row:1}
 .topbar .utility a,.topbar .view-button{position:relative;top:-2px}
 .hero-title-data{margin-block-end:12px}
 .scroll-note{bottom:max(8px,env(safe-area-inset-bottom));}
 .projects #project-01 .thought-credits{font-size:9px;line-height:1.7;letter-spacing:.08em}
}

/* Mobile Timeline: one stationary portrait cinematic window behind the navigator. */
@media(max-width:760px){
 .navigator-stage{block-size:100svh}
 .index-view .navigator-media{position:absolute;left:50%;top:50%;right:auto;width:100%;inline-size:100%;max-width:none;max-inline-size:none;height:auto;block-size:auto;aspect-ratio:4/5;transform:translate(-50%,-50%);background:#181816;overflow:hidden;padding:0;border:0}
 .index-view .navigator-slot{inset:0 8px}
 .index-view .navigator-media video,.index-view .navigator-poster,.index-view .navigator-peek{width:100%;inline-size:100%;height:100%;block-size:100%;object-fit:cover}
 .index-view .navigator-peek{inset:0 8px;width:calc(100% - 16px);inline-size:calc(100% - 16px)}
 .index-view .index-row,.index-view .index-row.is-current{top:50%;padding-inline:22px;grid-template-columns:minmax(0,1fr);column-gap:0}
 .index-view .index-row span{display:none}
 .index-view .index-row.is-current{color:#f7f6f2;text-shadow:0 2px 16px rgba(0,0,0,.4)}
 .index-view .index-row strong{text-align:center}
}

/* Mobile Timeline: edge-to-edge tall frame and quiet title-card rules. */
@media(max-width:760px){
 .index-view .navigator-media{aspect-ratio:3/4;inline-size:100%;width:100%}
 .index-view .navigator-slot{inset:0}
 .index-view .navigator-peek{inset:0;inline-size:100%;width:100%}
 .index-view .index-row strong,.index-view .index-row.is-current strong{--inactive-type:20px;--active-type:clamp(34px,9.5vw,44px);display:inline-block;inline-size:fit-content;max-inline-size:100%;justify-self:center;position:relative;padding-block:14px}
 .index-view .index-row strong::before,.index-view .index-row strong::after{content:"";position:absolute;left:0;right:0;height:1px;background:rgba(247,246,242,.7);opacity:0;transition:opacity 300ms ease}
 .index-view .index-row strong::before{top:0}
 .index-view .index-row strong::after{bottom:0}
 .index-view .index-row.is-current strong::before,.index-view .index-row.is-current strong::after{opacity:var(--row-focus,1)}
}

/* Mobile navigator remains visually stationary throughout native menu scrolling. */
@media(max-width:760px){
 body.is-index-mode{overscroll-behavior-y:none}
 body.is-index-mode .navigator-stage{position:fixed;inset:0;inline-size:100%;block-size:100svh;height:100svh;z-index:10;overflow:hidden}
}

/* Add breathing room beneath the mobile Timeline header. */
@media(max-width:760px){
 .index-view .navigator-media{top:calc(50% + 32px)}
 .index-view .index-row,.index-view .index-row.is-current{top:calc(50% + 32px)}
}

/* Match mobile title visibility to the stationary 3:4 film window. */
@media(max-width:760px){
 .index-view .navigator-titles{inset:0;inline-size:100%;block-size:100%;overflow:hidden;clip-path:inset(max(0px,calc(50% + 32px - 66.666667vw)) 0 max(0px,calc(50% - 32px - 66.666667vw)) 0)}
 .index-view .index-row strong,.index-view .index-row.is-current strong{max-inline-size:100%;overflow-wrap:break-word}
}