@media(max-width:760px){
 html{scroll-padding-top:80px}body{overflow-x:clip}
 .site-header{padding-top:env(safe-area-inset-top);height:calc(72px + env(safe-area-inset-top))}
 .site-menu-button,.site-menu-close{min-width:44px;min-height:44px}
 #site-menu{padding-bottom:calc(28px + env(safe-area-inset-bottom))}#site-menu a{min-height:44px;display:flex;align-items:center}#site-menu nav>a:first-child{display:flex}
 .journey{height:auto}.stage{position:relative;height:auto;min-height:0;overflow:visible}.visuals,.stage-footer,.progress-line{display:none}
 .chapter,.chapter.active,.info,.info.active,.work{position:relative;inset:auto;opacity:1;visibility:visible;pointer-events:auto;transform:none;width:100%;height:auto;min-height:0;max-height:none;overflow:visible;margin:0;border:0;border-radius:0;padding:36px 6vw;background:#191d21;color:#fff;box-shadow:none;backdrop-filter:none;text-shadow:none}
 .chapter.hero{padding-top:100px;background:#f6f4ef;color:#20201e}
 .hero::after{content:'';display:block;height:58vw;margin:30px -6vw -36px;background:url('assets/hero.webp') 68% center/cover}
 .hero h1{font-size:clamp(40px,11vw,64px);line-height:1.02;margin:22px 0}.hero .eyebrow{font-size:10px}.hero .intro{font-size:16px;line-height:1.6;max-width:38ch}.hero-foot{display:none}
 .info[data-section="about"]::before,.info[data-section="expertise"]::before,.info[data-section="contact"]::before{content:'';display:block;height:55vw;margin:-36px -6vw 30px;background-position:center;background-size:cover}
 .info[data-section="about"]::before{background-image:url('assets/about-me.webp')}.info[data-section="expertise"]::before{background-image:url('assets/expertise.webp')}.info[data-section="contact"]::before{background-image:url('assets/contact.webp')}
 .info h2,.work .work-heading h2{font-size:34px;line-height:1.12}.info p,.info .lead,.info .timeline p,.info .note span,.info .expertise-list p{font-size:16px;line-height:1.65;color:#eceeef}.info .eyebrow,.info .tools,.info .contact-details{font-size:10px;line-height:1.6}.info .timeline>div{grid-template-columns:70px 1fr;padding:16px 0}.info .timeline strong{color:white}.info .timeline>div>span{color:#e7ab9e}.info .note{margin-top:24px}.info summary{font-size:19px;min-height:52px}.info .tools{margin-top:24px}
 .info .work-note{font-size:13px!important}.work{padding-top:48px;padding-bottom:48px}.carousel{touch-action:pan-y}.carousel-track{transition:transform .3s ease}.project-media{height:auto;min-height:0;aspect-ratio:16/10}.project-caption{align-items:center}.work .project-caption h3{font-size:24px}.project-caption p{font-size:14px!important}.preview-toggle,.project-open,#prev-project,#next-project{min-width:44px;min-height:44px}.project-dots button{width:44px;height:44px;background:none;position:relative}.project-dots button::after{content:'';position:absolute;left:8px;right:8px;top:21px;height:2px;background:#8c9296}.project-dots button.selected::after{background:white}.contact .email-link{font-size:clamp(17px,5vw,24px);min-height:44px}.contact-details{flex-wrap:wrap;gap:12px}
 .text-link{min-height:44px;align-items:center;font-size:15px}.end-heading p{font-size:16px}.meme-wrap button{min-height:44px;min-width:44px;font-size:12px}footer{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
 /* Case-study pages retain their content, with comfortable reading and controls. */
 body:has(#hero-video) main,body:has(#hero) main{padding-top:82px}
 body:has(#journey).static header.site-header{position:fixed}body:has(#journey).static #reading{padding-top:76px}
 .read-card{padding:30px 6vw}.read-card p{font-size:16px;line-height:1.65}.read-card img{height:auto;object-fit:contain}.case-study p{font-size:16px;line-height:1.65}
 .hero-frame button,.motion-frame button,.carousel-buttons button,.skip-icons{min-height:44px;min-width:44px}
 section[id]{scroll-margin-top:84px}
}
@media(max-width:760px){
 .site-header,body:has(#journey) .site-header,body:has(#hero-video) .site-header{background:#f6f4ef;color:#20201e;mix-blend-mode:normal}
 .info .timeline{margin-top:24px}.info .timeline>div{gap:12px}
}
