/* Ath Wonder homepage hero: skyline scroll story (from /demos/skyline/, Oct 19 2026).
   Everything is namespaced with sky- and scoped to #sky-stage / .sky-* so nothing touches styles.css, the nav,
   the booking popup or the Concierge chat. Nav, buttons, .eyebrow and .gold-text come from styles.css. */
#sky-stage{position:relative;height:560vh;background:#050403;margin-top:-84px}
#sky-stage .sky-pin{position:sticky;top:0;height:100vh;height:100svh;min-height:560px;overflow:hidden;
 background:radial-gradient(ellipse 90% 60% at 50% 105%,rgba(122,90,20,calc(.08 + var(--lit,0)*.32)) 0%,transparent 60%),radial-gradient(ellipse 70% 50% at 50% 40%,#100d09 0%,#050403 70%)}
#sky-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
#sky-stage .sky-intro{position:absolute;left:0;right:0;top:clamp(104px,13vh,130px);z-index:3;text-align:center;padding:0 22px;transition:opacity .2s linear}
#sky-stage .sky-intro h1{font-family:var(--display);font-weight:500;font-size:clamp(28px,3.6vw,52px);line-height:1.08;color:var(--cream);margin:14px auto 0;max-width:22ch;letter-spacing:normal}
#sky-stage .sky-intro h1 .l2{display:block;font-family:var(--serif);font-style:italic;font-size:1.06em;margin-top:.1em}
#sky-stage .sky-beats{position:absolute;left:0;right:0;top:clamp(108px,17vh,170px);z-index:3;height:1.4em;text-align:center;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(34px,5vw,68px);color:var(--cream);line-height:1.2;pointer-events:none}
#sky-stage .sky-beats span{position:absolute;left:0;right:0;opacity:0;will-change:opacity,transform;text-shadow:0 0 30px rgba(212,175,55,.35)}
#sky-stage .sky-beats span.sky-g{background:var(--g-flow);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 18px rgba(212,175,55,.35))}
#sky-stage .sky-cue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:10px}
#sky-stage .sky-cue i{width:1px;height:38px;background:linear-gradient(var(--gold),transparent);animation:sky-cue 2s var(--ease) infinite}
@keyframes sky-cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
#sky-crisp{position:absolute;z-index:2;opacity:0;pointer-events:none;max-width:none;filter:drop-shadow(0 0 40px rgba(212,175,55,.35)) drop-shadow(0 0 2px rgba(255,241,193,.4));will-change:opacity,transform}
#sky-stage .sky-finale{position:absolute;left:0;right:0;z-index:3;text-align:center;padding:0 22px;opacity:0;pointer-events:none;will-change:opacity,transform}
#sky-stage .sky-finale.on{pointer-events:auto}
.sky-finale h2{font-family:var(--display);font-weight:500;font-size:clamp(26px,3.4vw,46px);line-height:1.08;color:var(--cream);margin:0 auto;letter-spacing:normal}
.sky-finale h2 .l2{display:block;font-family:var(--serif);font-style:italic;font-size:1.08em;margin-top:.12em}
.sky-finale .sky-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.sky-after{position:relative;z-index:2;background:var(--ink);border-top:1px solid var(--line);padding:70px 0 60px;text-align:center}
.sky-after p{color:var(--muted);max-width:640px;margin:16px auto 0}
.sky-after .sky-meta{display:flex;gap:10px 26px;justify-content:center;flex-wrap:wrap;margin-top:26px;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-hi)}
.sky-rm-crest{display:none}
@media (max-width:600px){#sky-stage{margin-top:-64px}.sky-finale .sky-ctas .btn{width:100%}.sky-finale h2{font-size:30px}#sky-stage .sky-beats{top:118px;font-size:40px}#sky-stage .sky-intro{top:100px}#sky-stage .sky-intro .eyebrow{font-size:10.5px;letter-spacing:.22em}#sky-stage .sky-intro .eyebrow::before{width:24px}#sky-stage .sky-intro h1{font-size:30px}}
@media (max-height:700px) and (min-width:601px){.sky-finale h2{font-size:30px}.sky-finale .sky-ctas{margin-top:16px}}
/* reduced motion (or ?rm): static lit skyline + crest, no pinning */
html.sky-rm #sky-stage{height:auto}html.sky-rm #sky-stage .sky-pin{position:relative;height:78vh;min-height:520px}
html.sky-rm #sky-stage .sky-beats,html.sky-rm #sky-stage .sky-cue,html.sky-rm #sky-crisp,html.sky-rm #sky-stage .sky-finale{display:none}
html.sky-rm .sky-rm-crest{display:block;padding:40px 22px 70px;text-align:center;background:#050403}
html.sky-rm .sky-rm-crest img{width:min(70vw,320px);margin:0 auto 26px;filter:drop-shadow(0 0 30px rgba(212,175,55,.3))}
html.sky-rm .sky-rm-crest .sky-finale{position:static;opacity:1;pointer-events:auto}
html.sky-rm #sky-stage .gold-text,html.sky-rm .sky-rm-crest .gold-text,html.sky-rm .sky-rm-crest .btn-gold,html.sky-rm #sky-stage .sky-cue i{animation:none}

/* Oct 19 2026: service reveal pairs (ivory name + champagne-gold line) */
#sky-stage .sky-beats{height:auto;font-style:normal;font-size:inherit;line-height:1.15}
#sky-stage .sky-beats span{display:flex;flex-direction:column;align-items:center;gap:.5em;padding:0 22px;text-shadow:none}
#sky-stage .sky-beats b{font-family:var(--display);font-weight:500;font-size:clamp(34px,4.6vw,64px);color:#f6efe1;letter-spacing:.01em;text-shadow:0 0 30px rgba(246,239,225,.25)}
#sky-stage .sky-beats em{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(21px,2.3vw,32px);color:#f1dca6;max-width:28ch;text-shadow:0 0 18px rgba(241,220,166,.35)}
.sky-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:600px){#sky-stage .sky-beats{top:118px}#sky-stage .sky-beats b{font-size:32px}#sky-stage .sky-beats em{font-size:23px}}
html.sky-rm .sky-sr{position:static;width:auto;height:auto;clip:auto;white-space:normal;color:#f1dca6;text-align:center;padding:0 22px}