/* Stay-day (2026-10-29, flowing version): ten scenes scroll by normally. On PC the clock rides along in the left column,
   on phones in a thin bar under the header; stay-day.js moves it to the scene in the middle of the screen, shifts the sky
   colour and reveals each scene once as it comes in. Nothing is pinned or pulled, so the page scrolls like any other. */
@property --sky-a{syntax:'<color>';inherits:true;initial-value:#4b80ab}
@property --sky-b{syntax:'<color>';inherits:true;initial-value:#1C2833}
.stay-day{--sky-a:#4b80ab;--sky-b:#1C2833;position:relative;color:#fff;background:var(--ink);overflow:clip;
 transition:--sky-a 1.2s ease,--sky-b 1.2s ease}
/* The sticky sky/snow layer must not spill past the section (it covered the room section below). clip keeps sticky working;
   the next section also gets its own background and stacking in case clip is unsupported. */
.stay-day+.interlude{position:relative;z-index:1;background:var(--snow)}
/* The sky rides with the screen (same sticky layer as the snow), so the time-of-day colour is visible at every scene. */
.stay-day-snow{position:sticky;top:0;display:block;width:100%;height:100vh;margin-bottom:-100vh;pointer-events:none;z-index:0;
 background:radial-gradient(90% 75% at 12% 8%,var(--sky-a) 0%,transparent 70%),linear-gradient(180deg,var(--sky-b) 0%,var(--ink) 85%)}
.stay-day-head,.stay-day-body,.stay-day-end{position:relative;z-index:1}
.stay-day-head{padding:110px 9% 40px;max-width:980px}
.stay-day-head .small-label{color:var(--frost-gold)}
.stay-day-head h2{font-size:52px;margin-bottom:20px}
.stay-day-head>p:not(.small-label){font-size:15px;line-height:2.1;color:var(--text-w-m)}
.stay-day-skip{display:inline-block;margin-top:14px;font-size:12px;letter-spacing:.08em;color:var(--text-w-m);text-decoration:none;border-bottom:1px solid #ffffff40;padding-bottom:3px}
.stay-day-skip:hover{color:#fff}
/* Overview of the ten scenes (2026-10-30): time + a word, each jumps to its scene. */
.stay-day-index{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;align-items:baseline;margin:30px 0 6px;max-width:860px}
.stay-day-index p{margin:0;font-size:12px;letter-spacing:.14em;color:var(--frost-gold)}
.stay-day-index ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.stay-day-index a{display:inline-flex;align-items:baseline;gap:8px;padding:7px 13px;border:1px solid #ffffff38;border-radius:99px;color:#fff;text-decoration:none;font-size:13px;line-height:1.3;transition:background .2s,border-color .2s}
.stay-day-index a:hover{background:#ffffff1a;border-color:#ffffff80}
.stay-day-index time{font:300 13px/1 var(--sans);font-variant-numeric:tabular-nums;color:var(--text-w-m)}
/* Plan link under a scene, and the booking break between day 1 and day 2 */
.stay-step-plan{display:inline-flex;align-items:center;gap:10px;margin-top:16px;padding:10px 16px;border:1px solid #ffffff66;border-radius:3px;color:#fff;text-decoration:none;font-size:14px;letter-spacing:.04em;transition:background .2s,color .2s}
.stay-step-plan:hover{background:#fff;color:var(--ink)}
.stay-day-mid{padding:30px 32px;border:1px solid #ffffff33;border-radius:6px;background:rgba(var(--ink-rgb),.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.stay-day-mid p{margin:0 0 18px;font-size:16px;line-height:1.9}
.stay-day-mid a{display:inline-flex;align-items:center;gap:14px;padding:14px 24px;border-radius:3px;background:#fff;color:var(--ink);text-decoration:none;font-size:15px;font-weight:600;letter-spacing:.04em}
.stay-day-mid a:hover{background:var(--frost-gold)}
.stay-day-mid small{display:block;margin-top:14px;font-size:12px;line-height:1.8;color:var(--text-w-m)}

/* PC: clock column (sticky) + scenes */
.stay-day-body{display:grid;grid-template-columns:minmax(0,30%) minmax(0,1fr);gap:6%;padding:30px 9% 40px}
.stay-day-clock{position:sticky;top:120px;align-self:start;padding-top:10px}
.stay-day-label{margin:0 0 18px;font-size:12px;letter-spacing:.14em;color:var(--text-w-m)}
.stay-day-label i{font-style:normal;opacity:.5;margin:0 .4em}
.stay-day-arc{display:block;width:min(220px,90%);height:auto;margin-bottom:4px;overflow:visible}
.stay-day-arc path{fill:none;stroke:#ffffff40;stroke-width:1;stroke-dasharray:2 5}
.stay-day-orb{fill:#F3D9A4;filter:drop-shadow(0 0 10px #F3D9A4);transition:fill .6s}
.stay-day.is-night .stay-day-orb{fill:#E6EEF5;filter:drop-shadow(0 0 8px #BFD3E6)}
.stay-day-clock-row{display:flex;flex-direction:column;margin:0}
.stay-day-clock-day{font-size:13px;letter-spacing:.2em;color:var(--frost-gold)}
.stay-day-clock-time{font:200 clamp(72px,8vw,128px)/1 var(--sans);letter-spacing:.02em;font-variant-numeric:tabular-nums;
 background:linear-gradient(180deg,#fff 30%,rgba(255,255,255,.5));-webkit-background-clip:text;background-clip:text;color:transparent}
.stay-day-count{align-self:flex-start;margin-top:14px;font:400 12px/1 Arial,Helvetica,sans-serif;letter-spacing:.12em;padding:5px 9px;border:1px solid #ffffff40;border-radius:99px}
.stay-day-progress{display:flex;gap:4px;margin-top:18px;max-width:260px}
.stay-day-progress span{flex:1;height:2px;background:#ffffff30;transition:background .4s}
.stay-day-progress span.is-done{background:#fff}

.stay-day-steps{list-style:none;margin:0;padding:0;display:grid;gap:clamp(64px,10vh,110px)}
.stay-step{display:block}
.stay-step-photo{overflow:hidden;border-radius:6px;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.stay-step-photo img{aspect-ratio:16/10;object-fit:cover}
.stay-step-copy{max-width:560px;padding-top:24px}
.stay-step-time{display:flex;align-items:baseline;gap:12px;margin-bottom:8px;font-size:12px;letter-spacing:.14em;color:var(--frost-gold)}
.stay-step-time time{font:300 30px/1.1 var(--sans);letter-spacing:.04em;font-variant-numeric:tabular-nums;color:#fff}
.stay-step-copy h3{font-size:30px;margin-bottom:12px}
.stay-step-copy p{font-size:16px;line-height:2;color:var(--text-w-m)}
.stay-step-copy small{display:block;margin-top:12px;font-size:12px;line-height:1.8;color:var(--text-w-m);opacity:.85}
.stay-step-copy small a{color:inherit}

/* Reveal once (stay-day.js adds .js-reveal to the section, then .is-in to each scene as it enters) */
.stay-day.js-reveal .stay-step-photo{clip-path:inset(14% 0 0 0 round 6px);opacity:0;transition:clip-path 1s cubic-bezier(.2,.7,.2,1),opacity .8s ease}
.stay-day.js-reveal .stay-step-photo img{transform:scale(1.08);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.stay-day.js-reveal .stay-step-copy>*{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.stay-day.js-reveal .stay-step-copy>*:nth-child(2){transition-delay:.08s}
.stay-day.js-reveal .stay-step-copy>*:nth-child(3){transition-delay:.16s}
.stay-day.js-reveal .stay-step-copy>*:nth-child(4){transition-delay:.24s}
.stay-day.js-reveal .stay-step.is-in .stay-step-photo{clip-path:inset(0 0 0 0 round 6px);opacity:1}
.stay-day.js-reveal .stay-step.is-in .stay-step-photo img{transform:none}
.stay-day.js-reveal .stay-step.is-in .stay-step-copy>*{opacity:1;transform:none}

.stay-day-end{padding:90px 9% 110px;display:flex;flex-wrap:wrap;align-items:center;gap:18px 32px}
.stay-day-cta{display:inline-flex;align-items:center;gap:18px;padding:17px 30px;border:1px solid #ffffff80;border-radius:3px;color:#fff;text-decoration:none;font-size:15px;letter-spacing:.06em;transition:background .2s,color .2s}
.stay-day-cta:hover{background:#fff;color:var(--ink)}
.stay-day-end p{font-size:12px;color:var(--text-w-m)}

@media(max-width:1000px){
 .stay-day-body{grid-template-columns:minmax(0,32%) minmax(0,1fr);padding-inline:6%}
}
/* Phones: the clock becomes a thin bar under the header; scenes stack. */
@media(max-width:680px){
 .stay-day-head{padding:72px 25px 28px}
 .stay-day-head h2{font-size:36px}
 .stay-day-body{display:block;padding:0 0 20px}
 .stay-day-clock{position:sticky;top:var(--stay-bar-top,64px);z-index:3;display:flex;align-items:center;gap:12px;padding:10px 25px;margin-bottom:26px;
  background:rgba(var(--ink-rgb),.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #ffffff1f}
 .stay-day-label,.stay-day-arc{display:none}
 .stay-day-clock-row{flex-direction:row;align-items:baseline;gap:10px;flex:1}
 .stay-day-clock-day{font-size:11px;letter-spacing:.12em}
 .stay-day-clock-time{font-size:28px;font-weight:300}
 .stay-day-count{margin:0 0 0 auto;align-self:center;font-size:11px;padding:3px 7px}
 .stay-day-progress{position:absolute;left:0;right:0;bottom:-1px;margin:0;max-width:none;gap:2px}
 .stay-day-steps{padding:0 25px;gap:64px}
 .stay-step-photo img{aspect-ratio:4/3}
 .stay-step-copy{padding-top:18px}
 .stay-step-time time{font-size:24px}
 .stay-step-copy h3{font-size:23px}
 .stay-step-copy p{font-size:15px;line-height:1.95}
 .stay-day-end{padding:56px 25px 80px}
 .stay-day-index{gap:8px 12px;margin-top:24px}
 .stay-day-index ol{gap:6px}
 .stay-day-index a{padding:6px 11px;font-size:12px}
 .stay-day-mid{padding:24px 20px}
 .stay-day-mid p{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
 .stay-day{transition:none}
 .stay-day-snow{display:none}
}
/* Scene facts as short icon lines instead of a paragraph of notes (2026-10-30) */
.stay-step-facts{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.stay-step-facts li{display:inline-flex;align-items:flex-start;gap:7px;font-size:13px;line-height:1.6;color:var(--text-w-m)}
.stay-step-facts .ic{flex:0 0 16px;width:16px;height:16px;margin-top:3px;fill:none;stroke:var(--frost-gold);stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.stay-step-facts a{color:#fff;text-underline-offset:4px}
.stay-day.js-reveal .stay-step-copy>.stay-step-facts{transition-delay:.24s}
@media(max-width:680px){.stay-step-facts{flex-direction:column;gap:6px}.stay-step-facts li{font-size:12.5px}}
/* B (adults): four highlights instead of the timed day (2026-10-30). Same stage colour and reveal as the day. */
.highlights{position:relative;color:#fff;background:linear-gradient(180deg,#1C2833 0%,var(--ink) 100%);padding:110px 9% 0;overflow:clip}
.highlights+.interlude{position:relative;z-index:1;background:var(--snow)}
.highlights-head{max-width:980px;margin-bottom:56px}
.highlights-head .small-label{color:var(--frost-gold)}
.highlights-head h2{font-size:52px;margin-bottom:20px}
.highlights-head>p:not(.small-label){font-size:15px;line-height:2.1;color:var(--text-w-m)}
.highlights-list{list-style:none;margin:0;padding:0;display:grid;gap:clamp(72px,11vh,120px)}
.highlight{display:grid;grid-template-columns:minmax(0,58%) minmax(0,1fr);gap:6%;align-items:center}
.highlight:nth-child(even) .highlight-photo{order:2}
.highlight-photo{overflow:hidden;border-radius:6px;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.highlight-photo img{aspect-ratio:16/10;object-fit:cover}
.highlight-num{margin:0 0 10px;font:300 22px/1 var(--sans);letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--frost-gold)}
.highlight-copy h3{font-size:30px;margin-bottom:14px}
.highlight-copy>p:not(.highlight-num){font-size:16px;line-height:2;color:var(--text-w-m)}
.highlights.js-reveal .highlight-photo{clip-path:inset(14% 0 0 0 round 6px);opacity:0;transition:clip-path 1s cubic-bezier(.2,.7,.2,1),opacity .8s ease}
.highlights.js-reveal .highlight-copy>*{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.highlights.js-reveal .highlight.is-in .highlight-photo{clip-path:inset(0 0 0 0 round 6px);opacity:1}
.highlights.js-reveal .highlight.is-in .highlight-copy>*{opacity:1;transform:none}
.highlights .stay-day-end{padding-inline:0}
@media(max-width:680px){
 .highlights{padding:72px 25px 0}
 .highlights-head{margin-bottom:36px}
 .highlights-head h2{font-size:36px}
 .highlight{display:block}
 .highlight-photo img{aspect-ratio:4/3}
 .highlight-copy{padding-top:18px}
 .highlight-copy h3{font-size:23px}
 .highlight-copy>p:not(.highlight-num){font-size:15px;line-height:1.95}
 .highlights-list{gap:56px}
}