/* Nalandhoo — The Neighbourhood (section styles). Reuses site :root vars + Cormorant/Inter. */
:root{
  --ocean:#0B2E40; --ocean-deep:#04111B; --lagoon:#2D6E7E; --lagoon-pale:#A8C9C5;
  --sand:#93AEB3; --cream:#EEF1F2; --gold:#5C9BA6; --charcoal:#1A1A1A;
  --t-ultra:#86DCE6; --t-luxury:#5C9BA6; --t-upper:#93AEB3; --t-upscale:#55757F;
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-sans:'Inter',-apple-system,system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
.preview-strip{position:sticky;top:0;z-index:50;background:rgba(4,17,27,.92);backdrop-filter:blur(8px);
  border-bottom:.5px solid rgba(238,241,242,.1);padding:9px 20px;display:flex;gap:14px;align-items:center;
  font-size:11px;letter-spacing:.04em;color:rgba(238,241,242,.6)}
.preview-strip b{color:var(--gold);font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:10px}
.preview-strip i{font-style:italic;color:rgba(238,241,242,.75)}

.nbhd{background:var(--ocean-deep);color:var(--cream);padding:clamp(64px,9vh,120px) 0 clamp(72px,11vh,150px);
  position:relative;overflow:hidden}
.nbhd::before{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 38%,rgba(45,110,126,.16),transparent 60%);pointer-events:none}
.nbhd__inner{max-width:1280px;margin:0 auto;padding:0 clamp(24px,5vw,72px);position:relative}

.nbhd__eyebrow{font-size:11px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.nbhd__title{font-family:var(--font-display);font-weight:400;font-size:clamp(42px,6vw,88px);line-height:1.02;
  letter-spacing:.01em;color:var(--cream);margin:12px 0 18px}
.nbhd__lede{font-family:var(--font-display);font-weight:300;font-size:clamp(19px,2.1vw,28px);line-height:1.45;
  color:rgba(238,241,242,.74);max-width:66ch}

.nbhd__controls{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;
  margin:clamp(32px,5vh,52px) 0 24px;padding-bottom:20px;border-bottom:.5px solid rgba(238,241,242,.1)}
.tiers{display:inline-flex;flex-wrap:wrap;gap:6px}
.tier-btn{font-family:var(--font-sans);font-size:12px;letter-spacing:.04em;color:rgba(238,241,242,.7);
  background:transparent;border:.5px solid rgba(238,241,242,.18);padding:9px 15px;cursor:pointer;
  transition:all .25s var(--ease);display:inline-flex;align-items:center;gap:8px;border-radius:1px}
.tier-btn:hover{color:var(--cream);border-color:rgba(238,241,242,.4)}
.tier-btn .dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.9}
.tier-btn.is-active{color:var(--ocean-deep)!important;background:var(--chip);border-color:transparent;font-weight:600}
.tier-btn.is-active .dot{background:var(--ocean-deep)}
.legend{display:inline-flex;gap:18px;align-items:center;font-size:11px;letter-spacing:.04em;color:rgba(238,241,242,.62)}
.legend i{font-style:normal;display:inline-flex;align-items:center;gap:7px}
.legend .mk{width:12px;height:12px;border-radius:50%;display:inline-block}
.legend .mk--op{background:var(--legendcol,var(--gold))}
.legend .mk--an{background:transparent;border:1.5px solid var(--legendcol,var(--gold))}

.nbhd__grid{display:grid;grid-template-columns:minmax(320px,520px) 1fr;gap:clamp(28px,4vw,64px);
  align-items:stretch;margin-top:8px}
@media(max-width:920px){.nbhd__grid{grid-template-columns:1fr;gap:32px}}

.nbhd-map{position:relative;width:100%;text-align:center;border:.5px solid rgba(238,241,242,.1);
  background:radial-gradient(ellipse at 60% 30%,#0a2630 0%,#061a22 55%,#04141c 100%);border-radius:2px;overflow:hidden}
.nbhd-map svg{display:block;height:clamp(460px,80vh,840px);width:auto;max-width:100%;margin:0 auto}
@media(max-width:920px){.nbhd-map svg{height:clamp(460px,72vh,680px)}}
.nbhd-map__hint{position:absolute;left:14px;bottom:12px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(238,241,242,.4);pointer-events:none;max-width:58%;text-align:left}
.nbhd-map__scale{position:absolute;right:14px;bottom:12px;display:flex;align-items:center;gap:8px;
  font-size:10px;letter-spacing:.1em;color:rgba(238,241,242,.5);pointer-events:none}
.nbhd-map__scale .bar{height:2px;background:rgba(238,241,242,.55);display:inline-block}

/* chart layers */
.reef{fill:rgba(92,155,166,.06);stroke:rgba(92,155,166,.16);stroke-width:.4}
.lagoon{fill:rgba(92,170,180,.16);stroke:none}
.nb-island{fill:rgba(205,217,210,.62);stroke:rgba(238,241,242,.35);stroke-width:.35}
.ring--hero{fill:none;stroke:var(--gold);stroke-width:1.3;stroke-dasharray:5 5;opacity:.92}
.ring-label--hero{font-family:var(--font-sans);font-size:10px;letter-spacing:.1em;fill:var(--gold);
  text-transform:uppercase;font-weight:600;opacity:.95;paint-order:stroke;stroke:rgba(4,17,27,.8);stroke-width:2.4}
.atoll-label{font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  fill:rgba(238,241,242,.46);paint-order:stroke;stroke:rgba(4,17,27,.82);stroke-width:2.6;stroke-linejoin:round}
.resort{cursor:pointer}
.resort .r-dot{transition:r .18s var(--ease),stroke-width .2s}
.resort:hover .r-dot,.resort.is-hi .r-dot{stroke:var(--cream);stroke-width:1.6}
.poi-label{font-family:var(--font-sans);letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  paint-order:stroke;stroke:rgba(4,17,27,.85);stroke-width:2.8;stroke-linejoin:round}
.nal-label{font-size:13px;fill:var(--cream)}
.maf-label{font-size:11px;fill:rgba(238,241,242,.9)}
.crosshair{stroke:var(--gold);stroke-width:1.2}

.nbhd-tip{position:absolute;z-index:20;pointer-events:none;opacity:0;transform:translate(-50%,calc(-100% - 14px));
  transition:opacity .15s;min-width:184px;max-width:236px;background:rgba(4,17,27,.97);
  border:.5px solid rgba(238,241,242,.18);border-left:2.5px solid var(--gold);padding:12px 14px;border-radius:2px;
  box-shadow:0 18px 50px rgba(0,0,0,.55);text-align:left}
.nbhd-tip.show{opacity:1}
.nbhd-tip h4{font-family:var(--font-display);font-weight:500;font-size:18px;line-height:1.12;color:var(--cream);margin-bottom:3px}
.nbhd-tip .brand{font-size:10px;letter-spacing:.08em;color:var(--gold);text-transform:uppercase;margin-bottom:10px}
.nbhd-tip dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:11.5px;align-items:center}
.nbhd-tip dt{color:rgba(238,241,242,.5)}
.nbhd-tip dd{color:rgba(238,241,242,.92);text-align:right;font-variant-numeric:tabular-nums}
.nbhd-tip .st{display:inline-block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:1px 6px;border-radius:2px}
.nbhd-tip .st--op{background:rgba(92,155,166,.22);color:var(--lagoon-pale)}
.nbhd-tip .st--an{background:transparent;border:1px solid var(--gold);color:var(--gold)}

.nbhd-stats{display:flex;flex-direction:column;justify-content:flex-start}
.nbhd-stat__fig{font-family:var(--font-display);font-weight:300;font-size:clamp(66px,8vw,108px);line-height:.9;
  color:var(--cream);letter-spacing:-.01em}
.nbhd-stat__fig em{font-style:normal;color:var(--gold);font-size:.26em;letter-spacing:0;margin-left:10px;font-family:var(--font-sans)}
.nbhd-stat__lab{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:rgba(238,241,242,.82);margin-top:14px}
.nbhd-stat__sub{font-size:12px;color:rgba(238,241,242,.5);margin-top:6px;letter-spacing:.01em}
.nbhd-split{display:flex;margin:28px 0;border-top:.5px solid rgba(238,241,242,.12);border-bottom:.5px solid rgba(238,241,242,.12)}
.nbhd-split>div{flex:1;padding:18px 0;border-left:.5px solid rgba(238,241,242,.12)}
.nbhd-split>div:first-child{border-left:none;padding-left:0}
.nbhd-split>div:last-child{padding-left:18px}
.nbhd-split .n{font-family:var(--font-display);font-size:38px;font-weight:300;color:var(--cream);line-height:1}
.nbhd-split .n.hl{color:var(--gold)}
.nbhd-split .l{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(238,241,242,.5);margin-top:9px;line-height:1.4}
.nbhd-callout{border-left:2px solid var(--gold);padding:4px 0 4px 18px;margin:4px 0 26px}
.nbhd-callout p{font-family:var(--font-display);font-weight:400;font-size:clamp(18px,2vw,24px);line-height:1.32;color:var(--cream)}
.nbhd-callout p b{color:var(--gold);font-weight:500}
.nbhd-gate{font-size:11.5px;line-height:1.62;color:rgba(238,241,242,.52);letter-spacing:.01em;
  background:rgba(238,241,242,.03);border:.5px solid rgba(238,241,242,.08);padding:14px 16px;border-radius:2px}
.nbhd-gate a{color:var(--gold);border-bottom:.5px solid rgba(92,155,166,.5);white-space:nowrap}
.nbhd-gate a:hover{color:var(--lagoon-pale)}
.nbhd__thesis{font-family:var(--font-display);font-weight:400;font-size:clamp(19px,1.7vw,23px);line-height:1.34;color:var(--cream);margin-top:30px;padding-top:24px;border-top:.5px solid rgba(238,241,242,.14)}
.nbhd__source{margin-top:12px;font-size:10.5px;line-height:1.55;color:rgba(168,201,197,.42);letter-spacing:.02em}
.nbhd__source b{color:rgba(168,201,197,.6);font-weight:500}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
