/* The preview stays in place and opens the booking demo on request. */
html:has(dialog[open]){overflow:hidden}
html{scroll-behavior:auto}
body{overflow-anchor:none}
.dive{height:660svh}
.anchor{top:340svh}
.shore{isolation:isolate}
.frame-top{container:site / inline-size;align-self:center;flex:none;height:calc(100% - 34px);position:relative;overflow:hidden;scrollbar-width:none}
.site-scroll{height:100%}
.s-hero{height:100%;min-height:0}
.shore-note{flex-shrink:0}
.journey-copy{position:absolute;left:5vw;right:5vw;top:calc(var(--top-h) + 42px);opacity:0;pointer-events:none;z-index:-1}
.journey-copy:not([inert]){pointer-events:auto}
.journey-copy h2{font-size:clamp(1.8rem,2.8vw,2.8rem);font-weight:530;letter-spacing:-.045em;line-height:1.07;margin:0;max-width:25em}
.journey-copy p{margin:8px 0 0;font-size:.96rem;line-height:1.45;color:#37585c;max-width:50em}
.journey-b{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:0 24px;align-items:center}
.journey-b h2{grid-column:1;grid-row:1}
.journey-b p{grid-column:1;grid-row:2}
.workshop-open{grid-column:2;grid-row:1/3;font:inherit;font-size:.92rem;background:var(--encre);color:#e9f2ef;border:0;border-radius:100px;padding:12px 20px;min-height:46px;cursor:pointer;white-space:nowrap}
.journey-next{grid-column:3;grid-row:1/3;display:inline-flex;align-items:center;gap:16px;text-decoration:none;border-bottom:1px solid #829e99;padding:10px 0;font-size:.86rem;white-space:nowrap}
.workshop-dialog{padding:0;border:0;width:min(900px,94vw);max-height:90svh;background:#f4f3ee;color:#24160f;border-radius:16px;box-shadow:0 20px 90px #0006;overscroll-behavior:contain}
.workshop-dialog::backdrop{background:#03161bda;backdrop-filter:blur(10px)}
.workshop-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;position:sticky;top:0;background:#f4f3eef5;z-index:2;border-bottom:1px solid #d9d5ca}
.workshop-bar strong{font:1.4rem "Young Serif",serif}
.workshop-close{font:inherit;padding:9px 14px;min-height:44px;border:1px solid #6b5d54;color:inherit;border-radius:100px;background:none;cursor:pointer}
.workshop-dialog .s-ateliers{border:0;padding-top:28px}
.suite-rail{position:fixed;right:8px;top:calc(50% + var(--top-h) / 2);transform:translateY(-50%);display:flex;flex-direction:column;z-index:24;padding:4px 0;border-radius:100px;background:rgb(233 242 239 / .65);backdrop-filter:blur(12px);visibility:hidden}
.suite-rail.rail-visible{visibility:visible}
.suite-rail a{display:grid;place-items:center;width:36px;height:42px;position:relative}
.suite-rail a:before{content:"";width:5px;height:5px;background:#7c9794;border-radius:50%}
.suite-rail a[aria-current]:before{background:#c04429;box-shadow:0 0 0 4px rgb(240 105 74 / .2)}
.suite-rail a span{position:absolute;right:38px;top:9px;padding:3px 9px;border-radius:100px;white-space:nowrap;background:var(--lumiere);font-size:.75rem;opacity:0;pointer-events:none}
.suite-rail a[aria-current] span,.suite-rail a:hover span,.suite-rail a:focus-visible span{opacity:1}
.suite-rail:has(a:hover,a:focus-visible) a[aria-current]:not(:hover,:focus-visible) span{opacity:0}
.s-hero{padding:0 clamp(18px,3.2cqw,48px)}
.s-copy h2{font-size:clamp(2.1rem,min(5.1cqw,9.4svh),5.2rem)}
.s-body{gap:clamp(20px,4cqw,64px)}
.s-facts{gap:clamp(16px,3cqw,40px);font-size:clamp(.7rem,1.1cqw,.92rem)}
@container site (max-width:600px){
 .s-hero{padding:0 22px}
 .s-nav{height:62px}.s-nav ul{display:none}.s-mark{font-size:1.6rem}
 .s-body{grid-template-columns:1fr;grid-template-rows:auto minmax(100px,1fr);gap:16px;align-items:stretch;padding-bottom:22px}
 .s-copy h2{font-size:clamp(2rem,9.8cqw,3rem);line-height:1.05}
 .s-lede{font-size:.94rem;line-height:1.45;margin-bottom:18px}
 .s-photo{align-self:stretch;height:auto;margin:0 -22px 0 0;min-height:100px}
 .s-photo img{width:calc(100% - 14px)}.s-glaze{right:0}
 .s-next{left:8px;bottom:14px;padding:8px 12px}.s-next strong{font-size:.86rem}
 .s-facts,.s-link{display:none}.s-cta{padding:12px 18px;font-size:.92rem}
 .s-what{font-size:1.15rem}
 .s-tabs{gap:5px}.s-tabs button{padding:10px 7px;font-size:.82rem;flex:1}
 .s-detail dl div{grid-template-columns:1fr;gap:0;padding:6px 0}.s-detail dd{font-size:.87rem}
}
@media(max-width:1000px) and (min-width:721px){
 .journey-b{grid-template-columns:1fr auto;gap:0 18px}
 .journey-b .journey-next{display:none}
 .journey-copy h2{font-size:1.9rem}
 .journey-copy p{font-size:.86rem}
}
@media(max-width:720px){
 .frame-top{height:calc(100% - 28px)}
 .journey-copy{top:calc(var(--top-h) + 38px);left:22px;right:22px}
 .journey-copy h2{font-size:1.65rem;max-width:14em}
 .journey-copy p{font-size:.83rem;margin-top:6px;max-width:27em}
 .journey-b{grid-template-columns:1fr 1fr;gap:0 12px}
 .journey-b h2,.journey-b p{grid-column:1/-1;grid-row:auto}
 .journey-b .workshop-open{grid-column:1;grid-row:3;font-size:.79rem;padding:8px 12px;margin-top:9px;min-height:40px}
 .journey-b .journey-next{grid-column:2;grid-row:3;font-size:.75rem;gap:10px;padding:9px 0;margin-top:9px;justify-self:end}
 .workshop-dialog{width:100%;height:100svh;max-width:none;max-height:100svh;margin:0;border-radius:0}
}
@media(max-width:720px),(max-height:320px){.suite-rail{display:none}}
html.calm .dive{height:auto}
html.calm .frame-top{height:auto}
html.calm .site-scroll{height:auto}
html.calm .s-hero{height:calc(100svh - var(--top-h) - 28px)}
html.calm .journey-copy{display:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}