/* Cinematic 0.4 · scoped homepage updates. Existing project templates stay intact. */
.hero-content{min-height:650px;height:100svh;padding:125px var(--pad) 100px;justify-content:center;align-items:center;text-align:center;color:#f5f4ed;--reveal-one:1;--reveal-two:1;--accent-text:var(--accent)}
.hero-content h1{font-size:clamp(76px,11.4vw,184px);font-weight:500;line-height:.98;letter-spacing:-.075em;text-transform:none;margin:0;max-width:100%;text-align:center;text-shadow:0 2px 24px #09101855}
.hero-content h1 span{display:block;transform-origin:center;will-change:filter,opacity,transform}
.hero-content h1 span+span{margin-left:0}
.reveal-complexity{opacity:calc(.22 + var(--reveal-one)*.78);filter:blur(calc((1 - var(--reveal-one))*15px));transform:translateY(calc((1 - var(--reveal-one))*14px))}
.reveal-clarity{opacity:calc(.08 + var(--reveal-two)*.92);filter:blur(calc((1 - var(--reveal-two))*21px));transform:translateY(calc((1 - var(--reveal-two))*20px))}
.hero-bottom{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:27px;padding:0;margin:34px 0 0;width:100%}
.hero-bottom>p{font-size:clamp(14px,1.1vw,17px);line-height:1.75;max-width:540px;color:#f3f3eb;text-wrap:balance;text-shadow:0 1px 13px #000}
.hero-bottom .explore-link{gap:17px;font-size:14px;letter-spacing:0;background:#0c171a88;border:1px solid #ffffff36;border-radius:40px;padding:7px 8px 7px 23px;backdrop-filter:blur(12px);margin:0;justify-content:center;color:#fafaf4}
.hero-bottom .circle-arrow{width:36px;height:36px;border:0;background:var(--accent);color:var(--accent-ink)}
.hero-bottom .circle-arrow svg{width:17px;height:17px;transform:rotate(45deg)}
.hero-bottom .explore-link:hover .circle-arrow{transform:translateY(2px)}
.water-layer{min-height:650px;height:100svh}
.water-shade{background:linear-gradient(180deg,#080e1680 0%,#080d1329 20%,#09111912 40%,#0811144d 74%,var(--bg) 100%),radial-gradient(ellipse at 50% 50%,#08101542,transparent 75%)}
.water-fallback{opacity:1!important;filter:none!important;mix-blend-mode:normal!important}
.water-layer:has(#tide-canvas.ready) .water-fallback{visibility:hidden}
#tide-canvas{transition:none}
body:has(.home-content:not([hidden])) .site-header{color:#f4f3ec;background:linear-gradient(#090e1480,transparent);--muted:#c0c8c7;--line:#abb5b74a}
.scrolled body:has(.home-content:not([hidden])) .site-header{color:var(--ink);background:color-mix(in srgb,var(--bg) 94%,transparent);--muted:inherit;--line:inherit}
.site-header .work-panel{color:var(--ink)}
.work-panel .menu-categories,.work-panel .menu-project{--muted:var(--ink)}
.hero-content :focus-visible{outline-color:var(--accent)}
.approach-section{padding:0 var(--pad);border-top:1px solid var(--line);position:relative}
.method-sticky{padding:100px 0 90px}
.approach-title{display:flex;align-items:flex-end;justify-content:space-between;gap:60px;margin:0}
.approach-title h2{font-size:clamp(42px,4.8vw,78px);line-height:1.07;flex:1}
.approach-title>p{max-width:360px;font-size:15px;line-height:1.8;margin:0}
.method-layout{display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:60px;margin:45px 0}
.method-art{min-width:0;color:var(--muted)}
.method-diagram{width:100%;height:auto;overflow:visible;display:block}
.method-piece{will-change:transform}
.method-piece rect{fill:var(--panel);stroke:var(--line)}
.method-piece text{fill:var(--ink);font:13px Manrope,Arial,sans-serif;letter-spacing:-.02em}
.method-connectors{stroke-width:1.3;opacity:var(--map-alpha,0);stroke-dasharray:650;stroke-dashoffset:calc((1 - var(--map-alpha,0))*650)}
.method-connectors .method-return{stroke:var(--accent-text);opacity:var(--delivery-alpha,0)}
.method-window{fill:var(--panel);fill-opacity:.8;stroke:var(--line);opacity:var(--window-alpha,0)}
.method-ui-detail{opacity:calc(var(--window-alpha,0)*.5)}
.method-selection{opacity:var(--refine-alpha,0);stroke:var(--accent-text);fill:var(--accent);fill-opacity:.09;stroke-width:1.4}
.method-selection path{fill:none}
.method-cursor{opacity:var(--refine-alpha,0);fill:var(--accent-text);transform:translate(var(--cursor-x,620px),var(--cursor-y,205px))}
.method-cursor rect{fill:var(--accent)}
.method-cursor text{fill:var(--accent-ink);font:10px Manrope,Arial,sans-serif}
.method-complete{opacity:var(--delivery-alpha,0);fill:var(--accent)}
.method-complete path{fill:none;stroke:var(--accent-ink);stroke-width:1.3}
.method-descriptions{position:relative;min-width:0}
.method-descriptions article{padding:25px 0}
.method-descriptions h3{font-size:clamp(26px,2.4vw,40px);line-height:1.15;max-width:330px}
.method-descriptions p{font-size:15px;line-height:1.8;margin-top:20px;max-width:365px}
.method-count{display:block;font-size:13px;margin-bottom:26px;color:var(--accent-text);font-variant-numeric:tabular-nums}
.method-stations{display:none;position:relative;grid-template-columns:repeat(5,1fr);gap:0;margin-top:auto}
.method-stations:before,.method-stations:after{content:"";position:absolute;left:0;top:8px;height:1px;width:80%;background:var(--line)}
.method-stations:after{background:var(--accent-text);transform:scaleX(var(--method-progress,0));transform-origin:left}
.method-stations button{position:relative;z-index:1;text-align:left;padding:0 25px 0 0;font-size:12px;color:var(--muted);line-height:1.5}
.station-dot{display:block;width:17px;height:17px;border:1px solid var(--line);background:var(--bg);border-radius:50%;margin-bottom:19px;box-shadow:0 0 0 6px var(--bg)}
.method-stations button[aria-pressed=true]{color:var(--ink)}
.method-stations button[aria-pressed=true] .station-dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 6px var(--bg),0 0 20px #c3f85c33}
.method-stations button.is-past .station-dot{border-color:var(--accent-text)}
.about-section{display:grid;grid-template-columns:1.05fr .85fr;gap:70px 8%;align-items:center;padding:110px var(--pad) 100px;border-top:1px solid var(--line);position:relative}
.about-copy{max-width:630px}
.about-copy h2{font-size:clamp(50px,6.3vw,100px);line-height:1.02;margin-bottom:36px}
.about-copy p{font-size:16px;line-height:1.85;max-width:490px;margin-bottom:25px}
.about-copy .text-link{margin-top:10px}
.portrait{margin:0;width:100%;max-width:470px;justify-self:end;position:relative}
.portrait img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 35%;border-radius:3px;display:block}
.portrait figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-top:16px;font-size:12px;color:var(--ink)}
.portrait figcaption span{color:var(--muted);font-size:11px}
.location-visual{grid-column:1/-1;width:min(900px,100%);aspect-ratio:1.3;justify-self:center;max-width:none;margin:0;position:relative;isolation:isolate}
.location-globe{position:absolute;inset:-12% 0 0;width:100%;height:100%;aspect-ratio:1;overflow:hidden;mask-image:linear-gradient(transparent,black 10%,black 83%,transparent);-webkit-mask-image:linear-gradient(transparent,black 10%,black 83%,transparent)}
.location-globe>svg,.location-globe>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.location-globe:has(canvas.ready)>svg{opacity:0}
.location-pin{position:absolute;display:flex;align-items:center;gap:7px;font-size:11px;background:var(--bg);color:var(--ink);padding:9px 13px;border:1px solid var(--line);border-radius:24px;transform:translate(-50%,20px);white-space:nowrap;z-index:2;left:56%;top:43%;letter-spacing:0;pointer-events:none}
.location-pin i{width:5px;height:5px;background:var(--accent-text);border-radius:50%;box-shadow:0 0 14px var(--accent-text)}
.location-caption{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;font-size:14px;line-height:1.8;color:var(--muted);z-index:3}
.location-caption strong{font-weight:400;font-size:clamp(22px,2.9vw,38px);letter-spacing:-.04em;color:var(--ink)}
.globe-destination{color:var(--accent-text);font-size:15px;white-space:nowrap}
@media(min-width:1000px) and (min-height:650px){
 .enhanced.motion-enabled .intro-sequence{height:290svh}
 .enhanced.motion-enabled .hero-content{min-height:0}
 .enhanced.motion-enabled .approach-section{height:310svh;padding-top:0;padding-bottom:0}
 .enhanced.motion-enabled .method-sticky{height:100svh;position:sticky;top:0;display:flex;flex-direction:column;justify-content:space-between;padding:120px 0 48px;overflow:hidden}
 .enhanced.motion-enabled .method-layout{flex:1;margin:20px 0;min-height:0}
 .enhanced.motion-enabled .method-diagram{max-height:38svh}
 .enhanced.motion-enabled .method-descriptions{min-height:220px;align-self:center}
 .enhanced.motion-enabled .method-descriptions article{position:absolute;inset:0;opacity:0;transform:translateY(15px);transition:opacity .25s,transform .35s;pointer-events:none}
 .enhanced.motion-enabled .method-descriptions article.is-current{opacity:1;transform:none;pointer-events:auto}
 .enhanced.motion-enabled .method-stations{display:grid}
}
@media(min-width:1000px) and (max-height:720px){
 .hero-content{padding-top:100px;padding-bottom:65px;min-height:560px}
 .hero-content h1{font-size:min(10.2vw,21svh)}
 .hero-bottom{gap:20px;margin-top:25px}
 .hero-bottom>p{font-size:14px;max-width:500px}
 .approach-title h2{font-size:43px}
 .approach-title>p{font-size:13px}
 .method-descriptions h3{font-size:27px}
 .method-descriptions p{font-size:13px}
 .method-count{margin-bottom:15px}
}
@media(max-width:999px){
 .hero-content{min-height:650px;padding:110px var(--pad) 95px}
 .hero-content h1{font-size:13vw;line-height:1.02;margin:0;text-align:center}
 .hero-content h1 span+span{margin:0}
 .hero-bottom{margin-top:35px;padding:0}
 .hero-bottom>p{max-width:480px;font-size:15px}
 .water-layer{min-height:650px}
 .method-sticky{padding:80px 0}
 .approach-title{display:block}
 .approach-title h2{font-size:48px}
 .approach-title>p{max-width:490px;margin-top:30px}
 .method-layout{display:block;margin:35px 0 0}
 .method-art{position:sticky;top:85px;background:var(--bg);z-index:2;margin:0 -6px;border-bottom:1px solid var(--line)}
 .method-diagram{max-height:230px}
 .method-descriptions article{padding:40px 0 40px 45px;border-bottom:1px solid var(--line);position:relative}
 .method-count{position:absolute;left:0;top:45px;margin:0}
 .method-descriptions h3{font-size:30px}
 .method-descriptions p{max-width:490px}
 .about-section{padding-top:85px;gap:60px 6%;grid-template-columns:1.2fr .8fr}
 .about-copy h2{font-size:52px}
 .about-copy p{font-size:14px}
 .portrait img{aspect-ratio:3/4}
 .location-visual{width:100%;margin-top:0}
}
@media(max-width:600px){
 .hero-content{height:100svh;min-height:600px;padding:120px 22px 95px}
 .hero-content h1{font-size:15.6vw;line-height:1.04;letter-spacing:-.07em;margin:0;width:100%}
 .hero-bottom{margin-top:29px;gap:25px}
 .hero-bottom>p{font-size:14px;line-height:1.8;max-width:320px}
 .hero-bottom .explore-link{font-size:13px}
 .water-layer{min-height:600px}
 .site-header{gap:12px;padding-left:18px;padding-right:18px}
 .identity{font-size:11px;gap:7px}
 .identity small{font-size:5.7px}
 .contact-nav{display:block;font-size:11px;white-space:nowrap}
 .contact-nav svg{display:none}
 .main-nav{gap:14px}
 .theme-control{padding-left:7px}
 .approach-section{padding:0 22px}
 .approach-title h2{font-size:39px}
 .approach-title>p{font-size:14px;line-height:1.8}
 .method-diagram{max-height:170px}
 .method-art{top:80px;margin:0 -10px}
 .method-descriptions h3{font-size:28px;max-width:280px}
 .method-descriptions p{font-size:14px}
 .about-section{display:grid;grid-template-columns:1fr;padding:70px 22px 80px;gap:48px}
 .about-copy h2{font-size:52px;line-height:1.05}
 .about-copy p{font-size:14px}
 .portrait{max-width:100%;justify-self:stretch}
 .portrait img{aspect-ratio:4/5}
 .location-visual{grid-column:1;aspect-ratio:1;margin:0;width:100%}
 .location-globe{inset:-8% -7% 0;width:114%;height:100%}
 .location-pin{font-size:9px;padding:7px 10px}
 .location-caption{font-size:11px;gap:15px;align-items:flex-start;bottom:-15px}
 .location-caption strong{font-size:22px;display:block;max-width:180px;line-height:1.2;margin-top:8px}
 .globe-destination{font-size:11px;padding-top:2px}
}
@media(max-width:360px){.contact-nav{display:none}.hero-content h1{font-size:15.4vw}}
@media(prefers-reduced-motion:reduce){.hero-content h1 span{filter:none!important;opacity:1!important;transform:none!important}.location-globe canvas.ready{display:block}.location-globe:has(canvas.ready)>svg{opacity:0}.method-art{position:relative;top:auto}}
html:not(.motion-enabled) .hero-content h1 span{filter:none!important;opacity:1!important;transform:none!important}
html:not(.motion-enabled) .method-art{position:relative;top:auto}
@media print{.method-sticky{position:static!important;height:auto!important}.method-descriptions article{position:static!important;opacity:1!important;transform:none!important}.method-art,.location-visual{display:none}.about-section{display:block}.hero-content{color:black;height:auto;min-height:0}.hero-content h1{font-size:60px}.hero-bottom>p{color:black;text-shadow:none}.hero-content h1 span{filter:none!important;opacity:1!important;transform:none!important}}
@media(prefers-reduced-motion:reduce){.water-layer:has(#tide-canvas.ready) .water-fallback{visibility:visible!important}}

/* Keep the globe AND its raised arcs inside a generously sized, unmasked canvas. */
.location-visual{aspect-ratio:auto;overflow:visible;width:min(1050px,100%)}
.location-globe{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1.16;overflow:visible;mask-image:none;-webkit-mask-image:none}
.location-caption{position:relative;inset:auto;margin:-4px 0 0}
.location-caption strong{line-height:1.2}
@media(max-width:600px){
 .location-globe{inset:auto;width:100%;height:auto;aspect-ratio:1}
 .location-caption{margin:0;gap:15px;display:grid;grid-template-columns:1fr}
 .location-caption strong{max-width:none}
 .globe-destination{padding:0;white-space:normal}
}

.portrait-image{position:relative;overflow:hidden;border-radius:3px}

/* Reveal complete lines from below. The hero has its own clarity sequence. */
.title-mask{display:block;overflow:hidden;padding:.08em .05em .11em;margin:-.08em -.05em -.11em}
.title-line{display:block;transform:translateY(0);opacity:1}
.motion-enabled .title-reveal:not(.is-revealed) .title-line{transform:translateY(113%);opacity:.01}
.motion-enabled .title-reveal.is-revealed .title-line{transition:transform .85s cubic-bezier(.2,.7,.15,1),opacity .65s;transition-delay:calc(var(--line-order,0)*140ms)}
html:not(.motion-enabled) .title-line{transform:none!important;opacity:1!important;transition:none!important}

/* One brand gesture between pages. Never a fake percentage or an initial loader. */
@view-transition{navigation:none}
.page-curtain{position:fixed;inset:-4px 0;z-index:99990;display:grid;place-items:center;background:var(--bg);color:var(--accent);border-top:3px solid var(--accent);border-bottom:3px solid var(--accent);transform:translateY(105%);will-change:transform;pointer-events:auto}
.page-curtain[hidden]{display:none!important}
.curtain-mark{display:block;width:clamp(55px,7vw,100px);height:auto;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--accent) 16%,transparent))}
.curtain-mark svg{display:block;width:100%;height:auto;fill:currentColor}
.rt-arriving body:before{content:"";position:fixed;inset:0;z-index:99989;background:var(--bg);pointer-events:none;animation:curtain-failsafe 0s 1.8s forwards}
@keyframes curtain-failsafe{to{visibility:hidden}}
@media(prefers-reduced-motion:reduce){
 .title-line{transform:none!important;opacity:1!important;transition:none!important}
 .page-curtain,.rt-arriving body:before{display:none!important}
}