/* Full-screen photographic sequence for the portfolio homepage. */
html:has(.home-page){scroll-padding-top:var(--navigation-height,96px)}
.home-page{background:var(--paper)}
.home-page .site-header{position:fixed;inset:0 0 auto;z-index:50;max-width:none;padding:0 clamp(20px,3vw,52px);color:#fff;background:linear-gradient(180deg,rgba(12,19,15,.42),transparent);transition:background .25s,color .25s}
.home-page .header-inner{min-height:96px;border:0}
.home-page .wordmark{font-size:1rem;letter-spacing:-.035em}
.home-page .main-nav{font-size:.9375rem;gap:32px}
.home-page .main-nav a{padding:12px 0}
.home-page .download-link{border-color:currentColor}
.home-page .main-nav a:hover{color:inherit;opacity:.7}
.home-page .site-header.on-paper{background:rgba(250,250,247,.97);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.home-page :focus-visible{outline-color:currentColor}
.story-panel{position:relative;height:100vh;height:100svh;min-height:0;overflow:hidden;background:#23342d;color:#fff;isolation:isolate}
.story-link{position:relative;display:block;width:100%;height:100%;color:inherit}
.story-link:focus-visible{outline:3px solid white;outline-offset:-8px}
.story-media{position:absolute;inset:-6% 0;z-index:-2;transform:translate3d(0,var(--image-shift,0px),0)}
.story-media img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;display:block}
.story-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,19,15,.25),transparent 25%,transparent 45%,rgba(12,19,15,.75) 100%)}
.opening-story .story-shade{background:linear-gradient(180deg,rgba(12,19,15,.25),rgba(12,19,15,.43) 42%,rgba(12,19,15,.43) 58%,rgba(12,19,15,.64))}
.opening-story .story-media img{object-position:50% 68%}
.story-amant .story-media img{object-position:50% 60%}
.story-wildflower .story-media img{object-position:50% 56%}
.story-chamartin .story-media img{object-position:50% 50%}
.story-stem .story-media img{object-position:50% 54%}
.story-title{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:24px;padding:110px 6vw 140px;text-shadow:0 2px 24px rgba(0,0,0,.16)}
.story-kicker{font-size:.875rem;line-height:1.5;letter-spacing:.09em;text-transform:uppercase;max-width:90%}
.story-title h1,.story-title h2{font-family:var(--serif);font-weight:400;font-style:normal;letter-spacing:-.045em;line-height:1.02;font-size:clamp(64px,9vw,150px);max-width:100%;text-wrap:balance}
.opening-title h1{font-family:'Manrope',var(--sans);font-size:clamp(64px,8.3vw,140px);font-weight:400;letter-spacing:-.055em;line-height:1.05}
.opening-title h1 span{display:block}
.opening-title{gap:30px}
.story-title:not(.opening-title){align-items:flex-start;justify-content:flex-end;text-align:left;padding:110px clamp(24px,3vw,52px) 152px;gap:12px}
.story-title h2{font-family:'Manrope',var(--sans);font-size:clamp(40px,4.8vw,72px);letter-spacing:-.045em}
.story-bottom{position:absolute;inset:auto clamp(24px,3vw,52px) 32px;display:flex;justify-content:space-between;align-items:flex-end;gap:28px;font-size:.9375rem;line-height:1.5}
.story-bottom p span{display:block;font-size:.875rem;margin-top:3px}
.story-action{display:inline-flex;align-items:center;gap:24px;padding:12px 0;min-height:44px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.65)}
.story-action>span{display:inline-flex;align-items:center;font-size:1em;transition:transform .3s}
.story-link:hover .story-action>span{transform:translate(3px,-3px)}
.project-stories{scroll-margin-top:0}
.home-details{position:relative;background:var(--paper)}
.home-page .expertise{background:var(--paper);color:var(--ink);padding:86px 0 35px}
.home-page .expertise-heading{display:flex;justify-content:space-between;gap:48px;align-items:flex-start;padding-bottom:44px}
.home-page .expertise-heading h2{font-size:clamp(32px,3.5vw,52px);max-width:650px}
.home-page .expertise .eyebrow{color:var(--muted);font-size:.875rem}
.home-page .expertise-item{border-color:var(--line)}
.home-page .expertise-item .number,.home-page .expertise-item p{color:var(--muted)}
.home-page .expertise-item .number,.home-page .eyebrow,.home-page .footer-bottom{font-size:.875rem}
.home-page .expertise-item a{border-color:var(--line);margin-top:18px}
.home-page .about{padding-top:80px;padding-bottom:80px;scroll-margin-top:0}
.home-page #contact{scroll-margin-top:0}
@media(prefers-reduced-motion:no-preference){
  .scroll-motion .story-title{transition:opacity .8s ease,translate .9s cubic-bezier(.2,.65,.3,1)}
  .scroll-motion .story-panel:not(.in-view) .story-title{opacity:.65;translate:0 22px}
}
@media(max-width:1000px){
  .home-page .main-nav{gap:24px}
  .story-title h2{font-size:clamp(40px,6vw,64px)}
}
@media(max-width:700px){
  .home-page .header-inner{min-height:90px;flex-direction:row;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
  .home-page .wordmark{font-size:.9375rem;flex-shrink:0}
  .home-page .wordmark span{display:block}
  .home-page .wordmark span+span::before{content:none}
  .home-page .main-nav{width:auto;gap:16px;font-size:.875rem}
  .home-page .main-nav a{padding:10px 0}
  .story-panel{min-height:0;height:100svh}
  .story-title{padding:100px 24px 140px;gap:18px}
  .story-title h1,.story-title h2{font-size:clamp(52px,13.5vw,86px);line-height:1.04}
  .story-title:not(.opening-title){padding:100px 24px 150px;gap:12px}
  .story-title h2{font-size:clamp(36px,9vw,52px)}
  .story-kicker{font-size:.875rem;letter-spacing:.065em;max-width:100%}
  .story-bottom{left:24px;right:24px;bottom:24px;gap:16px;align-items:flex-end;font-size:.875rem}
  .story-bottom p{max-width:57%}
  .story-bottom p span{font-size:.875rem}
  .story-action{gap:10px;font-size:.875rem}
  .home-page .expertise{padding:58px 0 20px}
  .home-page .expertise-heading{display:block;padding-bottom:34px}
  .home-page .expertise-heading h2{margin-top:20px}
  .home-page .about{padding-top:50px;padding-bottom:55px}
}
@media(max-width:380px){
  .home-page .site-header{padding:0 16px}
  .home-page .main-nav{gap:10px}
  .home-page .wordmark{font-size:.875rem}
  .story-title h1{font-size:50px}
  .story-title h2{font-size:36px}
  .story-bottom{left:20px;right:20px}
}
@media(prefers-reduced-motion:reduce){
  html:has(.home-page){scroll-behavior:auto}
  .story-media{transform:none!important}
  .story-action>span,.home-page .site-header{transition:none}
}
@media(max-height:500px){
  .opening-title{padding:80px 3vw 95px;gap:12px}
  .opening-title h1{font-size:clamp(38px,6vw,68px)}
  .opening-title .story-kicker{font-size:.875rem}
  .story-title:not(.opening-title){padding-bottom:110px}
  .story-title h2{font-size:38px}
  .story-bottom{bottom:14px}
}
@media print{
  .home-page .site-header{position:relative;background:none;color:var(--ink)}
  .story-panel{height:680px;min-height:0;break-inside:avoid}
  .story-media{transform:none!important}
  .story-title{opacity:1!important;translate:none!important}
}
