/* Let the reel dissolve over the hero while the latter is still pinned. */
.inline-reel{display:none}
@media(min-width:801px) and (min-height:560px){
 .hero-shell{height:158svh}
 .storycraft:not(.is-reading){margin-top:-130svh}
 .journey-ready .journey-stage canvas{transition:opacity .35s ease}
 .journey-ready .journey-poster{visibility:visible}
}
@media(max-width:800px){
 .hero-shell{height:100svh;min-height:0;background:#0d1218}
 .hero-shell .hero{height:100svh;min-height:0}
 .hero-shell .world-scrim{background:linear-gradient(180deg,#0d121852,transparent 32%,#0d12184d 62%,#0d1218 100%)}
 #home .opening-copy{translate:none!important}
 .storycraft,.storycraft.is-reading{margin-top:0;background:#0d1218;pointer-events:auto}
 .storycraft .journey-stage,.storycraft .journey-entry,.storycraft .journey-dock,.storycraft .story-stops{display:none}
 .storycraft .journey-heading{position:relative;inset:auto;opacity:1!important;padding:54px var(--pad) 0}
 .journey-heading h2{font-size:clamp(43px,10vw,62px);line-height:1.04}
 .journey-heading h2 br{display:none}
 .storycraft .journey-chapters{display:grid;grid-template-columns:minmax(0,1fr);gap:50px;padding:35px var(--pad) 60px}
 .storycraft .journey-chapter[data-side]{display:grid;gap:22px;min-height:0;padding:0;margin:0}
 .storycraft .journey-chapter[data-side] .story-copy{width:100%;max-width:620px;margin:0;opacity:1!important;transform:none!important;translate:none;scroll-margin-top:84px}
 .storycraft .story-copy h3{font-size:clamp(29px,6.9vw,39px);margin-bottom:14px}
 .storycraft .story-copy .story-paragraph{font-size:16px;line-height:1.7;max-width:62ch}
 .storycraft .craft-studio:before{display:none}
 .storycraft .craft-content{padding:52px var(--pad) 68px}
 .storycraft .skill-groups{display:grid;grid-template-columns:minmax(0,1fr);gap:46px;margin-top:36px}
 .storycraft .skill-group+.skill-group{margin:0}
 .storycraft .skill-group h3{font-size:clamp(31px,8vw,42px)}
 .inline-reel{display:block;width:100%;max-width:650px;margin:0}
 .inline-reel-toolkit{margin-top:24px}
 .inline-reel>a{display:block;position:relative;aspect-ratio:var(--sample-ratio);max-height:60svh;overflow:hidden;background:#171b20}
 .inline-reel img,.inline-reel video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
 .inline-reel video{opacity:0;pointer-events:none;transition:opacity .24s}
 .inline-reel .is-previewing video{opacity:1}
 .inline-reel-play{position:absolute;bottom:10px;left:10px;display:grid;place-items:center;width:44px;height:44px;border:1px solid #f6ede0a0;border-radius:50%;background:#080b10a3;color:#fff}
 .inline-reel figcaption{color:#acb4b6;font-size:12px;margin-top:9px}
 .page-title,.contact-page .page-title,.about-opening .page-title{overflow-wrap:anywhere;font-size:clamp(42px,11vw,70px)}
 .page-top>*{min-width:0}
 .work-preview-controls button,.footer35 .credits-button,.contact-other a,.contact-other button{min-height:44px}
 .photo-categories{display:flex;flex-wrap:wrap}
 .photo-categories button{white-space:normal}
 .work-bottom{flex-wrap:wrap}
 .viewer-bottom,.photo-bottom{max-height:50dvh;overflow:auto;overscroll-behavior:contain}
 .viewer-state{grid-column:1/-1;grid-row:auto;flex-wrap:wrap;gap:6px 14px}
 .viewer-links{margin-left:0;gap:0 14px}
 .viewer-details{grid-column:1/-1;grid-row:auto}
 .viewer-links a,.viewer-links button,.viewer-details summary{min-height:44px}
}
@media(max-width:420px){
 .film-grid .work-row-portrait[data-count="3"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
 .film-grid .work-row-portrait[data-count="3"] .work-tile{min-width:0}
 .film-grid .work-row-portrait[data-count="3"] .film-caption h3{font-size:16px}
 .footer35 .footer-contact{padding-inline:13px}
 .viewer-top{padding-inline:14px;gap:12px}
 .viewer-close{gap:7px}
 .viewer-bottom{gap:8px 10px;padding-inline:14px}
 .viewer-heading h2{font-size:20px;overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){.inline-reel video,.journey-ready .journey-stage canvas{transition:none}}

@media(max-width:800px){
 .storycraft .skill-list,.storycraft .skill-software{display:flex;flex-wrap:wrap}
 .storycraft .skill-list{gap:6px 14px}
 .storycraft .skill-list li:not(:last-child):after{content:none}
 .storycraft .skill-software{column-gap:20px}
}

