/* Latest owner-approved editorial system. Source imagery and plans stay intact. */
:root{--sea-glass:#a9bbb7;--brass:#b08d4f;--paper:#f7f6f0;--radius:12px;--header-height:86px;--on-slate:#fff;--photo-shadow:0 18px 45px rgba(22,42,49,.16)}
html{scroll-padding-top:calc(var(--header-height) + 18px)}
.announcement{background:var(--slate);color:var(--on-slate);text-align:center;padding:9px 22px;font-size:13px;line-height:1.5;min-height:38px}.announcement a{display:inline-flex;gap:18px;align-items:center;min-height:24px;text-decoration:none}.announcement a span{text-decoration:underline;text-underline-offset:4px}
header{height:var(--header-height);gap:25px;padding:0 30px;border-bottom:1px solid var(--line)}header .brand{width:166px;flex:none}header .brand img{height:auto;width:100%}header nav{gap:22px}header nav a{font-size:13px}.header-actions{display:flex;gap:12px;align-items:center}.header-register,.header-tour{font-size:13px;min-height:46px;padding:12px 15px;text-decoration:none;border-radius:5px;white-space:nowrap}.header-tour{border:1px solid var(--harbour)}.header-register{gap:12px}.tours-open .header-tour{background:var(--harbour);color:var(--ivory)}.tours-open .header-register{background:transparent;color:var(--harbour);border:1px solid var(--harbour)}
#mobile-menu{width:min(520px,100%);overflow:auto}#mobile-menu nav{gap:14px;margin:35px 0}#mobile-menu nav a{font-size:32px;line-height:1.2;min-height:44px}.menu-actions{border-top:1px solid var(--line);padding-top:22px;display:flex;flex-wrap:wrap;gap:14px}.menu-actions a{font-family:"Instrument Sans",sans-serif!important;font-size:16px!important}.menu-sub{display:flex;gap:22px;padding:0 0 10px}.menu-sub a{font-size:15px!important;font-family:"Instrument Sans",sans-serif!important}.header-actions a:hover{background:var(--pine);color:var(--ivory)}
.chapter-label{font-size:12px;letter-spacing:.12em;font-weight:600;margin:0 0 22px;line-height:1.5}.chapter-slate{background:var(--slate);color:var(--on-slate)}.chapter-slate h1,.chapter-slate h2{color:var(--ivory)}.chapter-pine{background:var(--pine);color:var(--ivory)}.chapter-seaglass{background:var(--sea-glass);color:var(--harbour)}.chapter-slate a:focus-visible,.chapter-slate button:focus-visible,.chapter-pine a:focus-visible,.chapter-pine button:focus-visible{outline-color:currentColor}.chapter-slate .fine{color:#fff}.section h2{font-size:clamp(56px,7.5vw,108px);line-height:1.03}.section-heading{align-items:center;gap:60px;margin-bottom:65px}.section-heading p{font-size:19px;line-height:1.65}.section-heading h2{flex-shrink:0}.button,.enlarge{border-radius:5px}.text-link{font-size:15px}.image-button{border-radius:var(--radius)}.image-button img{transition:transform .7s var(--ease)}figcaption{font-size:12px;line-height:1.5;max-width:65ch}.page-panorama .image-button{border-radius:var(--radius)}
/* The image itself always uses its complete source ratio, including during scroll. */
.hero-track{height:auto;min-height:0;padding:16px 0 0}.hero{position:relative;top:auto;min-height:0;height:auto;max-height:none;margin:0 18px;overflow:visible;will-change:auto;background:transparent}.hero-image{display:block;width:100%;height:auto;aspect-ratio:2100/749;object-fit:contain;object-position:center;transform:none!important;will-change:auto}.hero-shade{inset:0;background:linear-gradient(90deg,rgba(19,38,45,.45),transparent 55%);pointer-events:none}.hero-copy{left:5%;top:auto;bottom:12%;max-width:none;transform:none!important;will-change:auto}.hero h1{font-size:clamp(60px,9.4vw,145px);line-height:1;white-space:nowrap}.hero-descriptor{font-size:clamp(14px,1.4vw,21px);margin-top:12px}.opening-band{padding:45px var(--gutter) 65px;display:grid;grid-template-columns:1.7fr 1fr;gap:9vw;align-items:center}.opening-band .hero-headline{font:clamp(25px,2.8vw,40px)/1.32 Italiana,Georgia,serif;max-width:850px;margin:0}.opening-band>div{font-size:14px;border-left:1px solid var(--line);padding-left:35px}.opening-band .text-link{margin-top:14px}.rising-panel{margin:0}
.park{grid-template-columns:1fr 1fr .8fr;gap:45px 50px;padding-top:110px;padding-bottom:100px;position:relative;isolation:isolate}.park-title{grid-column:1/3;margin:0}.park-main{grid-column:1/3;grid-row:2}.park-main img{aspect-ratio:1.6}.park-copy{grid-column:3;grid-row:2;font-size:18px}.park-small{grid-column:1;grid-row:3;width:65%;margin:-5px 0 0 12%}.park-small img{aspect-ratio:.9}.park-wide{grid-column:2/4;grid-row:3;padding:75px 0 0;margin-left:-35px}.park-wide img{aspect-ratio:2.1}.park-detail{grid-column:3;grid-row:1;width:72%;margin:0 0 -70px auto;z-index:2;align-self:end;transform:rotate(3deg);box-shadow:var(--photo-shadow)}.park-detail img{aspect-ratio:1.1}.park-detail figcaption{padding:8px;background:var(--slate);margin:0}.park-main .image-button{box-shadow:var(--photo-shadow)}
.inside{padding-top:110px;padding-bottom:95px}.inside-heading{display:grid;grid-template-columns:1.2fr 1fr;column-gap:8vw;max-width:none;align-items:end;margin-bottom:60px}.inside-heading .chapter-label{grid-column:1/-1}.inside-heading h2{max-width:750px}.approved-home-headline{font-size:clamp(22px,2.4vw,32px);line-height:1.5;max-width:560px}.inside-layout{grid-template-columns:1.8fr 1fr;gap:7vw;padding-bottom:150px;margin-bottom:50px;isolation:isolate}.inside-layout:before{content:"";position:absolute;z-index:-1;background:var(--sea-glass);top:70px;left:6%;right:22%;bottom:70px;border-radius:var(--radius)}.inside-lead img{aspect-ratio:1.4}.inside-copy{padding-top:60px}.inside-kitchen{width:100%;margin:0}.inside-kitchen img{aspect-ratio:1.25}.inside-bedroom{left:37%;width:30%;border:10px solid var(--ivory);border-radius:18px;background:var(--ivory);box-shadow:var(--photo-shadow)}.inside-bedroom img{aspect-ratio:1.4}.feature-row{border-top-color:currentColor}.balcony-story{display:grid;grid-template-columns:1.25fr 1fr .6fr;gap:40px;align-items:center;margin-top:85px}.balcony-story h3{font:clamp(35px,4vw,56px)/1.1 Italiana,serif;margin-bottom:25px}.balcony-story p{font-size:17px}.balcony-story .text-link{margin-top:20px}.balcony-story>figure:first-child img{aspect-ratio:1.1;object-fit:cover}.balcony-detail{align-self:end;margin-bottom:-45px}.balcony-detail img{aspect-ratio:.8;object-fit:cover}
/* One concise native-scroll chapter. Geometry is measured after layout. */
.rooftop-track{padding:40px var(--gutter);position:relative}.rooftop-bar{margin-bottom:20px;gap:25px}.rooftop-bar>p{font:clamp(28px,3.1vw,44px)/1.1 Italiana,serif}.roof-scene{border-radius:var(--radius);height:620px}.roof-scene-copy h2{font-size:clamp(50px,5.8vw,84px)}.roof-scene-copy{bottom:13%;max-width:600px}.roof-scene-copy p{max-width:420px}.roof-shade{background:linear-gradient(90deg,rgba(18,37,45,.78),rgba(18,37,45,.08) 80%)}.roof-credit{font-size:12px}.motion-desktop .rooftop-track{height:calc(100svh + 1650px);min-height:0;padding-top:0;padding-bottom:0}.motion-desktop .rooftop-stage{top:var(--header-height);height:calc(100svh - var(--header-height));min-height:550px;padding:22px 0 12px}.motion-desktop .roof-scenes{border-radius:var(--radius);isolation:isolate}.motion-desktop .roof-scene{border-radius:0}.scene-controls{gap:22px;margin-top:12px}.scene-controls button{font-size:12px;min-height:60px}.scene-controls button[aria-pressed=true]{border-top-color:var(--brass)}.scene-controls button>span:first-child{font-size:30px}.motion-desktop .roof-detail{width:18%;border-radius:10px;overflow:hidden;box-shadow:var(--photo-shadow);right:3%;bottom:8%}.roof-detail img{aspect-ratio:1.15}
.plan-section{position:relative;isolation:isolate;background:var(--ivory)}.plan-section:before{content:"";position:absolute;right:0;top:0;bottom:0;width:36%;background:var(--sea-glass);opacity:.35;z-index:-1}.plan-explorer{grid-template-columns:minmax(260px,.85fr) minmax(0,1.2fr);gap:7vw;align-items:start;border:0;padding-top:0}.plan-sidebar{padding-top:10px}.plan-main{background:var(--paper);padding:22px;border-radius:var(--radius);box-shadow:0 14px 40px rgba(49,75,89,.09);max-width:730px;justify-self:center;width:100%}.plan-preview{background:var(--paper);min-height:0;padding:0}.plan-preview img{height:auto;width:auto;max-width:100%;max-height:690px;object-fit:contain;margin:auto;aspect-ratio:auto}.view-switch{margin-bottom:16px}.view-switch button:first-child{border-radius:5px 0 0 5px}.view-switch button:last-child{border-radius:0 5px 5px 0}.plan-tools{gap:12px;justify-content:center;padding-bottom:0}.plan-tools>*{font-size:12px!important}.plan-info>p{font-size:76px}.plan-info dl div{font-size:15px}.plan-sidebar label{font-size:14px}.plan-sidebar select{background:var(--ivory);border-radius:5px}.plan-sidebar>.fine{max-width:45ch}.plan-info h3{font-size:22px}.plan-section .section-heading>p{max-width:380px}.plan-preview:focus-visible{outline:3px solid var(--harbour);outline-offset:5px}
.oak-story{grid-template-columns:.85fr 1.25fr;gap:7vw;border:0;padding-top:100px;padding-bottom:100px}.oak-number{font-size:clamp(220px,36vw,520px);color:var(--sea-glass);line-height:.85}.oak-story h2{font-size:clamp(60px,7vw,100px)}.oak-story .chapter-label{margin-top:0}.oak-story p{font-size:19px;max-width:620px}.oak-story .text-link{margin-top:30px}.oak-counts{display:flex;gap:60px;margin-top:35px}.oak-counts>div{display:flex;align-items:center;gap:18px}.oak-counts strong{font:76px/1 Italiana,serif}.oak-counts span{font-size:14px;max-width:120px}.oak-story .plan-linework{opacity:.08;mix-blend-mode:screen;inset:-20% 28% -30% -15%;filter:invert(1)}.oak-story .fine{font-size:12px}.shore-gallery{grid-template-columns:1.1fr 1fr .75fr;gap:40px}.shore-gallery img{aspect-ratio:.9}.shore-gallery figure:first-child img{aspect-ratio:1.15}.shore-extra{display:flex;gap:55px;align-items:center;margin-top:-80px;width:65%}.shore-extra figure{width:60%}.shore-extra img{aspect-ratio:1.6;object-fit:cover}.closing{padding-top:110px;padding-bottom:100px;grid-template-columns:1.15fr 1fr;isolation:isolate}.closing h2{font-size:clamp(60px,7vw,105px)}.closing:before{content:"";position:absolute;right:0;top:12%;bottom:12%;width:42%;background:var(--slate);z-index:-1}.closing-image{padding:0}.closing-image img{aspect-ratio:1.25;object-fit:cover}.footer-logo{width:180px;height:auto!important}.footer-main nav{gap:12px}
.page-intro,.neighbour-intro{padding-top:85px;padding-bottom:65px}.page-intro h1,.neighbour-intro h1{font-size:clamp(66px,8vw,120px)}.page-panorama{margin:0 var(--gutter)}.page-panorama .image-button img{aspect-ratio:2.25;object-fit:cover}.interior-opening{position:relative;padding-bottom:80px}.opening-detail{position:absolute;right:10%;bottom:0;width:23%;border:10px solid var(--ivory);border-radius:18px;background:var(--ivory);box-shadow:var(--photo-shadow)}.opening-detail img{aspect-ratio:1.15;object-fit:cover}.homes-editorial{padding-top:80px}.homes-editorial h2{font-size:clamp(44px,4.3vw,64px)}.room-editorial{display:grid;grid-template-columns:1.3fr 1fr;gap:55px;align-items:start}.room-editorial>figure:first-child{grid-row:1/3}.room-editorial>figure:first-child img{aspect-ratio:.9;object-fit:cover}.room-editorial>figure:nth-child(2){width:83%;margin-left:auto}.room-editorial>figure:last-child{width:75%;margin:-80px 0 0 15%;grid-column:1;grid-row:3;box-shadow:var(--photo-shadow)}.room-note{grid-column:2;grid-row:2/4;align-self:center;max-width:400px}.room-note h3{font:40px/1.1 Italiana,serif;margin:15px 0 20px}.editorial-number{font:90px/1 Italiana,serif;color:var(--sea-glass)}.bedrooms{position:relative;overflow:hidden}.bedrooms>*:not(.plan-linework){position:relative;z-index:1}.bedrooms .plan-linework{inset:0 -35% 0 50%;opacity:.07}.bedroom-editorial{display:grid;grid-template-columns:1.3fr .8fr 1fr;gap:40px;align-items:start}.bedroom-editorial>figure:first-child{grid-column:1/3}.bedroom-editorial>figure:nth-child(2){grid-column:3;margin-top:80px}.bedroom-editorial>figure:nth-child(3){grid-column:1;margin-left:15%;margin-top:-20px}.bedroom-editorial>figure:last-child{grid-column:2/4;margin-top:40px}.bedroom-editorial img{aspect-ratio:1.5;object-fit:cover}.bedroom-editorial>figure:nth-child(2) img,.bedroom-editorial>figure:nth-child(3) img{aspect-ratio:.9}.amenity-opening{margin:16px var(--gutter) 0;border-radius:var(--radius);overflow:hidden}.amenity-opening>div img{height:auto;min-height:0;aspect-ratio:1.95;object-fit:cover}.amenity-opening h1{font-size:clamp(62px,8vw,112px)}.amenity-intro{margin-top:70px}.gathering-story{position:relative;padding-bottom:160px}.gathering-lead{width:83%}.gathering-lead img{aspect-ratio:1.85;object-fit:cover}.gathering-detail{position:absolute;width:30%;right:var(--gutter);bottom:65px;border:10px solid var(--ivory);background:var(--ivory);border-radius:18px;box-shadow:var(--photo-shadow)}.gathering-detail img{aspect-ratio:1.25;object-fit:cover}.garden-story{display:grid;grid-template-columns:.9fr 1.3fr;gap:60px;align-items:center}.garden-story>div>p:not(.chapter-label){margin-top:30px;font-size:19px}.garden-story>figure{position:relative}.garden-story>figure img{aspect-ratio:1.25;object-fit:cover}.garden-detail{grid-column:1;width:75%;margin:0 0 0 15%}.garden-detail img{aspect-ratio:1.5!important}.amenity-icons{display:flex;gap:30px;margin-top:35px}.amenity-icons span{display:flex;gap:12px;align-items:center;font-size:14px}.amenity-icons svg{width:32px;height:32px}.building-details .button{margin-top:30px}
.local-editorial{display:grid;grid-template-columns:1.3fr .8fr 1fr;gap:45px;align-items:start}.local-editorial>figure:first-child{grid-column:1/3}.local-editorial>figure:nth-child(2){grid-column:3;margin-top:80px}.local-editorial>figure:nth-child(3){grid-column:1;width:80%;margin-left:15%}.local-editorial>figure:nth-child(4){grid-column:2/4;margin-top:70px}.local-editorial img{aspect-ratio:1.6;object-fit:cover}.local-editorial>figure:nth-child(2) img,.local-editorial>figure:nth-child(3) img{aspect-ratio:.9}.park-pair{display:grid;grid-template-columns:1.5fr 1fr;gap:50px;align-items:center}.park-pair>figure:first-child{grid-row:1/3}.park-pair>figure:first-child img{aspect-ratio:.9;object-fit:cover}.park-pair>figure:last-child{width:78%;margin-left:-25%}.park-pair img{border-radius:var(--radius)}.wider .gallery-grid{margin-top:45px}.wider .fine{margin-top:35px}.about-intro{position:relative;overflow:hidden}.about-intro>*:not(.plan-linework){position:relative;z-index:1}.about-intro .plan-linework{inset:-100% -5% -100% 55%;opacity:.08}.about-place{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:center}.about-place p{margin-top:30px}.about-place .text-link{margin-top:25px}.about-place>figure img{aspect-ratio:1.3;object-fit:cover}.about-detail{grid-column:1;width:75%;margin-left:20%;margin-top:-80px}.about-links{display:flex;gap:60px;flex-wrap:wrap}.gallery-collection>h2{margin-bottom:25px}.gallery-collection>.gallery-grid{margin-top:60px}.gallery-jumps{display:flex;gap:22px;flex-wrap:wrap;margin-top:25px;font-size:15px}.gallery-jumps a{min-height:44px;display:flex;align-items:center}.contact-layout,.booking-layout{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:start}.contact-layout h1,.booking-layout h1{font-size:clamp(65px,8vw,112px)}.contact-layout p,.booking-copy>p:not(.chapter-label){margin-top:30px}.contact-layout>.button,.contact-layout>div>.button{margin-top:30px}.contact-address{margin:65px 0 35px}.contact-address h2{font-size:44px}.contact-address address{margin:24px 0 12px;font-style:normal}.contact-images{position:relative;padding-bottom:130px}.contact-images>figure:first-child{width:90%}.contact-images>figure:first-child img{aspect-ratio:.9;object-fit:cover}.contact-images>figure:last-child{position:absolute;bottom:0;right:0;width:62%;border:10px solid var(--ivory);border-radius:18px;background:var(--ivory);box-shadow:var(--photo-shadow)}.booking-copy>figure{margin-top:50px}.booking-panel{background:var(--slate);color:#fff;border-radius:var(--radius);padding:50px 40px;margin-top:40px}.booking-panel h2{font-size:45px;line-height:1.12;color:var(--ivory);margin:25px 0}.booking-panel>p{font-size:17px}.booking-panel .booking-status{font-size:14px;border-bottom:1px solid var(--sea-glass);padding-bottom:20px}.booking-panel>.button{margin:30px 0 20px;background:var(--ivory);color:var(--harbour)}.booking-panel .fine{font-size:13px}.booking-panel a:focus-visible{outline-color:#fff}.register-layout{background:var(--ivory);position:relative}.register-intro figure{width:90%;border-radius:var(--radius)}.register-form{background:var(--paper);padding:35px;border-radius:var(--radius);border:0;box-shadow:var(--photo-shadow)}
/* Distinctive, opaque map badges, matched to the directory by number and state. */
.destination-marker>span{background:var(--harbour)!important;color:var(--ivory)!important;border:2px solid var(--ivory)!important;width:38px!important;height:38px!important;font-size:16px!important;font-weight:600!important;box-shadow:0 2px 6px rgba(20,35,43,.24)}.destination-marker.is-selected>span,.destination-marker.is-focused>span{background:var(--ivory)!important;color:var(--harbour)!important;border:3px solid var(--harbour)!important;outline:2px solid var(--ivory)}.place-number{background:var(--harbour)!important;color:var(--ivory)!important;border:0!important;width:36px!important;height:36px!important;font-size:14px!important;font-weight:600;flex:none}.place-entry.is-selected .place-number{background:var(--ivory)!important;color:var(--harbour)!important;outline:2px solid var(--harbour)}.place-select:focus-visible{outline:3px solid var(--harbour);outline-offset:-3px}.neighbourhood-canvas{border-radius:var(--radius);overflow:hidden}.travel-chip{display:flex;align-items:center;gap:8px;font-size:13px;margin:14px 0}.travel-chip svg{width:22px;height:22px}.travel-highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid var(--line);margin-top:60px;padding-top:40px}.travel-highlights strong{font:72px/1 Italiana,serif}.travel-highlights strong small{font:16px "Instrument Sans",sans-serif}.travel-highlights h3{font-size:18px;margin:15px 0}.travel-highlights p{font-size:14px}.travel-highlights a{display:inline-block;min-height:44px;font-size:13px;margin-top:10px}.travel-verification-note{font-size:12px;margin-top:25px;max-width:850px}
/* Reveals have clear endpoints; the default, no-script document is complete. */
.reveal-ready{clip-path:inset(0 100% 0 0);transform:translateY(20px);transition:clip-path 1s var(--ease),transform 1s var(--ease)}.reveal-ready.is-visible{clip-path:inset(0);transform:none}.chapter-reveal{position:relative;isolation:isolate}.chapter-reveal:before{content:"";position:absolute;inset:0;background:var(--ivory);z-index:3;pointer-events:none;transform:scaleY(0);transform-origin:top}.chapter-reveal.panel-ready:before{transform:scaleY(1);transition:transform .95s var(--ease)}.chapter-reveal.panel-ready.panel-visible:before{transform:scaleY(0)}
@media(max-width:1250px){header nav{display:none}.menu-toggle{display:block}header .brand{width:165px}.inside-copy{padding-top:20px}.park{gap:35px}.park-copy{font-size:16px}.section-heading h2{flex-shrink:1}.header-actions{margin-left:auto}.opening-band{gap:5vw}.section h2{font-size:clamp(52px,7vw,85px)}}
@media(max-width:999px){.rooftop-track{height:auto!important;min-height:0!important}.rooftop-stage{height:auto!important;position:relative!important;top:auto!important}.roof-scene{height:auto;background:var(--ivory);color:var(--harbour);margin-bottom:40px}.roof-scene>img{height:auto;aspect-ratio:1.6;object-fit:cover}.roof-scene-copy{position:relative;inset:auto;padding:30px;max-width:none}.roof-scene-copy h2{font-size:52px}.roof-scene-copy p{max-width:600px;font-size:17px;margin-top:20px}.roof-shade{display:none}.roof-credit{position:static;display:block;color:var(--harbour);padding:0 30px 25px}.roof-detail{display:none!important}.scene-controls{display:none}.garden-story{gap:35px}.room-editorial{gap:35px}.travel-highlights{gap:25px}.booking-panel{padding:35px 25px}.booking-panel h2{font-size:36px}}
@media(max-width:850px){.park{grid-template-columns:1fr 1fr}.park-title{grid-column:1/3}.park-main{grid-column:1/3}.park-copy{grid-column:1/3;grid-row:3;font-size:18px}.park-small{grid-column:1;grid-row:4;margin:0;width:75%}.park-wide{grid-column:1/3;grid-row:5;margin:0;padding:0}.park-detail{grid-column:2;grid-row:4;width:85%;margin:35px 0 0;transform:rotate(2deg)}.inside-heading{grid-template-columns:1fr;gap:25px}.inside-heading .chapter-label{margin:0}.inside-layout{gap:30px;grid-template-columns:1.4fr 1fr}.inside-copy>p{font-size:17px}.inside-bedroom{width:35%;left:25%}.balcony-story{grid-template-columns:1fr 1fr;gap:30px}.balcony-detail{display:none}.oak-story{grid-template-columns:.6fr 1fr;gap:35px}.oak-number{font-size:260px}.oak-counts{gap:30px}.oak-counts strong{font-size:62px}.shore-extra{margin-top:30px;width:85%}.about-place{gap:35px}.contact-layout,.booking-layout{gap:40px}.booking-copy h1{font-size:64px}.contact-layout h1{font-size:64px}.travel-highlights{grid-template-columns:1fr 1fr}.register-form{padding:25px}.opening-detail{width:30%}.neighbour-intro{gap:35px}.hero h1{font-size:clamp(55px,10vw,90px)}}
@media(max-width:700px){:root{--header-height:72px;--radius:10px;--space:72px}.announcement{font-size:11px;padding:8px 15px}.announcement a{gap:9px}.announcement a span{white-space:nowrap}header{gap:8px;padding:0 16px}header .brand{width:118px}.header-actions{gap:0}.header-register{font-size:11px;padding:12px;min-height:44px}.header-tour{display:none}header .brand img{height:auto}.menu-toggle{width:38px}.hero-track{padding:8px 0 0}.hero{margin:0 8px!important;min-height:0;height:auto;max-height:none;top:auto}.hero-image{width:100%;height:auto!important;aspect-ratio:2100/749}.hero-copy{left:5%;right:auto;bottom:14%;top:auto;max-width:90%}.hero h1{font-size:clamp(31px,9vw,60px);line-height:1}.hero-descriptor{font-size:10px;margin-top:5px}.hero-shade{background:linear-gradient(90deg,rgba(19,38,45,.5),transparent 65%)}.opening-band{display:block;padding:30px 24px 45px}.opening-band .hero-headline{font-size:29px;line-height:1.28}.opening-band>div{margin-top:28px;padding:22px 0 0;border:0;border-top:1px solid var(--line);font-size:13px}.opening-band .text-link{margin-top:8px}.chapter-label{font-size:11px;margin-bottom:18px}.section h2{font-size:54px;line-height:1.04}.section-heading{margin-bottom:35px}.section-heading p{font-size:17px}.park{padding-top:65px;padding-bottom:65px;gap:30px 20px}.park-main img{aspect-ratio:1.3}.park-detail{box-shadow:none}.park-wide img{aspect-ratio:1.75}.park-copy{font-size:17px}.inside{padding:70px var(--gutter)}.inside-heading{margin-bottom:35px}.inside-heading h2{font-size:61px}.approved-home-headline{font-size:23px}.inside-layout{grid-template-columns:1fr;gap:28px;padding:0;margin-bottom:35px}.inside-layout:before{top:70px;left:12%;right:-12%;bottom:40px}.inside-lead img{aspect-ratio:1.3}.inside-copy{max-width:none;padding-top:0}.inside-copy>p{font-size:18px}.inside-kitchen{width:78%;margin-left:0}.inside-bedroom{position:relative;left:auto;bottom:auto;width:65%;margin:-15px 0 0 auto;border:7px solid var(--ivory);box-shadow:var(--photo-shadow)}.inside-bedroom img{aspect-ratio:1.25}.balcony-story{margin-top:55px;gap:28px;display:block}.balcony-story>figure:first-child{width:88%}.balcony-story>div{margin:30px 0 0 12%}.balcony-story h3{font-size:40px}.feature-row{gap:25px 15px}.rooftop-track{padding:35px 20px}.rooftop-bar{display:block;margin-bottom:25px}.rooftop-bar>p{font-size:40px}.rooftop-bar a{margin-top:15px}.roof-scene>img{aspect-ratio:1.25}.roof-scene-copy{padding:25px}.roof-scene-copy h2{font-size:47px}.roof-credit{padding-left:25px;font-size:12px}.plan-section:before{width:25%;opacity:.25}.plan-explorer{display:flex;flex-direction:column;gap:30px}.plan-sidebar{width:100%;padding:0}.plan-main{padding:15px 12px;width:100%}.plan-preview img{width:100%;height:auto;max-height:none;aspect-ratio:auto}.plan-info>p{font-size:65px}.plan-info h3{font-size:21px}.plan-info dl div{font-size:14px}.plan-sidebar>.button{width:100%;justify-content:center}.plan-tools{gap:10px 14px}.plan-tools>*{font-size:11px!important}.oak-story{display:block;padding-top:65px;padding-bottom:65px}.oak-number{display:block;text-align:left;font-size:210px;margin:0 0 35px;line-height:.75}.oak-story h2{font-size:58px}.oak-story p{font-size:17px}.oak-counts{gap:35px;flex-wrap:wrap}.oak-counts>div{gap:14px}.oak-counts strong{font-size:66px}.oak-counts span{font-size:13px;max-width:100px}.oak-story .plan-linework{inset:-10% -40% 35% 0;opacity:.09}.shore-gallery{gap:28px 18px}.shore-gallery>figure:first-child{width:100%}.shore-gallery>figure:nth-child(2){padding:0}.shore-gallery>figure:nth-child(3){padding-top:45px}.shore-extra{display:block;width:85%;margin:35px 0 0 auto}.shore-extra figure{width:100%}.shore-extra .text-link{margin-top:22px}.closing{padding:65px var(--gutter);display:block}.closing h2{font-size:60px}.closing-image{width:90%;margin-top:45px}.closing:before{top:auto;bottom:60px;width:80%;height:28%}.closing p{font-size:17px}.footer-logo{width:140px;height:auto!important}.footer-main{grid-template-columns:1fr 1fr}.footer-main>nav:last-child{grid-column:auto}.footer-main nav a{font-size:13px}.footer-bottom{line-height:1.6}.page-intro,.neighbour-intro{padding-top:55px}.page-intro h1,.neighbour-intro h1{font-size:63px}.page-panorama{margin:0 16px}.page-panorama .image-button img{aspect-ratio:1.4}.interior-opening{padding-bottom:65px}.opening-detail{width:43%;right:6%;border-width:6px}.opening-detail figcaption{font-size:10px}.homes-editorial h2{font-size:42px}.room-editorial{display:block}.room-editorial>figure:first-child img{aspect-ratio:1.2}.room-editorial>figure:nth-child(2){width:75%;margin:35px 0 0 auto}.room-note{margin:35px 0}.room-note h3{font-size:37px}.editorial-number{font-size:65px}.room-editorial>figure:last-child{margin:30px 0 0;width:80%}.bedroom-editorial{grid-template-columns:1fr 1fr;gap:30px 20px}.bedroom-editorial>figure:first-child{grid-column:1/-1}.bedroom-editorial>figure:nth-child(2){grid-column:1;margin:0}.bedroom-editorial>figure:nth-child(3){grid-column:2;margin:40px 0 0}.bedroom-editorial>figure:last-child{grid-column:1/-1;margin:0;width:85%}.amenity-opening{margin:8px}.amenity-opening>div img{aspect-ratio:1.1;height:auto}.amenity-opening h1{font-size:59px;left:24px;bottom:10%}.amenity-intro{margin-top:40px}.gathering-story{padding-bottom:65px}.gathering-lead{width:100%}.gathering-lead img{aspect-ratio:1.25}.gathering-detail{position:relative;right:auto;bottom:auto;width:70%;margin:-10px 0 0 auto;border-width:7px}.garden-story{display:block}.garden-story>figure{margin-top:35px}.garden-story>div>p:not(.chapter-label){font-size:17px}.garden-story .garden-detail{width:72%;margin:35px 0 0 auto}.amenity-icons{gap:25px}.local-editorial{grid-template-columns:1fr 1fr;gap:30px 20px}.local-editorial>figure:first-child{grid-column:1/-1}.local-editorial>figure:nth-child(2){grid-column:1;margin-top:0}.local-editorial>figure:nth-child(3){grid-column:2;width:100%;margin:40px 0 0}.local-editorial>figure:nth-child(4){grid-column:1/-1;margin:0;width:85%}.park-pair{grid-template-columns:1fr 1fr;gap:25px 20px}.park-pair>figure:first-child{grid-column:1/-1;grid-row:auto}.park-pair>figure:first-child img{aspect-ratio:1.25}.park-pair>figure:last-child{width:100%;margin:40px 0 0}.about-place{display:block}.about-place>figure{margin-top:40px}.about-place .about-detail{width:70%;margin:-5px 0 0 auto;border:7px solid var(--ivory);background:var(--ivory);border-radius:16px}.about-links{gap:15px;flex-direction:column;align-items:flex-start}.gallery-collection>.gallery-grid{margin-top:35px}.contact-layout,.booking-layout{display:block}.contact-layout h1,.booking-layout h1{font-size:63px}.contact-images{margin-top:45px;padding-bottom:80px}.booking-panel{margin-top:40px;padding:30px 24px}.booking-panel h2{font-size:40px}.booking-copy>figure{margin-top:35px}.booking-panel .fine{font-size:13px}.register-intro figure{display:block;width:75%;margin:35px 0 0 auto}.register-form{margin-top:30px;padding:25px 18px}.travel-highlights{grid-template-columns:1fr;gap:25px}.travel-highlights>div{border-bottom:1px solid var(--line);padding-bottom:20px}.travel-highlights strong{font-size:64px}.travel-highlights h3{margin:10px 0}.travel-verification-note{font-size:12px}.neighbourhood-explorer .section-heading h2{font-size:60px}}
@media(prefers-reduced-motion:reduce){.hero{margin-left:18px;margin-right:18px}.reveal-ready{clip-path:none;transform:none}.chapter-reveal:before{display:none}.roof-scene{clip-path:none!important}.roof-scene-copy{opacity:1!important;transform:none!important}}
.reduced-motion .reveal-ready{clip-path:none;transform:none}.reduced-motion .chapter-reveal:before{display:none}.reduced-motion .roof-scene{clip-path:none!important}.reduced-motion .roof-scene-copy{opacity:1!important;transform:none!important}
@media(max-width:700px){.inside-layout:before{right:0}.park-detail{transform:none}}

/* Homepage title: accepted stacked arrangement. */
.hero h1.hero-title-stack{display:flex;flex-direction:column;align-items:flex-start;gap:.06em;font-size:clamp(48px,7.4vw,114px);line-height:.94;white-space:normal}
@media(max-width:700px){.hero h1.hero-title-stack{font-size:clamp(24px,7vw,46px)}}

/* Dark surfaces need the same contrasting focus treatment for buttons as links. */
footer button:focus-visible,.closing button:focus-visible{outline-color:var(--ivory)}

/* Keep touch-sized actions within the available header width. */
.announcement{padding:0 22px}
.announcement a{min-height:44px;width:100%;justify-content:center}
header .brand{display:flex;align-items:center;min-height:44px}
#top:focus-visible{outline:3px solid var(--pine);outline-offset:-5px}
header nav a{min-width:44px;display:inline-flex;align-items:center;justify-content:center}
.menu-toggle{min-width:44px;min-height:44px}
.rooftop-bar .text-link{min-height:44px;align-items:center}
.viewer-toolbar button{min-width:44px;min-height:44px}
.neighbourhood-canvas a.leaflet-popup-close-button{width:44px;height:44px;line-height:44px}
@media(max-width:700px){
  .announcement{padding:0 12px}
  header{display:grid;grid-template-columns:minmax(44px,1fr) auto 44px;gap:8px;padding:0 12px}
  header .brand{width:100%;max-width:118px;min-width:0;margin:0}
  .header-actions{margin-left:0}
  .header-register{padding-inline:10px}
  .menu-toggle{width:44px;padding:12px}
  .privacy h2{font-size:clamp(30px,8vw,44px);overflow-wrap:anywhere}
}

/* Inspection keeps its controls and caption together at every viewport height. */
.viewer-status{flex:none;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--ivory);color:var(--harbour);font-size:14px}
.viewer-status:has(span:not(:empty)){padding:10px 16px}
.viewer-status button,.image-recovery button{font:inherit;color:inherit;background:transparent;border:1px solid currentColor;border-radius:5px;min-height:44px;padding:8px 14px}
.image-recovery{padding:12px;font-size:14px;line-height:1.5;background:var(--ivory);color:var(--harbour);border-radius:5px}
#image-viewer{border-radius:var(--radius)}
#image-viewer[open]{display:flex;flex-direction:column}
.viewer-toolbar{flex:none}
.viewer-toolbar button{border-radius:5px}
.viewer-toolbar button:disabled{cursor:default}
.viewer-scroll{flex:1;min-height:0;height:auto;background:var(--ivory)}
#image-viewer[data-mode="plan"] .viewer-scroll{background:var(--paper)}
#viewer-caption{flex:none;margin:0;line-height:1.5}
@media(hover:hover){
  .viewer-toolbar button:not(:disabled):hover{background:var(--harbour);color:var(--ivory);border-color:var(--harbour)}
  .view-switch button[aria-pressed="false"]:hover{background:var(--sea-glass)}
}
@media(max-width:700px){
  #viewer-caption{font-size:13px;padding:14px 16px}
  #image-viewer[data-mode="plan"] .viewer-toolbar{min-height:68px;flex-wrap:nowrap;gap:8px}
  #image-viewer[data-mode="plan"] .zoom-controls{order:0;width:auto;margin:0;gap:8px}
}

/* 22 October 2026, owner decision B: the home page opens on the full-screen rooftop rendering, with the walk-time trail and the move-in notice directly beneath it. */
.hero-full.hero-track{padding:0}
.hero-full .hero{margin:0!important;height:calc(100svh - var(--header-height) - 46px);min-height:560px;max-height:980px;overflow:hidden;border-radius:0}
.hero-full .hero-image{height:100%!important;aspect-ratio:auto;object-fit:cover;object-position:center 45%}
.hero-full .hero-shade{background:linear-gradient(90deg,rgba(19,38,45,.45),transparent 55%),linear-gradient(0deg,rgba(19,38,45,.55),transparent 42%)}
.hero-full .hero-copy{bottom:56px}
.hero-side{position:absolute;right:5%;bottom:64px;text-align:right;color:var(--ivory)}
.hero-side b{display:block;font:400 clamp(26px,2.4vw,34px)/1.1 Italiana,serif}
.hero-side span{display:block;font-size:14px;margin-top:8px}
.arrival{display:grid;grid-template-columns:1.2fr 1fr;gap:40px var(--gutter);padding:40px var(--gutter) 12px;align-items:start}
.arrival .hero-headline{font:clamp(25px,2.8vw,40px)/1.32 Italiana,Georgia,serif;max-width:620px;margin:0}
.arrival .where{font-size:14px;margin-top:14px}
.arrival .text-link{margin-top:14px}
.trail{position:relative;padding-left:30px}.trail ul{list-style:none;margin:0;padding:0}
.trail:before{content:"";position:absolute;left:7px;top:34px;bottom:14px;border-left:2px dashed var(--pine)}
.trail-title{font-size:12px;letter-spacing:.12em;font-weight:600;margin:0 0 6px -30px;max-width:none}
.stop{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:7px 0;border-bottom:1px solid var(--line)}
.stop:before{content:"";position:absolute;left:-28px;top:14px;width:12px;height:12px;border-radius:50%;background:var(--pine);border:2px solid var(--ivory);box-shadow:0 0 0 1.5px var(--pine)}
.stop .place{font-size:16px}.stop .place small{font-size:13px;margin-left:6px}
.stop .mins{font:600 24px/1 "Instrument Sans",sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}.stop .mins small{font:600 11px "Instrument Sans",sans-serif;letter-spacing:.12em;margin-left:5px}
.move-in{grid-column:1/-1;background:var(--slate);color:var(--on-slate);border-radius:var(--radius);padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:8px}
.move-in b{font:400 30px/1.1 Italiana,serif;color:var(--ivory);white-space:nowrap}.move-in p{font-size:15px;max-width:60ch}.move-in .button{flex:none}
.move-in .button:focus-visible{outline-color:var(--ivory)}
.day-on-foot .section-heading p{max-width:430px}
.day-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 30px;align-items:start}
.day-frame{position:relative}.day-time{display:block;font:48px/1 Italiana,serif;margin-bottom:14px}
.day-frame .image-button img{aspect-ratio:1.4;object-fit:cover}
.day-note{align-self:center;padding-right:10%}.day-note p{font-size:18px}
.travel-highlights{grid-template-columns:repeat(4,1fr)}
@media(max-width:850px){.arrival{grid-template-columns:1fr;gap:30px}.day-grid{grid-template-columns:1fr 1fr;gap:35px 20px}.day-time{font-size:38px}.travel-highlights{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.hero-full .hero{margin:0!important;height:calc(100svh - var(--header-height) - 44px);min-height:520px;max-height:760px}.hero-full .hero-image{object-position:40% 50%}.hero-full .hero-copy{left:22px;right:22px;bottom:92px;max-width:none}.hero-full .hero h1.hero-title-stack{font-size:clamp(48px,16vw,64px)}.hero-full .hero-descriptor{font-size:14px;margin-top:8px}.hero-side{left:22px;right:auto;bottom:24px;text-align:left}.hero-side b{font-size:24px}.hero-side span{display:none}.arrival{padding:28px 18px 10px}.move-in{flex-direction:column;align-items:flex-start;padding:22px}.day-note{padding-right:0;grid-column:1/-1}.day-time{font-size:34px}.travel-highlights{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.hero-full .hero{margin:0!important}}

/* 22 October 2026: exterior renderings. The building appears on the home page's five-oak story, About, Contact, the gallery and every closing section. */
.oak-exterior{grid-column:1/-1;margin-top:50px;position:relative;z-index:1}
.oak-exterior img{aspect-ratio:1.9;object-fit:cover}
.closing-image img{aspect-ratio:1.3}
@media(max-width:700px){.oak-exterior{margin-top:35px}.oak-exterior img{aspect-ratio:1.4}}

/* 22 October 2026: the brand's coordinates stamp joins the wordmark in the header, as on the guideline's secondary lockup. */
header .brand{width:auto;display:flex;align-items:center;gap:18px}
header .brand img{width:166px;flex:none}
.brand-coords{font-size:11px;letter-spacing:.14em;color:var(--harbour);border-left:1px solid var(--line);padding-left:18px;white-space:nowrap;line-height:1}
@media(max-width:1250px){header .brand{width:auto}header .brand img{width:165px}}
@media(max-width:900px){.brand-coords{display:none}}
@media(max-width:700px){header .brand{width:100%;max-width:118px;display:flex}header .brand img{width:100%}}
header .brand{text-decoration:none}

/* 22 October 2026: the title tried at 1.5x in live mode and returned to its original size at the owner's request. */

/* 22 October 2026, owner notes: the title must read over the photograph; the descriptor becomes a tracked capitals line. */
.hero-full .hero-shade{background:linear-gradient(90deg,rgba(19,38,45,.5),rgba(19,38,45,.14) 42%,transparent 65%),linear-gradient(0deg,rgba(19,38,45,.55),rgba(19,38,45,.18) 32%,transparent 55%)}
.hero-full .hero h1.hero-title-stack,.hero-full .hero-descriptor,.hero-side{text-shadow:0 2px 28px rgba(19,38,45,.6)}
.hero-full .hero-descriptor{font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-top:20px}
@media(max-width:700px){.hero-full .hero-descriptor{font-size:11px;letter-spacing:.18em;margin-top:12px}}

/* 22 October 2026: the move-in line sits on a frosted, outlined plate in the corner of the hero. */
.hero-side{padding:14px 20px;border:1px solid var(--ivory);border-radius:5px;background:rgba(49,75,89,.32);-webkit-backdrop-filter:blur(12px) saturate(1.1);backdrop-filter:blur(12px) saturate(1.1);text-shadow:none}
.hero-side b{font-size:clamp(22px,2vw,28px)}
@media(max-width:700px){.hero-side{padding:10px 14px}.hero-side b{font-size:20px}}

/* 22 October 2026: the hero copy and the move-in plate fade up after the photograph, once, on load. Reduced-motion rules above disable it. */
@keyframes fo-fade-up{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
.hero-full .hero-copy,.hero-full .hero-side{animation:fo-fade-up 3.2s var(--ease) .4s both}

/* 22 October 2026: the name stays as the original stacked Italiana, bottom-left in Ivory. Capitals, a centred placement and a Harbour-on-sky colour were each tried in live mode and set aside. */

/* 22 October 2026: the About page's corner section joins the home page ahead of the neighbourhood chapter, so the building appears early. */
.home-corner{padding-top:60px}
@media(max-width:700px){.home-corner{padding-top:40px}}

/* 22 October 2026: the address balances the descriptor on the hero, in Italiana; the arrival headline grows and the trail opens up to match it. */
.hero-addr{position:absolute;right:5%;bottom:56px;margin:0;font:400 clamp(14px,1.2vw,17px)/1.3 "Instrument Sans",Arial,sans-serif;letter-spacing:.02em;color:var(--ivory);text-align:right;text-shadow:0 2px 28px rgba(19,38,45,.6);animation:fo-fade-up 3.2s var(--ease) .4s both}
.arrival .hero-headline{font-size:clamp(30px,3.4vw,50px);line-height:1.22}
.arrival .text-link{margin-top:26px}
.trail-title{margin-bottom:12px}
.stop{padding:12px 0}
.stop:before{top:19px}
.trail:before{top:40px}
@media(max-width:700px){.hero-addr{left:22px;right:auto;bottom:22px;text-align:left;font-size:13px}.hero-full .hero-copy{bottom:72px}.arrival .hero-headline{font-size:30px}.stop{padding:9px 0}.stop:before{top:16px}}

/* 22 October 2026: the arrival headline reads heavier (Italiana has one weight, so a hairline stroke thickens it), and the trail fills its column. */
.arrival .hero-headline{-webkit-text-stroke:.45px currentColor;paint-order:stroke fill}
.arrival{align-items:stretch}
.trail{display:flex;flex-direction:column;justify-content:flex-start;padding-top:10px}
.trail-title{font-size:13px;margin-bottom:16px}
.stop{padding:17px 0;gap:20px}
.stop:before{top:25px}
.stop .place{font-size:19px}.stop .place small{font-size:14px}
.stop .mins{font-size:28px}
.trail:before{top:46px;bottom:18px}
@media(max-width:700px){.stop{padding:11px 0}.stop:before{top:18px}.stop .place{font-size:17px}.stop .mins{font-size:24px}}

/* 22 October 2026: the trail matches the headline's height exactly; the link sits below on its own row. */
.arrival{grid-template-columns:1.2fr 1fr;grid-template-rows:auto auto auto;align-items:stretch;row-gap:0}
.arrival>div:first-child{display:contents}
.arrival .hero-headline{grid-column:1;grid-row:1}
.arrival>div:first-child>.text-link{grid-column:1;grid-row:2;justify-self:start;margin-top:26px}
.arrival .trail{grid-column:2;grid-row:1;padding-top:0;justify-content:space-between;height:100%}
.arrival .trail ul{display:flex;flex-direction:column;justify-content:space-between;flex:1}
.arrival .trail-title{margin-bottom:0}
.arrival .stop{padding:0 0 6px;align-items:baseline}
.arrival .stop:before{top:8px}
.arrival .trail:before{top:30px;bottom:6px}
.arrival .move-in{grid-row:3;margin-top:40px}
@media(max-width:850px){.arrival{grid-template-columns:1fr}.arrival .trail{grid-column:1;grid-row:2;height:auto;margin-top:30px}.arrival>div:first-child>.text-link{grid-row:3}.arrival .move-in{grid-row:4}.arrival .stop{padding:10px 0}.arrival .stop:before{top:18px}}

/* 22 October 2026: more room above the arrival section; the trail's title drops to the headline's cap line. */
.arrival{padding-top:72px}
.arrival .trail{padding-top:14px}
.arrival .trail:before{top:44px}
@media(max-width:700px){.arrival{padding-top:44px}.arrival .trail{padding-top:0}}

/* 22 October 2026: the move-in notice copy reads larger. */
.move-in p{font-size:18px;line-height:1.5;max-width:52ch}
@media(max-width:700px){.move-in p{font-size:16px}}

/* 22 October 2026: photographs no longer wipe in; they settle in with a soft fade. */
.reveal-ready{clip-path:none!important;opacity:0;transform:translateY(12px) scale(1.012);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
.reveal-ready.is-visible{opacity:1;transform:none}
.chapter-reveal:before{display:none!important}

/* Hotel-style carousel: the active photo large and centred, neighbours smaller and faded, arrows at the edges. */
.carousel{position:relative;overflow:clip;padding:10px 0 48px;outline:none}
.carousel-track{display:flex;gap:28px;transition:transform .8s var(--ease);will-change:transform}
.carousel-slide{flex:0 0 min(62%,900px);margin:0;transition:opacity .8s var(--ease),transform .8s var(--ease);opacity:.42;transform:scale(.9)}
.carousel-slide.is-active{opacity:1;transform:none}
.carousel-slide .image-button{border-radius:var(--radius)}
.carousel-slide img{aspect-ratio:1.5;object-fit:cover}
.carousel-slide figcaption{opacity:0;transition:opacity .5s var(--ease) .2s;justify-content:center}
.carousel-slide.is-active figcaption{opacity:1}
.carousel-arrow{position:absolute;top:calc(50% - 44px);width:52px;height:52px;border-radius:50%;border:1px solid currentColor;background:rgba(240,237,229,.82);color:var(--harbour);display:flex;align-items:center;justify-content:center;padding:0;transition:background .25s,color .25s;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.carousel-arrow:hover{background:var(--harbour);color:var(--ivory);border-color:var(--harbour)}
.carousel-arrow svg{width:22px;height:22px}
.carousel-prev{left:var(--gutter)}.carousel-next{right:var(--gutter)}
.chapter-slate .carousel-arrow,.chapter-pine .carousel-arrow{background:rgba(49,75,89,.55);color:var(--ivory)}
.chapter-slate .carousel-arrow:hover,.chapter-pine .carousel-arrow:hover{background:var(--ivory);color:var(--harbour)}
.carousel-count{position:absolute;right:var(--gutter);bottom:12px;margin:0;font-size:12px;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.section>.carousel{margin:0 calc(-1 * var(--gutter))}
.inside-after{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;max-width:900px;margin:10px 0 40px}
.inside-after p{font-size:20px;max-width:520px}
.room-note-wide{max-width:520px;margin-top:30px}
.room-note-wide h3{font:40px/1.1 Italiana,serif;margin-bottom:16px}
@media(max-width:700px){.carousel{padding-bottom:40px}.carousel-track{gap:14px}.carousel-slide{flex-basis:78%}.carousel-slide img{aspect-ratio:1.25}.carousel-arrow{width:44px;height:44px;top:calc(50% - 40px)}.carousel-prev{left:10px}.carousel-next{right:10px}.inside-after{display:block}.inside-after p{font-size:18px}.inside-after .text-link{margin-top:14px}}

/* 22 October 2026: neighbourhood photographs as a walk along the street: one uniform row, scroll-snapped, the place name and note pinned on each card. Replaces the layered clusters. */
.strip{position:relative}
.strip-row{list-style:none;margin:0;padding:4px var(--gutter) 24px;display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.strip-row::-webkit-scrollbar{display:none}
.strip-card{flex:0 0 clamp(240px,24vw,340px);scroll-snap-align:start;position:relative;border-radius:var(--radius);overflow:hidden;background:var(--harbour)}
.strip-card .image-button{border-radius:0}
.strip-card img{aspect-ratio:3/4;object-fit:cover;width:100%}
.strip-card .enlarge{bottom:auto;top:0}
.strip-label{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(0deg,rgba(19,38,45,.78),rgba(19,38,45,0));color:var(--ivory);pointer-events:none}
.strip-label b{display:block;font:400 22px/1.15 Italiana,serif}
.strip-label span{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-top:6px;opacity:.9}
.strip .carousel-arrow{top:calc(50% - 38px)}
.strip-prev{left:calc(var(--gutter) - 26px)}.strip-next{right:calc(var(--gutter) - 26px)}
.strip-section>.strip,.shore>.strip{margin:0 calc(-1 * var(--gutter))}
.chapter-seaglass .carousel-arrow{background:rgba(240,237,229,.85);color:var(--harbour)}
.shore-extra-link{margin-top:10px}
@media(max-width:700px){.strip-row{gap:12px;padding-bottom:16px}.strip-card{flex-basis:72vw}.strip .carousel-arrow{display:none}.strip-label b{font-size:20px}}

/* 22 October 2026: the rooftop sequence takes far longer to scroll through, and its shade is lighter so the renderings read. */
.motion-desktop .rooftop-track{height:calc(100svh + 4200px)}
.roof-shade{background:linear-gradient(90deg,rgba(18,37,45,.58),rgba(18,37,45,.04) 78%)}

/* 22 October 2026: the plan explorer sits on one even grid with no offset wash; the closing is compact with the photograph squared to its band. */
.plan-section:before{display:none}
.plan-explorer{grid-template-columns:minmax(300px,.85fr) minmax(0,1.15fr);gap:60px;align-items:start}
.plan-main{max-width:none;justify-self:stretch}
.plan-sidebar{padding-top:0}
.plan-section .section-heading{align-items:flex-end}
.closing{padding:70px var(--gutter);grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.closing:before{display:none}
.closing h2{font-size:clamp(44px,4.6vw,66px)}
.closing p{font-size:17px;margin:22px 0}
.closing-image{max-width:520px;justify-self:end;width:100%}
.closing-image img{aspect-ratio:1.4;object-fit:cover}
.closing-image .image-button{border-radius:var(--radius)}
@media(max-width:700px){.closing{padding:55px var(--gutter)}.closing h2{font-size:48px}.closing-image{max-width:none;margin-top:30px}}

/* One day on foot as a photographer's proof sheet: a dark sheet, frame numbers, film-edge sprockets, and two frames circled in Brass grease pencil. */
.day-on-foot{background:var(--harbour);color:var(--ivory)}
.day-on-foot h2{color:var(--ivory)}
.day-on-foot .section-heading p{color:var(--ivory)}
.day-sheet{position:relative;padding:38px 0 46px;border-top:1px solid rgba(240,237,229,.35);border-bottom:1px solid rgba(240,237,229,.35)}
.day-sheet:before,.day-sheet:after{content:"";position:absolute;left:0;right:0;height:12px;background:repeating-linear-gradient(90deg,rgba(240,237,229,.38) 0 16px,transparent 16px 32px);border-radius:2px}
.day-sheet:before{top:10px}.day-sheet:after{bottom:10px}
.day-sheet-label{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin:0 0 30px;max-width:none;opacity:.85}
.day-grid{grid-template-columns:repeat(4,1fr);gap:46px 26px}
.day-frame{position:relative}
.day-no{position:absolute;top:-2px;right:0;font-size:11px;letter-spacing:.16em;color:var(--brass);font-weight:600}
.day-time{font-size:34px;margin-bottom:12px;color:var(--ivory)}
.day-frame .image-button{border:1px solid rgba(240,237,229,.45);padding:6px;background:#0f1d25;border-radius:4px}
.day-frame .image-button img{border-radius:2px;aspect-ratio:1.35}
.day-frame figcaption{color:var(--ivory);font-size:12px;letter-spacing:.06em;margin-top:10px}
.day-note{align-self:end;padding-right:0}
.day-note p{font-size:17px;line-height:1.55;max-width:26ch}
.circled:after{content:"";position:absolute;left:-12px;right:-12px;top:34px;bottom:14px;border:3px solid var(--brass);border-radius:46% 54% 52% 48%/56% 44% 56% 44%;transform:rotate(-2.5deg);pointer-events:none;opacity:.95}
.day-pencil{align-self:center;font:400 clamp(24px,2.2vw,32px)/1.2 Italiana,serif;color:var(--brass);transform:rotate(-3deg);padding-left:6px}
@media(max-width:850px){.day-grid{grid-template-columns:1fr 1fr;gap:36px 20px}.day-time{font-size:30px}}
@media(max-width:700px){.day-sheet{padding:34px 0 40px}.day-grid{gap:30px 14px}.day-time{font-size:26px}.day-note{grid-column:1/-1}.circled:after{left:-8px;right:-8px;top:30px}.day-pencil{grid-column:1/-1;transform:rotate(-2deg);font-size:26px}}

/* 22 October 2026: the map section reads as one calm tool. Wider map, the directory capped to the map's height with its own scroll, one category open at a time, quieter rows. */
.neighbourhood-tool{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);gap:40px;align-items:start}
.neighbourhood-canvas{height:600px;border-radius:var(--radius)}
.map-toolbar{border-top:0;min-height:0;padding:0 0 16px}
.map-toolbar strong{font-size:24px}
.places-directory{max-height:calc(600px + 48px);overflow:auto;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--slate) transparent}
.directory-head{border-top:0;padding-top:0}
.directory-head h3{font:400 28px/1.1 Italiana,Georgia,serif;margin-bottom:10px}
.place-group{border-top:1px solid var(--line)}
.place-group summary{display:flex;align-items:center;gap:12px;min-height:54px;cursor:pointer;font-size:15px;font-weight:600;list-style:none}
.place-group summary::-webkit-details-marker{display:none}
.place-group summary .category-count{margin-left:auto;font-weight:400;font-size:12px;letter-spacing:.1em;opacity:.7}
.place-group summary svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.place-group[open] summary svg{transform:rotate(45deg)}
.place-group ol{margin:0 0 14px;padding:0;list-style:none}
.place-select{min-height:48px;padding:8px 0;font-size:15px}
.place-select>span:nth-child(2){display:flex;flex-direction:column;gap:2px}
.place-select .travel-chip{margin:2px 0 0;font-size:12px;opacity:.8}
.place-select>svg{width:16px;height:16px;opacity:.5}
.travel-highlights{margin-top:50px}
@media(max-width:800px){.neighbourhood-tool{grid-template-columns:1fr}.neighbourhood-canvas{height:440px}.places-directory{max-height:none;overflow:visible;padding-right:0}}

/* Gallery: one even grid, captions always visible, nothing offset. */
.gallery-collection .gallery-grid{grid-template-columns:repeat(3,1fr);gap:28px 22px;align-items:start}
.gallery-collection .gallery-grid>figure{margin:0!important;width:auto!important;grid-column:auto!important}
.gallery-collection .gallery-grid img{aspect-ratio:1.4!important}
.gallery-collection .image-button{border-radius:var(--radius)}
.gallery-collection>p{margin:14px 0 30px;max-width:60ch}
.gallery-jumps{gap:10px}
.gallery-jumps a{border:1px solid var(--line);border-radius:5px;padding:8px 14px;text-decoration:none;font-size:14px}
@media(max-width:700px){.gallery-collection .gallery-grid{grid-template-columns:1fr 1fr;gap:18px 12px}.gallery-collection .gallery-grid img{aspect-ratio:1!important}}

/* 23 October 2026: the arrival section breathes evenly above, between and below its three parts. */
.arrival{padding:96px var(--gutter) 60px;row-gap:0}
.arrival .hero-headline{padding-right:6%}
.arrival .move-in{margin-top:64px}
@media(max-width:700px){.arrival{padding:52px 18px 40px}.arrival .move-in{margin-top:40px}}

.arrival{padding:128px var(--gutter) 88px;column-gap:clamp(60px,8vw,140px)}
.arrival .move-in{margin-top:88px}
@media(max-width:700px){.arrival{padding:60px 18px 48px}.arrival .move-in{margin-top:48px}}

/* 23 October 2026: the trail becomes a panel with a pictogram per leg and the minutes set as Italiana numerals, the brand's numbers-as-headlines. */
.arrival .trail{background:var(--sea-glass);border-radius:var(--radius);padding:28px 30px 26px 30px;height:auto;align-self:stretch;justify-content:space-between}
.arrival .trail:before{display:none}
.arrival .trail-title{color:var(--harbour);font-size:12px;margin:0 0 6px}
.arrival .stop{padding:10px 0;border-bottom:1px solid rgba(49,75,89,.25);display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:14px}
.arrival .stop:last-child{border-bottom:0}
.arrival .stop:before{display:none}
.arrival .stop svg{width:24px;height:24px;stroke-width:1.4;color:var(--harbour)}
.arrival .stop .place{font-size:18px;color:var(--harbour)}.arrival .stop .place small{color:var(--harbour);opacity:.75}
.arrival .stop .mins{font:400 44px/1 Italiana,serif;color:var(--harbour)}.arrival .stop .mins small{font:600 11px "Instrument Sans",sans-serif;letter-spacing:.12em;color:var(--harbour);opacity:.8;margin-left:6px}
@media(max-width:700px){.arrival .trail{padding:20px 18px}.arrival .stop{gap:10px}.arrival .stop .place{font-size:16px}.arrival .stop .mins{font-size:34px}}

/* 23 October 2026: the Sea Glass panel is withdrawn. Instead, a faint route trace wanders behind the trail and the headline's park and pier pick up Pine. */
.arrival .trail{background:none;border-radius:0;padding:14px 0 0;height:100%;position:relative}
.arrival .trail:before{display:block}
.arrival .trail-title{color:inherit;font-size:13px;margin:0 0 0 -30px}
.arrival .stop{padding:0 0 6px;border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:16px}
.arrival .stop:last-child{border-bottom:1px solid var(--line)}
.arrival .stop:before{display:block}
.arrival .stop .place{font-size:19px;color:inherit}.arrival .stop .place small{color:#6b6558;opacity:1}
.arrival .stop .mins{font:600 28px/1 "Instrument Sans",sans-serif;color:inherit}.arrival .stop .mins small{color:#6b6558;opacity:1}
.trail-route{position:absolute;left:-30px;top:-10px;width:calc(100% + 30px);height:calc(100% + 20px);color:var(--pine);opacity:.35;pointer-events:none;z-index:0}
.arrival .trail>p,.arrival .trail>ul{position:relative;z-index:1}
.hero-headline .anchor{font-style:normal;color:var(--pine)}
@media(max-width:700px){.arrival .trail{padding:0}.arrival .stop{padding:10px 0;gap:10px}.arrival .stop .place{font-size:16px}.arrival .stop .mins{font-size:24px}}

/* 23 October 2026: the route trace and Pine anchors are withdrawn. Each leg of the walk gets a small photograph instead of a dot. */
.arrival .trail-photos{padding:14px 0 0}
.arrival .trail-photos:before{display:none}
.arrival .trail-photos .trail-title{margin-left:0}
.arrival .trail-photos .stop{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:18px;padding:8px 0}
.arrival .trail-photos .stop:before{display:none}
.stop-thumb{display:block;width:72px;height:54px;border-radius:6px;overflow:hidden}
.stop-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){.arrival .trail-photos .stop{grid-template-columns:56px 1fr auto;gap:12px}.stop-thumb{width:56px;height:42px}}

/* 23 October 2026: back to the map idea. A wavy dotted spine runs behind the stop markers; park and pier are set in Brass. */
.arrival .trail-wavy{padding:14px 0 0 34px}
.arrival .trail-wavy:before{display:none}
.arrival .trail-wavy .trail-title{margin-left:-34px}
.arrival .trail-wavy .stop{display:flex;align-items:baseline;gap:16px;padding:0 0 6px;border-bottom:1px solid var(--line)}
.arrival .trail-wavy .stop:before{display:block;left:-33px;top:9px;width:14px;height:14px;background:var(--pine);border:3px solid var(--ivory);box-shadow:0 0 0 2px var(--pine)}
.trail-spine{position:absolute;left:-37px;top:38px;width:22px;height:calc(100% - 46px);color:var(--pine);pointer-events:none;z-index:0}
.hero-headline .anchor{font-style:normal;color:var(--brass)}
@media(max-width:700px){.arrival .trail-wavy{padding-left:30px}.arrival .trail-wavy .stop{padding:10px 0}.arrival .trail-wavy .stop:before{top:17px}}

/* 23 October 2026: park and pier in Pine, lifted with a light halo; the stop markers become location pins with the wavy route passing through them. */
.hero-headline .anchor{color:var(--pine);-webkit-text-stroke:.7px rgba(240,237,229,.9);paint-order:stroke fill;text-shadow:0 0 1px rgba(240,237,229,.9),0 0 14px rgba(240,237,229,1)}
.arrival .trail-wavy .stop:before{display:block;left:-37px;top:2px;width:22px;height:28px;border-radius:0;background:none;border:0;box-shadow:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 28'><path d='M11 27s9-8.4 9-15.4A9 9 0 0 0 2 11.6C2 18.6 11 27 11 27z' fill='%23F0EDE5' stroke='%23536B5C' stroke-width='2'/><circle cx='11' cy='11.4' r='3.2' fill='%23536B5C'/></svg>");background-size:22px 28px;background-repeat:no-repeat}
.trail-spine{left:-37px;width:22px;top:40px;height:calc(100% - 54px)}
@media(max-width:700px){.arrival .trail-wavy .stop:before{top:10px}}

.trail-spine{left:-3px}

/* 23 October 2026: park and pier heavier; the route through the pins is a straight dotted line. */
.hero-headline .anchor{-webkit-text-stroke:1.1px var(--pine);paint-order:stroke fill;text-shadow:0 0 1px rgba(240,237,229,.9),0 0 14px rgba(240,237,229,1)}
.trail-spine{display:none}
.arrival .trail-wavy:before{display:block;left:-26px;top:44px;bottom:16px;border-left:2px dotted var(--pine)}
.arrival .trail-wavy .stop:before{z-index:1}

.arrival .trail-wavy:before{left:7px}

/* 23 October 2026: the arrival headline runs larger and wider, closing the gap to the trail. */
.arrival{grid-template-columns:1.45fr 1fr;column-gap:clamp(40px,5vw,80px)}
.arrival .hero-headline{font-size:clamp(32px,3.9vw,58px);line-height:1.18;max-width:none;padding-right:0}
@media(max-width:850px){.arrival{grid-template-columns:1fr}}

.arrival .hero-headline{text-wrap:balance}

/* 23 October 2026: the move-in notice sits on the dusk rendering under a Harbour tint, with the coordinates stamp in the corner. */
.arrival .move-in{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(49,75,89,.94) 0%,rgba(49,75,89,.82) 55%,rgba(49,75,89,.45) 100%),url(/assets/ext-dusk-1200.webp) center 60%/cover no-repeat;padding:34px 40px;min-height:150px;align-items:center;gap:40px}
.arrival .move-in-copy{display:flex;align-items:center;gap:40px;flex:1}
.arrival .move-in b{font-size:34px;flex:none}
.arrival .move-in p{font-size:17px;max-width:46ch}
.arrival .move-in .button{flex:none;position:relative;z-index:1}
.move-in-stamp{position:absolute;right:40px;bottom:12px;font-size:10px;letter-spacing:.2em;color:var(--ivory);opacity:.75}
@media(max-width:850px){.arrival .move-in{flex-direction:column;align-items:flex-start;padding:28px 26px 36px}.arrival .move-in-copy{display:block}.arrival .move-in b{display:block;margin-bottom:10px}.move-in-stamp{right:26px;bottom:10px}}

/* 23 October 2026: the dusk-rendering notice is withdrawn; back to the flat Slate band. */
.arrival .move-in{background:var(--slate);padding:22px 28px;min-height:0;gap:24px}
.arrival .move-in b{font-size:30px}
@media(max-width:850px){.arrival .move-in{padding:22px}}

/* 23 October 2026: equal space above the headline and below it to the banner. */
.arrival{padding-top:96px}
.arrival .move-in{margin-top:96px}
@media(max-width:700px){.arrival{padding-top:56px}.arrival .move-in{margin-top:56px}}

/* 23 October 2026: the banner sits with equal space above and below. */
.arrival{padding-bottom:48px}
.home-corner{padding-top:48px}
@media(max-width:700px){.arrival{padding-bottom:28px}.home-corner{padding-top:28px}}

.arrival{padding-top:128px;padding-bottom:64px}
.arrival .move-in{margin-top:128px}
.home-corner{padding-top:64px}
@media(max-width:700px){.arrival{padding-top:64px;padding-bottom:32px}.arrival .move-in{margin-top:64px}.home-corner{padding-top:32px}}

/* 23 October 2026: the park-to-pier chapter becomes a walk: four Polaroids pinned along a dotted route from Victoria Park to the pier. */
.park{display:block;padding-top:110px;padding-bottom:110px}
.park-title{margin:0 0 20px}
.park .park-copy{max-width:560px;font-size:18px;margin:0 0 70px}
.park .park-copy .text-link{margin-top:18px}
.walk{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;align-items:start;padding:30px 0 20px}
.walk-path{position:absolute;left:0;right:0;top:0;width:100%;height:100%;color:var(--ivory);opacity:.75;pointer-events:none}
.polaroid{position:relative;background:var(--ivory);padding:12px 12px 44px;border-radius:3px;box-shadow:0 18px 40px rgba(18,37,45,.35);transform:rotate(var(--tilt,0));transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.polaroid:hover{transform:rotate(0) translateY(-6px);box-shadow:0 26px 50px rgba(18,37,45,.42);z-index:2}
.polaroid .image-button{border-radius:0}
.polaroid img{aspect-ratio:1;object-fit:cover}
.polaroid figcaption{position:absolute;left:12px;right:12px;bottom:-32px;margin:0;color:var(--harbour);font:400 20px/1.1 Italiana,serif;display:block}
.polaroid-note{position:absolute;left:12px;bottom:12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5a5346}
.walk-pin{position:absolute;top:-14px;left:50%;transform:translateX(-50%);width:22px;height:28px;z-index:3;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 28'><path d='M11 27s9-8.4 9-15.4A9 9 0 0 0 2 11.6C2 18.6 11 27 11 27z' fill='%23F0EDE5' stroke='%23536B5C' stroke-width='2'/><circle cx='11' cy='11.4' r='3.2' fill='%23536B5C'/></svg>") center/contain no-repeat}
.p1{--tilt:-3deg;margin-top:70px}.p2{--tilt:2deg;margin-top:0}.p3{--tilt:-1.5deg;margin-top:60px}.p4{--tilt:2.5deg;margin-top:10px}
.polaroid .enlarge{display:none}
@media(max-width:850px){.walk{grid-template-columns:1fr 1fr;gap:34px 22px}.p1,.p2,.p3,.p4{margin-top:0}.walk-path{display:none}}
@media(max-width:700px){.park{padding-top:65px;padding-bottom:65px}.park .park-copy{margin-bottom:40px}.walk{gap:30px 16px}.polaroid{padding:8px 8px 38px}.polaroid figcaption{font-size:17px;bottom:-30px}}

/* The Polaroid's caption and note live inside its white bottom band. */
.polaroid{padding-bottom:58px}
.polaroid figcaption{bottom:14px;right:auto;max-width:60%}
.polaroid-note{left:auto;right:12px;bottom:18px;text-align:right;max-width:38%;line-height:1.3}
@media(max-width:700px){.polaroid{padding-bottom:52px}.polaroid figcaption{bottom:12px}.polaroid-note{bottom:14px;font-size:10px}}

/* 23 October 2026: two small Polaroids fill the top-right of the park chapter. */
.park{position:relative}
.park-mini{position:absolute;right:var(--gutter);top:120px;width:min(34%,420px);height:300px;pointer-events:none}
.park-mini .polaroid{position:absolute;width:52%;padding:8px 8px 36px;pointer-events:auto}
.park-mini .polaroid figcaption{font-size:16px;bottom:10px;left:8px}
.park-mini .m1{--tilt:-5deg;left:0;top:30px}
.park-mini .m2{--tilt:4deg;right:0;top:0}
@media(max-width:1100px){.park-mini{top:90px;width:40%}}
@media(max-width:850px){.park-mini{display:none}}

.park-mini{top:170px;right:calc(var(--gutter) + 40px)}
@media(max-width:1100px){.park-mini{top:130px}}

.park-mini{top:220px;right:calc(var(--gutter) + 100px)}
@media(max-width:1100px){.park-mini{top:170px;right:calc(var(--gutter) + 40px)}}

/* 23 October 2026: the homes carousel runs smaller on the home page, and the plan explorer follows it directly. */
.inside{padding-top:90px;padding-bottom:70px}
.inside-heading{margin-bottom:36px}
.inside .carousel{padding:6px 0 40px}
.inside .carousel-slide{flex-basis:min(44%,620px)}
.inside .carousel-slide img{aspect-ratio:1.5}
.inside .carousel-arrow{top:calc(50% - 40px)}
.inside-after{margin:0 0 26px}
@media(max-width:700px){.inside{padding-top:60px;padding-bottom:50px}.inside .carousel-slide{flex-basis:76%}}

/* 23 October 2026: the chapters alternate: homes on Ivory, the plan explorer on Sea Glass, the rooftop on Ivory, the five-oak story on Pine. */
.plan-section{background:var(--sea-glass)}
.plan-section .plan-main{box-shadow:0 14px 40px rgba(49,75,89,.14)}
.plan-sidebar select{background:var(--ivory)}
.rooftop-track{background:var(--ivory);color:var(--harbour)}
.rooftop-track a:focus-visible,.rooftop-track button:focus-visible{outline-color:var(--pine)}
.scene-controls button{color:var(--harbour);border-top-color:rgba(49,75,89,.3)}
.scene-controls button[aria-pressed=true]{border-top-color:var(--brass)}
.motion-desktop .roof-detail{border-color:var(--ivory)}
@media(max-width:999px){.roof-scene{background:var(--ivory);color:var(--harbour)}}

/* 23 October 2026: the homes carousel's centre photo grows back; the line beneath spans the full width with the link at the far right. */
.inside .carousel-slide{flex-basis:min(54%,760px)}
.inside-after{max-width:none;display:flex;align-items:center;justify-content:space-between;gap:60px;margin:18px 0 34px}
.inside-after p{font-size:19px;max-width:560px;margin:0}
.inside-after .text-link{flex:none}
@media(max-width:700px){.inside .carousel-slide{flex-basis:78%}.inside-after{display:block}.inside-after .text-link{margin-top:14px}}

/* 23 October 2026: park and pier fill with Pine as the line comes into view, like a marker run over each word, once. */
.hero-headline .anchor{position:relative;color:var(--harbour);-webkit-text-stroke:0;text-shadow:none;display:inline-block}
.hero-headline .anchor::after{content:attr(data-word);position:absolute;left:0;top:0;color:var(--pine);-webkit-text-stroke:1.1px var(--pine);paint-order:stroke fill;text-shadow:0 0 1px rgba(240,237,229,.9),0 0 14px rgba(240,237,229,1);clip-path:inset(0 100% 0 0);transition:clip-path .6s var(--ease)}
.hero-headline.anchors-in .anchor::after{clip-path:inset(0 0 0 0)}
.hero-headline.anchors-in .anchor:nth-of-type(2)::after{transition-delay:.4s}
@media(prefers-reduced-motion:reduce){.hero-headline .anchor::after{transition:none;clip-path:inset(0)}}
.reduced-motion .hero-headline .anchor::after{transition:none;clip-path:inset(0)}

/* The marker fill, slower and more visible: the words start in Slate and fill to Pine over a second, the second word a beat later. */
.hero-headline .anchor{color:var(--slate)}
.hero-headline .anchor::after{transition:clip-path 1.1s var(--ease)}
.hero-headline.anchors-in .anchor:nth-of-type(2)::after{transition-delay:.8s}

/* 23 October 2026: the marker fill is withdrawn. The whole headline wipes in from left to right as it scrolls into view; park and pier stay Pine. */
.hero-headline .anchor{color:var(--pine);-webkit-text-stroke:1.1px var(--pine);paint-order:stroke fill;text-shadow:0 0 1px rgba(240,237,229,.9),0 0 14px rgba(240,237,229,1)}
.hero-headline .anchor::after{content:none}
.arrival .hero-headline{clip-path:inset(0 100% 0 0);transition:clip-path 1.4s var(--ease)}
.arrival .hero-headline.anchors-in{clip-path:inset(0 0 0 0)}
@media(prefers-reduced-motion:reduce){.arrival .hero-headline{clip-path:none;transition:none}}
.reduced-motion .arrival .hero-headline{clip-path:none;transition:none}

/* 23 October 2026: the headline fades and drifts in from the left, slowly; the anchor words stay inline so punctuation holds to them. */
.hero-headline .anchor{display:inline}
.arrival .hero-headline{clip-path:none;opacity:0;transform:translateX(-48px);transition:opacity 2.2s var(--ease),transform 2.2s var(--ease)}
.arrival .hero-headline.anchors-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.arrival .hero-headline{opacity:1;transform:none;transition:none}}
.reduced-motion .arrival .hero-headline{opacity:1;transform:none;transition:none}

/* 23 October 2026: the headline's fade-and-drift follows the scroll itself where the browser supports scroll-driven animation; elsewhere it plays once on arrival. */
@keyframes fo-drift{from{opacity:0;transform:translateX(-48px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  .arrival .hero-headline,.arrival .hero-headline.anchors-in{transition:none;animation:fo-drift linear both;animation-timeline:view();animation-range:entry 0% cover 42%}
  @media(prefers-reduced-motion:reduce){.arrival .hero-headline{animation:none}}
  .reduced-motion .arrival .hero-headline{animation:none}
}

/* 23 October 2026: the registration page balances: a smaller title, and a column of photographs beside the form that runs its full height. */
.register-intro h1{font-size:clamp(44px,5vw,68px)}
.register-form h2{font-size:24px}
.register-intro>p:first-of-type{font-size:21px;margin-top:22px}
.register-intro>figure{display:none}
.register-photos{display:flex;flex-direction:column;gap:28px;margin-top:40px}
.register-photos figure{width:100%;margin:0}
.register-photos .image-button{border-radius:var(--radius)}
.register-photos img{aspect-ratio:1.3;object-fit:cover}
.register-photos figure:nth-child(even){width:82%;margin-left:auto}
.register-photos figure:nth-child(even) img{aspect-ratio:1.1}
@media(max-width:700px){.register-photos{display:none}}

.register-layout{align-items:start}
.register-photos{gap:24px;margin-top:34px}
.register-photos img{aspect-ratio:1.5}
.register-photos figure:nth-child(even) img{aspect-ratio:1.35}

.register-photos img{aspect-ratio:1.9}
.register-photos figure:nth-child(even) img{aspect-ratio:1.5}
.register-photos{gap:20px;margin-top:30px}

/* 23 October 2026: the arrival headline enters the way Anthem's section titles do: a 0.8s ease fade from the right (100px), once, as it scrolls into view. The scroll-linked drift is withdrawn. */
@supports (animation-timeline: view()){.arrival .hero-headline,.arrival .hero-headline.anchors-in{animation:none}}
.arrival .hero-headline{opacity:0;transform:translate3d(100px,0,0);transition:opacity .8s ease,transform .8s ease}
.arrival .hero-headline.anchors-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.arrival .hero-headline{opacity:1;transform:none;transition:none}}
.reduced-motion .arrival .hero-headline{opacity:1;transform:none;transition:none}

/* Left to right. */
.arrival .hero-headline{transform:translate3d(-100px,0,0)}
.arrival .hero-headline.anchors-in{transform:none}

.arrival .hero-headline{transition:opacity 1.8s ease-out,transform 1.8s cubic-bezier(.16,1,.3,1)}

.arrival .hero-headline{transition:opacity 3s ease-out,transform 3s cubic-bezier(.16,1,.3,1)}

.arrival .hero-headline{transition:opacity 5s ease-out,transform 5s cubic-bezier(.16,1,.3,1)}

/* Fix: an earlier rule set transition:none on the animated state and made the entrance instant. */
.arrival .hero-headline.anchors-in{transition:opacity 5s ease-out,transform 5s cubic-bezier(.16,1,.3,1);animation:none}

.arrival .hero-headline,.arrival .hero-headline.anchors-in{transition:opacity 2s ease-out,transform 2s cubic-bezier(.16,1,.3,1)}

.arrival .hero-headline,.arrival .hero-headline.anchors-in{transition:opacity 1.5s ease-out,transform 1.5s cubic-bezier(.16,1,.3,1)}

/* 23 October 2026: a reusable entrance. data-enter="right" slides in from the right, "left" from the left, 1.5s, once. */
[data-enter]{opacity:0;transition:opacity 1.5s ease-out,transform 1.5s cubic-bezier(.16,1,.3,1)}
[data-enter="left"]{transform:translate3d(-100px,0,0)}
[data-enter="right"]{transform:translate3d(100px,0,0)}
[data-enter].entered{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){[data-enter]{opacity:1;transform:none;transition:none}}
.reduced-motion [data-enter]{opacity:1;transform:none;transition:none}

.arrival .hero-headline,.arrival .hero-headline.anchors-in,[data-enter]{transition:opacity 1s ease-out,transform 1s cubic-bezier(.16,1,.3,1)}

.arrival .hero-headline,.arrival .hero-headline.anchors-in,[data-enter]{transition:opacity .8s ease-out,transform .8s cubic-bezier(.16,1,.3,1)}

.arrival .hero-headline,.arrival .hero-headline.anchors-in,[data-enter]{transition:opacity .9s ease-out,transform .9s cubic-bezier(.16,1,.3,1)}

/* 23 October 2026: the homes chapter heading moves to the right; the approved line takes the left. */
.inside-heading{grid-template-columns:1fr 1.2fr;align-items:end}
.inside-heading .chapter-label{grid-column:2;grid-row:1;text-align:right}
.inside-heading h2{grid-column:2;grid-row:2;text-align:right;justify-self:end;max-width:none}
.inside-heading .approved-home-headline{grid-column:1;grid-row:2;max-width:480px}
@media(max-width:850px){.inside-heading{grid-template-columns:1fr}.inside-heading .chapter-label,.inside-heading h2{grid-column:1;text-align:left;justify-self:start}.inside-heading .chapter-label{grid-row:1}.inside-heading h2{grid-row:2}.inside-heading .approved-home-headline{grid-row:3}}

/* One line, label flush right, no orphan on the approved line. */
.inside-heading .chapter-label{justify-self:end;margin:0 0 10px;max-width:none}
.inside-heading h2{white-space:nowrap;font-size:clamp(48px,6.2vw,92px)}
.inside-heading .approved-home-headline{text-wrap:balance;max-width:440px}
@media(max-width:850px){.inside-heading .chapter-label{justify-self:start}.inside-heading h2{white-space:normal}}

/* 23 October 2026: the homes carousel opens on the living room; the neighbours are much smaller and fainter so the centre photo leads. */
.inside .carousel-slide{flex-basis:min(58%,820px)}
.carousel-slide:not(.is-active){transform:scale(.72);opacity:.32}
.carousel-slide:not(.is-active) figcaption{opacity:0}
@media(max-width:700px){.inside .carousel-slide{flex-basis:80%}.carousel-slide:not(.is-active){transform:scale(.85)}}

.inside-heading .approved-home-headline{font-size:clamp(18px,1.6vw,22px);max-width:380px}

/* 23 October 2026: residence features as a 3 by 3 grid with hairlines, a line icon, a title and one line each. */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:10px}
.feature-tile{padding:34px 30px 32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.feature-tile svg{width:38px;height:38px;stroke-width:1.2;color:var(--pine)}
.feature-tile h3{font:400 26px/1.15 Italiana,serif;margin-top:6px}
.feature-tile p{font-size:14.5px;line-height:1.5;max-width:30ch;color:#4a4336;margin:0}
.feature-row{display:none}
.inside .fine,.homes-editorial .fine{margin-top:16px}
@media(max-width:850px){.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-tile{padding:26px 18px}}
@media(max-width:700px){.feature-grid{grid-template-columns:1fr 1fr}.feature-tile{padding:22px 12px}.feature-tile h3{font-size:21px}.feature-tile p{font-size:13px}}

/* 23 October 2026: the feature tiles stand on white with a soft gap, so the grid lifts off the Ivory page. */
.feature-grid{border:0;gap:14px;margin-top:16px}
.feature-tile{background:#fff;border:0;border-radius:10px;padding:38px 28px 34px;box-shadow:0 10px 30px rgba(49,75,89,.07)}
.feature-tile svg{width:42px;height:42px;color:var(--harbour)}
.feature-tile h3{color:var(--harbour);font-size:27px}
.feature-tile p{color:#3d3a34;font-size:15px}
@media(max-width:700px){.feature-grid{gap:10px}.feature-tile{padding:24px 14px;border-radius:8px}}

/* Italiana ships in one weight; a hairline stroke gives the tile titles a touch more body. */
.feature-tile h3{-webkit-text-stroke:.55px currentColor;paint-order:stroke fill;letter-spacing:.01em}

/* Icons in Soft Pine. */
.feature-tile svg{color:var(--pine)}

/* The homes carousel closes on its link alone, flush right. */
.inside-after{justify-content:flex-end}

/* The approved line in Italiana, stroked a touch heavier, one step larger. */
.inside-heading .approved-home-headline{font-family:'Italiana',serif;font-size:clamp(24px,2.1vw,30px);line-height:1.25;-webkit-text-stroke:.55px currentColor;paint-order:stroke fill;letter-spacing:.01em;color:var(--harbour);max-width:460px}
/* 23 October 2026: a painted Sea Glass swatch behind the approved line on the home page.
   The stroke is an inline SVG with ragged edges and a dry tail, laid at a slight tilt,
   and it wipes in left to right once the line has slid in. */
.inside-heading .approved-home-headline{position:relative;isolation:isolate;padding:14px 22px 14px 18px;margin-left:-18px;max-width:520px}
.inside-heading .approved-home-headline:before{content:"";position:absolute;inset:-6px -10px -4px -8px;z-index:-1;pointer-events:none;transform:rotate(-1.6deg);transform-origin:40% 50%;
background-repeat:no-repeat;background-size:100% 100%;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 150' preserveAspectRatio='none'%3E%3Cpath fill='rgb(169,187,183)' fill-opacity='.62' d='M14 46c22-13 55-12 92-16 63-7 139-9 212-10 71-1 141 0 203 4 30 2 56 8 66 18 6 7 2 17-8 23 10 11 12 27 1 37-13 12-38 14-66 15-54 2-116 4-182 4-70 0-146 0-213-4-37-2-74-4-96-12-13-5-13-17-6-25-9-7-9-23-3-34z'/%3E%3Cpath fill='rgb(169,187,183)' fill-opacity='.42' d='M4 70c18-9 50-10 86-11 57-2 122-4 192-3 72 1 150 2 213 6 33 2 61 7 80 15 9 4 10 12 2 18-16 10-42 10-72 10-48 1-109 2-174 1-76-1-153-2-220-5-42-2-83-5-100-12-9-4-11-12-7-19z'/%3E%3Cpath fill='rgb(169,187,183)' fill-opacity='.35' d='M520 34c18-2 44 0 57 6 8 4 10 10 6 15-9 7-28 9-52 8-13-1-24-6-27-12-3-7 3-14 16-17zM560 110c15-1 30 2 35 8 3 5-3 10-14 12-15 2-31 0-37-6-5-5 1-12 16-14z'/%3E%3C/svg%3E");
clip-path:inset(0 100% 0 0);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1) .35s}
.inside-heading .approved-home-headline.entered:before{clip-path:inset(0 0 0 0)}
@media(prefers-reduced-motion:reduce){.inside-heading .approved-home-headline:before{clip-path:none;transition:none}}
@media(max-width:850px){.inside-heading .approved-home-headline{margin-left:0;padding:12px 16px}}

/* 23 October 2026: second pass on the swatch. One flat stroke in a lighter Sea Glass, no stacked
   translucency (that read as a blur), with bristle streaks cut out of the body and a dry tail. */
.inside-heading .approved-home-headline:before{inset:-4px -14px -2px -8px;transform:rotate(-1.2deg);
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 150' preserveAspectRatio='none'%3E%3Cpath fill='rgb(201,214,211)' fill-rule='evenodd' d='M10 52c30-11 70-13 118-16 70-5 146-7 220-6 68 1 132 2 184 8 24 3 42 9 48 17 4 6-1 12-9 15 7 10 8 24-3 32-12 9-36 11-62 12-56 2-120 3-186 2-70-1-144-2-208-7-36-3-72-6-94-14-11-4-12-14-6-22-7-7-8-15-2-21zM120 74c38 1 78 1 118 1-40-2-80-3-118-1zM330 96c50 0 100-1 150-2-50 0-100 0-150 2zM60 98c30 2 62 3 94 4-32-2-64-4-94-4zM250 58c40 0 80 1 120 2-40-2-80-3-120-2z'/%3E%3Cpath fill='rgb(201,214,211)' d='M548 44c14-3 30-1 36 5 3 4-1 8-9 9-11 2-24 0-28-5-3-4-3-8 1-9zM556 60c10 0 19 2 22 6 1 3-3 5-9 5-8 0-15-2-17-6-1-3 0-5 4-5zM560 114c11-2 21 0 25 4 2 3-2 6-9 7-9 1-18-1-21-5-2-3 0-5 5-6zM574 96c8-1 14 1 16 4 1 2-2 4-7 4-6 0-11-2-12-4-1-2 0-4 3-4z'/%3E%3C/svg%3E")}
/* Room between the heading block and the carousel. */
.inside .inside-heading{margin-bottom:56px}

/* 23 October 2026: the swatch is now a real brush file (src/brush-stroke.svg), three passes with
   noise-roughened bristle edges and a dry lower pass, in place of the earlier shaped blob. */
.inside-heading .approved-home-headline:before{inset:-8px -18px -8px -10px;transform:rotate(-1.4deg);background-image:url("/brush-stroke.svg")}


/* 23 October 2026: the homes chapter matches the neighbourhood chapter's scale and breathing room. */
.inside.section{padding-top:110px}
.inside-heading h2{font-size:clamp(56px,7.5vw,108px)}
@media(max-width:700px){.inside.section{padding-top:70px}}
/* The brush swatch sits on a diagonal. */
.inside-heading .approved-home-headline:before{transform:rotate(-4deg);transform-origin:30% 55%;inset:-10px -20px -10px -12px}
/* The side photos in the homes carousel tuck closer to the centre one. */
.inside .carousel-track{gap:0}
.inside .carousel-slide:not(.is-active){margin:0 -10px}

/* Side slides slide inward toward the centre photo, visually only, so centring math is untouched. */
.inside .carousel-slide:not(.is-active){margin:0}
.inside .carousel-slide.is-active ~ .carousel-slide{transform:scale(.72) translateX(-70px)}
.inside .carousel-slide:not(.is-active):has(~ .carousel-slide.is-active){transform:scale(.72) translateX(70px)}
@media(max-width:700px){.inside .carousel-slide.is-active ~ .carousel-slide,.inside .carousel-slide:not(.is-active):has(~ .carousel-slide.is-active){transform:scale(.85)}}

/* 23 October 2026: a dry raking stroke (make_brush.py) that wraps the whole line, with room for spatter. */
.inside-heading .approved-home-headline{padding:22px 34px 22px 26px;margin-left:-26px;max-width:560px}
.inside-heading .approved-home-headline:before{inset:-26px -40px -22px -34px;transform:rotate(-3deg);transform-origin:30% 55%}

.inside-heading .approved-home-headline:before{inset:-30px -44px -26px -40px;transform:rotate(-2.5deg)}

/* 23 October 2026: the homes label matches the neighbourhood label; the heading drops a step. */
.inside-heading .chapter-label{font-size:20px;letter-spacing:.12em}
.inside-heading h2{font-size:clamp(48px,6.4vw,92px)}

/* Three-pass stroke: a touch more height for the stacked passes, nearly level so the passes carry the angle. */
.inside-heading .approved-home-headline:before{inset:-34px -44px -30px -40px;transform:rotate(-1.5deg)}

/* 23 October 2026: feature tiles in the brush stroke's light Sea Glass instead of white, no shadow. */
.feature-tile{background:rgba(169,187,183,.34);box-shadow:none}
.feature-tile svg{color:var(--pine)}
.feature-tile h3{color:var(--harbour)}
.feature-tile p{color:#3d4a48}

/* 23 October 2026: diagonal block stroke. The angle lives in the SVG now, so the box is level and taller. */
.inside-heading .approved-home-headline{padding:30px 40px 30px 34px;margin-left:-34px;max-width:580px}
.inside-heading .approved-home-headline:before{inset:-70px -80px -66px -90px;transform:none;background-size:100% 100%}

.inside-heading .approved-home-headline:before{inset:-60px -70px -56px -80px}

.inside-heading .approved-home-headline:before{inset:-62px -40px -58px -110px}

/* 23 October 2026: a bottom-to-top entrance, used by the feature tiles. */
[data-enter="up"]{transform:translate3d(0,56px,0)}
/* The plan explorer, rebalanced: a smaller heading, the sheet filling its column, both columns starting level. */
.plan-section .section-heading h2{font-size:clamp(44px,5.4vw,78px)}
.plan-section .section-heading{margin-bottom:48px}
.plan-explorer{gap:72px;align-items:start}
.plan-main{display:flex;flex-direction:column;align-items:stretch}
.plan-main .view-switch{align-self:flex-start;margin-bottom:22px}
.plan-preview{width:100%;display:block}
.plan-preview img{width:100%;height:auto;display:block}
.plan-tools{justify-content:flex-start}

/* 23 October 2026: carousel captions sit centred directly under their photograph. */
.carousel-slide figcaption{display:block;width:100%;text-align:center;margin:12px 0 0;padding:0}

.carousel-slide figcaption{max-width:none}

/* 23 October 2026: back to the painted dab. A gentler box around the two lines, barely tilted. */
.inside-heading .approved-home-headline{padding:22px 30px 22px 26px;margin-left:-26px;max-width:560px}
.inside-heading .approved-home-headline:before{inset:-22px -40px -18px -34px;transform:rotate(-2deg);transform-origin:40% 50%}

.inside-heading .approved-home-headline:before{inset:-34px -44px -30px -40px}

/* 23 October 2026: the heading lives in the left column, level with the top of the plan card, and the button sits on the card's bottom edge. */
.plan-explorer{align-items:stretch}
.plan-sidebar{display:flex;flex-direction:column}
.plan-sidebar .plan-heading{margin:0 0 44px;font-size:clamp(44px,5.4vw,78px);line-height:1.03;max-width:none}
.plan-sidebar .fine{margin-bottom:28px}
.plan-sidebar #plan-register{margin-top:auto}
@media(max-width:850px){.plan-sidebar #plan-register{margin-top:8px}.plan-sidebar .plan-heading{margin-bottom:32px}}

/* 23 October 2026: more air between the homes heading and the carousel. */
.inside .inside-heading{margin-bottom:92px}
/* Tile contents carry the entrance; the tile itself keeps its layout. */
.feature-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:inherit}
.feature-inner svg{width:42px;height:42px;color:var(--pine);margin-bottom:14px}
/* The plan sheet centred in its card, both ways. */
.plan-main{justify-content:center;align-items:center}
.plan-main .view-switch{align-self:center;margin-bottom:0}
.plan-preview{margin:auto 0;width:100%;max-width:760px}
.plan-tools{justify-content:center;align-self:center}
@media(max-width:850px){.plan-preview{margin:20px 0}}

/* 23 October 2026: the plan specs sit on a frosted panel so the figures read cleanly on Sea Glass. */
.plan-sidebar .plan-info{background:rgba(255,255,255,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.6);border-radius:10px;padding:26px 28px 22px;margin-bottom:28px}
.plan-sidebar .plan-info dl{margin:0}
.plan-sidebar .plan-info dt,.plan-sidebar .plan-info dd{color:var(--harbour)}
.plan-sidebar .plan-info div{border-color:rgba(49,75,89,.14)}
@media(max-width:700px){.plan-sidebar .plan-info{padding:20px 18px 16px}}

/* 23 October 2026: the rooftop chapter matches the others. An AMENITIES label over a full-size heading,
   the photo keeps its title in Ivory, and the description of each scene moves to the numbered steps
   below, set like a process row: number, small-caps label, a line of copy. */
.rooftop-track{padding-top:0;padding-bottom:0}
.rooftop-bar{align-items:flex-end;gap:40px;margin-bottom:36px}
.rooftop-bar .rooftop-heading{display:flex;flex-direction:column;gap:14px}
.rooftop-bar .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--harbour);margin:0;font-family:'Instrument Sans',sans-serif;font-weight:600}
.rooftop-bar h2{font:400 clamp(48px,6.4vw,92px)/1.03 Italiana,serif;color:var(--harbour);margin:0;max-width:none}
.rooftop-bar .text-link{margin-bottom:10px}
.motion-desktop .rooftop-stage{padding:40px 0 24px;min-height:720px}
/* Titles on the photographs read in Ivory over the shade; the paragraph is only shown on phones. */
.roof-scene-copy h2{color:var(--ivory)}
.roof-scene-copy p{color:var(--ivory)}
.motion-desktop .roof-scene-copy p{display:none}
.roof-credit{color:var(--ivory)}
/* The step row. */
.motion-desktop .scene-controls{grid-template-columns:repeat(4,1fr);gap:36px;margin-top:28px}
.scene-controls button{flex-direction:column;align-items:flex-start;gap:0;color:var(--harbour);border-top:1px solid rgba(49,75,89,.22);padding:18px 0 4px;min-height:0;text-align:left}
.scene-controls button[aria-pressed=true]{border-top:3px solid var(--brass);padding-top:16px}
.scene-controls button .step-n{font:400 56px/1 Italiana,serif;color:var(--harbour);margin-bottom:12px}
.scene-controls button .step-l{font:600 12px/1.3 'Instrument Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--harbour);margin-bottom:10px}
.scene-controls button .step-d{font:400 15px/1.5 'Instrument Sans',sans-serif;color:#4a4336;max-width:280px;letter-spacing:0;text-transform:none}
.scene-controls button:hover .step-l{color:var(--pine)}
@media(max-width:999px){.rooftop-track{padding:70px 20px 40px}.rooftop-bar{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-bottom:36px}.rooftop-bar h2{font-size:48px}.roof-scene-copy h2,.roof-scene-copy p,.roof-credit{color:var(--harbour)}}


.scene-controls button>span.step-n{font-size:56px;margin-bottom:12px}
.scene-controls button>span.step-l{font-size:12px}

/* 23 October 2026: rooftop chapter, second pass. More air above the label, a quieter heading so the sticky stage
   has room, the renderings a little shorter, and the step row larger and centred, like the process-row reference. */
.motion-desktop .rooftop-stage{padding-top:96px}
.rooftop-bar{margin-bottom:32px}
.rooftop-bar h2{font-size:clamp(40px,4.6vw,66px)}
.motion-desktop .roof-scenes{max-height:min(50vh,500px)}
.motion-desktop .scene-controls{margin-top:34px;gap:40px}
.scene-controls button{align-items:center;text-align:center;padding:22px 0 6px}
.scene-controls button[aria-pressed=true]{padding-top:20px}
.scene-controls button>span.step-n{font-size:66px;margin-bottom:14px}
.scene-controls button>span.step-l{font-size:13px;margin-bottom:12px}
.scene-controls button .step-d{font-size:17px;line-height:1.5;max-width:300px}
/* The aerial opens on the garden and pergola rather than the street to the left. */
.roof-scene[data-scene="0"]>img{object-position:68% 62%;transform:scale(1.28);transform-origin:68% 62%}

/* Fit the whole stage within a 1000px-tall viewport. */
.motion-desktop .rooftop-stage{padding-top:72px}
.rooftop-bar{margin-bottom:26px}
.motion-desktop .scene-controls{margin-top:26px;gap:32px}
.scene-controls button>span.step-n{font-size:56px;margin-bottom:12px}
.scene-controls button .step-d{font-size:16px}

/* 23 October 2026: the hand-run marker (brush-stroke.svg) sits exactly on the paragraph box, one run per line, wiping in as before. */
.inside-heading .approved-home-headline{width:fit-content;max-width:560px;padding:10px 26px 10px 22px;margin-left:-22px;line-height:1.25}
.inside-heading .approved-home-headline:before{inset:0;transform:none;background-size:100% 100%}
@media(max-width:850px){.inside-heading .approved-home-headline{margin-left:0;padding:8px 18px}}

.inside-heading .approved-home-headline{max-width:500px}

/* Looser crop on the aerial: more of the roof top to bottom, the street still just out of frame. */
.roof-scene[data-scene="0"]>img{object-position:64% 56%;transform:scale(1.1);transform-origin:64% 56%}

/* On small screens the line wraps to four, so the marker repeats per line instead of stretching the two runs. */
@media(max-width:850px){.inside-heading .approved-home-headline:before{inset:8px 0;background-image:linear-gradient(transparent 7%,rgba(169,187,183,.66) 7%,rgba(169,187,183,.66) 93%,transparent 93%);background-size:100% 1.25em;background-repeat:repeat-y}}

/* No zoom on the aerial: the full rendering, only shifted right so the street edge drops off the left. */
.roof-scene[data-scene="0"]>img{transform:none;object-position:75% 50%}

/* 23 October 2026: the heading sits above the sticky stage in normal flow, so the stage holds only the
   photographs and the step row and the renderings can run much taller. */
.motion-desktop .rooftop-track{padding-top:110px}
.rooftop-bar{margin-bottom:40px}
.rooftop-bar h2{font-size:clamp(48px,6.4vw,92px)}
.motion-desktop .rooftop-stage{padding-top:16px;min-height:0}
.motion-desktop .roof-scenes{max-height:none}
@media(max-width:999px){.rooftop-track{padding-top:90px}}

/* The aerial levelled: a hair of clockwise rotation squares the near parapet to the frame, and the scene
   is nudged so that parapet sits on the bottom edge of the box. */
.roof-scene[data-scene="0"]>img{object-position:70% 50%;transform:rotate(1.6deg) scale(1.1) translateY(3%);transform-origin:50% 100%}

/* 23 October 2026: scene titles move to the right of the photograph, the shade flips to match, and the
   closing inset of the loungers sits bottom-left so the final frame reads inset left, words right. */
.motion-desktop .roof-scene-copy{left:auto;right:5%;text-align:right;max-width:620px}
.motion-desktop .roof-shade{background:linear-gradient(270deg,rgba(18,37,45,.78),rgba(18,37,45,.08) 80%)}
.motion-desktop .roof-credit{left:auto;right:5%;text-align:right}
.motion-desktop .roof-detail{right:auto;left:3%}

/* 23 October 2026: the rooftop heading a step smaller and entering from the right; the photo shade is
   only a pool in the bottom-right corner behind the title, not a band down the whole side. */
.rooftop-bar h2{font-size:clamp(44px,5.4vw,78px)}
.motion-desktop .roof-shade,.roof-shade{background:radial-gradient(ellipse 58% 70% at 100% 100%,rgba(18,37,45,.74) 0,rgba(18,37,45,.42) 38%,rgba(18,37,45,0) 100%)}

/* 23 October 2026: a light frame around the active carousel photograph. */
.carousel-slide.is-active .image-button{border:1px solid rgba(49,75,89,.18);padding:6px;background:#fff;border-radius:6px;box-sizing:border-box}
.carousel-slide.is-active .image-button img{border-radius:3px;display:block}
.carousel-slide .image-button{transition:border-color .5s var(--ease),padding .5s var(--ease)}

/* 23 October 2026: the step row as four boxed cells, hairline ruled on every side, each closer to square. */
.motion-desktop .scene-controls{gap:0;margin-top:26px;border:1px solid rgba(49,75,89,.22);border-top:0}
.scene-controls button{border-top:1px solid rgba(49,75,89,.22);border-right:1px solid rgba(49,75,89,.22);padding:30px 26px 28px;min-height:224px;justify-content:flex-start}
.scene-controls button:last-child{border-right:0}
.scene-controls button[aria-pressed=true]{border-top:3px solid var(--brass);padding-top:28px;background:rgba(169,187,183,.18)}
.scene-controls button>span.step-n{font-size:52px;margin-bottom:14px}
.scene-controls button .step-d{max-width:280px}

/* 23 October 2026: the plan specs panel sits closer to the Sea Glass behind it: a lighter tint, no blur. */
.plan-sidebar .plan-info{background:rgba(255,255,255,.22);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid rgba(255,255,255,.35)}

/* 23 October 2026: the five-oak story, made compact. Numeral left; label, heading, copy and counts
   right-aligned on the right, the heading entering from the right; beneath, the day rendering and the
   watercolour elevation side by side at a modest size. */
.oak-story{grid-template-columns:.7fr 1.3fr;gap:28px 6vw;align-items:start;padding-top:96px;padding-bottom:96px}
.oak-number{font-size:clamp(150px,19vw,280px);line-height:.8;text-align:left;align-self:start;margin-top:-10px}
.oak-story .oak-copy{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.oak-story .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--ivory);margin:0 0 14px}
.oak-story h2{font-size:clamp(44px,5.4vw,78px);line-height:1.03;max-width:none;margin:0}
.oak-story p{font-size:18px;max-width:560px;margin-top:24px}
.oak-counts{justify-content:flex-end;gap:48px;margin-top:28px}
.oak-counts strong{font-size:64px}
.oak-counts span{text-align:left}
.oak-story .fine{text-align:right}
.oak-story .oak-exterior{grid-column:1;margin-top:40px}
.oak-story .oak-elevation{grid-column:2;margin-top:40px}
.oak-story .oak-exterior img{aspect-ratio:1.6;object-fit:cover;max-height:360px;width:100%}
.oak-story .oak-elevation img{object-position:center 40%}
.oak-story .oak-exterior figcaption{color:var(--ivory);opacity:.85;font-size:12px;margin-top:10px}
@media(max-width:850px){.oak-story{display:block}.oak-number{font-size:180px;margin:0 0 20px}.oak-story .oak-copy{text-align:left;align-items:flex-start}.oak-counts{justify-content:flex-start}.oak-story .fine{text-align:left}.oak-story .oak-exterior,.oak-story .oak-elevation{margin-top:28px}}


/* Equal columns so the two exterior views sit as a matched pair. */
.oak-story{grid-template-columns:1fr 1fr}
.oak-story .oak-exterior img{height:340px;max-height:340px;aspect-ratio:auto}

.rooftop-bar>div:last-child .text-link{margin-bottom:10px}

/* Tighter on the rooftop itself: parapet on the bottom edge, the street reduced to a sliver at top left. */
.roof-scene[data-scene="0"]>img{transform:rotate(1.6deg) scale(1.3) translate(2%,1.5%);transform-origin:50% 100%}

/* Aerial crop eased back a step. */
.roof-scene[data-scene="0"]>img{transform:rotate(1.6deg) scale(1.2) translate(1.5%,1.5%)}

/* Looser again, framed so the right edge hugs the gardener at the far planter. */
.roof-scene[data-scene="0"]>img{transform:rotate(1.6deg) scale(1.08) translate(-3%,1.5%)}

/* 23 October 2026: five-oak story, third pass. The numeral sits beside the right-aligned text block;
   the watercolour elevation is the feature image, full width; the day rendering is a small framed
   inset overlapping its top-right corner, mostly outside the picture so the watercolour stays whole. */
.oak-story{grid-template-columns:1fr auto;gap:0 48px;align-items:start}
.oak-number{grid-column:1;justify-self:end;font-size:clamp(150px,19vw,280px);margin-top:-24px}
.oak-story .oak-copy{grid-column:2;max-width:640px}
.oak-story .oak-visual{grid-column:1/-1;position:relative;margin-top:56px;z-index:1}
.oak-story .oak-elevation{margin:0}
.oak-story .oak-elevation img{width:100%;height:auto;max-height:560px;object-fit:cover;object-position:center 60%;aspect-ratio:auto;display:block}
.oak-story .oak-elevation figcaption{color:var(--ivory);opacity:.85;font-size:12px;margin-top:10px}
.oak-story .oak-inset{position:absolute;top:-44px;right:-18px;width:min(27%,360px);margin:0;background:var(--ivory);padding:8px 8px 10px;border-radius:8px;box-shadow:0 18px 40px rgba(18,37,45,.28);transform:rotate(1.5deg)}
.oak-story .oak-inset img{aspect-ratio:1.2;object-fit:cover;object-position:60% 45%;width:100%;height:auto;max-height:none;display:block;border-radius:4px}
.oak-story .oak-inset figcaption{color:var(--harbour);font-size:12px;margin:8px 2px 0;opacity:1}
@media(max-width:850px){.oak-story{display:block}.oak-number{margin:0 0 20px}.oak-story .oak-visual{margin-top:36px}.oak-story .oak-inset{position:static;width:70%;margin:18px auto 0;transform:none}}


/* Chrome gives lazy images with sizes=auto a 300x150 size containment; pin this one's ratio so it lays out at full height. */
.oak-story .oak-elevation img{contain:none;aspect-ratio:2000/858;height:auto;max-height:560px}
.oak-story .oak-inset{width:min(22%,300px);top:-40px;right:-14px}

.oak-story .oak-elevation img{max-height:480px}

/* 23 October 2026: the whole watercolour, uncropped, shrunk into the left column beside the text; the 5 and the
   right-aligned text block fill the right; the small framed rendering still overlaps the watercolour's top-right corner. */
.oak-story{grid-template-columns:minmax(0,1.05fr) auto minmax(0,.95fr);gap:0 36px;align-items:center}
.oak-story .oak-visual{grid-column:1;grid-row:1;margin-top:0;align-self:center;padding-top:36px}
.oak-number{grid-column:2;grid-row:1;justify-self:end;align-self:start;margin-top:-16px}
.oak-story .oak-copy{grid-column:3;grid-row:1;align-self:start}
.oak-story .oak-elevation img{object-fit:contain;height:auto;max-height:none;aspect-ratio:2000/858;width:100%}
.oak-story .oak-inset{width:min(34%,300px);top:-6px;right:-28px}
@media(max-width:850px){.oak-story{display:block}.oak-story .oak-visual{padding-top:0;margin-top:36px}}

.oak-story .oak-inset{top:-56px;right:-44px;width:min(32%,280px)}

/* 23 October 2026: the 5 becomes a faded numeral behind the text on the right; the watercolour takes the extra room. */
.oak-story{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0 56px}
.oak-story .oak-visual{grid-column:1;grid-row:1}
.oak-story .oak-copy{grid-column:2;grid-row:1;position:relative;z-index:1}
.oak-number{position:absolute;right:calc(var(--gutter) - 20px);top:34px;font-size:clamp(260px,30vw,460px);line-height:.8;color:var(--ivory);opacity:.12;z-index:0;pointer-events:none;justify-self:auto;margin:0}
.oak-story .oak-inset{top:-48px;right:-40px;width:min(28%,280px)}
/* Air between the rooftop step row and the Pine chapter. */
.motion-desktop .rooftop-track{margin-bottom:84px}
@media(max-width:999px){.rooftop-track{padding-bottom:84px}}
@media(max-width:850px){.oak-number{position:static;opacity:1;color:var(--sea-glass);font-size:180px;margin:0 0 20px}}

.oak-number{z-index:1;opacity:.16}
.oak-story .oak-copy{z-index:2}

/* 23 October 2026: a narrower text column so the watercolour grows; the inset sits off the corner, touching it by a sliver. */
.oak-story{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:0 48px}
.oak-story .oak-copy{max-width:520px;justify-self:end}
.oak-story p{font-size:17px;max-width:480px}
.oak-story .oak-visual{padding-top:56px;padding-right:56px}
.oak-story .oak-inset{top:-24px;right:-28px;width:min(26%,250px);transform:rotate(2.5deg)}

/* The inset pinned on the watercolour's corner, half in and half out, a touch smaller. */
.oak-story .oak-visual{padding-top:100px;padding-right:0}
.oak-story .oak-inset{top:0;right:-96px;width:200px;transform:rotate(2.5deg)}
.oak-story{gap:0 120px}

/* The faded 5 drops below the copy, sitting between the picture and the counts rather than behind the words. */
.oak-number{top:auto;bottom:-36px;right:calc(var(--gutter) + 250px);font-size:clamp(200px,20vw,320px);line-height:.8}

/* The faded 5 sits in the gap between the watercolour and the text, level with the copy and the counts. */
.oak-number{left:55%;right:auto;top:120px;bottom:auto;font-size:clamp(200px,19vw,300px)}

/* Position the 5 against the whole chapter, not the text column, so it lands in the gap beside the watercolour. */
.oak-number{grid-column:1/-1;grid-row:1;left:56%;top:130px}

/* The 5 as sketched: tall, standing just left of the text block, its right edge brushing the start of the copy. */
.oak-number{left:69%;top:104px;font-size:clamp(300px,24vw,400px);line-height:.8}

.oak-number{top:150px}

/* 23 October 2026: the 5 at chapter height, fainter, the text block sitting inside it. */
.oak-number{font-size:clamp(420px,42vw,680px);top:36px;left:63%;opacity:.11}

.oak-number{top:16px}

/* 23 October 2026: the shore chapter opens like the homes chapter. One-line heading at chapter scale entering from the
   left; the line on the right in Italiana on the painted swatch, entering from the right, the swatch wiping right to left. */
.shore .section-heading{align-items:flex-start}
.shore .section-heading h2{white-space:nowrap;font-size:clamp(48px,6.4vw,92px);max-width:none}
.shore .section-heading>div{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.shore .shore-line{position:relative;isolation:isolate;font-family:'Italiana',serif;font-size:clamp(24px,2.1vw,30px);line-height:1.25;-webkit-text-stroke:.55px currentColor;paint-order:stroke fill;letter-spacing:.01em;color:var(--harbour);max-width:560px;padding:22px 26px 22px 30px;margin:0 -26px 0 0}
.shore .shore-line:before{content:'';position:absolute;inset:-34px -40px -30px -44px;z-index:-1;pointer-events:none;background:url('/brush-stroke.svg') no-repeat;background-size:100% 100%;transform:rotate(2deg);transform-origin:60% 50%;clip-path:inset(0 0 0 100%);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1) .35s}
.shore .shore-line.entered:before{clip-path:inset(0 0 0 0)}
.shore .section-heading .text-link{margin-top:22px}
@media(prefers-reduced-motion:reduce){.shore .shore-line:before{clip-path:none;transition:none}}
@media(max-width:850px){.shore .section-heading h2{white-space:normal}.shore .section-heading>div{align-items:flex-start;text-align:left}.shore .shore-line{margin:0;padding:14px 16px}}

/* 23 October 2026: the swatch hugs the words on both chapters. */
.shore .shore-line,.inside-heading .approved-home-headline{padding:12px 18px 12px 18px}
.shore .shore-line{margin:0 -18px 0 0}
.inside-heading .approved-home-headline{margin-left:-18px;max-width:520px}
.shore .shore-line:before,.inside-heading .approved-home-headline:before{inset:-6px -10px -4px -10px;transform:rotate(-1deg)}
.shore .shore-line:before{transform:rotate(1deg)}

/* 23 October 2026: the traced hills before the closing. The front hill is the closing's Harbour, so the two join without a seam. */
.hills{display:block;background:var(--ivory);line-height:0;margin-top:-1px}
.hills svg{display:block;width:100%;height:clamp(90px,12vw,190px)}
.hills+.closing{margin-top:-1px}

/* 23 October 2026: the page-end rule. A dotted Harbour line, the same dots as the walk-time trail, with a small Brass
   mark at its centre, sitting on the Ivory just above the closing on every page. The hills divider is retired. */
.hills{display:none}
.page-end{position:relative;height:1px;margin:0 auto;width:min(62%,900px);padding:56px 0 64px;background:none}
.page-end:before{content:'';position:absolute;left:0;right:0;top:56px;height:0;border-top:2px dotted rgba(49,75,89,.55)}
.page-end-mark{position:absolute;left:50%;top:56px;width:10px;height:10px;margin:-4px 0 0 -5px;border-radius:50%;background:var(--ivory);box-shadow:0 0 0 2px var(--brass) inset}
@media(max-width:700px){.page-end{width:70%;padding:40px 0 44px}.page-end:before,.page-end-mark{top:40px}}

/* 23 October 2026: page-end mark and hills both retired; the closing starts on its plain straight edge. */
.page-end{display:none}

/* 23 October 2026: the closing's two halves sit together in the middle of wide screens instead of hugging the gutters. */
@media(min-width:1001px){.closing{grid-template-columns:minmax(0,600px) minmax(0,680px);justify-content:center;column-gap:clamp(64px,7vw,130px)}.closing:before{right:auto;left:50%;width:50vw}}

@media(min-width:1001px){.closing{grid-template-columns:minmax(0,540px) minmax(0,640px);column-gap:clamp(48px,5vw,96px)}.closing-image{width:100%}}

/* 23 October 2026: the reduce-motion button is hidden; the site still honours the operating system's reduce-motion setting. */
#motion-toggle{display:none!important}

/* 23 October 2026: the neighbourhood page opens on a sketchbook spread. Two watercolour plates on the Ivory page,
   the pier large at the left and the Shipyards smaller, lower and overlapping its corner at the right, each on a
   thin white mat with a soft shadow and an Italiana caption, the same mounted-print language as the polaroids. */
.neighbour-intro{padding-bottom:40px}
.sketchbook{position:relative;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:0 0;align-items:start;padding:20px var(--gutter) 110px}
.sketch-plate{position:relative;margin:0;z-index:1}
.sketch-plate figure{margin:0;background:#fff;padding:12px 12px 14px;border-radius:6px;box-shadow:0 22px 50px rgba(49,75,89,.16)}
.sketch-plate .image-button{border-radius:3px}
.sketch-plate img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;border-radius:3px}
.sketch-plate figcaption{display:none}
.sketch-pier{grid-column:1;grid-row:1}
.sketch-shipyards{grid-column:2;grid-row:1;margin:120px 0 0 -9%;z-index:2}
.sketch-pier figure{transform:rotate(-1deg);transform-origin:50% 100%}
.sketch-shipyards figure{transform:rotate(1.4deg);transform-origin:0 0}
.sketch-caption{display:flex;flex-direction:column;gap:6px;margin:18px 6px 0}
.sketch-caption span:first-child{font:400 24px/1.15 Italiana,serif;color:var(--harbour)}
.sketch-caption .sketch-time{font:600 12px/1.3 'Instrument Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--pine)}
.sketch-note{position:absolute;right:var(--gutter);bottom:54px;margin:0;font:400 15px/1.3 Italiana,serif;letter-spacing:.04em;color:rgba(49,75,89,.55)}
@media(max-width:850px){.sketchbook{display:block;padding:10px 20px 70px}.sketch-shipyards{margin:28px 0 0 10%;width:88%}.sketch-note{position:static;margin-top:30px;text-align:right}}


/* 23 October 2026: neighbourhood opening, second pass. */
.sketchbook{display:none}
.neighbour-intro{display:none}
/* Full-bleed watercolour hero; the headline sits in the painting's sky. */
.nbhd-hero{position:relative;min-height:min(92vh,900px);overflow:hidden;background:#dfe9f0;isolation:isolate}
.nbhd-hero .nbhd-hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 68%;z-index:0}
.nbhd-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(240,237,229,.55) 0,rgba(240,237,229,.18) 36%,rgba(240,237,229,0) 60%);z-index:1;pointer-events:none}
.nbhd-hero-copy{position:relative;z-index:2;padding:clamp(70px,9vh,120px) var(--gutter) 0;max-width:880px}
.nbhd-hero-copy .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--harbour);margin:0 0 16px}
.nbhd-hero-copy h1{font:400 clamp(56px,7.4vw,112px)/1 Italiana,serif;color:var(--harbour);margin:0;max-width:none}
.nbhd-hero-line{font:400 clamp(20px,1.8vw,26px)/1.3 Italiana,serif;color:var(--harbour);margin:26px 0 0;max-width:520px;-webkit-text-stroke:.4px currentColor;paint-order:stroke fill}
.nbhd-hero-credit{position:absolute;right:var(--gutter);bottom:22px;z-index:2;margin:0;font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(49,75,89,.7)}
/* The walk ledger: one dotted line, six stops, read left to right. */
.nbhd-ledger{padding:54px var(--gutter) 64px;background:var(--ivory)}
.ledger-title{font:600 12px/1 'Instrument Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--pine);margin:0 0 30px}
.nbhd-ledger ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);position:relative}
.nbhd-ledger ul:before{content:'';position:absolute;left:6px;right:6px;top:6px;border-top:2px dotted rgba(49,75,89,.5)}
.nbhd-ledger li{position:relative;padding:26px 18px 0 0}
.ledger-pin{position:absolute;left:0;top:0;width:12px;height:12px;border-radius:50%;background:var(--ivory);box-shadow:0 0 0 2px var(--pine) inset}
.nbhd-ledger li:first-child .ledger-pin{background:var(--brass);box-shadow:none}
.ledger-place{display:block;font:400 22px/1.15 Italiana,serif;color:var(--harbour)}
.ledger-time{display:block;margin-top:6px;font:600 12px/1.3 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#4a4336}
/* The Shipyards plate on Sea Glass with the page's line beside it. */
.nbhd-plate{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0 clamp(48px,6vw,110px);align-items:center;padding:110px var(--gutter)}
.nbhd-plate-art figure{margin:0;background:#fff;padding:12px 12px 14px;border-radius:6px;box-shadow:0 22px 50px rgba(49,75,89,.18);transform:rotate(-1.2deg)}
.nbhd-plate-art img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;border-radius:3px}
.nbhd-plate-art figcaption{display:block;margin:12px 4px 0;font:400 18px/1.2 Italiana,serif;color:var(--harbour)}
.nbhd-plate-copy .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--harbour);margin:0 0 18px}
.nbhd-plate-copy h2{font:400 clamp(38px,3.9vw,60px)/1.06 Italiana,serif;color:var(--harbour);margin:0;max-width:none}
.nbhd-plate-copy p:not(.chapter-label){font-size:18px;line-height:1.55;color:#2f3a40;max-width:460px;margin:26px 0 0}
.nbhd-plate-copy .text-link{margin-top:26px}
@media(max-width:999px){.nbhd-ledger ul{grid-template-columns:repeat(3,1fr);row-gap:34px}.nbhd-ledger ul:before{display:none}.nbhd-ledger li{padding-top:0;padding-left:22px}.ledger-pin{top:7px}}
@media(max-width:850px){.nbhd-hero{min-height:72vh}.nbhd-hero-copy{padding-top:56px}.nbhd-plate{display:block;padding:70px 20px}.nbhd-plate-copy{margin-top:40px}}
@media(max-width:700px){.nbhd-ledger ul{grid-template-columns:repeat(2,1fr)}}


/* 23 October 2026: neighbourhood opening, third pass. A split opening: the walk-time headline left with the three numbers
   beneath it; the pier watercolour right as a tall mounted plate on a Sea Glass block, running to the page edge. */
.nbhd-hero{display:none}
.nbhd-open{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:0 clamp(40px,5vw,90px);align-items:center;padding:96px 0 90px var(--gutter);overflow:hidden}
.nbhd-open-copy .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--harbour);margin:0 0 22px}
.nbhd-open-copy h1{font:400 clamp(56px,6.6vw,100px)/1 Italiana,serif;color:var(--harbour);margin:0;max-width:none}
.nbhd-open-line{font:400 clamp(21px,1.9vw,27px)/1.35 Italiana,serif;color:var(--harbour);margin:30px 0 0;max-width:520px;-webkit-text-stroke:.4px currentColor;paint-order:stroke fill}
.nbhd-open-copy .text-link{margin-top:34px}
.nbhd-open-art{position:relative;padding:34px 0 0 34px}
.nbhd-open-art:before{content:'';position:absolute;left:0;top:0;right:-40vw;bottom:34px;background:var(--sea-glass);z-index:0}
.nbhd-open-art figure{position:relative;z-index:1;margin:0;background:#fff;padding:12px 12px 12px;border-radius:5px;box-shadow:0 26px 60px rgba(49,75,89,.2)}
.nbhd-open-art img{width:100%;height:auto;aspect-ratio:1.22;object-fit:cover;object-position:50% 62%;display:block;border-radius:3px}
.nbhd-open-art figcaption{display:none}
.nbhd-open-credit{position:relative;z-index:1;margin:16px 0 0 4px;font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--pine)}
@media(max-width:850px){.nbhd-open{display:block;padding:60px 20px 60px}.nbhd-open-art{margin-top:40px;padding:20px 0 0 20px}.nbhd-open-art:before{right:-20px;bottom:30px}}

.nbhd-open-copy h1{font-size:clamp(50px,5.5vw,86px);white-space:nowrap}
@media(max-width:850px){.nbhd-open-copy h1{white-space:normal}}

/* 23 October 2026: the opening's painting sits centred on a full-height Sea Glass panel that runs to the page edge, so the
   screen reads as two halves, words on Ivory and the painting on colour, rather than a plate floating off balance. */
.nbhd-open{align-items:stretch;padding-top:0;padding-bottom:0}
.nbhd-open-copy{align-self:center;padding:96px 0 90px}
.nbhd-open-art{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:70px 0 70px 64px}
.nbhd-open-art:before{top:0;bottom:0;left:0;right:-40vw}
.nbhd-open-art figure{max-width:640px}
.nbhd-open-art img{aspect-ratio:1.3;object-position:50% 60%}
@media(max-width:850px){.nbhd-open-copy{padding:60px 0 0}.nbhd-open-art{padding:30px 0 40px 20px;margin-top:40px}.nbhd-open-art:before{right:-20px}}

.nbhd-open-line{max-width:none;font-size:clamp(20px,1.6vw,24px)}

/* 23 October 2026: the opening stacked instead of split. Words first, then the painting at full content width,
   mat and panel gone, so nothing competes with the headline and the picture carries its own weight. */
.nbhd-open{display:block;padding:96px var(--gutter) 70px}
.nbhd-open-copy{padding:0;max-width:820px}
.nbhd-open-art{padding:56px 0 0;display:block}
.nbhd-open-art:before{display:none}
.nbhd-open-art figure{max-width:none;background:none;padding:0;border-radius:8px;box-shadow:none;overflow:hidden}
.nbhd-open-art img{aspect-ratio:2.6;object-position:50% 58%;border-radius:8px}
.nbhd-open-credit{margin:14px 0 0 2px}
@media(max-width:850px){.nbhd-open{padding:60px 20px 50px}.nbhd-open-art{padding-top:32px;margin:0}.nbhd-open-art img{aspect-ratio:1.5}}

.nbhd-open-art img{object-position:50% 84%}

/* 23 October 2026: neighbourhood opening, Angela's pick. Harbour band with the headline and a right-set sub-line, the pier
   watercolour as a full-bleed strip, then the walk ledger on Ivory. Earlier passes are retired. */
.nbhd-open{display:none}
.nbhd-band{background:var(--harbour);color:var(--ivory);padding:88px var(--gutter) 70px}
.nbhd-band-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:48px}
.nbhd-band .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--sea-glass);margin:0 0 22px}
.nbhd-band h1{font:400 clamp(56px,6.6vw,100px)/1 Italiana,serif;color:var(--ivory);margin:0;max-width:none}
.nbhd-band-line{font:400 clamp(20px,1.7vw,25px)/1.4 Italiana,serif;color:var(--ivory);margin:0 0 10px;max-width:460px;text-align:left;-webkit-text-stroke:.3px currentColor;paint-order:stroke fill}
.nbhd-strip{background:var(--harbour);line-height:0}
.nbhd-strip-art{width:100%;height:auto;aspect-ratio:3.1;object-fit:cover;object-position:50% 78%;display:block;contain:none}
.nbhd-ledger{padding-top:60px}
@media(max-width:850px){.nbhd-band{padding:60px 20px 50px}.nbhd-band-inner{display:block}.nbhd-band-line{margin-top:24px}.nbhd-strip-art{aspect-ratio:1.6}}

.nbhd-band-line{max-width:none;white-space:nowrap}
@media(max-width:1100px){.nbhd-band-line{white-space:normal;max-width:420px}}

/* 24 October 2026: the opening fits one screen. One-line headline, a tighter band, a shorter strip, so the ledger shows without scrolling. */
.nbhd-band{padding:62px var(--gutter) 48px}
.nbhd-band .chapter-label{margin-bottom:16px}
.nbhd-band h1{font-size:clamp(44px,4.6vw,70px);white-space:nowrap}
.nbhd-strip-art{aspect-ratio:3.6;object-position:50% 80%}
.nbhd-ledger{padding-top:46px;padding-bottom:56px}
.ledger-title{margin-bottom:24px}
@media(max-width:850px){.nbhd-band h1{white-space:normal}.nbhd-strip-art{aspect-ratio:1.6}}

.nbhd-strip-art{aspect-ratio:4}

/* 24 October 2026: the Shipyards chapter heading carries the hairline stroke so it reads on Sea Glass. */
.nbhd-plate-copy h2{-webkit-text-stroke:.8px currentColor;paint-order:stroke fill;letter-spacing:.005em}

/* 24 October 2026: the Shipyards heading sits on a painted Pine swatch (the marker shape, used as a mask) in Ivory, so it
   stands off the Sea Glass band the way the highlighted lines do on the home page. */
.nbhd-plate-copy h2{position:relative;isolation:isolate;display:inline-block;color:var(--ivory);padding:14px 22px 14px 18px;margin-left:-18px;-webkit-text-stroke:.4px currentColor}
.nbhd-plate-copy h2:before{content:'';position:absolute;inset:-6px -12px -4px -10px;z-index:-1;pointer-events:none;background:var(--pine);-webkit-mask:url('/brush-stroke.svg') no-repeat;-webkit-mask-size:100% 100%;mask:url('/brush-stroke.svg') no-repeat;mask-size:100% 100%;transform:rotate(-1deg);transform-origin:40% 50%;clip-path:inset(0 100% 0 0);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1) .35s}
.nbhd-plate-copy.entered h2:before{clip-path:inset(0)}
@media(prefers-reduced-motion:reduce){.nbhd-plate-copy h2:before{clip-path:none;transition:none}}
@media(max-width:850px){.nbhd-plate-copy h2{margin-left:0;padding:12px 14px}}

/* 24 October 2026: Make yourself local carries a three-group directory (Everyday, Getting around, Schools) between the
   heading and the photo strip, set in the ledger's language: Italiana names, small-caps times, dotted rules. */
.local-directory{display:grid;grid-template-columns:repeat(3,1fr);gap:0 64px;margin:56px 0 64px}
.local-group h3{font:600 12px/1 'Instrument Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--pine);margin:0 0 16px;padding-bottom:12px;border-bottom:2px solid var(--pine)}
.local-group ul{list-style:none;margin:0;padding:0}
.local-group li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px dotted rgba(49,75,89,.45)}
.local-group li span:first-child{font:400 21px/1.15 Italiana,serif;color:var(--harbour)}
.local-group li span:last-child{font:600 11px/1.3 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#4a4336;text-align:right;white-space:nowrap}
@media(max-width:850px){.local-directory{grid-template-columns:1fr;gap:36px;margin:40px 0 48px}}

/* 24 October 2026: the map section opens like the home page's shore chapter: one-line heading from the left, the
   Italiana line on the painted swatch from the right. */
.neighbourhood-explorer .section-heading{align-items:flex-start}
.neighbourhood-explorer .section-heading h2{white-space:nowrap;font-size:clamp(48px,6.4vw,92px);max-width:none}
.neighbourhood-explorer .section-heading>div{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.neighbourhood-explorer .shore-line{position:relative;isolation:isolate;font-family:'Italiana',serif;font-size:clamp(24px,2.1vw,30px);line-height:1.25;-webkit-text-stroke:.55px currentColor;paint-order:stroke fill;letter-spacing:.01em;color:var(--harbour);max-width:560px;padding:12px 18px;margin:0 -18px 0 0}
.neighbourhood-explorer .shore-line:before{content:'';position:absolute;inset:-6px -10px -4px -10px;z-index:-1;pointer-events:none;background:url('/brush-stroke.svg') no-repeat;background-size:100% 100%;transform:rotate(1deg);transform-origin:60% 50%;clip-path:inset(0 0 0 100%);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1) .35s}
.neighbourhood-explorer .shore-line.entered:before{clip-path:inset(0)}
.neighbourhood-explorer .map-intro-small{margin-top:22px;max-width:420px}
@media(prefers-reduced-motion:reduce){.neighbourhood-explorer .shore-line:before{clip-path:none;transition:none}}
@media(max-width:850px){.neighbourhood-explorer .section-heading h2{white-space:normal}.neighbourhood-explorer .section-heading>div{align-items:flex-start;text-align:left}.neighbourhood-explorer .shore-line{margin:0;padding:12px 14px}}

/* 24 October 2026: the map section's line keeps the Italiana but drops the swatch. */
.neighbourhood-explorer .shore-line:before{display:none}
.neighbourhood-explorer .shore-line{padding:0;margin:0}

/* 24 October 2026: the places directory reads as a set of tinted cards. Category bars in Sea Glass with Italiana titles,
   rows lighter underneath, the filter as a small outlined pill, so each group stands out from the list. */
.places-directory .directory-groups{display:grid;gap:12px}
.place-group{border:0!important;background:rgba(169,187,183,.22);border-radius:10px;overflow:hidden}
.place-group summary{background:rgba(169,187,183,.55);padding:16px 18px;min-height:60px;font:400 24px/1.1 Italiana,serif;color:var(--harbour);gap:14px}
.place-group summary .category-count{font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;opacity:1;color:var(--pine);background:var(--ivory);padding:7px 10px;border-radius:999px;margin-left:auto}
.place-group summary svg{width:16px;height:16px;color:var(--harbour)}
.place-group[open] summary{background:var(--pine);color:var(--ivory)}
.place-group[open] summary svg{color:var(--ivory)}
.place-group[open] summary .category-count{background:rgba(240,237,229,.18);color:var(--ivory)}
.place-group .category-filter{margin:14px 18px 4px;font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--pine);background:transparent;border:1px solid rgba(83,107,92,.6);border-radius:999px;padding:8px 14px;cursor:pointer}
.place-group .category-filter[aria-pressed=true]{background:var(--pine);color:var(--ivory)}
.place-group ol{margin:0;padding:6px 10px 12px}
.place-entry{border-top:0;border-bottom:1px solid rgba(49,75,89,.14)}
.place-entry:last-child{border-bottom:0}
.place-select{padding:10px 8px;min-height:50px;border-radius:8px}
.place-select:hover{background:rgba(240,237,229,.7)}
.place-number{width:30px!important;height:30px!important;font-size:12px!important}
.place-select .travel-chip{font:600 11px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--pine);opacity:1;gap:6px}
.place-select .travel-chip svg{width:16px;height:16px}
.place-detail{padding:4px 12px 18px 48px}
.directory-head>button{border-radius:8px}

/* Lighter open state: Sea Glass deepens rather than switching to Pine, so a page of open groups stays calm. */
.place-group[open] summary{background:rgba(169,187,183,.85);color:var(--harbour)}
.place-group[open] summary svg{color:var(--harbour)}
.place-group[open] summary .category-count{background:var(--ivory);color:var(--pine)}

/* 24 October 2026: places directory as the ledger (option B). No cards: Italiana titles over a Brass rule, dotted rows
   with the name in Italiana and the time set small-caps at the right. */
.places-directory .directory-groups{gap:26px}
.place-group{background:none;border-radius:0;overflow:visible}
.place-group summary,.place-group[open] summary{background:none;padding:0 0 10px;min-height:0;border-bottom:2px solid var(--brass);font:400 26px/1.1 Italiana,serif;color:var(--harbour);gap:14px}
.place-group summary .category-count,.place-group[open] summary .category-count{background:none;padding:0;color:var(--brass);font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.14em}
.place-group summary .category-count:after{content:' places'}
.place-group summary svg,.place-group[open] summary svg{width:14px;height:14px;color:var(--brass)}
.place-group .category-filter{margin:10px 0 0;padding:0 0 2px;border:0;border-bottom:1px solid rgba(176,141,79,.6);border-radius:0;color:var(--brass);font-size:10px}
.place-group .category-filter[aria-pressed=true]{background:none;color:var(--harbour);border-bottom-color:var(--harbour)}
.place-group ol{padding:4px 0 0}
.place-entry{border-bottom:1px dotted rgba(49,75,89,.45)}
.place-entry:last-child{border-bottom:1px dotted rgba(49,75,89,.45)}
.place-select{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:baseline;padding:11px 0;min-height:0;border-radius:0}
.place-select:hover{background:none}
.place-select:hover .place-number{color:var(--harbour)!important}
.place-number{width:auto!important;height:auto!important;background:none!important;color:var(--brass)!important;font:600 10px/1 'Instrument Sans',sans-serif!important;letter-spacing:.1em;outline:0!important}
.place-entry.is-selected .place-number{color:var(--harbour)!important;outline:0}
.place-select>span:nth-child(2){display:flex;flex-direction:row;align-items:baseline;justify-content:space-between;gap:16px;font:400 20px/1.2 Italiana,serif;color:var(--harbour)}
.is-selected .place-select{font-weight:400}
.is-selected .place-select>span:nth-child(2){-webkit-text-stroke:.5px currentColor}
.place-select .travel-chip{margin:0;white-space:nowrap}
.place-select .travel-chip svg{display:none}
.place-select>svg{display:none}
.place-detail{padding:2px 0 16px 28px}

/* 24 October 2026: places directory as tabs (option C). Category pills across the top, one flat list beneath with a
   colour dot, the category under each name and the time at the right. The ledger rules above are overridden here. */
.directory-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 8px}
.directory-head h3{width:100%;margin-bottom:4px}
.directory-head>button#all-places{width:auto;min-height:0;padding:9px 13px;border-radius:999px;font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;background:transparent;color:var(--harbour);border:1px solid rgba(49,75,89,.4);order:2}
.directory-head>button#all-places[aria-pressed=true]{background:var(--harbour);color:var(--ivory);border-color:var(--harbour)}
.directory-head>button#all-places span{margin-left:6px;opacity:.8}
.directory-head #map-results{width:100%;order:4;font-size:12px;margin:8px 0 0}
.category-pills{display:contents}
.category-pills button{order:3;padding:9px 13px;border-radius:999px;font:600 11px/1 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;background:transparent;color:var(--harbour);border:1px solid rgba(49,75,89,.4);cursor:pointer}
.category-pills button[aria-pressed=true]{background:var(--harbour);color:var(--ivory);border-color:var(--harbour)}
.places-directory .directory-groups{gap:0;margin-top:14px}
.place-group summary,.place-group[open] summary{display:none}
.place-group .category-filter{display:none}
.place-group ol{padding:0}
.place-entry{border-bottom:1px solid rgba(49,75,89,.14)}
.place-entry:last-child{border-bottom:1px solid rgba(49,75,89,.14)}
.place-select{grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:13px 4px}
.place-number{display:none!important}
.place-select:before{content:'';width:10px;height:10px;border-radius:50%;background:var(--slate);display:block}
.place-group[data-category=dining] .place-select:before{background:var(--brass)}
.place-group[data-category=essentials] .place-select:before,.place-group[data-category=fitness] .place-select:before{background:var(--pine)}
.place-group[data-category=parks] .place-select:before,.place-group[data-category=transit] .place-select:before{background:var(--slate)}
.place-group[data-category=health] .place-select:before,.place-group[data-category=arts] .place-select:before{background:var(--harbour)}
.place-group[data-category=schools] .place-select:before{background:var(--sea-glass);box-shadow:0 0 0 1px var(--pine) inset}
.place-select>span:nth-child(2){display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:16px;font:400 16px/1.3 'Instrument Sans',sans-serif;color:var(--harbour);-webkit-text-stroke:0}
.place-select>span:nth-child(2):after{order:-1;display:none}
.place-select>span:nth-child(2)>span.selection-label{display:none}
.place-select .travel-chip{font:600 11px/1.3 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--pine);margin:0}
.is-selected .place-select>span:nth-child(2){font-weight:600;-webkit-text-stroke:0}
.place-detail{padding:2px 0 16px 28px}

/* 24 October 2026: the places directory runs the full height of the map column; its list scrolls inside. */
@media(min-width:1000px){.neighbourhood-tool{align-items:stretch}.places-directory{max-height:none;height:auto;display:flex;flex-direction:column;min-height:0}.places-directory .directory-groups{flex:1;min-height:0;max-height:none;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--slate) transparent;padding-right:6px}}

/* The map column keeps its own height; the directory is sized to it by script (neighbourhood.js). */
@media(min-width:1000px){.neighbourhood-tool{align-items:start}}

/* 24 October 2026: more air under the walk ledger before the Down the hill chapter. */
.nbhd-ledger{padding-bottom:110px}
@media(max-width:850px){.nbhd-ledger{padding-bottom:70px}}

/* 24 October 2026: a little more air above the neighbourhood band's label. */
.nbhd-band{padding-top:84px}
@media(max-width:850px){.nbhd-band{padding-top:70px}}

/* 24 October 2026: the places list and its pills sit smaller, so more of the directory shows beside the map. */
.category-pills button,.directory-head>button#all-places{padding:7px 10px;font-size:10px;letter-spacing:.1em}
.directory-head #map-results{font-size:11px;margin-top:4px}
.places-directory .directory-groups{margin-top:8px}
.place-select{grid-template-columns:10px 1fr auto;gap:10px;padding:8px 2px;min-height:0}
.place-select:before{width:8px;height:8px}
.place-select>span:nth-child(2){font-size:14px;line-height:1.3}
.place-select .travel-chip{font-size:10px;letter-spacing:.1em}
.place-detail{padding:0 0 12px 20px;font-size:12px}
.place-detail .place-address{font-size:11px}

/* 24 October 2026: the directory keeps the category pills on top and, beneath, the Harbour-header white cards (option D):
   each category a dark bar with Italiana title and count, places as numbered rows on a white card. */
.places-directory .directory-groups{display:grid;gap:12px;margin-top:12px}
.place-group{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 10px 30px rgba(49,75,89,.08)}
.place-group summary,.place-group[open] summary{display:flex;align-items:center;gap:12px;background:var(--harbour);color:var(--ivory);padding:11px 14px;min-height:0;border:0;font:400 19px/1.1 Italiana,serif}
.place-group summary .category-count,.place-group[open] summary .category-count{background:rgba(240,237,229,.16);color:var(--ivory);font:600 10px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;padding:6px 9px;border-radius:999px;margin-left:auto}
.place-group summary .category-count:after{content:''}
.place-group summary svg,.place-group[open] summary svg{display:block;width:14px;height:14px;color:var(--ivory)}
.place-group .category-filter{display:none}
.place-group ol{padding:2px 8px 8px}
.place-entry,.place-entry:last-child{border-bottom:1px solid rgba(49,75,89,.1)}
.place-entry:last-child{border-bottom:0}
.place-select{grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:7px 6px}
.place-select:before{display:none}
.place-number{display:grid!important;width:26px!important;height:26px!important;border-radius:50%;background:var(--sea-glass)!important;color:var(--harbour)!important;font:600 11px/1 'Instrument Sans',sans-serif!important;letter-spacing:0;place-items:center}
.place-entry.is-selected .place-number{background:var(--harbour)!important;color:var(--ivory)!important}
.place-select>span:nth-child(2){display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:1px;font:500 14px/1.3 'Instrument Sans',sans-serif;color:var(--harbour)}
.place-select .travel-chip{font-size:10px;letter-spacing:.1em;color:var(--pine);margin:0}
.place-select:hover{background:rgba(169,187,183,.18);border-radius:8px}
.place-detail{padding:0 6px 12px 42px}

/* The card list flows as blocks (a details element inside a grid row was clipping to its summary). */
.places-directory .directory-groups{display:block}
.place-group{margin-bottom:12px}
.place-group:last-child{margin-bottom:0}

/* 24 October 2026: back to the flat list (option C), each place on its own white card so rows read clearly. The category
   name sits under each place; the dot carries the category colour. */
.place-group{background:none;border-radius:0;overflow:visible;box-shadow:none;margin-bottom:0}
.place-group summary,.place-group[open] summary{display:none}
.place-group ol{padding:0}
.place-entry,.place-entry:last-child{border:0;margin:0 0 6px}
.place-select{grid-template-columns:10px 1fr auto;gap:12px;align-items:center;padding:9px 12px;background:#fff;border-radius:8px;box-shadow:0 1px 0 rgba(49,75,89,.06)}
.place-select:hover{background:rgba(169,187,183,.3)}
.place-entry.is-selected .place-select{background:rgba(169,187,183,.45)}
.place-select:before{content:'';display:block;width:8px;height:8px;border-radius:50%}
.place-number{display:none!important}
.place-select>span:nth-child(2){display:flex;flex-direction:column;align-items:flex-start;gap:2px;font:500 14px/1.3 'Instrument Sans',sans-serif;color:var(--harbour)}
.place-select>span:nth-child(2):after{display:block;order:0;font:600 9.5px/1.2 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.place-group[data-category=dining] .place-select>span:nth-child(2):after{content:'Cafés & dining'}
.place-group[data-category=essentials] .place-select>span:nth-child(2):after{content:'Groceries & everyday essentials'}
.place-group[data-category=parks] .place-select>span:nth-child(2):after{content:'Parks & waterfront'}
.place-group[data-category=fitness] .place-select>span:nth-child(2):after{content:'Fitness & recreation'}
.place-group[data-category=health] .place-select>span:nth-child(2):after{content:'Health & services'}
.place-group[data-category=transit] .place-select>span:nth-child(2):after{content:'Transit & connections'}
.place-group[data-category=arts] .place-select>span:nth-child(2):after{content:'Arts & community'}
.place-group[data-category=schools] .place-select>span:nth-child(2):after{content:'Schools'}
.place-select .travel-chip{order:1;font-size:10px;letter-spacing:.1em;color:var(--pine);margin:0}
.place-select>span:nth-child(2) .travel-chip{display:none}
.place-select{grid-template-columns:10px 1fr auto}
.place-detail{padding:4px 12px 12px 34px;background:#fff;border-radius:0 0 8px 8px;margin-top:-6px;margin-bottom:6px}

/* The time sits at the right edge of each card. */
.place-select{position:relative;padding-right:120px}
.place-select>span:nth-child(2) .travel-chip{display:flex;position:absolute;right:12px;top:50%;transform:translateY(-50%);white-space:nowrap}

/* 24 October 2026: the map and the directory share one top edge. The toolbar that held "Back to Five Oaks" no longer
   reserves a strip above the map; the button floats over the map's top-right corner instead, so the map canvas starts
   level with the "Places to know" heading and the two columns read as one balanced block. */
@media(min-width:801px){
.map-toolbar{position:absolute;top:12px;right:12px;z-index:5;padding:0;min-height:0;border:0;gap:0}
.map-toolbar>div:first-child{display:none}
.map-toolbar button{background:#fff;color:var(--harbour);border-radius:999px;padding:8px 14px 8px 11px;min-height:36px;font:600 10.5px/1 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 2px 10px rgba(49,75,89,.14)}
.map-toolbar button:hover{background:var(--harbour);color:var(--ivory)}
.map-toolbar svg{width:16px;height:16px}
}
/* 24 October 2026: the Lonsdale section shows one feature photograph with a filmstrip of small thumbnails beneath;
   a thumbnail swaps the feature in, the feature opens full size. The other photo sections keep their strips. */
.filmstrip{margin-top:8px}
.film-stage{position:relative}
.film-feature{margin:0;position:relative}
.film-feature .image-button{border-radius:var(--radius);display:block;width:100%}
.film-feature img{width:100%;aspect-ratio:21/9;object-fit:cover;display:block}
.film-feature .enlarge{bottom:auto;top:16px;right:16px;left:auto}
.film-feature figcaption{position:absolute;left:0;right:0;bottom:0;padding:70px 34px 28px;color:var(--ivory);background:linear-gradient(0deg,rgba(19,38,45,.72),rgba(19,38,45,0));pointer-events:none;text-align:left;font-style:normal;margin:0}
.film-feature figcaption b{display:block;font:400 clamp(26px,3vw,40px)/1.1 Italiana,serif}
.film-feature figcaption span{display:block;font:500 12px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:8px;opacity:.9}
.film-count{position:absolute;right:34px;bottom:30px;margin:0;color:var(--ivory);font:500 12px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;pointer-events:none}
.film-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:10px;margin-top:14px}
.film-thumb{display:block;padding:0 0 6px;border:0;background:transparent;cursor:pointer;text-align:left;min-height:0;border-radius:0}
.film-thumb img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;display:block;opacity:.6;transition:opacity .3s var(--ease),transform .3s var(--ease)}
.film-thumb:hover img,.film-thumb:focus-visible img{opacity:.9}
.film-thumb[aria-selected=true] img{opacity:1;transform:translateY(-2px)}
.film-thumb[aria-selected=true]{box-shadow:0 3px 0 var(--brass)}
.film-thumb span{display:block;font:500 9.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.06em;text-transform:uppercase;margin-top:7px;color:var(--ivory);opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.film-thumb[aria-selected=true] span{opacity:1}
.film-thumb:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
@media(max-width:700px){
.film-feature img{aspect-ratio:4/3}
.film-feature figcaption{padding:50px 18px 18px}.film-count{right:18px;bottom:20px}
.film-row{display:flex;overflow-x:auto;scrollbar-width:none;gap:8px;padding-bottom:4px}.film-row::-webkit-scrollbar{display:none}
.film-thumb{flex:0 0 22vw}
}
.film-feature figcaption{display:block}

/* 24 October 2026: the Lonsdale section groups its photographs into three themes (option R): a numbered title and a
   paragraph on the left, three small captioned photographs on the right, thin rules between. Photos open full size. */
.themes{margin-top:8px}
.theme{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:center;border-top:1px solid rgba(240,237,229,.22);padding:34px 0 40px}
.theme:last-child{padding-bottom:8px}
.theme-n{display:block;font:400 13px/1 Italiana,serif;color:var(--brass);margin-bottom:12px}
.theme-copy h3{font:400 26px/1.15 Italiana,serif;color:var(--ivory);margin:0 0 12px;-webkit-text-stroke:0}
.theme-copy p{font-size:14px;line-height:1.65;color:rgba(240,237,229,.88);max-width:36ch;margin:0}
.theme-pics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.theme-pic{margin:0}
.theme-pic .image-button{display:block;width:100%;border-radius:6px}
.theme-pic img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block}
.theme-pic figcaption{display:block;margin-top:9px;padding:0;text-align:left;font-style:normal}
.theme-pic figcaption b{display:block;font:400 16px/1.2 Italiana,serif;color:var(--ivory);-webkit-text-stroke:0}
.theme-pic figcaption span{display:block;font:500 9.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:3px;color:rgba(240,237,229,.68)}
@media(max-width:900px){.theme{grid-template-columns:1fr;gap:22px;padding:28px 0 32px}.theme-copy p{max-width:none}}
@media(max-width:700px){.theme-pics{gap:10px}.theme-pic figcaption b{font-size:14px}.theme-pic figcaption span{font-size:8.5px}}
.theme-pic figcaption b,.theme-pic figcaption span{text-align:left}

/* 24 October 2026: the Victoria Park section loses its green band and shows its four photographs as tall panels across the
   width (option W); the one under the cursor opens wider, the others narrow, and each opens full size on tap. */
.park-page{background:var(--ivory)}
.panels{display:flex;gap:10px;height:520px;margin-top:8px}
.panel{flex:1;position:relative;overflow:hidden;border-radius:var(--radius);margin:0;transition:flex .6s var(--ease);background:var(--harbour);min-width:0}
.panel.is-open{flex:2.2}
.panel .image-button{display:block;width:100%;height:100%;border-radius:0}
.panel img{width:100%;height:100%;object-fit:cover;display:block}
.panel .enlarge{bottom:auto;top:14px;right:14px;left:auto;opacity:0;transition:opacity .3s var(--ease)}
.panel.is-open .enlarge{opacity:1}
.panel figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:60px 20px 18px;background:linear-gradient(0deg,rgba(19,38,45,.72),rgba(19,38,45,0));pointer-events:none;display:block;text-align:left;font-style:normal}
.panel figcaption b{display:block;font:400 22px/1.15 Italiana,serif;color:var(--ivory);-webkit-text-stroke:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.panel figcaption span{display:block;font:500 10px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:5px;color:rgba(240,237,229,.85);text-align:left;max-height:0;opacity:0;overflow:hidden;transition:max-height .4s var(--ease),opacity .4s var(--ease)}
.panel.is-open figcaption span{max-height:3em;opacity:1}
.panels-under{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-top:18px;font:500 10.5px/1.5 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
@media(max-width:900px){.panels{height:440px}.panel figcaption b{font-size:18px}.panels-hint{display:none}}
@media(max-width:700px){
.panels{flex-direction:column;height:auto;gap:8px}
.panel,.panel.is-open{flex:none}
.panel img{aspect-ratio:16/10;height:auto}
.panel figcaption span{max-height:3em;opacity:1}
.panel .enlarge{opacity:1}
}
/* The panel caption's gradient must reach the panel's right edge whatever width the panel opens to. */
.panel figcaption{max-width:none;width:auto}

/* 24 October 2026: the water section runs its twelve photographs in a rhythm of scale (option AA): a wide photograph
   across the width, a row of five small ones beneath, then the same again. Every photograph opens full size. */
.panorama{margin-top:8px}
.pano-block{margin-top:44px}.pano-block:first-child{margin-top:0}
.pano-wide{margin:0;position:relative}
.pano-wide .image-button{display:block;width:100%;border-radius:var(--radius)}
.pano-wide img{width:100%;aspect-ratio:21/8;object-fit:cover;border-radius:var(--radius);display:block}
.pano-wide .enlarge{bottom:auto;top:16px;right:16px;left:auto}
.pano-wide figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:70px 30px 24px;max-width:none;width:auto;display:block;text-align:left;font-style:normal;color:var(--ivory);background:linear-gradient(0deg,rgba(19,38,45,.72),rgba(19,38,45,0));border-radius:0 0 var(--radius) var(--radius);pointer-events:none}
.pano-wide figcaption b{display:block;font:400 clamp(24px,2.6vw,32px)/1.1 Italiana,serif;color:var(--ivory);-webkit-text-stroke:0;text-align:left}
.pano-wide figcaption span{display:block;font:500 11px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:6px;color:rgba(240,237,229,.88);text-align:left}
.pano-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:18px}
.pano-small{margin:0}
.pano-small .image-button{display:block;width:100%;border-radius:6px}
.pano-small img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block}
.pano-small figcaption{display:block;margin-top:9px;padding:0;text-align:left;font-style:normal;max-width:none}
.pano-small figcaption b{display:block;font:400 15px/1.2 Italiana,serif;color:var(--harbour);-webkit-text-stroke:0;text-align:left}
.pano-small figcaption span{display:block;font:500 9.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:3px;color:var(--slate);text-align:left}
@media(max-width:900px){.pano-row{grid-template-columns:repeat(3,1fr)}.pano-wide img{aspect-ratio:16/8}}
@media(max-width:700px){
.pano-wide img{aspect-ratio:4/3}.pano-wide figcaption{padding:50px 18px 16px}
.pano-row{grid-template-columns:repeat(2,1fr);gap:12px}
.pano-small figcaption b{font-size:14px}.pano-small figcaption span{font-size:8.5px}
.pano-block{margin-top:34px}
}
/* 24 October 2026: the farther-afield section shows the suspension bridge tall on the left over two rows and the other
   four Lynn Canyon photographs in a two-by-two beside it (option BB). Captions sit over the photos; each opens full size. */
.lead-grid{display:grid;grid-template-columns:1fr 1.1fr 1.1fr;grid-template-rows:1fr 1fr;gap:14px;height:620px;margin-top:8px}
.lead-cell{margin:0;position:relative;overflow:hidden;border-radius:var(--radius);background:var(--harbour);min-width:0}
.lead-cell.is-tall{grid-row:1/3}
.lead-cell .image-button{display:block;width:100%;height:100%;border-radius:0}
.lead-cell img{width:100%;height:100%;object-fit:cover;display:block}
.lead-cell .enlarge{bottom:auto;top:14px;right:14px;left:auto}
.lead-cell figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:50px 18px 16px;max-width:none;width:auto;display:block;text-align:left;font-style:normal;background:linear-gradient(0deg,rgba(19,38,45,.72),rgba(19,38,45,0));pointer-events:none}
.lead-cell figcaption b{display:block;font:400 20px/1.15 Italiana,serif;color:var(--ivory);-webkit-text-stroke:0;text-align:left}
.lead-cell figcaption span{display:block;font:500 9.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:4px;color:rgba(240,237,229,.85);text-align:left}
.strip-section .lead-grid+.fine{margin-top:26px}
@media(max-width:900px){.lead-grid{height:520px}}
@media(max-width:700px){
.lead-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto;height:auto;gap:10px}
.lead-cell.is-tall{grid-column:1/-1;grid-row:auto}.lead-cell.is-tall img{aspect-ratio:4/5;height:auto}
.lead-cell:not(.is-tall) img{aspect-ratio:4/3;height:auto}
.lead-cell figcaption{padding:40px 14px 12px}.lead-cell figcaption b{font-size:17px}.lead-cell figcaption span{font-size:8.5px}
}
@media(max-width:700px){.lead-cell:not(.is-tall) .enlarge{display:none}}

/* 24 October 2026: more air above and below the Down the hill plate so the section breaks more clearly. */
.nbhd-plate{padding-top:170px;padding-bottom:170px}
@media(max-width:850px){.nbhd-plate{padding-top:100px;padding-bottom:100px}}

/* 24 October 2026: the directory shows each place's map number again, inside a circle filled with its category colour,
   so the list carries both the colour and the number the map markers use. The plain dot goes. */
.place-select{grid-template-columns:26px 1fr auto}
.place-select:before{display:none}
.place-number{display:grid!important;width:26px!important;height:26px!important;border-radius:50%;place-items:center;background:var(--slate)!important;color:var(--ivory)!important;font:600 10.5px/1 'Instrument Sans',sans-serif!important;letter-spacing:0;outline:0!important}
.place-group[data-category=dining] .place-number{background:var(--brass)!important}
.place-group[data-category=essentials] .place-number,.place-group[data-category=fitness] .place-number{background:var(--pine)!important}
.place-group[data-category=parks] .place-number,.place-group[data-category=transit] .place-number{background:var(--slate)!important}
.place-group[data-category=health] .place-number,.place-group[data-category=arts] .place-number{background:var(--harbour)!important}
.place-group[data-category=schools] .place-number{background:var(--sea-glass)!important;color:var(--harbour)!important;box-shadow:0 0 0 1px var(--pine) inset}
.place-select:hover .place-number{color:var(--ivory)!important}
.place-group[data-category=schools] .place-select:hover .place-number{color:var(--harbour)!important}
.place-entry.is-selected .place-number{box-shadow:0 0 0 2px var(--ivory),0 0 0 3px var(--harbour)}
.place-detail{padding-left:50px}
/* 24 October 2026: the Homes page room-by-room photographs run as panel slices (as in the park section) instead of
   carousels, taller than the park's. With up to ten rooms in a row the open slice takes a larger share so it stays
   readable, and the closed slices show their room name only when opened. */
.panels.panels-rooms{height:660px;gap:8px;margin-top:8px}
.panels-rooms .panel.is-open{flex:4}
.panels-rooms .panel:not(.is-open) figcaption b{opacity:0;transition:opacity .3s var(--ease)}
.panels-rooms .panel.is-open figcaption b{opacity:1}
.panels-rooms .panel figcaption b{font-size:24px}
@media(max-width:900px){.panels.panels-rooms{height:540px}}
@media(max-width:700px){
.panels.panels-rooms{display:grid;grid-template-columns:1fr 1fr;height:auto;gap:8px}
.panels-rooms .panel,.panels-rooms .panel.is-open{flex:none}
.panels-rooms .panel:first-child{grid-column:1/-1}
.panels-rooms .panel img{aspect-ratio:4/5;height:auto}
.panels-rooms .panel:first-child img{aspect-ratio:4/3}
.panels-rooms .panel figcaption b{opacity:1;font-size:16px;white-space:normal}
.panels-rooms .panel figcaption{padding:40px 12px 12px}
.panels-rooms .panel:not(:first-child) .enlarge{display:none}
}
@media(max-width:700px){.panels-rooms .panel:not(.is-open) figcaption b{opacity:1}}
/* Decorative linework and right-entering cards must never widen the page on phones. */
html,body{overflow-x:clip}

/* 24 October 2026: Unit 607's photographs beside its furnished D1 floor plan (option FF). Each room carries a numbered
   pin; its photographs show the same number. A photo and its pin light together in Brass; each photo opens full size. */
.plan-rooms{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(32px,4.5vw,64px);align-items:center;margin-top:8px;position:relative;z-index:1}
.plan-rooms-plan{margin:0;background:#f7f5ef;border-radius:var(--radius);padding:clamp(14px,1.6vw,22px);box-shadow:0 14px 34px rgba(49,75,89,.1)}
.plan-rooms-map{position:relative}
.plan-rooms-map img{width:100%;height:auto;display:block}
.plan-pin{position:absolute;width:28px;height:28px;margin:-14px 0 0 -14px;padding:0;border:0;border-radius:50%;background:var(--harbour);color:var(--ivory);display:grid;place-items:center;font:600 11px/1 'Instrument Sans',sans-serif;box-shadow:0 0 0 3px rgba(255,255,255,.85),0 4px 10px rgba(19,38,45,.25);cursor:pointer;transition:transform .25s var(--ease),background-color .25s var(--ease);min-height:0}
.plan-pin.is-on,.plan-pin:hover,.plan-pin:focus-visible{background:var(--brass);transform:scale(1.25)}
.plan-pin:focus-visible{outline:2px solid var(--harbour);outline-offset:3px}
.plan-rooms-plan figcaption{display:block;margin:12px 0 0;padding:0;max-width:none;text-align:left;font:500 9.5px/1.4 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}
.plan-rooms-photos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 12px}
.plan-photo{position:relative;margin:0}
.plan-photo .image-button{display:block;width:100%;border-radius:6px}
.plan-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block;transition:opacity .25s var(--ease)}
.plan-rooms.has-on .plan-photo:not(.is-on) img{opacity:.55}
.plan-photo.is-on img{outline:2px solid var(--brass);outline-offset:3px}
.plan-photo-n{position:absolute;left:8px;top:8px;width:22px;height:22px;border-radius:50%;background:rgba(240,237,229,.94);color:var(--harbour);display:grid;place-items:center;font:600 10px/1 'Instrument Sans',sans-serif;pointer-events:none;transition:background-color .25s var(--ease),color .25s var(--ease)}
.plan-photo.is-on .plan-photo-n{background:var(--brass);color:var(--ivory)}
.plan-photo-cap{display:block;margin-top:8px;font:400 14px/1.25 Italiana,serif;color:var(--harbour)}
.plan-rooms~.plan-linework{z-index:0}
@media(max-width:1000px){.plan-rooms-photos{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.plan-rooms{grid-template-columns:1fr;gap:28px}.plan-rooms-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.plan-pin{width:24px;height:24px;margin:-12px 0 0 -12px;font-size:10px}.plan-rooms.has-on .plan-photo:not(.is-on) img{opacity:1}}
/* 24 October 2026: Unit 607's photographs as a room index (option GG): the rooms listed like a contents page at the left,
   the chosen room large at the right with its other views small beneath. The large photo opens full size. */
.room-index{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(32px,4.5vw,64px);align-items:start;margin-top:8px;position:relative;z-index:1}
.ri-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(49,75,89,.25)}
.ri-list li{border-bottom:1px solid rgba(49,75,89,.16)}
.ri-list button{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:baseline;width:100%;padding:15px 0;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--slate);min-height:0;border-radius:0}
.ri-n{font:400 13px/1 Italiana,serif;color:var(--pine)}
.ri-name{font:400 clamp(19px,1.7vw,23px)/1.2 Italiana,serif;transition:color .25s var(--ease)}
.ri-count{font:500 9.5px/1 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}
.ri-list button:hover .ri-name{color:var(--harbour)}
.ri-list button[aria-selected=true] .ri-name{color:var(--harbour);background:linear-gradient(var(--brass),var(--brass)) 0 100%/100% 1px no-repeat;padding-bottom:3px}
.ri-list button:focus-visible{outline:2px solid var(--brass);outline-offset:4px}
.ri-big{margin:0}
.ri-big .image-button{display:block;width:100%;border-radius:var(--radius)}
.ri-big img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius);display:block}
.ri-big .enlarge{bottom:auto;top:16px;right:16px;left:auto}
.ri-big figcaption{display:block;margin:14px 0 0;padding:0;max-width:none;text-align:left;font-style:normal}
.ri-big figcaption b{display:block;font:400 22px/1.2 Italiana,serif;color:var(--harbour);-webkit-text-stroke:0}
.ri-big figcaption span{display:block;font:500 9.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:4px;color:var(--slate)}
.ri-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.ri-panel .ri-thumbs{order:2}
.ri-thumb{display:block;padding:0;border:0;background:transparent;cursor:pointer;border-radius:6px;min-height:0}
.ri-thumb img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:6px;display:block;opacity:.65;transition:opacity .25s var(--ease)}
.ri-thumb:hover img{opacity:.9}
.ri-thumb[aria-pressed=true] img{opacity:1;outline:2px solid var(--brass);outline-offset:3px}
.ri-thumb:focus-visible{outline:2px solid var(--harbour);outline-offset:5px}
.ri-panel{display:flex;flex-direction:column}
.ri-panel[hidden]{display:none}
.ri-panel .ri-big{order:1}
@media(max-width:800px){
.room-index{grid-template-columns:1fr;gap:24px}
.ri-list{display:flex;flex-wrap:wrap;gap:8px;border:0}
.ri-list li{border:0}
.ri-list button{display:inline-flex;gap:8px;align-items:center;width:auto;padding:9px 14px;border:1px solid rgba(49,75,89,.3);border-radius:999px}
.ri-list button[aria-selected=true]{background:var(--harbour);border-color:var(--harbour)}
.ri-list button[aria-selected=true] .ri-name,.ri-list button[aria-selected=true] .ri-n{color:var(--ivory);background:none;padding:0}
.ri-name{font-size:16px}.ri-count{display:none}
}
.ri-big figcaption b,.ri-big figcaption span{text-align:left}
.ri-big img{aspect-ratio:16/10;max-height:68vh}

/* 24 October 2026: Unit 607's section without the sub-line or the faded plan linework; the heading sits at the top of the
   left column above the room list, so the photograph starts level with it. */
.room-index.has-heading{align-items:start;margin-top:0}
.ri-side{display:flex;flex-direction:column}
.ri-heading{margin:0 0 clamp(28px,3vw,44px)}
.bedrooms-index{background-image:none}
.bedrooms-index:before,.bedrooms-index:after{display:none}
@media(max-width:800px){.ri-heading{margin-bottom:22px}}
/* 24 October 2026: the room list names in Instrument Sans. */
.ri-name{font:400 clamp(16px,1.25vw,18px)/1.3 'Instrument Sans',sans-serif;letter-spacing:0}
.ri-list button[aria-selected=true] .ri-name{font-weight:500}
.ri-n{font:500 11px/1 'Instrument Sans',sans-serif;letter-spacing:.06em}
@media(max-width:800px){.ri-name{font-size:14px}}

/* 24 October 2026: Unit 606 uses the same room index, mirrored (photographs left, writing right) on the Slate band. */
.room-index.is-flipped{grid-template-columns:minmax(0,1.6fr) minmax(0,.8fr)}
.room-index.is-flipped .ri-side{order:2}
.room-index.is-flipped .ri-stage{order:1}
.chapter-slate .ri-heading{color:var(--ivory)}
.chapter-slate .ri-list{border-top-color:rgba(240,237,229,.3)}
.chapter-slate .ri-list li{border-bottom-color:rgba(240,237,229,.18)}
.chapter-slate .ri-list button{color:rgba(240,237,229,.72)}
.chapter-slate .ri-n{color:var(--sea-glass)}
.chapter-slate .ri-count{color:rgba(240,237,229,.6)}
.chapter-slate .ri-list button:hover .ri-name,.chapter-slate .ri-list button[aria-selected=true] .ri-name{color:var(--ivory)}
.chapter-slate .ri-big figcaption b{color:var(--ivory)}
.chapter-slate .ri-big figcaption span{color:rgba(240,237,229,.68)}
@media(max-width:800px){
.room-index.is-flipped{grid-template-columns:1fr}
.room-index.is-flipped .ri-side{order:1}.room-index.is-flipped .ri-stage{order:2}
.chapter-slate .ri-list button{border-color:rgba(240,237,229,.35)}
.chapter-slate .ri-list button[aria-selected=true]{background:var(--ivory);border-color:var(--ivory)}
.chapter-slate .ri-list button[aria-selected=true] .ri-name,.chapter-slate .ri-list button[aria-selected=true] .ri-n{color:var(--harbour)}
}
/* 24 October 2026: the Homes page opens on Unit 607's living room full-bleed (option LL), the headline set large across it
   and a fact rail along the bottom: 58 homes, 9 designs, 468 to 909 sq ft, a balcony on every upper-floor home. */
.homes-hero{position:relative;min-height:calc(100svh - var(--header-h,76px));min-height:max(680px,calc(100svh - 76px));overflow:hidden;color:var(--ivory);display:flex;flex-direction:column;justify-content:space-between;isolation:isolate}
.homes-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;aspect-ratio:auto}
.homes-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(19,38,45,.74) 0%,rgba(19,38,45,.38) 45%,rgba(19,38,45,0) 72%),linear-gradient(0deg,rgba(19,38,45,.62),rgba(19,38,45,0) 32%)}
.homes-hero-in{padding:clamp(56px,8vh,96px) var(--gutter) 40px;max-width:820px}
.homes-hero .chapter-label{color:var(--sea-glass)}
.homes-hero h1{font:400 clamp(64px,10vw,156px)/.92 Italiana,serif;color:var(--ivory);margin:18px 0 26px;-webkit-text-stroke:0}
.homes-hero-line{font-size:clamp(15px,1.2vw,17px);line-height:1.6;max-width:36ch;color:rgba(240,237,229,.92);margin:0 0 26px}
.homes-hero a{color:var(--ivory);border-color:rgba(240,237,229,.7)}
.homes-hero a svg,.homes-hero a path{stroke:var(--ivory)}
.homes-rail{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border-top:1px solid rgba(240,237,229,.35)}
.homes-rail div{padding:22px var(--gutter) 26px;border-right:1px solid rgba(240,237,229,.25)}
.homes-rail div:last-child{border-right:0}
.homes-rail dt{font:400 clamp(30px,3vw,44px)/1 Italiana,serif;color:var(--ivory)}
.homes-rail dd{margin:8px 0 0;font:500 10.5px/1.35 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(240,237,229,.82)}
@media(max-width:800px){
.homes-hero{min-height:calc(100svh - 64px)}
.homes-hero:after{background:linear-gradient(0deg,rgba(19,38,45,.78) 0%,rgba(19,38,45,.45) 50%,rgba(19,38,45,.3) 100%)}
.homes-hero-img{object-position:60% center}
.homes-rail{grid-template-columns:1fr 1fr}
.homes-rail div{padding:16px 20px 18px;border-bottom:1px solid rgba(240,237,229,.2)}
.homes-rail div:nth-child(2n){border-right:0}
}
/* The announcement bar and header together take about 130px; the hero fills what is left of the first screen. */
.homes-hero{min-height:max(640px,calc(100svh - 130px))}
.homes-hero h1{font-size:clamp(60px,8.6vw,136px)}
@media(max-width:800px){.homes-hero{min-height:max(600px,calc(100svh - 110px))}}
.homes-hero-in{padding-top:clamp(36px,5.5vh,80px);padding-bottom:28px}

/* 24 October 2026: smaller hero headline so it sits on two lines. */
.homes-hero-in{max-width:960px}
.homes-hero h1{font-size:clamp(48px,6.6vw,108px);line-height:.98}

/* 24 October 2026: the fact rail larger, each fact centred in its own cell; the headline sits directly above the link. */
.homes-hero h1{margin-bottom:30px}
.homes-rail div{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:34px 20px 36px}
.homes-rail dt{font-size:clamp(40px,4.4vw,68px);line-height:1}
.homes-rail dd{font-size:12px;letter-spacing:.14em;margin-top:12px}
@media(max-width:800px){.homes-rail div{padding:20px 12px 22px}.homes-rail dt{font-size:34px}.homes-rail dd{font-size:10px;margin-top:8px}}
/* 25 October 2026: the Homes page feature section as an open grid (option YY). The heading and note share a row; the nine
   features sit in three columns divided by hairlines, each icon in a small Sea Glass circle beside its name and sentence. */
.homes-features{display:block}
.homes-features-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:end;margin-bottom:clamp(36px,4vw,52px)}
.homes-features-top h2{font:400 clamp(38px,4vw,60px)/1.05 Italiana,serif;color:var(--harbour);margin:16px 0 0;max-width:18ch}
.homes-features-top>p{font-size:14px;line-height:1.65;color:var(--slate);max-width:42ch;margin:0}
.icon-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(49,75,89,.25)}
.icon-item{display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start;padding:28px 28px 28px 0;border-bottom:1px solid rgba(49,75,89,.14)}
.icon-item:not(:nth-child(3n+1)){padding-left:28px;border-left:1px solid rgba(49,75,89,.14)}
.icon-dot{width:52px;height:52px;border-radius:50%;background:var(--sea-glass);display:grid;place-items:center;color:var(--harbour)}
.icon-dot svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.icon-item h3{font:500 16px/1.3 'Instrument Sans',sans-serif;color:var(--harbour);margin:4px 0 0;-webkit-text-stroke:0}
.icon-item p{font-size:13px;line-height:1.55;color:var(--slate);margin:5px 0 0}
@media(max-width:900px){.icon-list{grid-template-columns:repeat(2,minmax(0,1fr))}.icon-item:not(:nth-child(3n+1)){padding-left:0;border-left:0}.icon-item:nth-child(2n){padding-left:24px;border-left:1px solid rgba(49,75,89,.14)}}
@media(max-width:700px){.homes-features-top{grid-template-columns:1fr;gap:18px}.icon-list{grid-template-columns:1fr}.icon-item,.icon-item:nth-child(2n){padding:20px 0;border-left:0}.icon-dot{width:46px;height:46px}.icon-item{grid-template-columns:46px 1fr;gap:16px}}
/* 25 October 2026: a smaller Jr. one bedroom heading so the heading and its room list end level with the photograph. */
.rooms-606 .ri-heading{font-size:clamp(52px,5.6vw,84px);line-height:1}

/* 25 October 2026: both room-index headings at the same size. */
.bedrooms-index .ri-heading{font-size:clamp(52px,5.6vw,84px);line-height:1}

/* 25 October 2026: each plan card in "All the details" leads with its outline drawing in Harbour linework, so the name
   has a plan shape to go with it. The drawings sit bottom-aligned in a fixed-height frame so the names line up. */
.download-list>div{display:flex;flex-direction:column}
.plan-outline{height:220px;display:flex;align-items:flex-end;justify-content:flex-start;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid rgba(49,75,89,.14)}
.plan-outline img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
@media(max-width:700px){.plan-outline{height:180px}}
/* The plan name sits above its drawing; the drawing is centred in its frame. */
.plan-outline{align-items:center;justify-content:center;margin:16px 0 20px;padding:14px 0;border-top:1px solid rgba(49,75,89,.14)}
.plan-outline img{margin:0 auto}

/* 25 October 2026: the plan cards centred, the starting rent on its own line. */
.download-list>div{align-items:center;text-align:center}
.download-list>div h3{width:100%}
.download-list>div p{margin-left:auto;margin-right:auto}
.download-list .plan-rent{margin-top:6px;font-weight:500;color:var(--harbour)}
.download-list>div a{align-self:center}

/* 25 October 2026: "All the details" plan cards as framed sheets (option DC): a hairline frame with a Brass bar across the
   top, the outline drawing on a white mat, and the starting rent in a soft Brass pill. Content and layout unchanged. */
#static-plan-downloads{gap:24px}
#static-plan-downloads>div{background:#f7f5ef;border:1px solid rgba(49,75,89,.18);border-top:4px solid var(--brass);padding:28px 24px 26px;border-radius:2px;box-sizing:border-box}
#static-plan-downloads .plan-outline{background:#fff;border:1px solid rgba(49,75,89,.12);padding:16px;margin:14px 0 18px;width:100%;box-sizing:border-box}
#static-plan-downloads .plan-rent{display:inline-block;background:rgba(176,141,79,.14);color:var(--harbour);padding:5px 12px;border-radius:999px}
@media(max-width:700px){#static-plan-downloads>div{padding:22px 18px 20px}}
/* 25 October 2026: each plan outline opens its full sheet; the mat shows a pointer and the View plan pill on hover. */
.plan-outline-btn{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:transparent;border:0;padding:0;cursor:zoom-in;position:relative;border-radius:0}
.plan-outline-btn img{max-width:100%;max-height:100%;width:auto;height:auto;transition:transform .35s var(--ease)}
.plan-outline-btn:hover img{transform:scale(1.03)}
.plan-outline-btn .enlarge{opacity:0;transition:opacity .25s var(--ease)}
.plan-outline-btn:hover .enlarge,.plan-outline-btn:focus-visible .enlarge{opacity:1}
#static-plan-downloads .plan-outline{cursor:zoom-in}

/* 25 October 2026: the plan cards switch to the Sea Glass board (option DB): a soft Sea Glass card with rounded corners and
   the drawing on a white sheet inset with a light shadow. The starting rent keeps its Brass pill from the framed version. */
#static-plan-downloads{gap:22px}
#static-plan-downloads>div{background:rgba(169,187,183,.35);border:0;border-radius:14px;padding:28px 24px 26px}
#static-plan-downloads .plan-outline{background:#fff;border:0;border-radius:8px;padding:18px;margin:14px 0 18px;box-shadow:0 10px 24px rgba(49,75,89,.1)}
#static-plan-downloads .plan-rent{background:rgba(176,141,79,.2)}
/* 25 October 2026: the starting-rent pill in Pine with Ivory text (option PC). */
#static-plan-downloads .plan-rent{background:var(--pine);color:var(--ivory)}

/* 25 October 2026: the rooftop photo frame matches Angela's reframe: a taller 2.12 to 1 frame that shows the street at the top
   and the parapet edge at the bottom, the rooftop centred. Capped so the numbered steps still fit on shorter screens. */
.motion-desktop .roof-scenes{height:auto!important;aspect-ratio:2.124;max-height:calc(100svh - 290px);flex:none}

/* 25 October 2026: the view watercolours as a panorama on the Homes page (option EB). The chosen view runs edge to edge
   with the heading in its sky; four small views beneath swap it. */
.view-pano{background:var(--ivory)}
.vp-stage{position:relative}
.vp-wide{margin:0}
.vp-wide .image-button{display:block;width:100%;border-radius:0}
.vp-wide img{width:100%;aspect-ratio:2.35;height:auto;object-fit:cover;display:block}
.vp-head{position:absolute;left:0;right:0;top:clamp(36px,5vw,72px);text-align:center;pointer-events:none;padding:0 var(--gutter)}
.vp-head .chapter-label{color:var(--harbour);margin:0 auto}
.vp-head h2{font:400 clamp(40px,4.6vw,70px)/1.02 Italiana,serif;color:var(--harbour);margin:14px auto 0;-webkit-text-stroke:0;text-shadow:0 0 24px rgba(255,255,255,.45)}
.vp-head h2 br{display:none}
.vp-row{display:grid;grid-template-columns:auto repeat(4,minmax(0,1fr));gap:16px;align-items:center;padding:24px var(--gutter) clamp(56px,6vw,90px)}
.vp-hint{font:600 10.5px/1.5 'Instrument Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);margin:0 18px 0 0;max-width:7ch}
.vp-thumb{display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:center;padding:0;border:0;background:transparent;text-align:left;cursor:pointer;min-height:0;border-radius:0}
.vp-thumb img{width:110px;aspect-ratio:1.5;height:auto;object-fit:cover;border-radius:4px;opacity:.7;transition:opacity .25s var(--ease)}
.vp-thumb:hover img{opacity:.95}
.vp-thumb[aria-pressed=true] img{opacity:1;outline:2px solid var(--brass);outline-offset:3px}
.vp-thumb:focus-visible{outline:2px solid var(--harbour);outline-offset:4px}
.vp-thumb b{display:block;font:600 10.5px/1 'Instrument Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--pine)}
.vp-thumb em{display:block;font:400 16px/1.25 Italiana,serif;font-style:normal;color:var(--harbour);margin-top:6px}
@media(max-width:900px){.vp-row{grid-template-columns:repeat(2,minmax(0,1fr))}.vp-hint{display:none}}
@media(max-width:700px){
.vp-wide img{aspect-ratio:4/3}
.vp-head h2 br{display:inline}
.vp-row{gap:14px 12px}
.vp-thumb{grid-template-columns:72px 1fr;gap:10px}.vp-thumb img{width:72px}.vp-thumb em{font-size:14px}
}
@media(max-width:1100px){.vp-row{grid-template-columns:repeat(2,minmax(0,1fr))}.vp-hint{display:none}}

/* 25 October 2026: on the Amenities page the view panorama is the page opener. */
.vp-opening .vp-head h1{font:400 clamp(44px,5.4vw,84px)/1.02 Italiana,serif;color:var(--harbour);margin:14px auto 0;-webkit-text-stroke:0;text-shadow:0 0 24px rgba(255,255,255,.45)}
.vp-opening .vp-head h1 br{display:none}
@media(max-width:700px){.vp-opening .vp-head h1 br{display:inline}}

/* 25 October 2026: the Amenities page after the panorama (combined GC page). A Pine intro band; three spreads with two
   photographs side by side, the one under the cursor widening like the park panels; a numbers row; then the day-to-day. */
.amenity-band{background:var(--pine);color:var(--ivory);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:end;padding-top:clamp(70px,7vw,100px);padding-bottom:clamp(70px,7vw,100px)}
.amenity-band .chapter-label{color:var(--sea-glass)}
.amenity-band h2{font:400 clamp(40px,4.6vw,72px)/1.02 Italiana,serif;color:var(--ivory);margin:16px 0 0;-webkit-text-stroke:0}
.amenity-band>p{font-size:clamp(15px,1.2vw,17px);line-height:1.7;color:rgba(240,237,229,.92);margin:0;max-width:44ch}
.rt-spreads{padding:clamp(60px,6vw,100px) var(--gutter) 0}
.rt-spread{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:center;margin-bottom:clamp(70px,7vw,110px)}
.rt-spread.is-flipped{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.rt-spread.is-flipped .rt-photos{order:2}
.rt-photos{display:flex;gap:14px;height:clamp(300px,30vw,440px)}
.rt-photos figure{margin:0;min-width:0;overflow:hidden;border-radius:var(--radius);transition:flex .6s var(--ease)}
.rt-photos .ph-a{flex:1.6}.rt-photos .ph-b{flex:1}
.rt-photos:has(.ph-b:hover) .ph-a,.rt-photos:has(.ph-b:focus-within) .ph-a{flex:1}
.rt-photos .ph-b:hover,.rt-photos .ph-b:focus-within{flex:1.6}
.rt-photos .image-button{display:block;width:100%;height:100%;border-radius:0}
.rt-photos img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:auto}
.rt-n{display:block;font:400 clamp(72px,8vw,110px)/.8 Italiana,serif;color:var(--sea-glass)}
.rt-copy .chapter-label{margin-top:12px}
.rt-copy h2{font:400 clamp(40px,4.4vw,68px)/1.02 Italiana,serif;color:var(--harbour);margin:14px 0 0;-webkit-text-stroke:0}
.rt-copy>p:last-child{font-size:15.5px;line-height:1.7;color:var(--harbour);max-width:40ch;margin:16px 0 0}
.amenity-facts{display:grid;grid-template-columns:repeat(3,1fr);margin:0 var(--gutter);padding:0;border-top:1px solid rgba(49,75,89,.25);border-bottom:1px solid rgba(49,75,89,.25)}
.amenity-facts div{padding:36px 20px;text-align:center;border-right:1px solid rgba(49,75,89,.15)}.amenity-facts div:last-child{border-right:0}
.amenity-facts b{display:block;font:400 clamp(40px,4vw,56px)/1 Italiana,serif;color:var(--pine);font-weight:400}
.amenity-facts span{display:block;font:500 11px/1.4 'Instrument Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;margin-top:10px;color:var(--harbour)}
.amenity-daily{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(36px,5vw,64px);align-items:start}
.amenity-daily h2{font:400 clamp(40px,4.4vw,68px)/1.02 Italiana,serif;color:var(--harbour);margin:16px 0 0;-webkit-text-stroke:0}
.amenity-daily ul{list-style:none;margin:0;padding:0;columns:2;column-gap:40px}
.amenity-daily li{break-inside:avoid;display:grid;grid-template-columns:40px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid rgba(49,75,89,.16)}
.amenity-daily svg{width:26px;height:26px;fill:none;stroke:var(--pine);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.amenity-daily h3{font:500 15px/1.3 'Instrument Sans',sans-serif;color:var(--harbour);margin:0;-webkit-text-stroke:0}
.amenity-daily li p{font-size:12.5px;line-height:1.5;color:var(--slate);margin:3px 0 0}
@media(max-width:900px){.amenity-band,.amenity-daily{grid-template-columns:1fr;gap:20px}.amenity-daily ul{columns:1}}
@media(max-width:800px){
.rt-spread,.rt-spread.is-flipped{grid-template-columns:1fr;gap:24px}
.rt-spread.is-flipped .rt-photos{order:0}
.rt-photos{height:auto;flex-direction:column}
.rt-photos .ph-a,.rt-photos .ph-b,.rt-photos .ph-b:hover{flex:none}
.rt-photos img{aspect-ratio:4/3;height:auto}
.rt-photos .ph-b img{aspect-ratio:16/9}
.amenity-facts{grid-template-columns:1fr}.amenity-facts div{border-right:0;border-bottom:1px solid rgba(49,75,89,.15)}.amenity-facts div:last-child{border-bottom:0}
}
/* 25 October 2026: bigger photos in the Amenities spreads: a larger share of the row and taller pairs. */
.rt-spread{grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:clamp(32px,4vw,60px)}
.rt-spread.is-flipped{grid-template-columns:minmax(0,1fr) minmax(0,1.75fr)}
.rt-photos{height:clamp(360px,36vw,560px)}
@media(max-width:800px){.rt-spread,.rt-spread.is-flipped{grid-template-columns:1fr}.rt-photos{height:auto}}

/* 25 October 2026: the hovered photo in an Amenities pair opens much wider (either photo). */
@media(min-width:801px){.rt-photos:has(figure:hover) figure,.rt-photos:has(figure:focus-within) figure{flex:1}.rt-photos figure:hover,.rt-photos figure:focus-within{flex:3!important}}

/* 25 October 2026: the hovered Amenities photo opens wider still; its partner narrows to a slim slice. */
@media(min-width:801px){.rt-photos figure:hover,.rt-photos figure:focus-within{flex:5!important}}

/* 26 October 2026: more air between the panorama and its Look around row. */
.vp-row{padding-top:clamp(36px,3.6vw,56px)}
.vp-row{padding-top:clamp(48px,5vw,80px)}

/* 26 October 2026: "For the day-to-day" on a rounded Sea Glass panel, each item on a white card with its icon in a soft circle (option DC). */
.amenity-daily{background:var(--sea-glass);border-radius:18px;margin:clamp(60px,6vw,90px) var(--gutter);padding:clamp(40px,4.5vw,64px) clamp(24px,4vw,56px)!important}
.amenity-daily ul{columns:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.amenity-daily li{background:#fff;border:0;border-radius:12px;padding:20px 22px;box-shadow:0 10px 24px rgba(49,75,89,.08);grid-template-columns:58px 1fr;align-items:center}
.amenity-daily svg{width:34px;height:34px;padding:10px;border-radius:50%;background:rgba(169,187,183,.4);box-sizing:content-box}
.amenity-daily li p{color:var(--slate)}
@media(max-width:700px){.amenity-daily{border-radius:14px}.amenity-daily ul{grid-template-columns:1fr}.amenity-daily li{padding:16px 18px;grid-template-columns:50px 1fr}.amenity-daily svg{width:28px;height:28px;padding:9px}}
/* 26 October 2026: the new aerial render (roof-1) is already level, so the 1.6 degree correction made for the old render is removed. */
.roof-scene[data-scene="0"]>img{transform:none!important;object-position:50% 50%}

/* 26 October 2026: on the first rooftop scene only, "A different point of view." sits top left, with the shade moved to that corner. */
@media(min-width:1000px){.roof-scene[data-scene="0"] .roof-scene-copy{top:clamp(36px,4vw,60px);left:64px;right:auto;bottom:auto;text-align:left}.roof-scene[data-scene="0"] .roof-shade{background:radial-gradient(58% 70% at 0% 0%,rgba(18,37,45,.74) 0,rgba(18,37,45,.42) 38%,rgba(18,37,45,0) 100%)}}

/* 26 October 2026: on the first rooftop scene only, "A different point of view." sits top left, with the shade moved to that corner. */
@media(min-width:1000px){.roof-scene[data-scene="0"] .roof-scene-copy{top:clamp(36px,4vw,60px);left:64px;right:auto;bottom:auto;text-align:left}.roof-scene[data-scene="0"] .roof-shade{background:radial-gradient(58% 70% at 0% 0%,rgba(18,37,45,.74) 0,rgba(18,37,45,.42) 38%,rgba(18,37,45,0) 100%)}}
@media(min-width:1000px){.roof-scene[data-scene="0"] .roof-shade{background:radial-gradient(62% 74% at 0% 0%,rgba(18,37,45,.84) 0,rgba(18,37,45,.52) 38%,rgba(18,37,45,0) 100%)}}

/* 26 October 2026: the place names in the home page "Make yourself local." list in Instrument Sans. */
.local-directory li span:first-child{font:400 17px/1.35 'Instrument Sans',sans-serif;letter-spacing:0;-webkit-text-stroke:0}
@media(max-width:700px){.local-directory li span:first-child{font-size:15.5px}}

/* 26 October 2026: more room at the top of each open place panel in the directory, to balance its bottom. */
.place-detail{padding-top:20px;padding-bottom:22px;margin-top:-6px}
.place-detail{padding-top:28px}

/* 26 October 2026: a spread with one photograph lets it fill the photo area. */
.rt-photos figure:only-child{flex:1!important}

/* 26 October 2026: Contact page (option CE, without the rendering). The view south over Central Lonsdale to the Inlet and
   downtown fills the section and fades to Ivory behind the copy on the left. */
.contact-view{position:relative;isolation:isolate;overflow:hidden;min-height:max(680px,calc(100svh - 130px));display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center}
.contact-view-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 72%;z-index:-2;aspect-ratio:auto}
.contact-view:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(240,237,229,.97) 0%,rgba(240,237,229,.93) 36%,rgba(240,237,229,.35) 62%,rgba(240,237,229,0) 82%)}
.contact-view-copy{grid-column:1;max-width:520px}
.contact-view-credit{position:absolute;right:var(--gutter);bottom:18px;margin:0;font:500 10.5px/1.3 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.4)}
@media(max-width:900px){
.contact-view{display:block;min-height:0;padding-bottom:0}
.contact-view-bg{position:static;height:auto;aspect-ratio:4/3;margin:40px calc(-1 * var(--gutter)) 0;width:calc(100% + 2 * var(--gutter));max-width:none}
.contact-view:after{display:none}
.contact-view-credit{position:static;color:var(--slate);text-shadow:none;margin:10px 0 40px}
}
/* Book a Tour: the building rendering, wide, under the intro. */
.booking-copy .booking-rendering img{aspect-ratio:16/10;height:auto;object-fit:cover;width:100%}@media(max-width:900px){.contact-view{display:flex;flex-direction:column}.contact-view-copy{order:1}.contact-view-bg{order:2}.contact-view-credit{order:3}}

/* 26 October 2026: Book a Tour as a single Ivory card centred on a Sea Glass band (option BD), no photograph. The card
   keeps the booking-panel hooks so the scheduler can switch on later. */
.booking-band{background:var(--sea-glass);padding:clamp(56px,7vw,100px) var(--gutter);min-height:calc(100svh - 130px);box-sizing:border-box;display:grid;place-items:center}
.booking-panel.booking-card{background:var(--ivory)!important;color:var(--harbour)!important;max-width:760px;width:100%;margin:0;border-radius:20px;padding:clamp(40px,5vw,60px) clamp(24px,5vw,64px)!important;text-align:center;box-shadow:0 30px 70px rgba(49,75,89,.18);box-sizing:border-box}
.booking-cal{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;border:1.5px solid var(--pine);border-radius:14px;color:var(--pine)}
.booking-cal svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.booking-pill{display:inline-flex!important;align-items:center;gap:10px;font:600 11px/1 'Instrument Sans',sans-serif!important;letter-spacing:.16em;text-transform:uppercase;background:rgba(83,107,92,.12);color:var(--pine)!important;padding:10px 14px;border-radius:999px;margin:0!important}
.booking-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brass)}
.booking-card h1{font:400 clamp(48px,5.2vw,74px)/1.02 Italiana,serif;color:var(--harbour)!important;margin:22px auto 0;max-width:12ch;-webkit-text-stroke:0}
.booking-card>p{font-size:16px;line-height:1.7;color:var(--harbour)!important;max-width:42ch;margin:20px auto 0}
.booking-card .booking-action{margin-top:28px}
.booking-card .fine{font-size:12px;color:var(--slate)!important;margin:14px auto 0}
@media(max-width:700px){.booking-band{min-height:0;padding:40px 16px}.booking-card h1{font-size:46px}}
/* 26 October 2026: Register Your Interest with the rooftop at dusk behind everything (option RC). The copy sits in white
   on the left, held in place while the long HubSpot form scrolls on an Ivory card at the right. */
.register-dusk{position:relative;isolation:isolate;max-width:none!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:clamp(32px,5vw,72px)!important;align-items:start;padding:clamp(56px,6vw,84px) var(--gutter) clamp(70px,7vw,110px)!important}
.register-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;z-index:-2;aspect-ratio:auto}
.register-dusk:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(19,38,45,.72),rgba(19,38,45,.28) 58%,rgba(19,38,45,.16))}
.register-dusk .register-intro{position:sticky;top:120px}
.register-dusk .register-intro h1,.register-dusk .register-intro p{color:var(--ivory)!important}
.register-dusk .register-intro p{max-width:40ch;text-shadow:0 1px 10px rgba(0,0,0,.25)}
.register-dusk .register-form{background:var(--ivory);border-radius:20px;padding:clamp(24px,3vw,36px)!important;box-shadow:0 30px 70px rgba(0,0,0,.3)}
@media(max-width:900px){
.register-dusk{grid-template-columns:1fr!important;padding:48px 16px 60px!important}
.register-dusk .register-intro{position:static}
.register-dusk:after{background:linear-gradient(180deg,rgba(19,38,45,.72),rgba(19,38,45,.35) 40%,rgba(19,38,45,.55))}
}
/* 26 Oct 2026: privacy page restyled to the site system (Pine opening band, indexed numbered sections) */
.privacy-page .privacy-band{background:var(--pine);color:var(--ivory);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:end;padding-top:clamp(70px,7vw,110px);padding-bottom:clamp(60px,6vw,90px)}
.privacy-page .privacy-band .chapter-label{font-size:20px;letter-spacing:.12em;color:var(--sea-glass);margin:0 0 16px;font-family:'Instrument Sans',sans-serif;font-weight:600}
.privacy-page .privacy-band h1{font:400 clamp(48px,6.2vw,96px)/.98 Italiana,serif;color:var(--ivory);margin:0;-webkit-text-stroke:0}
.privacy-page .privacy-band .lead{font:400 clamp(17px,1.4vw,20px)/1.6 'Instrument Sans',sans-serif;color:rgba(240,237,229,.92);margin:0;max-width:44ch}
.privacy-page .privacy-band .fine{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--sea-glass);margin:22px 0 0;font-weight:600}
.privacy-page .privacy{max-width:none;margin:0;display:grid;grid-template-columns:minmax(200px,280px) minmax(0,760px);gap:clamp(40px,6vw,110px);justify-content:center;align-items:start}
.privacy-page .pv-toc{position:sticky;top:120px}
.privacy-page .pv-toc-label{font:600 13px/1 'Instrument Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--pine);margin:0 0 14px}
.privacy-page .pv-toc ol{list-style:none;margin:0;padding:0;border-top:1px solid rgba(49,75,89,.2)}
.privacy-page .pv-toc li{border-bottom:1px solid rgba(49,75,89,.14)}
.privacy-page .pv-toc a{display:flex;gap:14px;padding:11px 0;font:500 15px/1.35 'Instrument Sans',sans-serif;color:var(--harbour);text-decoration:none;transition:color .2s,padding-left .2s}
.privacy-page .pv-toc a span{font:400 15px/1.35 Italiana,serif;color:var(--pine);min-width:22px}
.privacy-page .pv-toc a:hover{color:var(--pine);padding-left:6px}
.privacy-page .pv-list{border-top:1px solid rgba(49,75,89,.2)}
.privacy-page .pv-item{display:grid;grid-template-columns:64px minmax(0,1fr);gap:20px;padding:clamp(30px,3vw,42px) 0;border-bottom:1px solid rgba(49,75,89,.14);scroll-margin-top:110px}
.privacy-page .pv-num{font:400 30px/1 Italiana,serif;color:var(--pine);padding-top:4px}
.privacy-page .pv-item h2{font:400 clamp(30px,2.8vw,40px)/1.08 Italiana,serif;color:var(--harbour);margin:0 0 16px;-webkit-text-stroke:0;letter-spacing:0;text-transform:none;overflow-wrap:normal}
.privacy-page .pv-item p{font:400 17px/1.7 'Instrument Sans',sans-serif;color:#2f3a40;margin:0 0 14px;max-width:62ch}
.privacy-page .pv-item p:last-child{margin-bottom:0}
.privacy-page .pv-item a{color:var(--pine);text-decoration:underline;text-decoration-color:rgba(83,107,92,.4);text-underline-offset:3px;font-weight:500}
.privacy-page .pv-item a:hover{text-decoration-color:var(--pine)}
.privacy-page .pv-contact{background:var(--sea-glass);border-radius:20px;padding:clamp(30px,3vw,42px) clamp(24px,3vw,40px);margin:18px 0;border-bottom:0}
.privacy-page .pv-contact a{color:var(--harbour);text-decoration-color:rgba(49,75,89,.5)}
@media(max-width:850px){
.privacy-page .privacy-band{grid-template-columns:1fr;gap:22px;align-items:start}
.privacy-page .privacy{grid-template-columns:1fr;gap:36px}
.privacy-page .pv-toc{position:static}
.privacy-page .pv-toc ol{columns:2;column-gap:22px}
.privacy-page .pv-toc li{break-inside:avoid}
.privacy-page .pv-item{grid-template-columns:1fr;gap:6px}
.privacy-page .pv-num{font-size:24px}
.privacy-page .pv-item h2{font-size:30px}
}
@media(max-width:520px){.privacy-page .pv-toc ol{columns:1}.privacy-page .pv-item p{font-size:16px}}
/* 28 Oct 2026: longer SeaBus note under the pier polaroid; 'The pier' caption is short, so give the note more room */
.polaroid.p4 .polaroid-note{max-width:56%}
@media(max-width:700px){.polaroid.p4 .polaroid-note{max-width:47%}}
@media(max-width:700px){.polaroid-note{line-height:1.2;letter-spacing:.05em}}
@media(max-width:700px){.polaroid-note{bottom:9px;line-height:1.15}}

/* 28 Oct 2026: developer and manager logos on an Ivory band under the footer (logos keep their own colours),
   and the developer's footer note: larger logo and address, same-size links set closer together */
footer{padding-top:clamp(48px,5vw,64px)}
.footer-main{align-items:start}
.footer-logo{width:240px}
.footer-main>div p{font-size:22px;line-height:1.35}
.footer-main address{font-size:17px;line-height:1.6;margin-top:16px}
.footer-main nav{gap:2px}
.footer-main nav a,.footer-main nav button{min-height:0;padding:7px 0;line-height:1.4}
.footer-bottom{margin-top:44px}
.footer-partners{background:var(--ivory);display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:24px clamp(48px,8vw,120px);padding:28px var(--gutter)}
.footer-partners .partner{display:flex;align-items:center;gap:18px}
.partner-label{font:600 11px/1.2 'Instrument Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--slate,#5E7079)}
.footer-partners img{display:block;width:auto}
.footer-partners .partner:first-child img{height:58px}
.footer-partners .partner:last-child img{height:34px}
@media(max-width:850px){
.footer-logo{width:200px}
.footer-main>div p{font-size:19px}
.footer-main address{font-size:15px}
.footer-main nav a,.footer-main nav button{padding:9px 0}
}
@media(max-width:560px){
.footer-logo{width:170px}
.footer-partners{gap:20px 36px;padding:24px var(--gutter)}
.footer-partners .partner{flex-direction:column;gap:10px}
.footer-partners .partner:first-child img{height:46px}
.footer-partners .partner:last-child img{height:28px}
}@media(max-width:850px){.footer-main>nav:last-child{gap:2px}}
@media(max-width:560px){.footer-partners{align-items:flex-start}.footer-partners .partner{justify-content:flex-start}.footer-partners .partner img{margin-top:auto}}
/* 28 Oct 2026: RF Properties joins King Pacific under Developed by */
.footer-partners .partner-logos{display:flex;align-items:center;gap:28px}
.footer-partners .partner-amp{width:1px;height:40px;background:rgba(49,75,89,.25)}
.footer-partners .partner img.logo-kp{height:58px}
.footer-partners .partner img.logo-rf{height:30px}
@media(max-width:560px){
.footer-partners{flex-direction:column;align-items:center;gap:22px}
.footer-partners .partner{flex-direction:column;align-items:center;gap:10px}
.footer-partners .partner-logos{gap:18px}
.footer-partners .partner-amp{height:30px}
.footer-partners .partner img.logo-kp{height:44px}
.footer-partners .partner img.logo-rf{height:22px}
.footer-partners .partner img{margin-top:0}
}
/* 28 Oct 2026: Lonsdale themes read larger (Angela); tour pill sits under the headline */
.theme-n{font-size:15px}
.theme-copy h3{font-size:clamp(30px,2.6vw,36px);margin-bottom:16px}
.theme-copy p{font-size:17px;line-height:1.7;max-width:40ch}
.theme-pic figcaption b{font-size:18px}
.theme-pic figcaption span{font-size:10.5px}
@media(max-width:850px){.theme-copy h3{font-size:28px}.theme-copy p{font-size:16px}.theme-pic figcaption b{font-size:15px}.theme-pic figcaption span{font-size:9.5px}}
.booking-card .booking-pill{margin:22px auto 0!important}
.booking-card h1+.booking-pill+p,.booking-card .booking-pill+p{margin-top:20px}
/* 28 Oct 2026: rendering disclaimer tag, top-right of rendered images */
.render-tag{position:absolute;top:10px;right:10px;z-index:3;pointer-events:none;font:600 9.5px/1 'Instrument Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(240,237,229,.95);background:rgba(28,26,23,.38);padding:5px 8px;border-radius:999px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
@media(max-width:700px){.render-tag{top:8px;right:8px;font-size:8.5px;padding:4px 7px}}
.footer-bottom .render-note{opacity:.8;text-transform:none;letter-spacing:.02em}.image-button .render-tag{left:10px;right:auto}
@media(max-width:700px){.image-button .render-tag{left:8px}}

/* 28 Oct 2026 (Angela): larger plan sheet on first view. Fill the panel width, capped to the screen height so the
   whole sheet stays visible; never smaller than the previous 690px. */
@media(min-width:851px){
.plan-main .plan-preview{max-width:none}
.plan-main .plan-preview img{width:auto;max-width:100%;height:auto;max-height:940px;margin:0 auto;object-fit:contain}
}
/* 28 Oct 2026 (Angela): "A place to work, unwind, cook and share." larger and set to the right edge */
.homes-features-top>p{font-size:19px;line-height:1.65;color:var(--harbour);text-align:right;justify-self:end;max-width:none}
@media(max-width:850px){.homes-features-top>p{font-size:17px;text-align:left;justify-self:start}}
/* 29 Oct 2026: RF Properties and Orin footer logos link to their sites (King Pacific has no website) */
.footer-partners .partner-link{display:inline-flex;align-items:center;border-radius:2px;transition:opacity .2s ease}
.footer-partners .partner-link:hover{opacity:.7}
.footer-partners .partner-link:focus-visible{outline:2px solid var(--harbour);outline-offset:6px}

/* 3 Nov 2026: features sheet download beside the plan drawings */
.details-side .sheet-link{display:inline-block;margin-top:14px;padding:8px 0;font-size:15px;color:var(--harbour);text-decoration:underline;text-underline-offset:4px}
.details-side .sheet-link:hover{opacity:.7}
.details-side .sheet-link:focus-visible{outline:2px solid var(--harbour);outline-offset:4px}