body{background:#0b1117}body>header{position:absolute!important;top:22px;left:3%;right:3%;width:94%;margin:0!important;background:#143d5333!important;box-shadow:none!important;border:1px solid #ffffff42!important;backdrop-filter:blur(12px);z-index:20;color:white}body>header nav a{color:#fff!important}body>header .nav-actions .ghost{background:#ffffff12;color:white;border-color:#ffffff65}body>header .nav-actions .button:not(.ghost){background:#f5f6f1;color:#153141}.sky-scene{position:relative;height:112vw;max-height:1500px;min-height:850px;overflow:hidden;isolation:isolate;background:#287db2}.scene-photo,.scene-foreground{position:absolute;inset:0;background:url('assets/sky-neighborhood.png') center top/100% 100% no-repeat;pointer-events:none}.scene-photo{z-index:-3}.sky-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#062e4a40,transparent 55%,#06121d88)}.floating-frame{position:absolute;top:12%;left:12%;width:76%;height:57%;border:1px solid #eaf6ff99;border-radius:28px;background:linear-gradient(150deg,#e7f8ff30,#d9f3ff09 65%);box-shadow:inset 0 1px 0 #ffffff77,0 25px 80px #12334215;z-index:-1}.sky-copy{padding:clamp(32px,5vw,80px);text-align:center;color:white;text-shadow:0 2px 25px #12334d35}.sky-copy .eyebrow{color:white;font-size:clamp(10px,1vw,14px);letter-spacing:.16em}.sky-copy h1{font-size:clamp(38px,5.1vw,80px);line-height:1.08;letter-spacing:-.055em;font-weight:450;margin:25px -30px 22px}.sky-copy h1 em{font-style:normal;color:#d1f7ff}.sky-copy p{font-size:clamp(14px,1.35vw,20px);line-height:1.65;margin:0 auto 24px}.sky-actions{display:flex;align-items:center;justify-content:center;gap:25px;font-size:13px}.sky-actions .button{background:#effaff;color:#153342;border:0;font-size:13px}.scene-foreground{z-index:1;clip-path:polygon(0 17%,4% 20%,7% 23%,11% 24%,14% 28%,19% 27%,22% 31%,28% 33%,32% 35%,36% 38%,41% 40%,45% 43%,43% 47%,39% 51%,38% 55%,41% 56%,42% 55%,44% 56%,44% 58%,50% 60%,52% 57%,55.8% 54%,57% 54.8%,62% 54%,65% 52%,66% 51.4%,68.5% 51.5%,69% 55%,74% 56%,75% 48%,77% 44%,82% 38%,83.2% 37%,84% 39%,91% 43%,100% 39.5%,100% 100%,0 100%)}.scene-bottom{position:absolute;z-index:3;bottom:55px;left:6%;right:6%;display:flex;align-items:end;justify-content:space-between;color:#fff;font-size:17px}.scene-bottom strong{font-size:26px;font-weight:450}.scene-bottom>a{display:flex;align-items:center;gap:18px;font-size:13px}.scene-bottom>a span{display:grid;place-items:center;border:1px solid #ffffff70;border-radius:50%;width:42px;height:42px;font-size:20px}.sky-intro{padding:85px 0;display:grid;grid-template-columns:1fr 1fr;gap:20px 80px}.sky-intro .eyebrow{grid-column:1/-1}.sky-intro h2{font-size:40px;margin:0}.sky-intro p{color:var(--muted);margin:0;font-size:17px}#property-management{padding-top:60px}
@media(min-width:1500px){.sky-scene{height:1400px}}
@media(max-width:760px){.sky-scene{height:1100px;min-height:0}.scene-photo,.scene-foreground{background-size:auto 100%;background-position:center top}.scene-foreground{display:none}.floating-frame{top:125px;left:6%;width:88%;height:440px;background:#123d5c30}.sky-copy{padding:28px 16px}.sky-copy h1{font-size:43px;margin:22px 0}.sky-copy p{font-size:15px}.sky-copy .eyebrow{font-size:9px}.sky-actions{flex-direction:column;gap:16px}.scene-bottom{bottom:32px;font-size:13px}.scene-bottom strong{font-size:18px}.sky-intro{display:block;padding:55px 24px}.sky-intro h2{font-size:30px;margin:15px 0 20px}.sky-intro p{font-size:16px}.scene-bottom>a{font-size:11px}.scene-bottom>a span{width:32px;height:32px}}
@media(prefers-reduced-motion:no-preference){.floating-frame{animation:arrive 1s ease-out both}@keyframes arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}}
/* Keep interactive copy above the foreground, while the frame remains behind it. */
.floating-frame{z-index:auto;animation:none}.sky-copy{position:relative;z-index:2}.sky-copy p{color:#fff;text-shadow:0 1px 12px #102d4b90}.sky-actions{position:relative;z-index:2}

/* Rounded photographic opening and original headline sequence. */
.sky-scene{margin:16px;border-radius:30px}
.sky-copy h1.animated-headline .headline-ending{justify-content:center;flex-wrap:nowrap}
.sky-copy h1.animated-headline .headline-slot{width:3.7em;text-align:left}
.sky-copy h1.animated-headline .headline-word{color:#fff}
.sky-copy h1.animated-headline .headline-final{color:#d1f7ff}
@media(max-width:760px){.sky-scene{margin:8px;border-radius:22px}.sky-copy h1.animated-headline{font-size:clamp(27px,6.4vw,43px)}}
/* Frosted glass panel, with an embossed rim. */
.floating-frame{background:linear-gradient(135deg,rgba(239,250,255,.24),rgba(219,241,255,.08) 42%,rgba(230,246,255,.18));border:1px solid rgba(245,253,255,.72);box-shadow:inset 2px 2px 2px rgba(255,255,255,.65),inset -2px -2px 3px rgba(25,70,103,.25),0 18px 55px rgba(8,40,67,.18);backdrop-filter:blur(9px) saturate(115%);-webkit-backdrop-filter:blur(9px) saturate(115%)}
/* The glass filter creates a stacking context: lift the copy separately. */
.sky-copy{position:absolute;top:12%;left:12%;width:76%;z-index:2}
body>header{position:fixed!important;top:22px;transition:background .25s,box-shadow .25s}
body.sky-scrolled>header{background:rgba(17,33,43,.92)!important;box-shadow:0 8px 30px #0003!important;border-color:#ffffff25!important}
@media(max-width:760px){.sky-copy{top:125px;left:6%;width:88%}body>header{top:14px}}
/* Bring the entire intro composition closer to the navigation. */
.floating-frame,.sky-copy{top:8.5%}
@media(max-width:760px){.floating-frame,.sky-copy{top:105px}}
/* Original light frame, with glass restricted to the copy area. */
.floating-frame{top:12%;background:linear-gradient(150deg,#e7f8ff30,#d9f3ff09 65%);border:1px solid #eaf6ff99;box-shadow:inset 0 1px 0 #ffffff77,0 25px 80px #12334215;backdrop-filter:none;-webkit-backdrop-filter:none}
.sky-copy{top:calc(12% + 30px);left:17%;width:66%;padding:30px 24px 26px;border:1px solid #ffffff65;border-radius:20px;background:linear-gradient(140deg,#eaf8ff2b,#19486826);backdrop-filter:blur(12px) saturate(115%);-webkit-backdrop-filter:blur(12px) saturate(115%);box-shadow:inset 0 1px 0 #ffffff80,0 12px 35px #10385215}
.sky-copy h1{font-size:clamp(38px,4.6vw,72px);margin:22px -12px 18px}
@media(max-width:760px){.floating-frame{top:125px}.sky-copy{top:145px;left:10%;width:80%;padding:24px 14px}.sky-copy h1.animated-headline{font-size:clamp(26px,6vw,40px)}}
/* Fine foreground cutout overlaps the single glass frame. */
.floating-frame{top:8.5%;height:57%;backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(150deg,#e7f8ff30,#d9f3ff09 65%);border:1px solid #eaf6ff99;box-shadow:inset 0 1px 0 #ffffff77,0 25px 80px #12334215}
.sky-copy{top:8.5%;left:12%;width:76%;padding:clamp(32px,5vw,80px);border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.sky-copy h1{font-size:clamp(38px,5.1vw,80px);margin:25px -30px 22px}
.scene-foreground{background-image:url('assets/neighborhood-foreground.png');clip-path:none}
@media(max-width:760px){.floating-frame{top:105px;height:440px}.sky-copy{top:105px;left:6%;width:88%;padding:28px 16px}.sky-copy h1.animated-headline{font-size:clamp(27px,6.4vw,43px);margin:22px 0}.scene-foreground{display:block}}
/* Let the glass disappear gently into the foreground. */
.floating-frame{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 78%,transparent 100%)}
@media(max-width:760px){.floating-frame{height:520px}}
/* Medium glass: gentle refraction, with the sharp foreground above it. */
.sky-copy h1.animated-headline .headline-final{color:#12556e;text-shadow:0 1px 0 #ffffff40}
.floating-frame{background:linear-gradient(140deg,rgba(235,249,255,.28),rgba(221,244,255,.14) 55%,rgba(218,239,249,.08));backdrop-filter:blur(3px) saturate(108%);-webkit-backdrop-filter:blur(3px) saturate(108%);border-color:rgba(239,252,255,.62);box-shadow:inset 0 1px 1px #ffffff80,inset 1px 0 1px #ffffff33,0 16px 45px #14394b12}
/* Compact opening with scroll-driven atmosphere. */
.sky-scene{height:calc(100svh - 24px);min-height:680px;max-height:960px;--scene-shift:0px;--glass-opacity:1;--sky-darkness:0}
.scene-photo,.scene-foreground{background-size:cover;background-position:center 55%;transform:translateY(var(--scene-shift)) scale(1.06);transform-origin:center center}
.sky-scene:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(12,43,67,.35),#0b1117);opacity:var(--sky-darkness)}
.floating-frame{top:110px;height:66%;opacity:var(--glass-opacity)}
.sky-copy{top:110px;padding:28px 24px;opacity:var(--glass-opacity);transform:translateY(calc(var(--scene-shift) * -.25))}
.sky-copy h1{font-size:clamp(38px,4.6vw,70px)}
.scene-bottom{bottom:28px}
@media(max-width:760px){.sky-scene{height:calc(100svh - 16px);min-height:700px;max-height:850px}.floating-frame,.sky-copy{top:105px}.floating-frame{height:470px}.sky-copy{padding:24px 16px}.scene-photo,.scene-foreground{background-position:center 48%}.scene-bottom{bottom:24px}.scene-bottom strong{font-size:16px}}
@media(prefers-reduced-motion:reduce){.scene-photo,.scene-foreground,.sky-copy{transform:none}.floating-frame,.sky-copy{opacity:1}.sky-scene:after{display:none}}
/* Foreground rises through the sky as the visitor scrolls. */
.sky-scene{overflow:clip;height:calc(100svh + 340px);min-height:1020px;max-height:1300px}
.scene-photo,.scene-foreground{background-size:cover;background-position:center 55%;transform:none}
.scene-photo{position:sticky;top:0;height:100svh;background-size:cover;filter:blur(0);background-position:center top}
.scene-foreground{top:0;bottom:auto;height:100svh;transform:translateY(var(--foreground-rise,0px));background-position:center top}
.sky-shade{background:linear-gradient(180deg,#062e4a35,transparent 70%)}
.sky-scene:after{display:none}
.floating-frame{position:absolute;top:110px;height:470px;transform:translateY(var(--copy-hold,0px));opacity:var(--glass-opacity)}
.sky-copy{top:110px;transform:translateY(var(--copy-hold,0px))}
.scene-bottom{display:none}
@media(max-width:760px){.sky-scene{height:calc(100svh + 300px);min-height:980px;max-height:none}.floating-frame,.sky-copy{top:105px}.scene-photo,.scene-foreground{background-size:auto 100%;background-position:center top}}
@media(prefers-reduced-motion:reduce){.sky-scene{height:100svh;min-height:700px}.scene-photo{position:absolute;height:100%}.scene-foreground{height:100%;transform:none}.floating-frame,.sky-copy{transform:none}}
.scene-photo{background-size:auto 300%;background-position:center top}
.scene-foreground{height:100%;background-size:cover;transform:translateY(var(--foreground-rise,0px)) scale(1.25);transform-origin:center bottom}
@media(max-width:760px){.scene-photo{background-size:auto 300%}.scene-foreground{background-size:auto 100%}}
.scene-foreground:after{content:"";position:absolute;left:0;right:0;top:calc(100% - 110px);height:450px;background:linear-gradient(to bottom,transparent,#0b1117 110px,#0b1117)}
/* Restore the full photograph's proportions while retaining foreground motion. */
.sky-scene{height:112vw;min-height:1000px;max-height:none}
.scene-foreground{background-size:100% 100%;background-position:center top;transform:translateY(var(--foreground-rise,0px));transform-origin:center center}
.scene-photo{height:100%;background-size:auto 300%;position:absolute;top:0}
@media(max-width:760px){.sky-scene{height:1100px;min-height:0;max-height:none}.scene-foreground{background-size:100% 100%}}
@media(prefers-reduced-motion:reduce){.scene-foreground{transform:none}}
@media(max-width:760px){.scene-foreground{background-size:auto 100%}}
/* Familiar live-site captions, sitting on the lower part of the photo. */
.scene-labels{position:absolute;left:4%;right:4%;bottom:150px;height:90px;z-index:3;transform:translateY(var(--foreground-rise,0px));color:#fff;pointer-events:none}
.scene-labels .photo-caption{top:auto;bottom:0;left:0;right:auto;font-size:21px;padding:12px 18px;max-width:none}
.scene-labels .photo-tag{bottom:0;right:0;padding:15px 24px;font-size:15px;gap:18px}
@media(max-width:760px){.scene-labels{left:24px;right:24px;bottom:150px}.scene-labels .photo-caption{font-size:15px;padding:12px}.scene-labels .photo-tag{font-size:14px;padding:12px;gap:10px}.scene-labels .care-mark{font-size:26px}}
@media(max-width:420px){.scene-labels{left:16px;right:16px}.scene-labels .photo-caption{font-size:13px;padding:10px}.scene-labels .photo-caption span{font-size:9px}.scene-labels .photo-tag{font-size:12px;padding:10px;gap:8px}}
@media(prefers-reduced-motion:reduce){.scene-labels{transform:none}}
/* End the opening at the moving photo edge instead of leaving its travel space blank. */
.sky-scene{margin-bottom:calc(-1 * var(--closing-space,0px))}
.sky-scene + .intro{margin-top:0;padding-top:36px}
.sky-scene + .intro{position:relative;z-index:4;background:#0b1117}
/* Shared corner geometry and a clearer final word. */
body>header{border-radius:30px!important}
.sky-copy h1.animated-headline .headline-final{color:#a4f2f6;text-shadow:0 2px 3px #123d5cb3,0 0 18px #123d5c55}
.sky-copy h1.animated-headline .headline-final::after{height:6px;bottom:-.16em;border-radius:4px;left:-.02em;right:.01em}
@media(max-width:760px){body>header{border-radius:22px!important}.sky-copy h1.animated-headline .headline-final::after{height:5px}}
/* Softer header actions to echo the rounded navigation frame. */
body>header .nav-actions .button{border-radius:22px}
@media(max-width:760px){body>header .nav-actions .button{border-radius:18px}}
/* Header belongs to the opening until the regular content reaches the top. */
body>header{position:absolute!important}
body.sky-scrolled>header{position:fixed!important}

/* Trim excess road while keeping the full skyline and soft exit. */
.sky-scene{--road-trim:clamp(80px,8vw,150px);margin-bottom:calc(-1 * var(--closing-space,0px) - var(--road-trim))}
.scene-labels{bottom:190px}
.scene-foreground:after{top:calc(100% - 110px - var(--road-trim));height:calc(450px + var(--road-trim))}
@media(max-width:760px){.scene-labels{bottom:180px}}

.sky-actions{justify-content:center;align-items:center}

/* Local canopy study: preserve photo proportions, remove some empty upper sky. */
.scene-photo{background-image:url('assets/sky-neighborhood-new.png')}
.scene-foreground{background-image:url('assets/neighborhood-foreground-new.png')}
@media(min-width:761px){
 .sky-scene{height:96vw;min-height:900px;--photo-height:calc(100% + 16vw);--sky-crop:16vw}
 .scene-foreground{height:var(--photo-height);top:calc(-1 * var(--sky-crop));background-size:100% 100%}
 .floating-frame,.sky-copy{top:110px}
}

/* Begin dissolving the raised glass frame sooner into the skyline. */
.floating-frame{
 -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 90%);
 mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 90%);
}

/* Alternative: stationary sky, with the neighborhood moving upward. */
.scene-photo{
 position:sticky;
 top:0;
 height:100svh;
 background-size:auto max(300svh, 250vw);
 background-position:center top;
}

/* Raised captions and a longer, softer transition into the next section. */
.scene-labels{bottom:220px}
.scene-foreground:after{
 top:calc(100% - 320px - var(--road-trim));
 height:calc(660px + var(--road-trim));
 background:linear-gradient(to bottom,transparent,#0b1117 320px,#0b1117);
}
@media(max-width:760px){.scene-labels{bottom:210px}}

/* Keep the stationary sky inside the visible, shortened opening. */
.sky-scene{
 clip-path:inset(0 0 calc(var(--closing-space,0px) + var(--road-trim)) 0);
}

/* Keep navigation visible while the neighborhood rises beneath it. */
body>header{position:fixed!important;transition:background .3s ease,box-shadow .3s ease,border-color .3s ease}

/* Original position first, then floating navigation at the caption milestone. */
body>header{position:absolute!important;opacity:1;transform:none;visibility:visible;pointer-events:auto;transition:background .3s ease,box-shadow .3s ease,border-color .3s ease}
body.hero-header-returned>header{position:fixed!important}
@media(prefers-reduced-motion:reduce){body>header{transition:none}}