:root {
  --ink: #080b12;
  --ink-soft: #10141d;
  --ivory: #f4f0e8;
  --paper: #fbf9f4;
  --gold: #c9ad70;
  --gold-light: #e0ca98;
  --line: rgba(201, 173, 112, .32);
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
img { display: block; max-width: 100%; }

.luxury-eyebrow { margin: 0 0 1.2rem; color: #9a7a3f; font-size: .68rem; font-weight: 700; letter-spacing: .23em; text-transform: uppercase; }
.public-header { position: fixed; z-index: 30; inset: 0 0 auto; display: flex; align-items: center; justify-content: space-between; min-height: 92px; padding: 0 5.5vw; color: #fff; border-bottom: 1px solid rgba(255,255,255,.11); background: linear-gradient(to bottom, rgba(5,7,12,.92), rgba(5,7,12,.54)); backdrop-filter: blur(16px); }
.public-brand { display: flex; align-items: center; gap: 14px; }
.public-brand-mark { display: grid; place-items: center; width: 42px; aspect-ratio: .82; color: var(--gold-light); font-family: var(--serif); font-size: 1.25rem; border: 1px solid var(--gold); clip-path: polygon(50% 0, 96% 22%, 88% 80%, 50% 100%, 12% 80%, 4% 22%); }
.public-brand > span:last-child { display: grid; gap: 4px; }
.public-brand strong { font-family: var(--serif); font-size: 1.04rem; letter-spacing: .28em; }
.public-brand small { color: rgba(255,255,255,.55); font-size: .56rem; letter-spacing: .18em; text-transform: uppercase; }
.public-header nav { display: flex; align-items: center; gap: 2.2rem; font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.public-header nav a { transition: color .25s; }
.public-header nav a:hover { color: var(--gold-light); }
.public-header-cta { padding: 15px 20px; border: 1px solid var(--line); }

.collection-hero { position: relative; display: grid; align-content: center; min-height: 88vh; padding: 140px 8vw 90px; overflow: hidden; color: white; background: radial-gradient(circle at 78% 38%, rgba(157,127,69,.22), transparent 25%), radial-gradient(circle at 25% 80%, rgba(53,67,91,.22), transparent 34%), linear-gradient(135deg, #05070c, #0b0f18 65%, #15120e); }
.collection-hero::before, .collection-hero::after { content: ""; position: absolute; border: 1px solid rgba(201,173,112,.1); border-radius: 50%; }
.collection-hero::before { width: 52vw; height: 52vw; right: -20vw; top: -23vw; }
.collection-hero::after { width: 32vw; height: 32vw; right: 3vw; top: 8vw; }
.collection-hero h1 { max-width: 900px; margin: 0; font: 400 clamp(4rem, 8.5vw, 9rem)/.86 var(--serif); letter-spacing: -.055em; }
.collection-hero h1 em { color: var(--gold-light); font-weight: 400; }
.collection-hero > p:not(.luxury-eyebrow) { max-width: 570px; margin: 2.5rem 0 0; color: rgba(255,255,255,.68); font: 400 1.05rem/1.8 var(--serif); }
.round-scroll { position: absolute; right: 6vw; bottom: 4vw; display: grid; place-items: center; width: 68px; height: 68px; border: 1px solid var(--line); border-radius: 50%; color: var(--gold-light); }

.collection-list { padding: 9rem 6vw 10rem; }
.collection-heading { display: grid; grid-template-columns: .65fr 1.8fr; align-items: end; gap: 4vw; max-width: 1300px; margin: auto auto 5rem; }
.collection-heading > div { display: flex; align-items: flex-end; gap: 1.5rem; border-bottom: 1px solid #d7d0c2; padding-bottom: 1rem; }
.collection-heading > div span { color: #7e7467; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; }
.collection-heading > div strong { margin-left: auto; color: var(--gold); font: 400 2.3rem/1 var(--serif); }
.collection-heading h2, .owner-proof h2, .gallery-heading h2, .amenities-heading h2, .inmy-experience h2, .stay-section h2 { margin: 0; font: 400 clamp(3rem, 5vw, 6.5rem)/.94 var(--serif); letter-spacing: -.045em; }
.collection-heading h2 em, .owner-proof h2 em, .gallery-heading h2 em, .amenities-heading h2 em, .inmy-experience h2 em, .stay-section h2 em { color: #9e8048; font-weight: 400; }
.property-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5rem 2.3rem; max-width: 1400px; margin: auto; }
.property-card { display: block; }
.property-card:nth-child(even) { transform: translateY(5rem); }
.property-card-image { position: relative; aspect-ratio: 1.35; overflow: hidden; background: #0a0d14; }
.property-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.property-card:hover .property-card-image img { transform: scale(1.035); }
.property-card-placeholder img { object-fit: contain; opacity: .45; padding: 10%; filter: sepia(.2) brightness(.7); background: radial-gradient(circle, #313443, #080b12 68%); }
.property-card-arrow { position: absolute; right: 1.3rem; top: 1.3rem; display: grid; place-items: center; width: 46px; height: 46px; background: rgba(8,11,18,.68); color: var(--gold-light); border: 1px solid var(--line); border-radius: 50%; backdrop-filter: blur(10px); }
.demo-badge { position: absolute; left: 1.3rem; top: 1.3rem; padding: 9px 12px; color: white; background: rgba(8,11,18,.68); border: 1px solid rgba(255,255,255,.18); font-size: .58rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.property-card-copy { padding: 1.5rem 0; border-bottom: 1px solid #d9d2c4; }
.property-card-copy p { margin: 0 0 .65rem; color: #8c7f6c; font-size: .65rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.property-card-copy h3 { margin: 0; font: 400 clamp(2rem, 3vw, 3.4rem)/1 var(--serif); }
.property-card-copy > div { display: flex; gap: 1.4rem; margin-top: 1.2rem; color: #6c665d; font-size: .72rem; }
.collection-empty { grid-column: 1 / -1; padding: 5rem; text-align: center; color: white; background: var(--ink); }
.collection-empty > span { color: var(--gold-light); font-size: .65rem; letter-spacing: .18em; text-transform: uppercase; }
.collection-empty h3 { max-width: 700px; margin: 2rem auto; font: 400 clamp(2.5rem, 5vw, 5rem)/1 var(--serif); }
.collection-empty p { max-width: 560px; margin: auto; color: rgba(255,255,255,.65); line-height: 1.8; }
.owner-proof { padding: 10rem 8vw; color: white; text-align: center; background: radial-gradient(circle at 50% 35%, #25202a 0, #0a0d14 45%, #05070c 80%); }
.owner-proof p:not(.luxury-eyebrow) { max-width: 650px; margin: 2.4rem auto; color: rgba(255,255,255,.65); font: 1.1rem/1.8 var(--serif); }
.gold-button { display: inline-flex; align-items: center; justify-content: center; gap: 2rem; min-height: 58px; padding: 0 1.8rem; color: #13110d; background: linear-gradient(110deg, #c9ad70, #ecd79e); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.public-footer { display: flex; align-items: center; justify-content: space-between; padding: 3rem 6vw; color: white; background: #05070c; border-top: 1px solid rgba(255,255,255,.1); }
.public-footer p { color: rgba(255,255,255,.45); font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }

/* Property page */
.property-nav { position: fixed; z-index: 50; inset: 0 0 auto; display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; min-height: 76px; padding: 0 2.5vw; color: white; background: rgba(5,7,12,.84); border-bottom: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(18px); }
.property-close { display: grid; place-items: center; width: 40px; height: 40px; margin-right: 1.6rem; color: rgba(255,255,255,.75); border: 1px solid rgba(255,255,255,.18); border-radius: 50%; font-size: 1.4rem; }
.property-close:is(button) { padding: 0; background: transparent; cursor: pointer; }
.property-wordmark { font-family: var(--serif); font-size: 1.08rem; letter-spacing: .22em; white-space: nowrap; }
.property-wordmark span { color: var(--gold-light); font-size: .62rem; }
.property-nav nav { justify-self: center; display: flex; gap: 1.55rem; }
.property-nav nav a { color: rgba(255,255,255,.62); font-size: .59rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.property-nav nav a:hover { color: var(--gold-light); }
.share-property { border: 0; color: var(--gold-light); background: transparent; cursor: pointer; font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.share-property span { margin-left: .7rem; }
.property-hero { position: relative; display: flex; align-items: flex-end; min-height: 100svh; overflow: hidden; color: white; background: #070a11; }
.property-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.property-hero-shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(4,6,10,.94) 0, rgba(4,6,10,.3) 52%, rgba(4,6,10,.6)), linear-gradient(to right, rgba(4,6,10,.48), transparent 50%); }
.property-hero-placeholder { background: radial-gradient(circle at 67% 35%, #2b2a31, #0b0e16 52%, #05070c); }
.property-placeholder-logo { object-fit: contain; padding: 10vh 20vw; opacity: .24; filter: grayscale(.2) brightness(.7); }
.property-hero-copy { position: relative; z-index: 2; max-width: 1000px; padding: 0 6vw 9rem; }
.property-hero-copy > p { color: var(--gold-light); font-size: .66rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.property-hero-copy h1 { margin: .8rem 0; font: 400 clamp(4.4rem, 9vw, 10rem)/.82 var(--serif); letter-spacing: -.06em; }
.property-hero-copy strong { color: rgba(255,255,255,.72); font: 400 clamp(1rem, 1.5vw, 1.35rem)/1.5 var(--serif); }
.property-hero-facts { position: absolute; z-index: 2; right: 5vw; bottom: 6rem; display: grid; grid-template-columns: repeat(2, auto); gap: .8rem 2rem; color: rgba(255,255,255,.66); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.property-scroll { position: absolute; z-index: 2; left: 50%; bottom: 2rem; display: flex; align-items: center; gap: 1rem; color: rgba(255,255,255,.45); font-size: .58rem; letter-spacing: .2em; text-transform: uppercase; transform: translateX(-50%); }
.property-scroll i { display: block; width: 1px; height: 30px; background: var(--gold); }
.property-intro { display: grid; grid-template-columns: .5fr 2fr; gap: 7vw; padding: 10rem 7vw; }
.property-section-index { display: flex; align-items: flex-start; gap: 1rem; color: #807667; }
.property-section-index span { color: #b09055; font: 1.6rem var(--serif); }
.property-section-index p { margin: .4rem 0; font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; }
.property-intro-main { max-width: 950px; }
.property-intro-main h2 { margin: 0 0 3rem; max-width: 950px; font: 400 clamp(2.7rem, 5vw, 6rem)/1.02 var(--serif); letter-spacing: -.045em; }
.rich-copy { max-width: 720px; color: #5f5a52; font: 1.04rem/1.9 var(--serif); }
.property-highlights { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.5rem; }
.property-highlights span { padding: 12px 16px; border: 1px solid #d7cdbb; color: #655d50; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.property-gallery { padding: 8rem 4vw; color: white; background: var(--ink); }
.gallery-heading { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 3rem; max-width: 1350px; margin: 0 auto 4rem; }
.gallery-heading > span { color: var(--gold); font: 2rem var(--serif); }
.gallery-heading > p { color: rgba(255,255,255,.45); font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; }
.gallery-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: minmax(180px, 30vw); gap: 1rem; max-width: 1500px; margin: auto; }
.gallery-item { position: relative; grid-column: span 6; padding: 0; overflow: hidden; border: 0; background: #151923; cursor: zoom-in; }
.gallery-item:nth-child(3n+1) { grid-column: span 7; }
.gallery-item:nth-child(3n+2) { grid-column: span 5; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.gallery-item:hover img { transform: scale(1.025); }
.gallery-item span { position: absolute; left: 1rem; bottom: 1rem; padding: .6rem .8rem; background: rgba(5,7,12,.72); color: white; font-size: .65rem; }
.gallery-empty { grid-column: 1 / -1; display: grid; place-items: center; align-content: center; min-height: 420px; color: rgba(255,255,255,.52); border: 1px solid rgba(201,173,112,.2); background: radial-gradient(circle, #1a1d26, #090c13); }
.gallery-empty span { color: var(--gold); font: 5rem var(--serif); }
.gallery-empty p { max-width: 480px; text-align: center; line-height: 1.7; }
.property-amenities { display: grid; grid-template-columns: .55fr 1.2fr 1.3fr; gap: 5vw; padding: 10rem 7vw; color: white; background: #111621; }
.property-section-index.light { color: rgba(255,255,255,.5); }
.amenities-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.11); }
.amenities-grid > div { min-height: 130px; padding: 1.5rem; background: #111621; }
.amenities-grid span { color: var(--gold); font-size: 1.4rem; }
.amenities-grid p { margin: 1.7rem 0 0; color: rgba(255,255,255,.74); font: 1rem var(--serif); }
.inmy-experience { position: relative; display: flex; justify-content: flex-end; min-height: 780px; padding: 10rem 9vw; overflow: hidden; background: #efe9dd; }
.experience-watermark { position: absolute; left: -2vw; bottom: -10vw; margin: 0; color: rgba(106,88,55,.08); font: 20vw/.8 var(--serif); }
.inmy-experience > div { position: relative; width: min(760px, 60vw); }
.stay-section { display: grid; grid-template-columns: 1.3fr .8fr .9fr; gap: 5vw; padding: 10rem 7vw; }
.stay-facts { border-top: 1px solid #cfc6b7; }
.stay-facts p { display: flex; justify-content: space-between; gap: 1rem; margin: 0; padding: 1.2rem 0; border-bottom: 1px solid #cfc6b7; }
.stay-facts span { color: #81786c; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.stay-facts strong { font: 400 1rem var(--serif); }
.stay-cta p { margin: 0 0 2rem; color: #625c54; font: 1rem/1.8 var(--serif); }
.property-footer { display: flex; align-items: center; justify-content: space-between; padding: 3rem 5vw; color: white; background: #05070c; }
.property-footer p { color: rgba(255,255,255,.5); font-size: .68rem; }
.gallery-dialog { width: 100vw; max-width: none; height: 100vh; max-height: none; padding: 0; border: 0; color: white; background: rgba(4,6,10,.97); }
.gallery-dialog::backdrop { background: rgba(4,6,10,.8); }
.gallery-dialog[open] { display: grid; grid-template-columns: 70px 1fr 70px; align-items: center; }
.gallery-dialog figure { display: grid; align-content: center; justify-items: center; height: 100vh; margin: 0; padding: 5rem; }
.gallery-dialog figure img { max-width: 100%; max-height: 82vh; object-fit: contain; }
.gallery-dialog figcaption { margin-top: 1rem; color: rgba(255,255,255,.6); }
.gallery-close, .gallery-prev, .gallery-next { border: 0; color: white; background: transparent; cursor: pointer; font-size: 1.5rem; }
.gallery-close { position: absolute; z-index: 2; right: 2rem; top: 1.5rem; width: 50px; height: 50px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.gallery-count { position: absolute; left: 2rem; bottom: 1.5rem; color: var(--gold-light); }
.not-found { display: grid; place-items: center; align-content: center; min-height: 100svh; padding: 4rem; color: white; text-align: center; background: radial-gradient(circle, #252431, #070a11 65%); }
.not-found > p { margin: 4rem 0 0; color: var(--gold); letter-spacing: .3em; }
.not-found h1 { margin: 1rem 0 3rem; font: 400 clamp(3rem, 7vw, 7rem)/.95 var(--serif); }
.not-found h1 em { color: var(--gold-light); font-weight: 400; }

@media (max-width: 1050px) {
  .public-header nav a:not(.public-header-cta), .property-nav nav { display: none; }
  .property-nav { grid-template-columns: auto 1fr auto; }
  .property-wordmark { justify-self: center; }
  .property-hero-facts { left: 6vw; right: auto; bottom: 4.5rem; }
  .property-intro, .property-amenities, .stay-section { grid-template-columns: 1fr; }
  .property-section-index { margin-bottom: 2rem; }
  .property-amenities { gap: 3rem; }
  .inmy-experience > div { width: min(760px, 80vw); }
}

@media (max-width: 720px) {
  .public-header { min-height: 76px; padding: 0 1rem; }
  .public-header-cta { padding: 12px; font-size: .56rem; }
  .public-brand small { display: none; }
  .collection-hero { min-height: 100svh; padding: 110px 1.4rem 8rem; }
  .collection-hero h1 { font-size: clamp(3.8rem, 17vw, 6.3rem); }
  .round-scroll { right: 1.5rem; bottom: 1.5rem; }
  .collection-list { padding: 6rem 1.1rem 8rem; }
  .collection-heading { grid-template-columns: 1fr; margin-bottom: 3rem; }
  .property-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .property-card:nth-child(even) { transform: none; }
  .owner-proof { padding: 7rem 1.5rem; }
  .public-footer { align-items: flex-start; flex-direction: column; gap: 2rem; }
  .property-nav { min-height: 66px; padding: 0 .8rem; }
  .property-close { margin-right: .5rem; }
  .property-wordmark { font-size: .9rem; }
  .share-property { font-size: 0; }
  .share-property span { margin: 0; font-size: .85rem; }
  .property-hero-copy { padding: 0 1.4rem 9rem; }
  .property-hero-copy h1 { font-size: clamp(4rem, 19vw, 7rem); }
  .property-hero-facts { left: 1.4rem; bottom: 4.8rem; grid-template-columns: repeat(2, auto); gap: .6rem 1rem; font-size: .54rem; }
  .property-intro { padding: 7rem 1.4rem; }
  .property-gallery { padding: 6rem 1rem; }
  .gallery-heading { grid-template-columns: auto 1fr; gap: 1rem; }
  .gallery-heading > p { grid-column: 2; }
  .gallery-grid { display: flex; flex-direction: column; }
  .gallery-item { min-height: 55vw; }
  .property-amenities { padding: 7rem 1.4rem; }
  .amenities-grid { grid-template-columns: 1fr; }
  .inmy-experience { min-height: auto; padding: 7rem 1.4rem; }
  .inmy-experience > div { width: 100%; }
  .stay-section { padding: 7rem 1.4rem; }
  .property-footer { align-items: flex-start; flex-direction: column; gap: 1.5rem; }
  .property-footer .share-property { font-size: .62rem; }
  .gallery-dialog[open] { grid-template-columns: 45px 1fr 45px; }
  .gallery-dialog figure { padding: 4rem .5rem; }
}
