/* Stable large surfaces cover retracted browser controls; content fits the small viewport. */
:root{--scene-cover:100lvh;--scene-content:calc(100svh - env(safe-area-inset-bottom,0px))}
/* Scroll chapters. The photograph in the hero is a single, continuous element. */
.hero{height:auto;min-height:0;max-height:none;overflow:visible;background:var(--wine)}
.hero-stage{position:relative;height:var(--scene-cover);min-height:650px;overflow:hidden;isolation:isolate;background:var(--wine)}
.hero-photo{z-index:2;inset:auto;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%)}
.hero-photo img{transform:translate(13%,8%) scale(1.16);object-position:57% 48%}
.hero-name{display:block;width:max-content;font-size:clamp(54px,8.2vw,164px);line-height:1;top:calc(var(--scene-content) * .18);left:7%;color:var(--paper);letter-spacing:-.045em;font-kerning:none;mix-blend-mode:normal;white-space:nowrap}
.name-baseline{display:inline-block;width:0;height:0;vertical-align:baseline}
.hero-shade{background:linear-gradient(90deg,#501b2d 0%,#501b2dd9 23%,#501b2d66 47%,#250c1700 68%),linear-gradient(0deg,#250c17a0,transparent 45%)}
.hero-shade{z-index:3;pointer-events:none}
.hero-name,.hero-thread{z-index:4}
.hero-thread{mask-image:linear-gradient(transparent 45%,#000 75%);opacity:.45}
.hero-intro{position:absolute;inset:0;height:var(--scene-content);z-index:5;pointer-events:none}
.hero-copy{pointer-events:auto}
.round-cta{z-index:6;top:calc(var(--scene-content) * .86 - 120px);bottom:auto}
.identity-contours{position:absolute;inset:-15%;width:130%;height:130%;color:#d5c7b43b;pointer-events:none;opacity:0}
.identity-words{display:none;position:absolute;z-index:1;top:calc(var(--scene-content) * .5);left:0;width:100%;transform:translateY(-50%);pointer-events:none}
.word-track{display:flex;align-items:center;gap:.28em;width:max-content;white-space:nowrap;font:400 clamp(90px,9.8vw,200px)/.93 var(--serif);letter-spacing:-.055em;text-transform:uppercase;will-change:transform}
.word-separator{flex:none;width:.45em;height:.45em;margin:0 .135em;color:var(--accent)}
.word-track-role{color:#d5c7b4}
.word-track-person{font:600 clamp(72px,8.1vw,160px)/1.1 var(--sans);letter-spacing:-.065em;color:var(--paper)}
.word-track-spirit{font-style:italic;text-transform:none;color:#c7baa5}
.identity-signature{display:none;position:absolute;z-index:7;left:50%;top:calc(var(--scene-content) * .52);width:min(65vw,1000px);height:48%;transform:translate(-50%,-50%) rotate(-9deg);color:#f2ece1;pointer-events:none;filter:drop-shadow(0 2px 20px #250c1755)}
.identity-signature .signature-stroke{stroke-width:12}
.identity-summary{margin:0;padding:45px 8%;font:30px/1.4 var(--serif);text-align:center;color:var(--paper)}
.identity-anchor{position:absolute;top:100svh;left:0;width:1px;height:1px;pointer-events:none}
.scroll-motion .hero{height:530svh}
.scroll-motion .hero-stage{position:sticky;top:0;min-height:0;height:var(--scene-cover)}
.scroll-motion .identity-words,.scroll-motion .identity-signature{display:block}
.scroll-motion .identity-summary{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0}
.scroll-motion .identity-words{opacity:0}
.scroll-motion .hero-photo{will-change:transform}
.scroll-motion .hero-intro{will-change:transform,opacity}
.scroll-motion .reveal{opacity:1;transform:none}
.motion-line{display:block;overflow:hidden;padding:.17em .035em;margin:-.17em -.035em}
.motion-line>span{display:block;transform-origin:0 100%}
.about,.moments,.work,.questions,.journey,.connect{position:relative}
.about{z-index:2}
.scroll-motion .about{margin-top:calc(-1 * var(--scene-cover));border-radius:0}
.chapter-doors{display:none;visibility:hidden;position:absolute;inset:0;z-index:10;pointer-events:none;perspective:1800px}
.scroll-motion .chapter-doors{display:block}
.chapter-door{position:absolute;top:0;bottom:0;width:calc(50% + 1px);background:var(--paper);will-change:transform;backface-visibility:hidden}
.door-left{left:0;transform:translateX(-102%);transform-origin:left center;box-shadow:12px 0 35px #250c1740}
.door-right{right:0;transform:translateX(102%);transform-origin:right center;box-shadow:-12px 0 35px #250c1740}
.door-left:after,.door-right:after{content:"";position:absolute;top:0;bottom:0;width:1px;background:#501b2d25;opacity:var(--edge-opacity,1)}
.door-left:after{right:0}.door-right:after{left:0}
.door-seam{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#501b2d38;opacity:0}
.portrait-main,.portrait-small{overflow:hidden}
.portrait-main img{object-position:55% 50%}
.moments{isolation:isolate}
.moments:before,.moments:after{content:"";position:absolute;z-index:-1;pointer-events:none;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#d5c7b455,transparent)}
.moments:before{top:0}.moments:after{bottom:0}
.scroll-motion .film-card{transition:none}
.scroll-motion .work-stage{perspective:1200px}
.scroll-motion .work-panel{transform-origin:100% 50%}
.journey{overflow:hidden}
.journey-years{position:relative}
.year-thread{transform-origin:left center}
.connect{z-index:2}
.contact-photo img{filter:grayscale(1) brightness(.72)}
@media(max-width:1050px){
 .hero-photo img{transform:translate(8%,6%) scale(1.12);object-position:59% 48%}
 .hero-name{font-size:10vw;top:auto;bottom:calc(var(--scene-cover) - var(--scene-content) * .82 + 16.6vw + 44px)}
 .word-track{font-size:12vw}.word-track-person{font-size:10vw}
 .identity-signature{width:80vw;height:45%}
}
@media(max-width:700px){
 .round-cta{top:calc(var(--scene-content) * .955 - 82px)}
 .hero-photo img{transform:translate(3%,4%) scale(1.08);object-position:50% 48%}
 .hero-name{font-size:12vw;top:auto;bottom:calc(var(--scene-cover) - var(--scene-content) * .81 + 34.6vw + 32px);left:7%;color:var(--paper)}
 .hero-shade{background:linear-gradient(0deg,#501b2d 0%,#501b2dbb 19%,#501b2d00 63%),linear-gradient(90deg,#501b2d88,transparent 60%)}
 .hero-stage{min-height:650px}
 .scroll-motion .hero{height:500svh}
 .scroll-motion .hero-stage{min-height:0}
 .word-track{font-size:19vw;line-height:1.05;gap:.25em}
 .word-track-person{font-size:15vw;line-height:1.3}
 .identity-signature{width:94vw;height:38%;top:calc(var(--scene-content) * .51)}
 .identity-signature .signature-stroke{stroke-width:14}
 .identity-summary{font-size:25px;padding:35px 7%}

 .portrait-main{width:94%;height:min(72vw,340px)}

}
@media(prefers-reduced-motion:reduce){
 .hero-photo,.hero-photo img{will-change:auto}
 .motion-line>span{transform:none!important;opacity:1!important}
}

/* The visible copy on each closing panel matches the live section pixel for pixel. */
.chapter-door{overflow:hidden}
.door-content{position:absolute;top:0;width:var(--story-width);min-height:var(--scene-cover);padding:55px calc(var(--story-width)*.06) 120px;isolation:isolate}
.door-left .door-content{left:0}
.door-right .door-content{right:0}
.scroll-motion :is(.about,.door-content) .about-statement{min-height:calc(100svh - 55px);align-content:start}
@media(min-width:1700px){.door-content{padding-left:calc(var(--story-width)*.09);padding-right:calc(var(--story-width)*.09)}}
@media(max-width:700px){.door-content{padding:40px calc(var(--story-width)*.07) 60px}.scroll-motion :is(.about,.door-content) .about-statement{min-height:calc(100svh - 40px)}}

/* A compact, staggered photographic reel. Every image keeps its own caption space. */
.moments{padding:0;overflow:visible}
.moments-stage{overflow:hidden;background:var(--wine);padding:80px 5vw}
.moments-track{display:block}
.photo-cluster{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;margin:0 0 40px}
.moment-image{position:relative;margin:0 0 90px;width:100%;aspect-ratio:16/9;pointer-events:none;user-select:none}
.moment-image.portrait{width:72%;aspect-ratio:3/4;justify-self:center}
.moment-image.menlo-frame{aspect-ratio:2.15/1}
.cluster-4 .moment-image{aspect-ratio:3/2}
.moment-window{width:100%;height:100%;overflow:hidden;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.moment-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--focal,50% 50%)}
/* Two independent camera angles share one frame; neither image is repeated elsewhere. */
.conversation-split .moment-window{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:var(--wine)}
.conversation-angle{min-width:0;height:100%;overflow:hidden}
.conversation-split .angle-guest img{object-position:42% 50%}
.conversation-split .angle-host img{object-position:82% 50%}
.moment-image:before{content:"";position:absolute;inset:-7px;pointer-events:none;background:linear-gradient(var(--paper),var(--paper)) left top/20px 1px no-repeat,linear-gradient(var(--paper),var(--paper)) left top/1px 20px no-repeat,linear-gradient(var(--paper),var(--paper)) right bottom/20px 1px no-repeat,linear-gradient(var(--paper),var(--paper)) right bottom/1px 20px no-repeat;border:1px solid #d5c7b43d}
.moment-image figcaption{position:absolute;left:0;right:0;top:calc(100% + 16px);color:var(--paper)}
.guest-name{font:500 12px/1.5 var(--sans);letter-spacing:.01em;text-wrap:balance}
.guest-role{display:block;font:400 10px/1.5 var(--sans);color:#d5c7b4;margin-top:2px}
.file-meta{display:flex;flex-wrap:wrap;gap:5px 14px;margin-top:8px;padding-top:7px;border-top:1px solid #d5c7b43d;color:#d5c7b4;font:9px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.025em;font-variant-numeric:tabular-nums}
.file-meta:first-child{margin-top:0}
.scroll-motion .moments{height:calc(var(--scene-cover) + var(--gallery-distance,0px) + var(--monitor-travel,0px))}
.scroll-motion .moments-stage{position:sticky;top:0;height:var(--scene-cover);padding:0}
.gallery-interactive{touch-action:pan-y pinch-zoom}
.gallery-interactive:focus-visible{outline:2px solid var(--paper);outline-offset:-5px}
.scroll-motion .moments-track{
 --reel-gap:clamp(24px,2.6vw,50px);--caption-space:82px;
 --reel-height:calc(var(--scene-content) - 170px);
 --small-image:calc((var(--reel-height) - 2 * var(--caption-space) - var(--reel-gap))/2);
 --large-image:calc(var(--reel-height) - var(--caption-space));
 display:flex;align-items:center;gap:var(--reel-gap);position:relative;width:max-content;height:var(--scene-content);padding:104px 5vw 66px;will-change:transform;
}
.scroll-motion .photo-cluster{position:relative;display:grid;flex:none;grid-template-columns:max-content max-content;grid-template-rows:1fr 1fr;gap:var(--reel-gap);width:max-content;height:100%;margin:0;align-items:start}
.scroll-motion .moment-image{--image-height:var(--small-image);--image-ratio:1.777778;position:relative;left:auto;top:auto;margin:0;width:calc(var(--image-height)*var(--image-ratio));height:var(--image-height);aspect-ratio:auto;justify-self:start}
.scroll-motion .moment-image.portrait{--image-height:var(--large-image);--image-ratio:.64;grid-row:1 / 3;align-self:center;transform:translateY(-28px)}
.scroll-motion .cluster-1 .frame-1{grid-column:1}
.scroll-motion .cluster-1 .frame-2{--image-ratio:2.15;grid-column:2;grid-row:1}
.scroll-motion .cluster-1 .frame-3{grid-column:2;grid-row:2;justify-self:end}
.scroll-motion .cluster-2 .frame-1{grid-column:1;grid-row:1}
.scroll-motion .cluster-2 .frame-2{--image-ratio:.68;grid-column:2}
.scroll-motion .cluster-2 .frame-3{grid-column:1;grid-row:2}
.scroll-motion .cluster-3 .frame-1{--image-height:calc(var(--small-image)*.85);grid-column:1;grid-row:1;justify-self:end}
.scroll-motion .cluster-3 .frame-2{--image-height:min(calc(var(--large-image)*.86),27vw);grid-column:2;grid-row:1 / 3;align-self:center;transform:translateY(-26px)}
.scroll-motion .cluster-3 .frame-3{grid-column:1;grid-row:2}
.scroll-motion .cluster-4 .moment-image{--image-ratio:1.5;grid-row:1 / 3}
.scroll-motion .cluster-4 .frame-1{--image-height:min(calc(var(--large-image)*.92),38vw);grid-column:1;align-self:start}
.scroll-motion .cluster-4 .frame-2{--image-height:min(calc(var(--large-image)*.7),29vw);grid-column:2;align-self:end;transform:translateY(-80px)}
@media(max-width:900px){
 .scroll-motion .moments-track{--reel-gap:28px;--reel-height:calc(var(--scene-content) - 150px);--caption-space:78px;--small-image:min(calc((var(--reel-height) - 2 * var(--caption-space) - var(--reel-gap))/2),46vw);--large-image:min(calc(var(--reel-height) - var(--caption-space)),118vw);padding:95px 7vw 55px}
 .scroll-motion .photo-cluster{height:min(var(--reel-height),calc(2 * var(--small-image) + 2 * var(--caption-space) + var(--reel-gap)))}
 .scroll-motion .cluster-1 .frame-2{--image-height:calc(var(--small-image)*.9)}
 .scroll-motion .cluster-3 .frame-2{--image-height:min(51vw,var(--large-image))}
 .scroll-motion .cluster-4 .frame-1{--image-height:min(62vw,var(--large-image))}
 .scroll-motion .cluster-4 .frame-2{--image-height:min(54vw,var(--large-image))}
}
@media(max-width:700px){
 .moments-stage{padding:75px 7vw 30px}
 .photo-cluster{grid-template-columns:1fr;gap:28px;margin-bottom:28px}
 .moment-image{margin-bottom:90px}
 .guest-name{font-size:11px}.guest-role{font-size:10px}.file-meta{font-size:8px;gap:5px 10px}
}
@media(prefers-reduced-motion:reduce){.moments-track{transform:none!important}.moments-stage{clip-path:none!important}}

/* The live work page starts inside the production monitor, then fills the screen. */
.work{background:#050607;color:var(--paper);min-height:100svh}
.work-countdown{display:none;position:absolute;left:0;right:0;top:calc(100svh - 95px);text-align:center;font:500 21px/1.2 var(--sans);letter-spacing:.06em;pointer-events:none}
.work-countdown span{display:inline-block;min-width:.65em;font-variant-numeric:tabular-nums}
.scroll-motion .work-anchor{position:relative;margin-top:calc(-1 * var(--scene-cover))}
.scroll-motion .work{position:fixed;top:0;left:0;width:100%;z-index:4;margin:0;transform-origin:0 0;visibility:hidden;will-change:transform}
.scroll-motion .work.work-in-flow{position:relative}
.scroll-motion .work-countdown{display:block}
.monitor-window{position:relative;transform-origin:0 0;will-change:transform}
.monitor-window:after{content:"";position:absolute;inset:0;background:#050607;clip-path:polygon(44.2917% 52.6875%,61.4167% 50.75%,61.4583% 65.0625%,44.5833% 67.5625%)}
.moment-image:before{opacity:var(--frame-opacity,1)}
.work .ambient-field{display:none}
.work-choices button{color:#8d8984;border-color:#f2ece133}
.work-choices button:first-child{border-color:#f2ece133}
.work-choices [aria-selected=true]{color:var(--paper)}
.work-panel{background:#141416;color:var(--paper)}
.work-orbit{color:var(--paper)}
.work-orbit>i{border-color:#f2ece144}
.work-footnote{border-color:#f2ece133}
@media(prefers-reduced-motion:reduce){.work-countdown{display:none}}
.work{--monitor-font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.work-heading{font:500 clamp(25px,3.6vw,56px)/1.18 var(--monitor-font);letter-spacing:-.025em;text-transform:uppercase;padding:clamp(70px,12svh,120px) 0 64px;text-align:center}
.work-heading em{font-style:normal;margin-left:0}
.work-countdown{top:83.5svh;font:600 6.4svh/1.2 var(--monitor-font);letter-spacing:-.04em}
@media(max-width:700px){.work-heading{font-size:7vw;padding:70px 0 45px}}

/* Every company remains reachable without operating the scroll sequence. */
.company-links{display:none}
.scroll-motion .company-links{display:flex;position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:100;flex-wrap:wrap;gap:1rem;padding:1rem;background:var(--paper);color:var(--ink);border:1px solid currentColor;clip-path:inset(50%);pointer-events:none}
.scroll-motion .company-links:focus-within{clip-path:none;pointer-events:auto}
.company-links a:focus-visible{outline:2px solid currentColor;outline-offset:4px}

.company-links ul{display:flex;flex-wrap:wrap;gap:1rem 2rem;list-style:none;margin:0;padding:0;max-height:70svh;overflow:auto}
.company-links li>span{display:block;font-size:.75em}

/* Short landscape screens use one gallery row so captions stay in the reading area. */
@media(max-height:500px) and (min-width:601px) and (max-width:1000px){
 .hero-name{font-size:44px;top:70px;bottom:auto}
 .hero h1{font-size:58px}.hero-copy{bottom:15%}
 .scroll-motion .moments-track{--reel-height:calc(var(--scene-content) - 110px);--caption-space:68px;--reel-gap:24px;--large-image:max(48px,calc(var(--reel-height) - var(--caption-space)));--small-image:var(--large-image);padding:70px 5vw 40px}
 .scroll-motion .photo-cluster{grid-template-rows:1fr;height:100%}
 .scroll-motion .photo-cluster .moment-image{grid-row:1;grid-column:auto;--image-height:var(--large-image);align-self:start;transform:none}
 .scroll-motion .moment-image:has(.quote-standards){margin-left:260px}
 .scroll-motion .quote-standards{top:0;bottom:auto;left:-260px;width:240px}
}

/* Let backgrounds reach the iPhone home-indicator area while controls remain safe. */
.site-header{padding-top:max(22px,env(safe-area-inset-top,0px));padding-left:max(3.5vw,env(safe-area-inset-left,0px));padding-right:max(3.5vw,env(safe-area-inset-right,0px))}
.social-footer{padding-bottom:env(safe-area-inset-bottom,0px)}
body .cookie-banner{bottom:max(16px,env(safe-area-inset-bottom,0px))}
body .cookie-dialog{max-height:calc(100svh - 40px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}