/* Direct emerald canvas: shared public-site palette and outer surfaces. */
:root {
  --emerald-950: #051f1b;
  --emerald-900: #022f27;
  --emerald-800: #03382e;
  --emerald-700: #07543f;
  --emerald-600: #0b684f;
  --emerald-glow: rgba(35, 143, 108, .28);
  --emerald-glass: rgba(255, 255, 255, .08);
  --emerald-line: rgba(235, 250, 242, .2);
  --canvas-ink: #fffdf7;
  --canvas-muted: #cde8dc;
  --surface: #fffdf8;
  --surface-muted: #eef6f1;
  --surface-ink: #093b30;
  --surface-copy: #45665b;
  --canvas-shadow: 0 28px 70px -38px rgba(0, 20, 15, .72);
}

html,
body {
  background: var(--emerald-900);
}

body {
  color: var(--canvas-ink);
}

main,
#deferred-main,
main > section,
#deferred-main > section,
footer,
.hero,
.summer,
.winter,
.notes-band,
  .promo-band {
  background-color: transparent;
}

main {
  background:
    radial-gradient(circle at 78% 12%, var(--emerald-glow), transparent 38rem),
    radial-gradient(circle at 12% 68%, rgba(5, 31, 27, .42), transparent 46rem),
    linear-gradient(145deg, var(--emerald-800) 0%, var(--emerald-900) 48%, var(--emerald-950) 100%);
}

.nav,
.jnav {
  color: var(--canvas-ink);
  background: rgba(2, 47, 39, .96);
  border-bottom: 1px solid var(--emerald-line);
  box-shadow: none;
}

.nav .brand span,
.nav .links,
.jnav .brand span,
.jnav .links {
  color: var(--canvas-muted);
}

.nav .links a:hover,
.jnav .links a:hover {
  color: #fff;
}

.nav .call,
.jnav .call {
  color: var(--emerald-900);
  background: var(--canvas-ink);
}

.nav .call:hover,
.jnav .call:hover {
  color: var(--emerald-950);
  background: #d8efe2;
}

.burger span,
.jnav .burger span {
  background: var(--canvas-ink);
}

.summer,
.winter,
.notes-band {
  background-image: none;
}

footer,
.jfoot {
  background: var(--emerald-950);
}

.footbox {
  background: var(--emerald-950);
  color: var(--canvas-ink);
  border: 1px solid var(--emerald-line);
  box-shadow: var(--canvas-shadow);
}

.sec-h h2,
.sec-h p,
.summer-copy h2,
.summer-copy .lead,
.summer-facts li,
.winter-copy h2,
.winter-copy .lead,
.winter-facts li,
.jhead h1,
.jhead p,
.more > .t,
.goelse > .t,
.back {
  color: var(--canvas-ink);
}

.sec-h p,
.summer-copy .lead,
.winter-copy .lead,
.jhead p,
.back {
  color: var(--canvas-muted);
}

/* Light surfaces remain readable objects, never the section canvas. */
.bar,
.offer,
.room,
.jr,
.place,
.amen .a,
.jcard,
.pr-howto,
.pr-know,
.art-body,
.modal {
  color: var(--surface-ink);
}

.art-body {
  background: var(--surface);
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 32px;
  box-shadow: var(--canvas-shadow);
}

.art-body h1 {
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

.jhead,
.jgrid,
.more,
.goelse,
.practical,
.art-cta,
.back {
  position: relative;
}

.jfoot {
  color: var(--canvas-ink);
  border-radius: 40px 40px 0 0;
  border-top: 1px solid var(--emerald-line);
}

@media (max-width: 760px) {
  .nav .links,
  .jnav .links {
    color: var(--surface-copy);
    background: var(--surface);
  }

  .nav .links a:hover,
  .jnav .links a:hover {
    color: var(--surface-ink);
    background: var(--surface-muted);
  }

  .art-body {
    margin: 20px 16px 0;
    padding: 36px 22px 30px;
    border-radius: 24px;
  }
}

/* Home: editorial composition built on, rather than painted with, emerald. */
.hero {
  padding: 18px 24px 42px;
}

.herobox {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(430px, .88fr);
  gap: 18px;
  max-width: 1320px;
  margin: 0 auto;
  padding: 18px;
  color: var(--canvas-ink);
  background:
    radial-gradient(circle at 82% 10%, rgba(35, 143, 108, .28), transparent 28rem),
    linear-gradient(145deg, var(--emerald-700) 0%, var(--emerald-900) 58%, var(--emerald-950) 100%);
  border: 1px solid var(--emerald-line);
  border-radius: 40px;
  box-shadow: var(--canvas-shadow);
}

.hero-bg {
  position: relative;
  inset: auto;
  grid-column: 2;
  grid-row: 1;
  min-height: 600px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 30px;
  clip-path: none;
  transform: none;
  box-shadow: 0 28px 70px -34px rgba(0, 20, 15, .9);
}

.hero-bg:after {
  background: linear-gradient(180deg, rgba(3, 47, 39, .06), rgba(3, 47, 39, .32));
}

.hero-inner {
  grid-column: 1;
  grid-row: 1;
  min-height: 600px;
  padding: 38px 34px;
}

.herobox h1 {
  max-width: 650px;
  font-size: clamp(46px, 3.75vw, 54px);
  line-height: 1.08;
}

.bar {
  margin-top: -30px;
  border: 1px solid rgba(255, 255, 255, .58);
  box-shadow: var(--canvas-shadow);
}

.bar-consent,
.bar-soon {
  color: var(--canvas-muted);
}

.bar-consent a {
  color: #fff;
}

.sec {
  padding-top: clamp(68px, 8vw, 112px);
  padding-bottom: clamp(68px, 8vw, 112px);
}

.sec-h .t,
.notes-head .t,
.rev-mast-b .t,
.pb-k {
  color: #aee3cf;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.sec-h h2,
.rev-mast-b h2,
.notes-head h2,
.jr-head .all {
  color: var(--canvas-ink);
}

.jr-head .all {
  border-color: var(--emerald-line);
}

.offer,
.wf,
.rev,
.gnote,
.bx,
.jcard,
.place,
.faq-item,
.faq-cta,
.benefit,
.st-in {
  border: 1px solid rgba(255, 255, 255, .48);
  box-shadow: var(--canvas-shadow);
}

.offer,
.wf,
.rev,
.gnote,
.bx,
.place,
.faq-item,
.faq-cta,
.benefit,
.st-in,
.locbox {
  color: var(--surface-ink);
}

.amen {
  background: var(--emerald-glass);
  border: 1px solid var(--emerald-line);
  box-shadow: var(--canvas-shadow);
}

.poolband {
  width: min(1280px, calc(100% - 48px));
  min-height: 650px;
  margin: 0 auto 56px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 38px;
  box-shadow: var(--canvas-shadow);
}

.summer,
.winter {
  width: min(1280px, calc(100% - 48px));
  margin: 56px auto;
  overflow: hidden;
  background: linear-gradient(145deg, var(--emerald-700) 0%, var(--emerald-800) 44%, var(--emerald-900) 100%);
  border: 1px solid var(--emerald-line);
  border-radius: 38px;
  box-shadow: var(--canvas-shadow);
}

.summer-copy,
.winter-copy {
  color: var(--canvas-ink);
}

.summer-copy {
  padding-top: clamp(38px, 4vw, 54px);
  padding-bottom: clamp(32px, 3.5vw, 44px);
}

.summer-anchor {
  min-height: clamp(390px, 43vw, 550px);
}

.summer-copy .kicker,
.winter-copy .kicker {
  color: #aee3cf;
}

.summer-facts li svg,
.winter-facts li svg {
  color: #aee3cf;
}

.summer-facts li span {
  color: var(--canvas-muted);
}

.summer-specs li {
  background: rgba(255, 255, 255, .1);
  color: var(--canvas-ink);
  border-color: var(--emerald-line);
}

.summer-specs li svg {
  color: #aee3cf;
}

.incl-box {
  padding: 28px;
  background: var(--emerald-glass);
  border: 1px solid var(--emerald-line);
  border-radius: 26px;
}

.incl-list li {
  color: var(--canvas-ink);
}

.territory-legend {
  border: 1px solid var(--emerald-line);
  background: linear-gradient(135deg, var(--emerald-700), var(--emerald-950));
  box-shadow: var(--canvas-shadow);
}

.promo-band {
  border: 1px solid rgba(255, 255, 255, .48);
  box-shadow: var(--canvas-shadow);
}

.rev-mast .rate {
  color: var(--canvas-ink);
}

.rev-mast-b p,
.notes-head p,
.bx-lead {
  color: var(--canvas-muted);
}

.notes-band {
  margin: 20px 0 0;
  background: linear-gradient(180deg, rgba(5, 31, 27, .62), rgba(7, 84, 63, .26));
  border-top: 1px solid var(--emerald-line);
  border-bottom: 1px solid var(--emerald-line);
}

.season-teaser {
  padding-top: 48px;
  padding-bottom: 48px;
}

.locbox {
  padding: clamp(22px, 4vw, 40px);
  background: var(--emerald-glass);
  border: 1px solid var(--emerald-line);
  border-radius: 30px;
  box-shadow: var(--canvas-shadow);
}

.loc-info .sec-h h2,
.loc-info p,
.loc-list li,
.loc-info .ig-loc,
.loc-info .ig-note {
  color: var(--canvas-ink);
}

.loc-info p,
.loc-list li,
.loc-info .ig-note {
  color: var(--canvas-muted);
}

.loc-list li:before {
  color: #aee3cf;
}

.footbox .ig-loc {
  color: #aee3cf;
}

@media (max-width: 820px) {
  .hero {
    padding: 10px 12px 34px;
  }

  .herobox {
    grid-template-columns: 1fr;
    grid-template-rows: 170px auto;
    gap: 0;
    padding: 10px;
    border-radius: 30px;
  }

  .hero-bg {
    grid-column: 1;
    grid-row: 1;
    min-height: 170px;
    border-radius: 22px;
  }

  .hero-bg img {
    object-position: center 57%;
  }

  .hero-bg:after {
    background: linear-gradient(180deg, rgba(3, 47, 39, .02), rgba(3, 47, 39, .24));
  }

  .hero-inner {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
    padding: 20px 14px 16px;
  }

  .herobox h1 {
    font-size: clamp(30px, 8vw, 34px);
    line-height: 1.09;
  }

  .herobox .lead {
    font-size: 14px;
  }

  .hero-price b.disp {
    font-size: 30px;
  }

  .bar {
    width: calc(100% - 32px);
    margin-top: -12px;
  }

  .poolband,
  .summer,
  .winter {
    width: calc(100% - 24px);
    border-radius: 28px;
  }

  .poolband {
    min-height: 570px;
  }

}

@media (max-width: 420px) {
  .hero .badge {
    font-size: 9.5px;
  }

  .hero-inner {
    padding-top: 20px;
  }

  .hero-cta {
    margin-top: 12px;
  }

  .hero-book {
    min-height: 50px;
    padding: 13px 22px;
  }

  .sec {
    padding-top: 66px;
    padding-bottom: 66px;
  }
}

/* Journal, articles and privacy keep the same emerald perimeter. */
.jhead .t {
  color: #aee3cf;
}

.jhead::after,
.art-body > h1::after {
  content: "";
  display: block;
  width: 76px;
  height: 2px;
  margin-top: 22px;
  border-radius: 999px;
  background: linear-gradient(90deg, #aee3cf, rgba(174, 227, 207, 0));
}

.art-body > h1::after {
  margin-top: 18px;
  background: linear-gradient(90deg, var(--emerald-600), rgba(20, 115, 91, 0));
}

.jgrid {
  position: relative;
}

.art-hero {
  width: min(1280px, calc(100% - 48px));
  min-height: 620px;
  margin: 20px auto 0;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 38px;
  box-shadow: var(--canvas-shadow);
}

.art-body {
  max-width: 780px;
  margin: 40px auto 0;
  padding: 54px clamp(28px, 5vw, 64px) 48px;
}

.art-body + .art-cta,
.practical,
.goelse,
.more {
  margin-top: 30px;
}

.goelse-links a,
.goelse-places {
  color: var(--canvas-muted);
}

.goelse-links a:hover,
.goelse-places:hover {
  color: #fff;
}

.goelse-links a:before {
  color: #aee3cf;
}

.goelse-places {
  border-color: var(--emerald-line);
}

.practical,
.art-cta,
.more {
  color: var(--canvas-ink);
}

.pr-grid,
.more .row {
  color: var(--surface-ink);
}

.art-cta .box {
  color: var(--canvas-ink);
}

.stickybook {
  color: var(--canvas-ink);
  background: var(--emerald-950);
  border-top: 1px solid var(--emerald-line);
}

/* Booking remains a readable light workspace inside the dark canvas. */
.overlay {
  padding:
    max(12px, env(safe-area-inset-top))
    max(12px, env(safe-area-inset-right))
    max(12px, env(safe-area-inset-bottom))
    max(12px, env(safe-area-inset-left));
  background: rgba(3, 47, 39, .8);
}

.modal {
  max-height: min(90dvh, 760px);
  overscroll-behavior: contain;
  background: var(--surface-muted);
  border: 1px solid rgba(255, 255, 255, .58);
  box-shadow: 0 34px 90px -30px rgba(0, 20, 15, .9);
}

@media (max-width: 760px) {
  .art-hero {
    width: calc(100% - 24px);
    min-height: 58svh;
    margin-top: 12px;
    border-radius: 28px;
  }

  .art-body {
    margin: 20px 14px 0;
    padding: 36px 22px 34px;
  }

  .jhead {
    padding: 48px 20px 8px;
  }

  .jgrid {
    padding-left: 20px;
    padding-right: 20px;
  }

  .jfoot {
    padding-bottom: 104px;
  }

  .overlay {
    align-items: flex-start;
  }

  .modal {
    max-height: calc(100dvh - max(24px, env(safe-area-inset-top) + env(safe-area-inset-bottom)));
    border-radius: 24px;
  }
}

/* Background/logo/surface release patch: the approved landscape is the
   atmospheric canvas; the real property image remains a framed photograph. */
.hero{position:relative;padding:28px 0 68px;background:#063f34;overflow:hidden;isolation:isolate}
.hero-atmosphere{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-atmosphere picture,.hero-atmosphere img{display:block;width:100%;height:100%}
.hero-atmosphere img{object-fit:cover;object-position:center 68%;filter:saturate(.92) contrast(1.02)}
.hero-atmosphere:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,47,39,.1),rgba(2,47,39,.08) 58%,rgba(2,47,39,.58)),linear-gradient(90deg,rgba(2,47,39,.28),transparent 30%,transparent 72%,rgba(2,47,39,.22))}
.herobox{position:relative;z-index:1;display:block;max-width:1360px;min-height:690px;margin:0 auto;padding:0;overflow:visible;background:transparent;border:0;isolation:isolate}
.hero-inner{position:absolute;inset:0 auto 0 max(28px,calc((100vw - 1280px)/2));width:620px;max-width:calc(50vw - 38px);min-height:690px;margin:0;padding:48px 52px;justify-content:center;border:1px solid rgba(255,255,255,.2);border-radius:30px;background:linear-gradient(145deg,rgba(3,60,49,.9),rgba(3,47,39,.78));box-shadow:0 28px 80px -38px rgba(0,0,0,.72);backdrop-filter:blur(8px)}
.hero-inner:before{display:none}
.hero-lines .hl,.hero-lines .hl span{overflow:visible}
.hero-bg{position:absolute;inset:54px max(28px,calc((100vw - 1280px)/2)) auto auto;width:min(40vw,520px);height:510px;clip-path:none;transform:none;border:1px solid rgba(255,255,255,.34);border-radius:28px;overflow:hidden;box-shadow:0 34px 86px -34px rgba(0,0,0,.76)}
.hero-bg:after{background:linear-gradient(180deg,transparent 55%,rgba(2,47,39,.34))}
.atmosphere-stage{height:clamp(360px,34vw,520px);margin:36px 0 86px;-webkit-mask-image:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent)}
.atmosphere-stage img{object-position:center 70%;opacity:.96;filter:saturate(.9) contrast(1.01)}
.atmosphere-stage:after{background:linear-gradient(90deg,rgba(2,47,39,.3),transparent 28%,transparent 76%,rgba(2,47,39,.28)),linear-gradient(180deg,rgba(2,47,39,.12),transparent 32%,rgba(2,47,39,.26))}
@media(max-width:900px) and (min-width:641px){
  .hero-inner{left:24px;width:54vw;max-width:none;padding:40px 34px}
  .hero-bg{right:24px;width:39vw}
}
@media(max-width:640px){
  .hero{padding:12px 12px 34px;min-height:1120px}
  .hero-atmosphere img{object-position:center 62%}
  .hero-atmosphere:after{background:linear-gradient(180deg,rgba(2,47,39,.08),rgba(2,47,39,.16) 62%,rgba(2,47,39,.6))}
  .herobox{display:block;min-height:1074px;padding:0}
  .hero-inner{position:absolute;inset:18px 12px auto;width:auto;max-width:none;min-height:610px;margin:0;padding:34px 24px;border-radius:26px;background:linear-gradient(160deg,rgba(3,60,49,.91),rgba(3,47,39,.78));backdrop-filter:blur(6px)}
  .hero-bg{position:absolute;inset:auto 12px 18px;width:auto;height:300px;border-radius:24px}
  .hero-bg img{object-position:center 56%}
  .atmosphere-stage{height:500px;margin:18px 0 58px}
  .atmosphere-stage img{object-position:center 63%;opacity:.95}
}

/* Package 2: three material levels over the emerald atmospheric canvas. */
:root{
  --patch-ivory:#f7f2e8;
  --patch-warm:#efe5d4;
  --patch-sage:#dce9df;
  --patch-ink:#123c32;
  --patch-copy:#426358;
  --patch-line:rgba(18,60,50,.16);
  --patch-shadow:0 30px 72px -38px rgba(0,24,18,.74);
}
.hero-inner{
  color:var(--patch-ink);
  border-color:rgba(255,255,255,.7);
  background:linear-gradient(145deg,rgba(247,242,232,.97),rgba(239,229,212,.93));
  box-shadow:var(--patch-shadow);
  backdrop-filter:blur(10px);
}
.hero .badge{color:#2f6555;opacity:1}
.hero .lead,.hero-book-sub{color:var(--patch-copy);opacity:1;text-shadow:none}
.hero-price,.hero-price b.disp,.hero-price b.disp span{color:var(--patch-ink);text-shadow:none}
.hero-book{background:var(--patch-ink);color:var(--patch-ivory);box-shadow:0 18px 38px -22px rgba(0,35,26,.8)}
.hero-book:hover{background:#1c5b4a;color:#fff}
.chips{color:#31594f;opacity:1;text-shadow:none}
.chips span:before{background:#3b806a}

.summer{border-color:rgba(247,242,232,.42);background:var(--patch-ivory)}
.summer-copy{color:var(--patch-ink);background:linear-gradient(150deg,var(--patch-ivory),#f4ecdf)}
.summer-copy h2{color:var(--patch-ink)}
.summer-copy .kicker{color:#7b5034}
.summer-copy .lead,.summer-facts li span{color:var(--patch-copy)}
.summer-facts li{color:var(--patch-ink);background:var(--patch-sage);border-color:var(--patch-line);box-shadow:0 10px 24px -24px rgba(0,35,26,.6)}
.summer-specs{background:var(--patch-warm);border-color:rgba(87,65,37,.16)}
.summer-specs li{color:var(--patch-ink);background:rgba(255,255,255,.46);border-color:var(--patch-line)}
.summer-specs li svg{color:#32705d}

.amen{background:transparent;border:0;box-shadow:none}
.amen .in{padding:16px 0}
.amen .a{background:var(--patch-ivory);border:1px solid rgba(255,255,255,.55);box-shadow:var(--patch-shadow)}
.amen .a:nth-child(2n){background:var(--patch-sage)}
.amen .a:nth-child(3n){background:var(--patch-warm)}
.amen .a b{color:var(--patch-ink)}
.feature-icon-frame{background:rgba(255,255,255,.56);border-color:var(--patch-line)}

.incl-box{background:var(--patch-warm);border-color:rgba(255,255,255,.62);box-shadow:var(--patch-shadow)}
.incl-list li{color:var(--patch-ink)}
.benefit:nth-child(2){background:var(--patch-sage)}
.benefit:nth-child(3){background:var(--patch-warm)}
.territory-legend{color:var(--patch-ink);background:var(--patch-sage);border-color:rgba(255,255,255,.58)}
.territory-item{background:rgba(255,255,255,.48);border:1px solid var(--patch-line)}
.territory-item .benefit-icon{color:#2e6c59}
.wf:nth-child(2),.bx.week{background:var(--patch-sage)}
.wf:nth-child(3){background:var(--patch-warm)}
.locbox{background:rgba(247,242,232,.96);border-color:rgba(255,255,255,.64);box-shadow:var(--patch-shadow)}
.loc-info .sec-h h2,.loc-info p,.loc-list li,.loc-info .ig-loc,.loc-info .ig-note{color:var(--patch-ink)}
.loc-info p,.loc-list li,.loc-info .ig-note{color:var(--patch-copy)}

@media(max-width:640px){
  .hero-inner{background:linear-gradient(155deg,rgba(247,242,232,.97),rgba(239,229,212,.94));backdrop-filter:blur(8px)}
  .amen .in{padding:10px 0;gap:12px}
  .amen .a{padding:20px 10px 18px}
}

/* Official circular emblem in every public header; the nearby copy is location only. */
.brand{display:flex;align-items:center;gap:10px}
.brand-emblem{display:block;width:68px;height:68px;object-fit:contain;flex:none;border-radius:50%;filter:drop-shadow(0 7px 12px rgba(0,20,14,.24))}
.brand-copy{display:block;min-width:0}
.brand-copy b{display:block}
.nav .brand-emblem{width:68px;height:68px}
@media(max-width:640px){
  .brand{gap:8px}
  .brand-emblem,.nav .brand-emblem{width:60px;height:60px}
}
