@font-face{font-family:PingAR;src:url('fonts/PingAR-Regular.otf')}@font-face{font-family:PingAR;src:url('fonts/PingAR-Bold.otf');font-weight:700}
:root{--ink:#07384a;--deep:#032c3a;--green:#2c8b61;--lime:#a4cc58;--cream:#f7f4ec;--sand:#d29659;--blue:#2da8d1;--line:rgba(7,56,74,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:PingAR,Arial,sans-serif;overflow-x:hidden}button,a{font:inherit}button{color:inherit}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}
.topbar{position:fixed;z-index:100;top:0;left:0;width:100%;height:72px;padding:0 clamp(22px,4vw,72px);display:flex;align-items:center;justify-content:space-between;color:#fff;border-bottom:1px solid rgba(255,255,255,.22);background:linear-gradient(180deg,rgba(3,44,58,.62),transparent);backdrop-filter:blur(8px)}.brand{font-weight:700;letter-spacing:.1em}.brand span,.brand b{color:var(--lime)}.topbar nav{display:flex;gap:32px;font-size:13px;letter-spacing:.1em;text-transform:uppercase}.topbar nav a{position:relative}.topbar nav a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:1px;background:#fff;transition:.3s}.topbar nav a:hover:after{width:100%}.langToggle{width:40px;height:40px;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;border-radius:50%;cursor:pointer}
.hero{height:100svh;min-height:650px;position:relative;overflow:hidden;background:var(--deep);isolation:isolate}.heroBackdrop{position:absolute;inset:-5%;width:110%;height:110%;object-fit:cover;filter:blur(30px) brightness(.55);transform:scale(1.08)}.heroArtWrap{position:absolute;inset:72px 0 0;display:grid;place-items:center;will-change:transform;transition:transform .8s cubic-bezier(.2,.8,.2,1)}.heroArt{width:100%;height:100%;object-fit:contain}.heroShade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,44,58,.25),rgba(3,44,58,.02) 42%,rgba(3,44,58,.72))}.heroCopy{position:absolute;z-index:2;left:50%;bottom:11%;width:min(1100px,90vw);transform:translateX(-50%);text-align:center;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.34)}.heroCopy p{margin:0 0 14px;font-size:12px;letter-spacing:.28em}.heroCopy h1{margin:0;font:700 clamp(45px,7.5vw,118px)/.92 Georgia,serif;letter-spacing:-.045em}.heroCopy span{display:block;max-width:620px;margin:20px auto 0;font-size:clamp(15px,1.25vw,20px);line-height:1.6}.scrollCue{position:absolute;z-index:3;left:clamp(24px,4vw,70px);bottom:32px;display:flex;align-items:center;gap:12px;color:#fff;font-size:12px;letter-spacing:.1em}.scrollCue i{width:34px;height:34px;border:1px solid rgba(255,255,255,.6);border-radius:50%;position:relative}.scrollCue i:after{content:"↓";position:absolute;inset:0;display:grid;place-items:center;animation:nudge 1.7s ease-in-out infinite}@keyframes nudge{50%{transform:translateY(3px)}}
.section{padding:clamp(90px,11vw,180px) clamp(22px,5vw,90px)}.sectionHead{max-width:980px;margin:0 auto clamp(54px,7vw,100px);text-align:center}.sectionHead small{display:block;color:var(--green);font-weight:700;margin-bottom:18px}.sectionHead p{margin:0 0 18px;font-size:12px;letter-spacing:.28em;font-weight:700}.sectionHead h2{margin:0;font:400 clamp(40px,5vw,78px)/1.02 Georgia,serif;letter-spacing:-.04em}.sectionHead.light{color:#fff}.sectionHead.light small,.sectionHead.light p{color:var(--lime)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}
.story{background:#fff}.phoneScene{max-width:1280px;margin:auto;display:grid;grid-template-columns:minmax(290px,430px) minmax(280px,1fr);gap:clamp(50px,8vw,130px);align-items:center}.phone{background:#101b20;border:9px solid #151a1d;border-radius:46px;padding:12px;box-shadow:0 38px 90px rgba(7,56,74,.18);color:#fff;overflow:hidden}.phoneBar{height:26px;display:flex;justify-content:space-between;align-items:center;padding:0 12px;font-size:10px}.phoneBar i{width:82px;height:20px;border-radius:16px;background:#000}.phoneBar b{font-size:7px;letter-spacing:2px}.phoneBrowser{height:40px;background:#eef1ef;color:#7a8584;border-radius:12px 12px 0 0;display:grid;place-items:center;font-size:10px}.phoneMap{height:172px;overflow:hidden}.phoneMap img{width:100%;height:100%;object-fit:cover}.phoneLines{padding:17px 15px 20px;background:var(--cream);color:var(--ink)}.phoneLines p{display:grid;grid-template-columns:30px 1fr;gap:12px;margin:0;padding:10px 0;border-bottom:1px solid rgba(7,56,74,.12);font-size:12px;line-height:1.35}.phoneLines p:last-child{border:0}.phoneLines b{color:var(--green)}.storyAside{max-width:570px;font:400 clamp(25px,3vw,43px)/1.35 Georgia,serif}.storyAside a{display:inline-block;margin-top:38px;border-bottom:1px solid var(--ink);padding-bottom:7px;font:700 12px PingAR;letter-spacing:.15em;text-transform:uppercase}
.album{background:var(--cream);padding-left:0;padding-right:0}.album .sectionHead{padding:0 22px}.albumRail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 max(22px,calc((100vw - 1460px)/2));overscroll-behavior-inline:contain}.albumRail::-webkit-scrollbar{display:none}.albumCard{flex:0 0 clamp(270px,29vw,440px);height:clamp(440px,52vw,690px);position:relative;scroll-snap-align:center;background-repeat:no-repeat;background-color:#ccc;overflow:hidden}.albumCard:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(3,44,58,.92))}.albumCard .cardCopy{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:32px;color:#fff}.cardCopy small{font-size:11px;color:var(--lime);letter-spacing:.2em}.cardCopy h3{margin:10px 0;font:400 clamp(29px,2.4vw,40px)/1 Georgia,serif}.cardCopy p{margin:0;line-height:1.55;font-size:14px;max-width:340px}.railNav{display:flex;justify-content:center;align-items:center;gap:28px;margin-top:38px}.railNav button,.detailNav button{width:52px;height:52px;background:transparent;border:1px solid var(--ink);cursor:pointer}.railNav span{font-weight:700;font-size:12px;letter-spacing:.14em}
.holdSection{background:var(--deep);padding-left:clamp(10px,3vw,48px);padding-right:clamp(10px,3vw,48px)}.holdStage{max-width:1540px;margin:auto;position:relative;overflow:hidden;cursor:pointer;user-select:none;touch-action:pan-y;outline:none}.holdStage>img{width:100%}.livingCrop{position:absolute;inset:0;background:url('assets/wellness-harbor-map-2048.webp') center/100% 100% no-repeat;opacity:0;pointer-events:none}.cropPeople{clip-path:circle(12% at 65% 53%)}.cropHarbor{clip-path:circle(17% at 80% 30%)}.cropSpring{clip-path:circle(10% at 87% 75%)}.holdStage.is-live .livingCrop{opacity:1}.holdStage.is-live .cropPeople{animation:livePeople 1.8s ease-in-out infinite alternate}.holdStage.is-live .cropHarbor{animation:liveHarbor 2.2s ease-in-out infinite alternate}.holdStage.is-live .cropSpring{animation:liveSpring 2.6s ease-in-out infinite alternate}@keyframes livePeople{to{transform:translate(1px,-2px)}}@keyframes liveHarbor{to{transform:translate(2px,-1px)}}@keyframes liveSpring{to{transform:translate(-1px,2px)}}.waterShimmer{position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.36),transparent 65%);mix-blend-mode:soft-light;transform:translateX(-100%);opacity:0}.holdStage.is-live .waterShimmer{opacity:1;animation:water 2.7s linear infinite}@keyframes water{to{transform:translateX(100%)}}.lifePulse{position:absolute;width:12px;height:12px;border-radius:50%;border:2px solid #fff;opacity:0}.p1{left:64%;top:51%}.p2{left:82%;top:27%}.p3{left:87%;top:73%}.holdStage.is-live .lifePulse{animation:pulse 1.7s ease-out infinite}.holdStage.is-live .p2{animation-delay:.4s}.holdStage.is-live .p3{animation-delay:.8s}@keyframes pulse{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(3)}}.holdPrompt{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:190px;height:190px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:rgba(3,44,58,.88);border:1px solid rgba(255,255,255,.5);box-shadow:0 0 0 14px rgba(255,255,255,.14);transition:.35s}.holdPrompt span{font-size:34px;font-weight:300}.holdPrompt b{font-size:13px;letter-spacing:.15em;margin:8px 0}.holdPrompt small{font-size:10px;max-width:125px;line-height:1.4}.holdStage.is-live .holdPrompt{opacity:.15;transform:translate(-50%,-50%) scale(.88)}
.compareSection{background:#fff}.compareGrid{max-width:1460px;margin:auto;display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(40px,6vw,100px);align-items:center}.compareFrame{position:relative;aspect-ratio:1.5;overflow:hidden;background:var(--deep)}.compareFrame>img,.oldMap,.oldMap img{width:100%;height:100%;object-fit:cover}.oldMap{position:absolute;inset:0;width:var(--split);overflow:hidden}.oldMap img{width:calc(100% / (var(--split) / 100));max-width:none;object-position:left}.compareLine{position:absolute;left:var(--split);top:0;bottom:0;width:2px;background:#fff;transform:translateX(-1px)}.compareLine span{position:absolute;top:50%;left:50%;width:46px;height:46px;border-radius:50%;transform:translate(-50%,-50%);background:#fff;display:grid;place-items:center;color:var(--ink)}.compareFrame input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.compareFrame>b{position:absolute;bottom:18px;padding:7px 10px;color:#fff;background:rgba(3,44,58,.72);font-size:10px;letter-spacing:.12em}.oldLabel{left:18px}.newLabel{right:18px}.compareCopy>p{font:400 clamp(20px,2vw,28px)/1.55 Georgia,serif;margin:0 0 24px}.compareCopy ul{padding:0;margin:40px 0 0;list-style:none}.compareCopy li{display:grid;grid-template-columns:100px 1fr;gap:20px;padding:16px 0;border-top:1px solid var(--line);font-size:12px}.compareCopy li span{color:var(--green);font-weight:700;letter-spacing:.1em}
.inspiration{background:var(--deep)}.moodboard{max-width:1460px;margin:auto;position:relative}.moodboard img{width:100%;aspect-ratio:16/8.3;object-fit:cover}.moodboard>div{position:absolute;right:4%;bottom:7%;max-width:450px;padding:36px;background:rgba(247,244,236,.94);color:var(--ink)}.moodboard small{font-weight:700;letter-spacing:.18em;color:var(--green)}.moodboard p{font:400 25px/1.45 Georgia,serif;margin:14px 0 0}.palette{max-width:1460px;margin:46px auto 0;display:grid;grid-template-columns:repeat(6,1fr);color:#fff}.palette article{border-left:1px solid rgba(255,255,255,.2);padding:0 16px}.palette i{display:block;width:100%;height:10px;background:var(--c);margin-bottom:20px}.palette b,.palette span{display:block}.palette b{font-size:12px}.palette span{font-size:10px;opacity:.62;margin-top:8px}
.explore{background:var(--cream)}.explorer{max-width:1600px;margin:auto;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(330px,.7fr);background:var(--deep);padding:16px;gap:16px;position:relative}.explorerTools{position:absolute;z-index:6;right:16px;top:-56px}.explorerTools button{height:42px;border:1px solid var(--ink);background:transparent;padding:0 16px;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:11px;letter-spacing:.1em}.interactiveMap{position:relative;align-self:start;overflow:hidden}.interactiveMap>img{width:100%;height:auto}.hotspot{position:absolute;transform:translate(-50%,-50%);width:34px;height:34px;padding:0;border:2px solid rgba(255,255,255,.75);border-radius:50%;background:rgba(247,244,236,.92);box-shadow:0 3px 12px rgba(3,44,58,.2);font-weight:700;font-size:10px;cursor:pointer;transition:.25s;display:grid;place-items:center}.hotspot:hover,.hotspot.active{background:var(--lime);border-color:#fff;transform:translate(-50%,-50%) scale(1.18);z-index:3}.mapDetail{background:var(--cream);padding:clamp(28px,3vw,54px);align-self:stretch}.mapDetail>span{display:block;font:700 55px/1 Georgia;color:var(--green)}.mapDetail small{display:block;margin:24px 0 12px;letter-spacing:.2em;color:#71817e;font-weight:700}.mapDetail h3{font:400 clamp(32px,3vw,52px)/1.03 Georgia,serif;margin:0 0 24px}.mapDetail p{font-size:18px;line-height:1.65;margin:0}.detailNav{display:flex;align-items:center;gap:16px;margin-top:45px}.detailNav b{font-size:12px}.explorer:fullscreen{width:100vw;height:100vh;max-width:none;grid-template-columns:minmax(0,1.7fr) minmax(380px,.7fr);padding:52px 16px 16px;background:var(--deep)}.explorer:fullscreen .explorerTools{top:8px;right:16px}.explorer:fullscreen .explorerTools button{color:#fff;border-color:rgba(255,255,255,.5)}.explorer:fullscreen .interactiveMap{height:calc(100vh - 68px);display:grid;place-items:center}.explorer:fullscreen .interactiveMap>img{max-height:100%;width:auto}.explorer:fullscreen #hotspots{position:absolute;inset:0}.explorer:fullscreen .mapDetail{overflow:auto}
footer{min-height:150px;background:#022634;color:#fff;padding:40px clamp(22px,5vw,90px);display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.13em}footer span{color:var(--lime)}
[dir=rtl] .sectionHead,[dir=rtl] .heroCopy{text-align:center}[dir=rtl] .phoneLines p{grid-template-columns:1fr 30px}[dir=rtl] .phoneLines p b{grid-column:2;grid-row:1}[dir=rtl] .phoneLines p span{grid-column:1;grid-row:1}[dir=rtl] .compareCopy,[dir=rtl] .storyAside,[dir=rtl] .mapDetail{text-align:right}[dir=rtl] .compareCopy li{grid-template-columns:1fr 100px}[dir=rtl] .compareCopy li span{grid-column:2;grid-row:1}
@media(max-width:900px){.topbar{height:60px}.topbar nav{display:none}.heroArtWrap{inset:60px 0 8vh}.heroArt{object-fit:contain}.heroCopy{bottom:12%}.heroCopy h1{font-size:clamp(41px,12vw,70px)}.heroCopy span{font-size:13px;max-width:85%}.scrollCue{left:50%;transform:translateX(-50%);bottom:20px}.scrollCue span{display:none}.phoneScene,.compareGrid{grid-template-columns:1fr}.phone{width:min(390px,92vw);margin:auto}.storyAside{text-align:center;margin:auto}.compareCopy{max-width:680px;margin:auto}.moodboard>div{position:relative;right:auto;bottom:auto;max-width:none}.palette{grid-template-columns:repeat(3,1fr);gap:26px 0}.explorer{grid-template-columns:1fr;padding:8px}.explorerTools{right:8px}.mapDetail{min-height:340px}.explorer:fullscreen{display:block;padding:58px 8px 8px;overflow:auto}.explorer:fullscreen .interactiveMap{height:auto}.explorer:fullscreen .mapDetail{margin-top:8px}.hotspot{width:29px;height:29px;font-size:9px}}
@media(max-width:560px){.section{padding:84px 18px}.sectionHead{margin-bottom:48px}.sectionHead h2{font-size:39px}.topbar{padding:0 16px}.brand{font-size:12px}.hero{min-height:620px}.heroBackdrop{filter:blur(18px) brightness(.5)}.heroArtWrap{inset:95px 0 20vh}.heroCopy p{font-size:8px}.heroCopy h1{font-size:44px;max-width:350px;margin:auto}.heroCopy span{margin-top:12px}.album{padding-left:0;padding-right:0}.albumCard{flex-basis:82vw;height:118vw;max-height:590px}.holdSection{padding-left:0;padding-right:0}.holdPrompt{width:132px;height:132px}.holdPrompt span{font-size:23px}.holdPrompt small{display:none}.moodboard img{aspect-ratio:1/1;object-position:center}.moodboard>div{padding:26px}.moodboard p{font-size:21px}.palette{grid-template-columns:repeat(2,1fr);gap:26px 0}.explore{padding-left:8px;padding-right:8px}.explore .sectionHead{padding:0 10px}.explorerTools{top:-49px}.hotspot{width:24px;height:24px;border-width:1px;font-size:7px}.mapDetail h3{font-size:34px}.mapDetail p{font-size:15px}footer{flex-direction:column;gap:22px;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Stable comparison and fullscreen geometry: overlays always share the image box. */
.compareFrame .oldMap{width:100%;clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.compareFrame .oldMap img{width:100%;height:100%;max-width:100%;object-position:left}
.explorer:fullscreen .interactiveMap{height:auto;display:block;align-self:start}
.explorer:fullscreen .interactiveMap>img{width:100%;height:auto;max-height:none}

/* Editorial sticky opening: the story rises above a fixed map canvas. */
main{position:relative}
.hero{position:sticky;top:0;z-index:0}
.topbar.scrolled{background:rgba(3,44,58,.96);box-shadow:0 8px 30px rgba(3,44,58,.15)}
.story,.album,.holdSection,.compareSection,.inspiration,.explore,footer{position:relative;z-index:2}
.story{box-shadow:0 -32px 70px rgba(3,44,58,.12)}

/* Eight-line editorial story, without a device mockup. */
.storyLayout{max-width:1400px;margin:auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:clamp(52px,8vw,130px);align-items:start}
.storyLines{border-top:1px solid var(--ink)}
.storyLines p{margin:0;padding:clamp(18px,2vw,28px) 0;display:grid;grid-template-columns:64px 1fr;gap:20px;border-bottom:1px solid var(--line);font:400 clamp(20px,2vw,31px)/1.35 Georgia,serif}
.storyLines p b{font:700 13px/1 PingAR;color:var(--green);padding-top:8px;letter-spacing:.12em}
.storyAside{position:sticky;top:120px}
.storyLayoutSimple{display:block;max-width:900px;text-align:center}
.storyLayoutSimple .storyAside{position:static;max-width:900px;margin:auto;text-align:center}

/* Each album frame has its own composition and crop. */
.albumRail{align-items:flex-start;min-height:720px}
.albumCard{background:none;flex-basis:clamp(290px,27vw,430px);height:620px}
.albumCard>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.albumCard:hover>img{transform:scale(1.055)}
.albumCard.crop-1{height:660px}
.albumCard.crop-2{height:520px;margin-top:90px;flex-basis:clamp(320px,34vw,520px)}
.albumCard.crop-3{height:610px;margin-top:25px}
.albumCard.crop-4{height:500px;margin-top:120px;flex-basis:clamp(330px,35vw,540px)}
.albumCard.crop-5{height:680px}
.albumCard.crop-6{height:540px;margin-top:80px;flex-basis:clamp(320px,33vw,510px)}
.albumCard.crop-7{height:625px;margin-top:30px}
.albumCard.crop-8{height:510px;margin-top:110px;flex-basis:clamp(330px,34vw,530px)}

/* The supplied film starts only while the visitor is pressing. */
.holdStage{background:#021f2b;aspect-ratio:3000/2045;display:grid;place-items:center}
.holdStage video{display:block;width:100%;height:100%;object-fit:contain;background:#021f2b}
.holdStage::before{content:"";position:absolute;z-index:1;left:50%;top:50%;width:min(62vw,820px);aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg,rgba(164,204,88,.28) 0deg,rgba(164,204,88,0) 8deg,rgba(45,168,209,.2) 15deg,rgba(45,168,209,0) 26deg);-webkit-mask:radial-gradient(circle,transparent 0 18%,#000 34%,transparent 70%);mask:radial-gradient(circle,transparent 0 18%,#000 34%,transparent 70%);opacity:.38;pointer-events:none;animation:holdRays 22s linear infinite}
.holdStage::after{content:"";position:absolute;z-index:1;left:50%;top:50%;width:min(32vw,390px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(164,204,88,.34) 0,rgba(45,168,209,.2) 34%,rgba(45,168,209,0) 72%);filter:blur(16px);opacity:.8;pointer-events:none;animation:holdGlow 2.8s ease-in-out infinite}
.holdPrompt{z-index:2;box-shadow:0 0 0 14px rgba(255,255,255,.12),0 0 32px rgba(164,204,88,.45),0 0 80px rgba(45,168,209,.3)}
.holdStage.is-live::before,.holdStage.is-live::after{opacity:0;transition:opacity .45s ease}
.holdStage.is-live .holdPrompt{opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.82)}
.holdPrompt span{font-size:26px;line-height:1;margin-left:4px}
@keyframes holdRays{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes holdGlow{50%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}}

/* Supplied album artwork already contains the approved crop and proportions. */
.albumRail{min-height:0;align-items:stretch}
.albumCard,.albumCard.crop-1,.albumCard.crop-2,.albumCard.crop-3,.albumCard.crop-4,.albumCard.crop-5,.albumCard.crop-6,.albumCard.crop-7,.albumCard.crop-8{height:auto;aspect-ratio:1386/1374;margin-top:0;flex-basis:clamp(310px,38vw,560px)}
.albumCard>img{object-fit:cover;object-position:center}

/* The map image and its numbered markers zoom as one aligned layer. */
.mapZoomLayer{position:relative;width:100%;transform-origin:var(--zoom-x,50%) var(--zoom-y,50%);transition:transform .75s cubic-bezier(.2,.75,.2,1),transform-origin .75s cubic-bezier(.2,.75,.2,1);will-change:transform}
.mapZoomLayer>img{display:block;width:100%;height:auto}
.mapZoomLayer.is-zoomed{transform:scale(1.36)}
.explorer:fullscreen .mapZoomLayer>img{width:100%;height:auto;max-height:none}

/* Closing statement: the new map sits as a visual layer beneath the message. */
.closingMessage{position:relative;z-index:2;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:var(--deep);color:#fff;padding:clamp(90px,10vw,170px) clamp(22px,7vw,120px)}
.closingMapLayer{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;filter:saturate(.82) brightness(.62);transform:scale(1.025)}
.closingShade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,44,58,.42),rgba(3,44,58,.76)),radial-gradient(circle at 50% 46%,rgba(3,44,58,.08),rgba(3,44,58,.62) 78%)}
.closingCopy{position:relative;z-index:1;width:min(1100px,92vw);text-align:center;text-shadow:0 3px 24px rgba(0,0,0,.35)}
.closingCopy small{display:block;margin-bottom:30px;color:var(--lime);font-weight:700;font-size:13px;letter-spacing:.24em}
.closingCopy h2{margin:0;font:700 clamp(48px,7vw,108px)/.95 Georgia,serif;letter-spacing:-.045em}
.closingCopy p{max-width:900px;margin:36px auto 0;font-size:clamp(18px,1.7vw,27px);line-height:1.65}

@media(max-width:900px){.mapZoomLayer.is-zoomed{transform:scale(1.42)}}
@media(max-width:560px){.closingMessage{min-height:88svh}.closingCopy h2{font-size:42px}.closingCopy p{font-size:17px}.closingCopy small{font-size:11px;line-height:1.6}.mapZoomLayer.is-zoomed{transform:scale(1.48)}}

/* The interactive map pins in place while the final message rises above it. */
.finalStack{position:relative;z-index:2;background:var(--deep)}
.finalStack .explore{position:sticky;top:0;z-index:1;min-height:100svh}
.finalStack .closingMessage{z-index:3;box-shadow:0 -34px 80px rgba(3,44,58,.34)}
.explorerTools{display:flex;align-items:center;gap:8px}
.explorerTools button:disabled{opacity:.38;cursor:not-allowed}

@media(max-width:900px){
  .finalStack .explore{position:relative;top:auto}
  .explorerTools button{padding:0 11px}
  .explorerTools button b{font-size:9px}
}

/* Refined final sequence: show the full explorer, pause, then let the message cover it. */
.exploreIntro{position:relative;z-index:2;background:var(--cream);padding-bottom:clamp(80px,8vw,120px)}
.explorerPin{position:sticky;top:72px;z-index:1;min-height:calc(100svh - 72px);display:grid;place-items:center;background:var(--cream);padding:70px clamp(22px,4vw,70px) 38px}
.explorerPin .explorer{width:100%}
.overlayGap{position:relative;z-index:1;height:38vh;min-height:240px;pointer-events:none}
.finalStack .closingMessage{position:relative;z-index:3}

/* Button zoom and mouse panning share one stable transform layer. */
.mapZoomLayer{transform:translate3d(var(--pan-x,0px),var(--pan-y,0px),0) scale(var(--zoom,1))}
.interactiveMap{user-select:none}
.interactiveMap.can-pan{cursor:grab}
.interactiveMap.can-pan{touch-action:none}
.interactiveMap.is-dragging{cursor:grabbing}
.interactiveMap.is-dragging .mapZoomLayer{transition:none}

@media(max-width:900px){
  .exploreIntro{padding-bottom:72px}
  .explorerPin{position:relative;top:auto;min-height:auto;padding:70px 8px 44px}
  .overlayGap{height:56px;min-height:56px;background:var(--cream)}
}

/* Glass markers keep the artwork visible beneath every number. */
.hotspot{color:#07384a;background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(255,255,255,.16));border:1px solid rgba(255,255,255,.82);-webkit-backdrop-filter:blur(10px) saturate(145%);backdrop-filter:blur(10px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(255,255,255,.2),0 7px 20px rgba(3,44,58,.22);text-shadow:0 1px 0 rgba(255,255,255,.8)}
.hotspot:hover,.hotspot.active{color:#07384a;background:linear-gradient(145deg,rgba(205,235,132,.78),rgba(80,167,135,.38));border-color:rgba(255,255,255,.96);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 4px rgba(164,204,88,.18),0 9px 26px rgba(3,44,58,.28)}

[dir=rtl] .storyLines p{grid-template-columns:1fr 64px;text-align:right}
[dir=rtl] .storyLines p b{grid-column:2;grid-row:1}
[dir=rtl] .storyLines p span{grid-column:1;grid-row:1}

@media(max-width:900px){
  .storyLayout{grid-template-columns:1fr}
  .storyAside{position:static;text-align:center}
  .albumRail{min-height:610px}
  .albumCard,.albumCard.crop-1,.albumCard.crop-2,.albumCard.crop-3,.albumCard.crop-4,.albumCard.crop-5,.albumCard.crop-6,.albumCard.crop-7,.albumCard.crop-8{height:560px;margin-top:0;flex-basis:min(82vw,430px)}
}
@media(max-width:560px){
  .hero{position:sticky;top:0}
  .storyLines p{grid-template-columns:42px 1fr;gap:10px;font-size:19px}
  [dir=rtl] .storyLines p{grid-template-columns:1fr 42px}
  .albumRail{min-height:520px}
  .albumCard,.albumCard.crop-1,.albumCard.crop-2,.albumCard.crop-3,.albumCard.crop-4,.albumCard.crop-5,.albumCard.crop-6,.albumCard.crop-7,.albumCard.crop-8{height:500px}
  .holdStage{aspect-ratio:3000/2045}
}

/* A brief North Star loading state while the opening map becomes ready. */
.siteLoader{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:#032c3a;color:#f7f4ec;transition:opacity .6s ease,visibility .6s ease}
.siteLoader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.siteLoader p{font-size:12px;font-weight:700;letter-spacing:.24em;margin:0;color:#d2e793}
.northStar{width:108px;height:108px;border:1px solid rgba(164,204,88,.36);border-radius:50%;display:grid;place-items:center;position:relative;animation:starOrbit 8s linear infinite}
.northStar:before,.northStar:after{content:"";position:absolute;background:#a4cc58}
.northStar:before{width:1px;height:132px;top:-13px;left:50%}
.northStar:after{height:1px;width:132px;left:-13px;top:50%}
.northStar span{font:400 54px/1 Georgia,serif;color:#d2e793;filter:drop-shadow(0 0 15px rgba(164,204,88,.65));animation:starGlow 2s ease-in-out infinite alternate}
@keyframes starOrbit{to{transform:rotate(360deg)}}
@keyframes starGlow{to{opacity:.6;filter:drop-shadow(0 0 3px rgba(164,204,88,.35))}}

/* The hold cue sits over the lower part of the image without covering its story. */
.holdStage::before,.holdStage::after{display:none}
.holdPrompt{left:50%;top:auto;bottom:6%;width:auto;height:auto;min-width:170px;transform:translateX(-50%);padding:0;gap:14px;border:0;border-radius:0;background:none;box-shadow:none;pointer-events:none;text-shadow:0 2px 12px rgba(3,44,58,.85)}
.holdPrompt b{font-size:12px;font-weight:700;letter-spacing:.21em;margin:0;white-space:nowrap}
.holdPrompt span{display:grid;place-items:center;width:56px;height:56px;margin:0;border:1px solid rgba(255,255,255,.95);border-radius:50%;background:rgba(3,44,58,.16);font:300 34px/1 PingAR,Arial,sans-serif;box-shadow:0 0 20px rgba(3,44,58,.22)}
.holdStage.is-live .holdPrompt{opacity:0;transform:translateX(-50%)}
@media(max-width:560px){.holdPrompt{bottom:5%;min-width:142px;gap:9px}.holdPrompt b{font-size:10px}.holdPrompt span{width:44px;height:44px;font-size:28px}}

/* Keep mobile long presses inside the intended video interaction. */
.holdStage,.holdStage *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.holdStage video{pointer-events:none}

/* All ten supplied square album frames retain their complete composition. */
.albumCard.crop-9,.albumCard.crop-10{height:auto;aspect-ratio:1386/1374;margin-top:0;flex-basis:clamp(310px,38vw,560px)}
@media(max-width:900px){.albumCard.crop-9,.albumCard.crop-10{height:auto;margin-top:0;flex-basis:min(82vw,430px)}}
@media(max-width:560px){.albumCard,.albumCard.crop-1,.albumCard.crop-2,.albumCard.crop-3,.albumCard.crop-4,.albumCard.crop-5,.albumCard.crop-6,.albumCard.crop-7,.albumCard.crop-8,.albumCard.crop-9,.albumCard.crop-10{height:auto;aspect-ratio:1386/1374}}

/* One-tap playback with the browser's normal video controls. */
.langToggle[hidden]{display:none}
.holdStage{cursor:default}
.holdStage video{pointer-events:auto}
.holdPrompt{pointer-events:auto;cursor:pointer}
.holdPrompt span{font-size:21px;padding-left:3px}
.holdStage.has-started .holdPrompt{opacity:0;pointer-events:none}
@media(max-width:560px){.holdPrompt span{font-size:17px}}

/* Center the video action over its preview. */
.holdPrompt{top:50%;bottom:auto;transform:translate(-50%,-50%)}
.holdStage.is-live .holdPrompt{transform:translate(-50%,-50%)}
@media(max-width:560px){.holdPrompt{top:50%;bottom:auto}}

/* Reveal the full-height map first, then let the story rise over the pinned scene. */
.hero{position:relative;top:auto;height:calc(200svh + var(--hero-pan-distance,100svh));min-height:0;overflow:visible}
.heroScene{position:sticky;top:0;height:100svh;min-height:0;overflow:hidden;background:var(--deep);isolation:isolate}
.story{margin-top:-100svh;z-index:3;border-radius:24px 24px 0 0}
.heroBackdrop{display:block}
.heroShade{display:block}
.heroArtWrap{inset:72px 0 0;display:block;overflow:hidden;transition:none;will-change:auto}
.heroArt{width:100%;height:auto;min-height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center top;will-change:transform}
.heroCopy{left:50%;bottom:11%;transform:translateX(-50%);width:min(1100px,90vw);height:auto;padding:0;background:none;display:block;text-shadow:0 2px 16px rgba(0,0,0,.34)}
.heroCopy p{font-size:12px;margin:0 0 14px}
.heroCopy h1{font-size:clamp(45px,7.5vw,118px);line-height:.92;letter-spacing:-.045em}
.heroCopy span{font-size:clamp(15px,1.25vw,20px);line-height:1.6;margin:20px auto 0;max-width:620px}
.scrollCue{left:clamp(24px,4vw,70px);right:auto;bottom:32px;transform:none}
@media(max-width:900px){
  .heroArtWrap{inset:60px 0 0}
  .heroArt{min-height:120%}
  .heroCopy{bottom:12%;width:92%}
  .heroCopy h1{font-size:clamp(45px,9vw,76px)}
  .heroCopy span{font-size:14px;max-width:85%}
  .scrollCue{left:50%;right:auto;bottom:20px;transform:translateX(-50%)}
}
@media(max-width:560px){
  .hero{position:relative;top:auto;min-height:0}
  .heroArtWrap{inset:60px 0 0}
  .heroArt{min-height:125%}
  .heroCopy{bottom:14%}
  .heroCopy p{font-size:9px;margin-bottom:12px}
  .heroCopy h1{font-size:clamp(42px,12vw,58px)}
  .heroCopy span{font-size:13px;max-width:92%;margin-top:16px}
}

@font-face{font-family:'AHG Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/wp-content/plugins/ahg-site-experience/manrope-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'AHG Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/wp-content/plugins/ahg-site-experience/manrope-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
html[lang=en] body,html[lang=en] button,html[lang=en] input{font-family:'AHG Manrope',Arial,sans-serif}html[lang=en] body{font-weight:400}html[lang=en] h1,html[lang=en] h2,html[lang=en] h3,html[lang=en] strong{font-weight:750}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #99c85f;outline-offset:4px}.interactiveMap,.compareFrame{direction:ltr}.langToggle{flex:0 0 44px;width:44px;height:44px}.topbar{gap:16px}html[dir=rtl] .heroCopy h1{line-height:1.3;letter-spacing:0}html[dir=rtl] .topbar nav{letter-spacing:0}.map-fullscreen-open{overflow:hidden}.explorer.fullscreen-fallback{position:fixed;inset:0;z-index:9999;width:100%;height:100dvh;max-width:none;margin:0;background:#f7f4ec;padding:70px 20px 20px;overflow:auto}.explorer.fullscreen-fallback .explorerTools{top:12px;right:16px}.explorerTools button{min-height:44px}.explorer.fullscreen-fallback .interactiveMap{min-height:45vh}@media(max-width:900px){.explorer.fullscreen-fallback{display:block;padding:64px 8px 8px}.explorer.fullscreen-fallback .mapDetail{margin-top:8px}.topbar .brand{white-space:nowrap}}
