/* One continuous background surface. Never applied above media. */
.content-ground { position:relative; isolation:isolate; background:#101713; background-image:none; }
.content-ground::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; background:url('/media/atmosphere.svg') center / cover no-repeat; }
.statement,.photo-edit,.services,.about,.contact { background:transparent; background-image:none; }
.photo-edit { background-color:rgba(190,190,160,.035); }
.about { background-color:rgba(0,0,0,.13); }
.site-header { padding:12px var(--inset); min-height:64px; transition:opacity 200ms,transform 200ms,background-color 200ms; }
.site-header .button { padding:.85em 1.3em; }
.site-header.in-film-scene { opacity:0; transform:translateY(-100%); pointer-events:none; }
.hero-chapter { height:auto; min-height:0; position:relative; z-index:2; }
.hero { position:relative; top:0; height:100svh; min-height:0; }
.hero__line,.hero__choices,.hero__controls,.hero__scroll { transform:none !important; }
.statement { min-height:0; padding:1.45rem var(--inset); border-bottom:1px solid var(--rule); }
.statement>.inset { position:static; padding:0; }
.statement p { max-width:70ch; font:300 clamp(1rem,1.6vw,1.25rem)/1.45 var(--serif); }
/* A complete scene: a single navigation bar plus one active project. */
.film-chapter { height:auto; position:relative; }
.work-browser { position:relative; top:0; height:100svh; min-height:0; padding:0; background:rgba(4,8,6,.43); overflow:visible; display:flex; flex-direction:column; border-bottom:1px solid var(--rule); }
.work-browser__heading { flex:0 0 56px; position:static; min-height:56px; top:auto; margin:0; padding:7px var(--inset); gap:2rem; background:rgba(4,8,6,.43); border-bottom:1px solid var(--rule); }
.scene-home { font:500 .63rem var(--mono); letter-spacing:.14em; text-transform:uppercase; text-decoration:none; white-space:nowrap; }
.work.work-browser > .work-browser__heading > .marker { flex:1; margin:0; font-size:.65rem; }
.work-browser__heading .marker::before { display:none; }
.work-arrows { gap:.4rem; align-items:center; }
.work-arrows button { width:38px; min-width:38px; height:38px; min-height:38px; }
.project-position { font-size:.65rem; }
.project-track { position:relative; flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr); align-items:center; padding:18px var(--inset) 70px; gap:0; overflow:visible; scroll-snap-type:none; outline-offset:-8px; }
.inline-project { grid-area:1/1; min-width:0; width:100%; max-width:1440px; margin:0 auto; padding:clamp(14px,1.8vw,25px); background:#101612; border:1px solid rgba(230,221,198,.28); box-shadow:none !important; scroll-margin-top:0; }
.inline-project[hidden] { display:none !important; }
.project-surface { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(230px,1fr); grid-template-rows:auto auto auto; column-gap:clamp(20px,3vw,40px); align-items:start; filter:none !important; opacity:1 !important; transition:none; }
.inline-project__heading { grid-column:1/-1; padding:0 0 14px; gap:1rem; }
.inline-project__heading h3 { margin-top:.25rem; font-size:clamp(2rem,3vw,3rem); line-height:1.02; }
.inline-project__heading .label { font-size:.62rem; }
.film-frame { grid-column:1; grid-row:2; min-width:0; padding:4px; margin:0; width:100%; max-height:calc(100svh - 200px); aspect-ratio:16/9; border-color:rgba(230,221,198,.28); }
.film-frame video { width:100%; height:100%; object-fit:contain; }
.playback-options { grid-column:1; grid-row:3; padding-top:8px; }
.inline-project__context { grid-column:2; grid-row:2; display:block; padding:0; }
.inline-project__context>p { font-size:clamp(.85rem,1.1vw,1rem); line-height:1.55; color:#E0DDD2; }
.inline-project__context .project-credit { margin-top:1rem; font-size:.71rem; line-height:1.6; color:#B8BCAF; }
.project-credit span { display:block; }
.project-stills { grid-column:2; grid-row:3; align-self:end; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:12px; }
.project-stills img { aspect-ratio:16/9; object-fit:contain; width:100%; height:auto; }
.project-surface.scene-enter { animation:scene-in 420ms ease both; }
@keyframes scene-in { from { opacity:.25; transform:translateY(8px); } to { opacity:1; transform:none; } }
/* Phone composition keeps the film and its complete frame visible together. */
@media(max-width:47.99em) {
 .scene-home { display:none; }
 .site-header { min-height:58px; padding-block:8px; }
 .work-browser__heading { flex-basis:48px; min-height:48px; padding-block:5px; gap:8px; }
 .work-browser__heading .marker { font-size:.63rem; }
 .work-arrows button { width:36px; min-width:36px; height:36px; min-height:36px; }
 .project-track { padding:10px var(--inset) 70px; }
 .inline-project { padding:12px; }
 .project-surface { display:flex; flex-direction:column; gap:0; }
 .inline-project__heading { width:100%; padding-bottom:10px; }
 .inline-project__heading h3 { font-size:2rem; }
 .inline-project__heading .label { font-size:.56rem; }
 .film-frame { width:100%; max-height:none; padding:3px; }
 .playback-options { width:100%; padding-top:7px; }
 .playback-options .label { font-size:.55rem; }
 .inline-project__context { padding-top:10px; width:100%; }
 .inline-project__context>p { font-size:.82rem; line-height:1.45; }
 .inline-project__context .project-credit { margin-top:8px; font-size:.63rem; line-height:1.4; }
 .project-credit span { display:inline; margin-left:.4em; }
 .project-stills { display:grid; width:100%; margin-top:10px; gap:5px; }
 .statement { padding-block:1.15rem; }
 .statement p { font-size:1rem; max-width:40ch; }
}
/* Natural scrolling on short windows, enlarged text, or reduced motion. */
@media(max-height:560px) {
 .hero-chapter,.film-chapter { height:auto; }
 .hero { min-height:480px; position:relative; }
 .work-browser { position:relative; height:auto; min-height:100svh; }
 .film-frame { max-height:none; }
}
.film-chapter.natural-flow { height:auto; }
.natural-flow .work-browser { position:relative; height:auto; min-height:100svh; }
@media(prefers-reduced-motion:reduce) {
 .hero-chapter,.film-chapter { height:auto; }
 .hero,.work-browser { position:relative; top:auto; }
 .work-browser { height:auto; min-height:100svh; }
 .project-surface.scene-enter { animation:none; }
 .site-header { transition:none; }
}

.project-support { grid-column:2; grid-row:2 / 4; display:flex; flex-direction:column; justify-content:space-between; align-self:stretch; gap:1.2rem; min-width:0; }
.project-support .project-stills { margin-top:0; align-self:auto; }
@media(max-width:47.99em) { .project-support { display:contents; } .project-support .project-stills { margin-top:10px; } }

/* Native page movement with a slower background; no scroll-distance holds. */
.hero__slides { transform:translate3d(0,var(--hero-media-offset,0px),0); will-change:transform; }
.project-deck { display:grid; width:100%; max-width:1440px; margin:auto; border:1px solid rgba(230,221,198,.28); background:#101612; }
.project-deck .inline-project { border:0; background:transparent; }
.film-switcher { grid-row:2; display:flex; align-items:center; justify-content:flex-end; gap:8px; margin:0 clamp(14px,1.8vw,25px); padding:10px 0; border-top:1px solid var(--rule); }
.film-switcher>.label { margin-right:auto; color:var(--muted); }
.film-switcher button { display:flex; align-items:center; gap:9px; min-height:44px; padding:8px 14px; color:var(--text); border:1px solid rgba(230,221,198,.35); background:transparent; cursor:pointer; font:400 .7rem var(--mono); }
.film-switcher button[aria-pressed="true"] { background:#d9d2bf; color:#111812; border-color:#d9d2bf; }
.film-switcher button:hover { border-color:#f1e9d5; }
.film-switcher button:focus-visible { outline:2px solid #f1e9d5; outline-offset:3px; }
@media(max-width:47.99em) {
 .film-switcher { margin-inline:12px; gap:6px; }
 .film-switcher>.label { display:none; }
 .film-switcher button { flex:1; justify-content:center; padding:8px 7px; font-size:.64rem; gap:6px; }
}
@media(prefers-reduced-motion:reduce) { .hero__slides { transform:none; will-change:auto; } }