:root {
  --bg: #07080a;
  --panel: #101114;
  --ivory: #f4f0e7;
  --muted: #aaa69e;
  --gold: #d6b16f;
  --gold-light: #efd39c;
  --line: rgba(214,177,111,.24);
  --max: 1280px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--ivory);
  font-family: Inter, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img, video { display: block; width: 100%; }
img { height: auto; }
button { font: inherit; }
:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 4px; }
::selection { background: rgba(214,177,111,.3); color: #fff; }

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  padding: 12px 16px;
  background: var(--gold);
  color: #080808;
  font-weight: 700;
  transform: translateY(-160%);
  transition: transform .2s;
}
.skip-link:focus { transform: translateY(0); }

.nav {
  position: fixed;
  inset: 0 0 auto;
  z-index: 30;
  padding: 14px clamp(14px,3vw,42px);
}
.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(100%,var(--max));
  min-height: 66px;
  margin: auto;
  padding: 10px 15px;
  border: 1px solid rgba(214,177,111,.17);
  background: rgba(7,8,10,.9);
  box-shadow: 0 16px 50px rgba(0,0,0,.38);
  backdrop-filter: blur(18px);
}
.wordmark { display: flex; align-items: center; gap: 11px; font-size: 11px; font-weight: 600; letter-spacing: .24em; }
.wordmark img { width: 42px; height: 34px; object-fit: contain; filter: drop-shadow(0 0 12px rgba(80,190,255,.28)); }
.wordmark b { color: #65caff; font-weight: inherit; }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.nav-link, .language {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--line);
  color: #d1cdc5;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  transition: border-color .2s, color .2s, background .2s;
}
.nav-link:hover, .language:hover { border-color: var(--gold); color: var(--gold-light); background: rgba(214,177,111,.05); }

.hero {
  position: relative;
  display: grid;
  align-items: end;
  min-height: min(84vh,900px);
  padding: 150px clamp(20px,6vw,88px) 74px;
  background:
    linear-gradient(90deg,rgba(5,6,8,.92) 0%,rgba(5,6,8,.45) 48%,rgba(5,6,8,.16) 100%),
    linear-gradient(0deg,var(--bg) 0%,transparent 38%),
    url("tahiti-vila-intro.jpg") center 40% / cover no-repeat;
}
.hero-inner { width: min(100%,var(--max)); margin: auto; }
.eyebrow, .section-label {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: var(--gold);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
}
.eyebrow::before, .section-label::before { width: 42px; height: 1px; background: currentColor; content: ""; }
h1, h2, h3, p { margin-top: 0; }
h1 {
  max-width: 920px;
  margin: 22px 0 22px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(3.6rem,8vw,8.4rem);
  font-weight: 300;
  letter-spacing: -.035em;
  line-height: .82;
}
h1 span, h2 em { color: var(--gold-light); font-style: italic; font-weight: 300; }
.hero-lead {
  max-width: 650px;
  margin-bottom: 0;
  color: #d4d0c8;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.05rem,1.8vw,1.35rem);
  line-height: 1.7;
}

.section { padding: clamp(72px,9vw,126px) clamp(20px,5vw,72px); }
.container { width: min(100%,var(--max)); margin: auto; }
.intro-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(38px,7vw,110px); align-items: start; }
h2 {
  margin: 18px 0 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.7rem,5.8vw,6rem);
  font-weight: 300;
  letter-spacing: -.025em;
  line-height: .94;
}
.intro-copy p, .detail-card p, .result-copy p {
  color: var(--muted);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 1.03rem;
  line-height: 1.9;
}
.intro-copy strong { color: var(--ivory); font-weight: 500; }

.film-section { padding-top: 0; }
.film-frame { position: relative; overflow: hidden; border: 1px solid var(--line); background: #000; box-shadow: 0 35px 90px rgba(0,0,0,.45); }
.film-frame video { aspect-ratio: 16 / 9; object-fit: contain; background: #000; }
.film-caption {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 16px 18px;
  border-top: 1px solid var(--line);
  color: #8d8981;
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.proof-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  border: 1px solid var(--line);
  background: var(--panel);
}
.proof-item { min-height: 155px; padding: 28px; border-right: 1px solid var(--line); }
.proof-item:last-child { border-right: 0; }
.proof-item span { display: block; margin-bottom: 14px; color: var(--gold); font-size: 9px; letter-spacing: .18em; text-transform: uppercase; }
.proof-item strong { display: block; font-family: "Cormorant Garamond",Georgia,serif; font-size: 1.45rem; font-weight: 400; line-height: 1.24; }

.details { background: linear-gradient(180deg,#090a0c,#0d0e11); }
.details-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 44px; }
.detail-card { min-height: 300px; padding: clamp(26px,3vw,42px); border: 1px solid var(--line); background: rgba(16,17,20,.72); }
.detail-card .number { color: var(--gold); font-family: Cinzel,serif; font-size: .75rem; letter-spacing: .18em; }
.detail-card h3 { margin: 30px 0 15px; font-family: "Cormorant Garamond",Georgia,serif; font-size: 2rem; font-weight: 400; }

.gallery { display: grid; grid-template-columns: 1.2fr .8fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.gallery picture:first-child { grid-row: 1 / span 2; }
.gallery img { height: 100%; min-height: 260px; object-fit: cover; }

.result { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(42px,8vw,120px); align-items: center; }
.result-copy h2 { margin-bottom: 28px; }
.result-list { margin: 28px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.result-list li { padding: 16px 0; border-bottom: 1px solid var(--line); color: #d8d3cb; font-size: .92rem; }
.worldwide {
  display: inline-block;
  margin-top: 28px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  color: var(--gold-light);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.cta { padding-top: 0; text-align: center; }
.cta-panel { padding: clamp(50px,8vw,96px) 24px; border: 1px solid var(--line); background: radial-gradient(circle at 50% 0,rgba(214,177,111,.12),transparent 48%),var(--panel); }
.cta-panel h2 { max-width: 800px; margin: 18px auto 24px; }
.cta-panel p { color: var(--muted); }
.buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 28px; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid var(--line);
  color: var(--ivory);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  transition: transform .2s, background .2s, color .2s;
}
.button.primary { border-color: var(--gold); background: var(--gold); color: #090909; }
.button:hover { transform: translateY(-2px); background: var(--gold-light); color: #090909; }

footer {
  display: flex;
  justify-content: center;
  padding: 28px 20px 38px;
  border-top: 1px solid rgba(214,177,111,.12);
  color: #77736c;
  font-size: 9px;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
}

.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease,transform .8s ease; }
.js .reveal.in { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .intro-grid, .result { grid-template-columns: 1fr; }
  .proof-grid { grid-template-columns: 1fr 1fr; }
  .proof-item:nth-child(2) { border-right: 0; }
  .proof-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .details-grid { grid-template-columns: 1fr; }
  .detail-card { min-height: auto; }
  .gallery { grid-template-columns: 1fr; grid-template-rows: auto; }
  .gallery picture:first-child { grid-row: auto; }
}
@media (max-width: 640px) {
  .nav-link { display: none; }
  .wordmark span { display: none; }
  .hero { min-height: 76vh; padding-right: 20px; padding-left: 20px; background-position: 44% center; }
  h1 { font-size: clamp(3.25rem,18vw,5rem); }
  .film-caption { flex-direction: column; }
  .proof-grid { grid-template-columns: 1fr; }
  .proof-item, .proof-item:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
  .proof-item:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}