/* Deliberate motion and the editorial layer of the homepage. */
:root{--motion-duration:700ms;--motion-ease:cubic-bezier(.22,.61,.36,1)}
.island-description{text-align:left;hyphens:none;text-wrap:pretty;line-height:1.85;color:#68706b}
.journal{position:relative}
.brand-ribbon{position:absolute;bottom:0;left:50%;width:100vw;max-width:100vw;height:calc(var(--section-space) - 18px);transform:translateX(-50%);overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.brand-ribbon-toggle{display:block;width:100%;height:100%;cursor:default;overflow:hidden}
.brand-ribbon-toggle:focus-visible{outline:1px solid #858b86;outline-offset:-6px}
.brand-ribbon-track{display:flex;width:max-content;height:100%;animation:brand-drift 75s linear infinite;will-change:transform}
.brand-ribbon-group{display:flex;align-items:center;flex-shrink:0}
.brand-ribbon-item{display:flex;align-items:center;justify-content:center;width:clamp(200px,18vw,320px);padding:0 35px}
.brand-ribbon-item img{height:42px;width:160px;object-fit:contain;filter:grayscale(1) brightness(0);opacity:.21}
.brand-ribbon-item img[src*="mandarin"]{height:52px;width:145px}
.brand-ribbon-item img[src*="porsche"]{height:22px;width:165px}
.brand-ribbon:hover .brand-ribbon-track,.brand-ribbon:focus-within .brand-ribbon-track,.brand-ribbon.is-paused .brand-ribbon-track{animation-play-state:paused}
@keyframes brand-drift{from{transform:translateX(-50%)}to{transform:translateX(0)}}
/* The Gazette has a lead story and two supporting stories. */
.guide-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:1fr 1fr;gap:28px 36px}
.guide-grid .guide-card{display:flex;flex-direction:column;min-height:0;align-items:stretch}
.guide-grid .guide-card:first-child{grid-row:1 / 3}
.guide-grid .guide-card .reference-photo{aspect-ratio:2.65!important}
.guide-grid .guide-card:first-child .reference-photo{aspect-ratio:auto!important;flex:1;min-height:250px}
.guide-grid .guide-card h3{font:400 17px/1.5 Avenir,'Avenir Next',var(--sans);letter-spacing:0;margin-top:14px}
.guide-grid .guide-card:first-child h3{font-size:22px}
.property-card .reference-photo:after,.property-card .photo:after,.guide-card .reference-photo:after{transition:opacity var(--motion-duration) var(--motion-ease)}
.property-card .real-photo img,.property-card .photo img{transition:transform var(--motion-duration) var(--motion-ease)}
.property-card:hover .real-photo img,.property-card:focus-visible .real-photo img,.property-card:hover .photo img,.property-card:focus-visible .photo img{transform:scale(1.025)}
.property-card:hover .reference-photo:after,.property-card:focus-visible .reference-photo:after,.property-card:hover .photo:after,.property-card:focus-visible .photo:after,.guide-card:hover .reference-photo:after,.guide-card:focus-visible .reference-photo:after{opacity:.02}
.section-heading,.journal-heading{align-items:center}
.carousel-controls button{width:42px;height:42px}
.button{transition:background .3s ease,color .3s ease,border-color .3s ease}
.reveal-ready{opacity:0;transform:translateY(16px);transition:opacity var(--motion-duration) var(--motion-ease),transform var(--motion-duration) var(--motion-ease)}
.reveal-ready.is-visible{opacity:1;transform:none}
@media(max-width:700px){
 .brand-ribbon-item{width:180px;padding:0 30px}
 .brand-ribbon-item img{height:28px;width:120px}
 .brand-ribbon-item img[src*="mandarin"]{height:36px;width:100px}
 .brand-ribbon-item img[src*="porsche"]{height:18px;width:120px}
 .guide-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto;gap:28px 18px}
 .guide-grid .guide-card:first-child{grid-column:1/-1;grid-row:auto}
 .guide-grid .guide-card:first-child .reference-photo{aspect-ratio:1.57!important;min-height:0;flex:none}
 .guide-grid .guide-card .reference-photo{aspect-ratio:1.25!important}
 .guide-grid .guide-card h3{font-size:14px;margin-top:12px}
 .guide-grid .guide-card:first-child h3{font-size:18px}
 .carousel-controls button{width:34px;height:34px}
}
@media(prefers-reduced-motion:reduce){
 .brand-ribbon-track{animation:none;transform:none}
 .brand-ribbon-toggle{overflow-x:auto}
 .brand-ribbon-group[aria-hidden]{display:none}
 .reveal-ready{opacity:1;transform:none;transition:none}
 .property-card .real-photo img,.property-card .photo img,.property-card .reference-photo:after,.property-card .photo:after,.guide-card .reference-photo:after{transition:none}
 .property-card:hover img,.property-card:focus-visible img{transform:none!important}
}
/* Readability pass: body copy, controls and supporting labels. */
.island-description{font-size:16px;line-height:1.8}
.seller-copy .seller-aside{font-size:16px;line-height:1.8}
.journal-heading p{font-size:15px;line-height:1.8}
.button,.island-maps .island-link.button,.rental-reset{font-size:12px}
:is(.sale-grid,.rental-grid) .property-image-caption h3{font-size:clamp(16px,1.25vw,20px)}
:is(.sale-grid,.rental-grid) .property-image-caption p{font-size:12px}
.island-divider{font-size:12px}
.hero-caption>p{font-size:clamp(12px,.95vw,15px)}
.reference-footer h2{font-size:20px}
.reference-footer h3{font-size:14px;line-height:1.6}
.footer-columns a,.footer-columns button{font-size:13px;line-height:1.7}
.reference-footer .subscribe input,.reference-footer .subscribe button{font-size:12px}
.footer-legal{font-size:12px;line-height:1.7}
.journal{border-top:0;padding-bottom:calc(var(--section-space) + 48px)}
@media(min-width:701px) and (max-width:1100px){
 .site-header nav{font-size:12px;gap:14px;letter-spacing:.1em}
}
@media(max-width:700px){
 .island-description,.seller-copy .seller-aside{font-size:15px;line-height:1.8}
 .journal-heading p{font-size:14px;max-width:none}
 .guide-grid .guide-card h3{font-size:16px;line-height:1.5}
 :is(.sale-grid,.rental-grid) .property-image-caption h3{font-size:15px}
 .hero-actions .button,.menu-toggle{font-size:12px}
 .island-divider{font-size:12px}
 .journal{padding-bottom:calc(var(--section-space) + 36px)}
}
.site-header nav{font-size:clamp(12px,.82vw,14px)}


/* Original photographs and a quiet, separate brand column in the footer. */
.guide-grid .editorial-photo{position:relative;overflow:hidden}
.guide-grid .editorial-photo>img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;object-fit:cover;transform:none}
.guide-grid .guide-card:first-child .editorial-photo>img{object-position:center 55%}
.island-maps .island-photo{display:flex;align-items:center;justify-content:center}
.island-maps .island-photo img{width:85%;height:85%;object-fit:contain}
.reference-footer .footer-inner{display:grid;grid-template-columns:minmax(0,20fr) minmax(0,74fr);gap:6%}
.footer-content{min-width:0}
.footer-monogram{padding-top:0;align-self:center}
.footer-monogram img{display:block;width:100%;max-width:270px;height:auto;filter:brightness(0) invert(1);opacity:.075}
.reference-footer .footer-top{grid-template-columns:minmax(0,1fr) auto;gap:7%}
.reference-footer .footer-social{gap:20px}
.reference-footer .footer-social button{width:28px}
.reference-footer .footer-columns{grid-template-columns:1.15fr .8fr 1.25fr;gap:5%}
@media(min-width:701px) and (max-width:1100px){
 .reference-footer .footer-top{grid-template-columns:minmax(0,1fr);gap:24px}
 .reference-footer .footer-social{justify-content:flex-start;gap:24px}
 .reference-footer .footer-columns{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px 24px}
 .reference-footer .footer-conversation{grid-column:1/-1}
}
@media(max-width:700px){
 .reference-footer .footer-inner{grid-template-columns:minmax(0,1fr);gap:36px}
 .footer-monogram{padding-top:0}
 .footer-monogram img{width:130px;max-width:100%;transform:none}
 .reference-footer .footer-top{grid-template-columns:minmax(0,1fr);gap:24px}
 .reference-footer .footer-social{justify-content:flex-start;gap:24px}
 .reference-footer .footer-columns{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px 20px}
}

/* Carry the editorial typography and charcoal palette into the entrance. */
.site-header{padding-top:28px;padding-bottom:28px;align-items:center}
.site-header nav{align-items:center;font-family:Avenir,'Avenir Next',var(--sans);font-weight:400;letter-spacing:.09em;line-height:1.5}
.site-header .language-toggle{transform:none;height:28px}
.site-header .language-toggle img{width:21px;height:21px}
.site-header:not(.is-sticky) .original-logo{width:60px;opacity:.85}
.site-header:not(.is-sticky) nav{color:#eceeeb}
.site-header.is-sticky{background:rgba(32,37,35,.97);color:#e1e4df;box-shadow:0 1px 0 #ffffff12}
.site-header.is-sticky .original-logo,.site-header.is-sticky .language-toggle img{filter:brightness(0) invert(1);opacity:.85}
.hero::after,.hero:hover::after{background:linear-gradient(180deg,rgba(32,37,35,0) 0%,rgba(0,0,0,0) 48%,rgba(0,0,0,.2) 65%,rgba(0,0,0,.68) 84%,rgba(0,0,0,.84) 100%);opacity:1}
.hero-caption{bottom:clamp(56px,9svh,104px)}
.hero-caption>p{font:400 12px/1.6 Avenir,'Avenir Next',var(--sans);letter-spacing:.16em;color:#d9ded8;margin-bottom:16px}
.hero-caption h1{font:300 clamp(26px,2.35vw,36px)/1.3 Avenir,'Avenir Next',var(--sans);letter-spacing:.07em;color:#f5f6f3;-webkit-text-fill-color:#f5f6f3}
.hero-caption .hero-actions{margin-top:30px;gap:18px}
.hero-actions .button{width:210px;height:50px;min-height:50px;padding:14px 22px;font:400 12px/1.5 Avenir,'Avenir Next',var(--sans);letter-spacing:.09em}
.hero-primary{background:#f5f6f3;border-color:#f5f6f3;color:#202523}
.hero-caption .hero-secondary{border-color:#ffffff80;color:#f5f6f3}
.hero-caption .hero-secondary:hover{background:#f5f6f3;color:#202523}
@media(min-width:701px) and (max-width:1100px){.site-header nav{gap:16px;font-size:12px;letter-spacing:.06em}.site-header:not(.is-sticky) .original-logo{width:52px}}
@media(max-width:700px){
 .site-header{padding-top:24px;padding-bottom:24px}
 .site-header:not(.is-sticky) .original-logo{width:48px}
 .site-header .menu-toggle{top:34px;font-family:Avenir,'Avenir Next',var(--sans);letter-spacing:.09em}
 .hero-caption{bottom:56px}
 .hero-caption h1{font-size:25px;letter-spacing:.055em;max-width:340px}
 .hero-caption>p{font-size:12px;margin-bottom:14px}
 .hero-caption .hero-actions{gap:12px;margin-top:26px}
 .hero-actions .button{width:auto;min-width:0;max-width:190px;padding:13px 10px;font-size:11px;height:48px;min-height:48px}
}

/* White navigation and two balanced actions over a darker hero. */
.site-header:not(.is-sticky),.site-header:not(.is-sticky) nav,.site-header:not(.is-sticky) .menu-toggle{color:#f5f6f3}
.site-header:not(.is-sticky) .original-logo,.site-header:not(.is-sticky) .language-toggle img{filter:brightness(0) invert(1);opacity:.9}
@media(min-width:1101px){
 .site-header,.site-header.is-sticky{padding-left:calc(var(--content-edge) + 3vw);padding-right:calc(var(--content-edge) + 3vw)}
}
.hero::after,.hero:hover::after{background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.18) 18%,rgba(0,0,0,0) 35%,rgba(0,0,0,0) 48%,rgba(0,0,0,.2) 65%,rgba(0,0,0,.68) 84%,rgba(0,0,0,.84) 100%);opacity:1}

/* Gazette: quiet editorial column alongside a portrait story carousel. */
.journal{display:grid;grid-template-columns:minmax(0,35fr) minmax(0,61fr);column-gap:4%;align-items:stretch;padding-top:var(--section-space)}
.journal-heading{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:48px;margin:0;padding:5px 32px 0 0}
.journal-heading h2{font-size:28px;line-height:1.4;max-width:340px}
.journal-heading p{font:300 15px/1.85 Avenir,'Avenir Next',var(--sans);color:#626963;max-width:290px;margin:0 0 6px}
.journal .journal-controls{position:absolute;top:calc(var(--section-space) - 56px);right:0;margin:0;padding:0;display:flex;gap:8px}
.journal .guide-grid.carousel{display:grid;grid-template-columns:none;grid-template-rows:auto;grid-auto-flow:column;grid-auto-columns:calc((100% - 32px)/2.35);gap:16px;width:calc(100% + var(--content-edge,6vw));min-width:0;padding:0 0 8px;align-items:start}
.journal .guide-grid .guide-card,.journal .guide-grid .guide-card:first-child{display:flex;flex-direction:column;grid-column:auto;grid-row:auto;min-width:0;text-align:center}
.journal .guide-grid .guide-card .reference-photo,.journal .guide-grid .guide-card:first-child .reference-photo{width:100%;height:auto;aspect-ratio:.66!important;min-height:0;flex:none}
.journal .guide-grid .guide-card h3,.journal .guide-grid .guide-card:first-child h3{font:400 15px/1.6 Avenir,'Avenir Next',var(--sans);text-transform:uppercase;letter-spacing:.06em;margin:20px 10px 0}
.story-action{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-40%);background:#fff;color:#252b2a;padding:16px 22px;font:400 12px/1.5 Avenir,'Avenir Next',var(--sans);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap;opacity:0;transition:opacity .3s,transform .3s}
.guide-card:hover .story-action,.guide-card:focus-visible .story-action{opacity:1;transform:translate(-50%,-50%)}
@media(max-width:1100px) and (min-width:701px){.journal-heading h2{font-size:25px}.journal-heading{padding-right:12px}.journal-heading p{font-size:14px}}
@media(max-width:700px){
 .journal{grid-template-columns:minmax(0,1fr);gap:30px;padding-top:var(--section-space)}
 .journal-heading{padding:0;gap:16px}
 .journal-heading h2{font-size:22px;max-width:280px}
 .journal-heading p{font-size:14px;max-width:310px;margin:0}
 .journal .journal-controls{top:var(--section-space);right:0;gap:0}
 .journal .guide-grid.carousel{width:calc(100% + 6vw);grid-auto-columns:74%;gap:14px}
 .journal .guide-grid .guide-card .reference-photo,.journal .guide-grid .guide-card:first-child .reference-photo{aspect-ratio:.78!important}
 .journal .guide-grid .guide-card h3{font-size:14px;margin-top:16px}
}
@media(prefers-reduced-motion:reduce){.story-action{transition:none}}

/* Let the next property continue beyond the right viewport edge. */
.collection .sale-grid.carousel,.rentals .rental-grid.carousel{width:calc(100% + var(--content-edge,6vw));grid-auto-columns:calc((100% - var(--content-edge,6vw) - (var(--columns) - 1)*var(--grid-gap))/var(--columns))}
@media(max-width:700px){
 .collection .sale-grid.carousel,.rentals .rental-grid.carousel{width:calc(100% + 6vw);grid-auto-columns:calc((100% - 6vw)*.86)}
}
.site-header .member-toggle{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.member-toggle svg{flex:none}


/* Left-aligned hero signature on the shared content edge. */
.hero-caption{left:var(--content-edge,6vw);right:var(--content-edge,6vw);text-align:left}
.hero-caption>p{margin-bottom:18px}
.hero-caption h1{font-size:clamp(40px,4.0625vw,52px);line-height:1.12;letter-spacing:.035em;max-width:100%;margin:0;text-wrap:balance}
.hero-caption .hero-actions{justify-content:flex-start;margin-top:32px}
@media(max-width:700px){
 .hero-caption{left:6vw;right:6vw;bottom:48px}
 .hero-caption h1{font-size:clamp(36px,10vw,48px);line-height:1.14;letter-spacing:.025em;max-width:360px;margin:0}
 .hero-caption>p{margin-bottom:16px}
 .hero-caption .hero-actions{margin-top:28px}
}

.hero-caption h1 .hero-title-prefix{font-size:.55em;line-height:1.2;display:inline-block;vertical-align:baseline}

/* Keep the two title lines together without an oversized inline line box. */
.hero-caption h1{display:flex;flex-direction:column;align-items:flex-start;gap:4px;line-height:1.08}
.hero-caption h1 .hero-title-prefix{display:block;font-size:1em;line-height:1.08}
.hero-caption h1 .hero-title-main{display:block;line-height:1.08}
.hero-caption>p{margin-bottom:20px}
.hero-caption .hero-actions{margin-top:32px}

/* Lift the hero composition and anchor a quiet brand line below it. */
.hero-caption{bottom:clamp(116px,17svh,180px)}
.hero-signature{position:absolute;z-index:2;bottom:27px;left:6%;right:6%;margin:0;text-align:center;color:rgba(255,255,255,.82);font:300 14px/1.6 Avenir,'Avenir Next',var(--sans);letter-spacing:.035em}
@media(max-width:700px){.hero-caption{bottom:124px}.hero-signature{bottom:25px;font-size:12px;max-width:300px;margin:auto;letter-spacing:.02em}}

.hero-signature{text-transform:uppercase;font-size:12px;letter-spacing:.13em}
@media(max-width:700px){.hero-signature{font-size:11px;line-height:1.8;letter-spacing:.08em;max-width:320px}}

.hero-caption h1 .hero-title-main{font-size:1.3em}
@media(max-width:700px){.hero-caption h1 .hero-title-main{font-size:1.12em;letter-spacing:.015em}}

.hero-signature{left:var(--content-edge,6vw);right:var(--content-edge,6vw);text-align:left;max-width:none;margin:0}
@media(max-width:700px){.hero-signature{left:6vw;right:6vw;max-width:320px;margin:0}}
/* Gazette keeps the established portrait carousel, now linked to the guide library. */
.journal .gazette-intro p{font-size:16px;line-height:1.85}
.journal .gazette-all{display:inline-flex;margin-top:28px;border:1px solid #aeb3ab;padding:14px 26px;min-height:48px;font:400 12px/1.5 Avenir,'Avenir Next',var(--sans);text-transform:uppercase;letter-spacing:.07em;color:#303630;background:white}
.journal .gazette-all:hover{background:#262b28;color:white;border-color:#262b28}
.journal .gazette-photo-credits{display:block;width:fit-content;font:400 11px/1.6 Avenir,'Avenir Next',var(--sans);color:#72786e;margin-top:20px}
.journal .guide-card>.line{display:none}

/* Original partner artwork, scaled to the existing ribbon. */
.brand-ribbon-item img[src$="/eiva.svg"]{width:180px;max-width:none;height:54px;flex-shrink:0}
.brand-ribbon-item img[src$="/lionsgate-capital.svg"]{width:165px;height:47px}

.brand-ribbon-item img[src$="/lionsgate-gallery.svg"]{width:155px;height:24px;max-width:none;flex-shrink:0}

.brand-ribbon-item-eiva{width:clamp(240px,21vw,360px)}
@media(max-width:900px){.brand-ribbon-item-eiva{width:220px}}