/* Alternate whole-site direction. Current mode is deliberately untouched. */
.scroll-scene { display: contents }
.scene-index,.scene-lines { display: none }
html[data-site-mode=parallax] { --scene-cream: #f0ede5; --scene-dark: #181a19 }
html[data-site-mode=parallax] body { overflow-x: clip }
html[data-site-mode=parallax] .site-header { background: #102650f5; color: #f5f6ff; border-color: #ffffff20 }
html[data-site-mode=parallax] .site-header .brand-mark i { background: #edf0ff }
html[data-site-mode=parallax] .site-header .brand-mark i:nth-child(2) { background: #98b2ff }
html[data-site-mode=parallax] .site-header .menu-toggle>span { background: #edf0ff }
html[data-site-mode=parallax] .site-header .desktop-nav a:hover { border-color: #c1ceff }
html[data-site-mode=parallax] .site-header .mobile-nav { background: #102650; border-color: #ffffff20 }
html[data-site-mode=parallax] .site-header .projects-dropdown { background: #102650; color: #f5f6ff; border-color: #ffffff30 }
html[data-site-mode=parallax] .site-header .projects-dropdown a:hover,
html[data-site-mode=parallax] .site-header .projects-dropdown a:focus-visible { background: #ffffff12 }
html[data-site-mode=parallax] .site-header .projects-nav-toggle { border-color: #ffffff20 }
html[data-site-mode=parallax] .site-header .projects-nav-toggle:focus-visible { outline-color: #98b2ff }
html[data-site-mode=parallax] .site-header .projects-dropdown a:focus-visible { outline-color: #98b2ff }
html[data-site-mode=parallax] .home-page { background: #102650 }
html[data-site-mode=parallax] .home-page .scroll-scene { display: block; position: relative; height: 175svh }
html[data-site-mode=parallax] .home-page .scene-content {
  --scene-progress: 0; --art-y: 30px; --copy-y: 16px; --art-turn: -3deg; --art-scale: 1.025;
  position: sticky; top: var(--site-top); width: 100%; max-width: none;
  height: calc(100svh - var(--site-top)); min-height: 0; margin: 0; padding: 5vw;
  border-radius: 0; overflow: hidden; isolation: isolate;
  opacity: 1; transform: none; transition: none;
}
html[data-site-mode=parallax] .home-page .projects { width: 100%; max-width: none; padding: 0 }
html[data-site-mode=parallax] .home-page .project-grid { display: block; margin: 0 }
html[data-site-mode=parallax] .home-page .projects-heading { margin: 0; padding: 12vh 6vw; background: #102650; color: #ecf0ff; opacity: 1; transform: none }
html[data-site-mode=parallax] .home-page .projects-heading h2 { font-size: clamp(70px,15vw,220px); line-height: .95; letter-spacing: -.07em }
html[data-site-mode=parallax] .home-page .scene-content>.project-copy,
html[data-site-mode=parallax] .home-page .scene-content>.gallery-copy,
html[data-site-mode=parallax] .home-page .scene-content>.coaching-project-copy { position: relative; z-index: 3; transform: translateY(var(--copy-y)); padding: 0; min-width: 0; align-self: center }
html[data-site-mode=parallax] .home-page .project-copy { display: block }
html[data-site-mode=parallax] .home-page .project-meta,
html[data-site-mode=parallax] .home-page .coaching-project-copy .eyebrow { font-size: 9px; margin: 0 0 24px; color: inherit; opacity: .65 }
html[data-site-mode=parallax] .home-page .project-copy h3,
html[data-site-mode=parallax] .home-page .coaching-project-copy h3 { font-size: clamp(40px,5.5vw,88px); line-height: 1.04; letter-spacing: -.06em; margin-bottom: 24px }
html[data-site-mode=parallax] .home-page .project-copy h3 button>span { display: none }
html[data-site-mode=parallax] .home-page .project-copy>p,
html[data-site-mode=parallax] .home-page .gallery-copy>p,
html[data-site-mode=parallax] .home-page .coaching-project-copy>p:not(.eyebrow),
html[data-site-mode=parallax] .home-page .coaching-project-copy ul { font-size: clamp(14px,1.25vw,18px); line-height: 1.75; color: inherit; max-width: 440px }
html[data-site-mode=parallax] .home-page .scene-content .text-link { font-size: 13px; margin-top: 26px }
html[data-site-mode=parallax] .home-page .scene-content>.gallery-image,
html[data-site-mode=parallax] .home-page .scene-content>.project-visual,
html[data-site-mode=parallax] .home-page .scene-content>.coaching-project-art { transform: none; border-radius: 0; min-width: 0; align-self: center }
/* Opening: typography and the recursive cube move at different depths. */
html[data-site-mode=parallax] .home-page .scroll-scene[data-scene=hero] { height: 175svh; background: #253bb0 }
html[data-site-mode=parallax] .home-page .hero[data-hero-preview] { display: grid; grid-template-columns: 1fr; align-items: center; padding: 5vw; background: #253bb0; color: #f5f6ff }
html[data-site-mode=parallax] .home-page .hero-switch { display: none }
html[data-site-mode=parallax] .home-page .hero-copy { z-index: 3; width: 100%; max-width: none; padding: 0; text-align: center; align-self: center; transform: translateY(calc(var(--scene-progress)*-70px)) scale(calc(1 - var(--scene-progress)*.2)); transform-origin: center }
html[data-site-mode=parallax] .home-page .hero h1 { max-width: none; font-size: clamp(80px,15vw,230px); line-height: 1; letter-spacing: -.075em; text-wrap: nowrap; text-shadow: none }
html[data-site-mode=parallax] .home-page .hero-description { font-size: clamp(17px,1.7vw,25px); line-height: 1.5; color: #e4eaff; max-width: 31ch; margin: 32px auto 0 }
html[data-site-mode=parallax] .home-page .hero-art { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; background: none; border-radius: 0; z-index: 1; overflow: visible }
html[data-site-mode=parallax] .home-page .hero-art::after { background: linear-gradient(0deg,#253bb000 20%,#253bb050 80%); pointer-events: none }
html[data-site-mode=parallax] .home-page .hero .sculpture { inset: -35% -15% -35% 20%; opacity: .65; transform: translateY(calc(var(--scene-progress)*80px)) scale(calc(1 + var(--scene-progress)*.35)) rotate(calc(var(--scene-progress)*12deg)) }
html[data-site-mode=parallax] .scene-lines { display: block; position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; opacity: .3 }
html[data-site-mode=parallax] .scene-lines i { position: absolute; width: 22vw; aspect-ratio: 1; border: 1px solid #becbff; transform: rotate(calc(-25deg + var(--scene-progress)*45deg)); left: -10vw; top: 10%; }
html[data-site-mode=parallax] .scene-lines i:nth-child(2) { width: 12vw; left: auto; right: 8vw; top: 11%; transform: rotate(calc(25deg - var(--scene-progress)*30deg)) }
html[data-site-mode=parallax] .scene-lines i:nth-child(3) { width: 38vw; left: 32%; top: 75%; transform: rotate(calc(35deg - var(--scene-progress)*60deg)) }
/* Each project gets one uninterrupted, full-width scene. */
html[data-site-mode=parallax] .home-page [data-scene=gallery] { background: #e8e4db }
html[data-site-mode=parallax] .home-page .gallery-feature { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(0,.85fr); gap: 7vw; background: #e8e4db; color: #242a2a }
html[data-site-mode=parallax] .home-page .gallery-image { height: 72%; width: 100%; aspect-ratio: auto }
html[data-site-mode=parallax] .home-page .gallery-copy { display: flex; background: transparent }
html[data-site-mode=parallax] .home-page .gallery-wordmark { font-size: clamp(75px,9vw,145px); line-height: .85; color: #283a61; letter-spacing: -.075em; margin-bottom: 30px }
html[data-site-mode=parallax] .home-page .gallery-copy>p { max-width: 350px }
html[data-site-mode=parallax] .home-page [data-scene=notes] { background: #181a19 }
html[data-site-mode=parallax] .home-page .project-notes { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: center; gap: 8vw; background: #181a19; color: #f0eee8 }
html[data-site-mode=parallax] .home-page .project-notes .project-visual { max-height: 100%; aspect-ratio: 1.07 }
html[data-site-mode=parallax] .home-page .project-notes .ntmf-brand { opacity: 0 }
html[data-site-mode=parallax] .home-page .project-notes .phone-composition { inset: -20% 0 0; transform: translateY(calc(var(--scene-progress)*30px)) }
html[data-site-mode=parallax] .home-page .project-notes .phone-main { transform: translateY(calc(var(--scene-progress)*-45px)) rotate(calc(14deg - var(--scene-progress)*12deg)) }
html[data-site-mode=parallax] .home-page .project-notes .phone-back { transform: translateY(calc(var(--scene-progress)*45px)) rotate(calc(-14deg + var(--scene-progress)*9deg)) }
html[data-site-mode=parallax] .home-page [data-scene=cards] { background: #ede9e0 }
html[data-site-mode=parallax] .home-page .project-cards { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(0,.8fr); align-items: center; gap: 6vw; background: #ede9e0; color: #263959 }
html[data-site-mode=parallax] .home-page .project-cards .cards-visual { width: 100%; height: auto; max-height: none; transform: translateY(var(--art-y)); box-shadow: 0 30px 65px -45px #3a2f2260 }
html[data-site-mode=parallax] .home-page .project-cards .cards-visual>img { object-fit: contain; transform: none }
html[data-site-mode=parallax] .home-page [data-scene=education] { background: #243eb2; height: 185svh }
html[data-site-mode=parallax] .home-page .coaching-project { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); align-items: center; gap: 7vw; background: #243eb2; color: #f0f3ff }
html[data-site-mode=parallax] .home-page .coaching-project-art { width: 100%; aspect-ratio: 1.05; max-height: 95%; background: #14286e; grid-template-rows: minmax(0,1fr) auto }
html[data-site-mode=parallax] .home-page .coaching-project-copy h3 { font-size: clamp(37px,4.5vw,70px); margin-bottom: 20px }
html[data-site-mode=parallax] .home-page .coaching-project-copy>p:not(.eyebrow),html[data-site-mode=parallax] .home-page .coaching-project-copy ul { font-size: clamp(13px,1.12vw,16px); line-height: 1.65 }
html[data-site-mode=parallax] .home-page .coaching-art-brand { min-height: 95px }
html[data-site-mode=parallax] .home-page [data-scene=niki] { background: #e7edfa; height: 155svh }
html[data-site-mode=parallax] .home-page .niki-layout-preview { display: grid; place-items: center; background: #e7edfa; color: #142b52 }
html[data-site-mode=parallax] .home-page .niki-layout-panel { width: 100%; max-width: 1440px }
html[data-site-mode=parallax] .home-page .niki-feature { margin: 0 }
html[data-site-mode=parallax] .home-page .niki-header { transform: translateY(var(--copy-y)); margin-bottom: 55px }
html[data-site-mode=parallax] .home-page .niki-copy h3 { font-size: clamp(48px,7.8vw,120px); line-height: 1.02; letter-spacing: -.06em }
html[data-site-mode=parallax] .home-page .video-strip { gap: 3vw; margin: 0 }
html[data-site-mode=parallax] .home-page .video-strip>a { transform: translateY(calc(var(--art-y)*1.6)) }
html[data-site-mode=parallax] .home-page .video-strip>a:nth-child(2) { transform: translateY(calc(var(--art-y)*-.7)) }
html[data-site-mode=parallax] .home-page .video-strip p { color: #526583; font-size: 14px }
html[data-site-mode=parallax] .home-page .site-footer { color: #edf1ff; border-color: #ffffff20; padding-block: 65px 35px; background: #102650; width: 100%; max-width: none }
html[data-site-mode=parallax] .home-page .site-footer .brand-mark i { background: #e7edfa }
html[data-site-mode=parallax] .home-page .scene-index { display: flex; flex-direction: column; position: fixed; z-index: 30; right: 12px; top: 50%; transform: translateY(-50%); gap: 2px; mix-blend-mode: difference; color: white }
html[data-site-mode=parallax] .scene-index a { width: 25px; height: 29px; display: grid; place-items: center }
html[data-site-mode=parallax] .scene-index span { width: 4px; height: 4px; background: currentColor; border-radius: 50%; opacity: .4; transition: height .3s,opacity .3s }
html[data-site-mode=parallax] .scene-index [aria-current] span { height: 21px; border-radius: 2px; opacity: 1 }
/* Short and narrow screens keep the same chapter styling in natural flow. */
@media(max-width:1000px) {
  html[data-site-mode=parallax] .home-page .scene-content { padding: 4vw }
  html[data-site-mode=parallax] .home-page .project-notes,html[data-site-mode=parallax] .home-page .gallery-feature,html[data-site-mode=parallax] .home-page .project-cards,html[data-site-mode=parallax] .home-page .coaching-project { gap: 5vw }
  html[data-site-mode=parallax] .home-page .project-copy h3 { font-size: clamp(36px,5.7vw,60px) }
  html[data-site-mode=parallax] .home-page .coaching-project-copy h3 { font-size: 38px }
  html[data-site-mode=parallax] .home-page .coaching-project-copy ul,html[data-site-mode=parallax] .home-page .coaching-project-copy>p:not(.eyebrow) { font-size: 13px }
  html[data-site-mode=parallax] .home-page .scene-content .text-link { font-size: 12px }
  html[data-site-mode=parallax] .home-page .niki-header { align-items: start; gap: 25px; margin-bottom: 35px }
  html[data-site-mode=parallax] .home-page .niki-links { gap: 15px }
  html[data-site-mode=parallax] .home-page .niki-links .text-link { font-size: 12px }
}
@media(max-width:760px),(max-height:650px) {
  html[data-site-mode=parallax] .home-page .scroll-scene { height: auto }
  html[data-site-mode=parallax] .home-page .scene-content { position: relative; top: auto; height: auto; min-height: calc(100svh - var(--site-top)); padding: 65px 6vw; overflow: clip }
  html[data-site-mode=parallax] .home-page .scroll-scene[data-scene=hero] { height: auto }
  html[data-site-mode=parallax] .home-page .hero[data-hero-preview] { min-height: calc(100svh - var(--site-top)); padding: 80px 6vw }
  html[data-site-mode=parallax] .home-page .hero h1 { font-size: 16vw; text-wrap: balance; line-height: .98; max-width: 8ch; margin-inline: auto }
  html[data-site-mode=parallax] .home-page .hero-description { font-size: 17px; max-width: 29ch; margin-top: 28px }
  html[data-site-mode=parallax] .home-page .hero .sculpture { inset: -10% -70% -10% -40%; opacity: .6 }
  html[data-site-mode=parallax] .home-page .projects-heading { padding: 70px 6vw }
  html[data-site-mode=parallax] .home-page .project-notes,html[data-site-mode=parallax] .home-page .gallery-feature,html[data-site-mode=parallax] .home-page .project-cards,html[data-site-mode=parallax] .home-page .coaching-project { display: flex; flex-direction: column; gap: 45px; align-items: stretch }
  html[data-site-mode=parallax] .home-page .scene-content>.gallery-image,html[data-site-mode=parallax] .home-page .scene-content>.project-visual,html[data-site-mode=parallax] .home-page .scene-content>.coaching-project-art,html[data-site-mode=parallax] .home-page .scene-content>.project-copy,html[data-site-mode=parallax] .home-page .scene-content>.gallery-copy,html[data-site-mode=parallax] .home-page .scene-content>.coaching-project-copy { align-self: stretch; transform: none }
  html[data-site-mode=parallax] .home-page .gallery-image { height: auto; aspect-ratio: 1.4 }
  html[data-site-mode=parallax] .home-page .gallery-wordmark { font-size: 90px }
  html[data-site-mode=parallax] .home-page .project-copy h3,html[data-site-mode=parallax] .home-page .coaching-project-copy h3 { font-size: clamp(40px,10vw,64px) }
  html[data-site-mode=parallax] .home-page .project-copy>p,html[data-site-mode=parallax] .home-page .gallery-copy>p,html[data-site-mode=parallax] .home-page .coaching-project-copy>p:not(.eyebrow),html[data-site-mode=parallax] .home-page .coaching-project-copy ul { font-size: 15px; max-width: 500px }
  html[data-site-mode=parallax] .home-page .project-notes .project-visual { aspect-ratio: 1.07; max-height: none }
  html[data-site-mode=parallax] .home-page .coaching-project-art { aspect-ratio: 1.12; max-height: none }
  html[data-site-mode=parallax] .home-page .niki-header { display: block; margin-bottom: 35px }
  html[data-site-mode=parallax] .home-page .niki-copy h3 { font-size: clamp(45px,12vw,80px) }
  html[data-site-mode=parallax] .home-page .niki-links { margin-top: 25px }
  html[data-site-mode=parallax] .home-page .video-strip { display: grid; grid-template-columns: 1fr; gap: 30px }
  html[data-site-mode=parallax] .home-page .video-strip>a,html[data-site-mode=parallax] .home-page .video-strip>a:nth-child(2) { transform: none }
  html[data-site-mode=parallax] .home-page .scene-index { display: none }
}
@media(prefers-reduced-motion:reduce) {
  html[data-site-mode=parallax] .home-page .scroll-scene { height: auto }
  html[data-site-mode=parallax] .home-page .scene-content { position: relative; top: auto; height: auto; min-height: calc(100svh - var(--site-top)); padding-block: 70px }
  html[data-site-mode=parallax] .home-page .scene-content *,html[data-site-mode=parallax] .home-page .scene-content>*,html[data-site-mode=parallax] .scene-index span { transform: none !important; transition: none !important }
}
