:root, [data-theme="light"] {
  --radius-sm: .5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  --radius-full: 999px;
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem; --space-20:5rem;
  --color-bg: #f7f1eb;
  --color-surface: #fff9f3;
  --color-surface-2: #f1e6dd;
  --color-surface-offset: #e7d6c8;
  --color-border: rgba(48,26,22,.12);
  --color-text: #241815;
  --color-text-muted: #6e5a53;
  --color-text-faint: #9e8a82;
  --color-primary: #8e0f2d;
  --color-primary-hover: #751026;
  --color-gold: #8a9baa;
  --color-rose: #c36b7a;
  --shadow-sm: 0 8px 24px rgba(56,16,20,.08);
  --shadow-lg: 0 24px 60px rgba(56,16,20,.14);
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Inter', Arial, sans-serif;
  --content: 1180px;
}

[data-theme="dark"] {
  --color-bg: #0d090a;
  --color-surface: #171012;
  --color-surface-2: #211618;
  --color-surface-offset: #2b1c1f;
  --color-border: rgba(230,197,153,.12);
  --color-text: #f5eade;
  --color-text-muted: #c9b6aa;
  --color-text-faint: #8e766d;
  --color-primary: #a51435;
  --color-primary-hover: #ca2147;
  --color-gold: #d7aa55;
  --color-rose: #d17a88;
  --shadow-sm: 0 10px 25px rgba(0,0,0,.35);
  --shadow-lg: 0 28px 80px rgba(0,0,0,.5);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --color-bg: #0d090a;
    --color-surface: #171012;
    --color-surface-2: #211618;
    --color-surface-offset: #2b1c1f;
    --color-border: rgba(230,197,153,.12);
    --color-text: #f5eade;
    --color-text-muted: #c9b6aa;
    --color-text-faint: #8e766d;
    --color-primary: #a51435;
    --color-primary-hover: #ca2147;
    --color-gold: #d7aa55;
    --color-rose: #d17a88;
    --shadow-sm: 0 10px 25px rgba(0,0,0,.35);
    --shadow-lg: 0 28px 80px rgba(0,0,0,.5);
  }
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.6;
  background:
    radial-gradient(circle at top right, rgba(165,20,53,.18), transparent 22%),
    radial-gradient(circle at left center, rgba(215,170,85,.14), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.02), transparent),
    var(--color-bg);
  color: var(--color-text);
  min-height: 100vh;
}

img { max-width:100%; display:block; }
.site-gallery img, .suite img { width:100%; height:auto; object-fit:cover; }
a { text-decoration:none; color:inherit; }
button, input, textarea, select { font:inherit; color:inherit; }
.container { width:min(calc(100% - 1.25rem), var(--content)); margin-inline:auto; }
.skip-link { position:absolute; left:-9999px; }
.skip-link:focus { left:1rem; top:1rem; background:var(--color-primary); padding:.75rem 1rem; border-radius:.75rem; z-index:999; }

.site-header { position:sticky; top:0; z-index:30; background:rgba(13,9,10,.76); backdrop-filter:blur(18px); border-bottom:1px solid var(--color-border); }
.nav { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 0; }
.brand { display:flex; align-items:center; gap:.8rem; }
.brand svg { width:44px; height:44px; padding:8px; border:1px solid var(--color-border); border-radius:14px; background:linear-gradient(135deg, rgba(215,170,85,.2), rgba(165,20,53,.16)); }
.brand img { width:44px; height:44px; border-radius:14px; }
.brand-title { font-family:var(--font-display); font-size:1.55rem; letter-spacing:.06em; }
.brand-sub { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.18em; color:var(--color-text-faint); }
.nav-links { display:flex; gap:1.15rem; font-size:var(--text-sm); color:var(--color-text-muted); flex-wrap:wrap; }
.nav-actions { display:flex; align-items:center; gap:.75rem; }
.theme-toggle { width:44px; height:44px; border-radius:50%; border:1px solid var(--color-border); display:grid; place-items:center; background:var(--color-surface); }

.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.9rem 1.25rem; border-radius:var(--radius-full); font-weight:600; transition:.2s ease; border:1px solid transparent; }
.btn-primary { background:linear-gradient(135deg, var(--color-gold), #f0cc86 58%, var(--color-primary)); color:#180c0f; box-shadow:var(--shadow-sm); }
.btn-secondary { border-color:var(--color-border); background:rgba(255,255,255,.02); }

.hero { padding:clamp(3rem,8vw,6rem) 0 var(--space-12); }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:1rem; align-items:stretch; }

.card, .hero-panel, .feature, .suite, .gallery-frame, .contact-card, .copy-panel, .review-card {
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)), var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-sm);
}

.hero-panel { padding:clamp(1.4rem,4vw,2.6rem); position:relative; overflow:hidden; }
.eyebrow { display:inline-flex; gap:.55rem; align-items:center; padding:.45rem .9rem; border-radius:999px; background:rgba(215,170,85,.08); border:1px solid rgba(215,170,85,.18); font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.2em; color:var(--color-gold); }
h1 { font-family:var(--font-display); font-size:clamp(3rem,8vw,6.4rem); line-height:.93; margin:1rem 0; max-width:10ch; }
.lead { max-width:60ch; color:var(--color-text-muted); }
.hero-actions { display:flex; gap:.85rem; flex-wrap:wrap; margin-top:1.5rem; }
.hero-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin-top:1.75rem; }
.stat { padding:1rem; border-radius:1rem; background:linear-gradient(180deg, rgba(215,170,85,.07), rgba(165,20,53,.06)); border:1px solid rgba(215,170,85,.1); }
.stat strong { display:block; color:var(--color-gold); font-size:1.35rem; }
.hero-visual { padding:.85rem; display:grid; grid-template-rows:1fr auto; gap:.85rem; }
.hero-photo { min-height:540px; border-radius:calc(var(--radius-xl) - .6rem); overflow:hidden; position:relative; background:linear-gradient(180deg, rgba(10,6,8,.16), rgba(10,6,8,.58)), url('pictures/IMG_0086-scaled.jpg') center/cover; }
.hero-note { position:absolute; left:1rem; right:1rem; bottom:1rem; background:rgba(17,11,12,.7); backdrop-filter:blur(10px); padding:1rem; border-radius:1rem; border:1px solid rgba(215,170,85,.18); }
.hero-note strong { display:block; color:var(--color-gold); }
.copy-panel { padding:1.1rem 1.2rem; color:var(--color-text-muted); }

.section { padding:var(--space-12) 0; }
.section-head { display:flex; justify-content:space-between; gap:1rem; align-items:end; margin-bottom:1.5rem; }
.section-head h2 { font-family:var(--font-display); font-size:clamp(2rem,5vw,3.4rem); line-height:1; }
.section-head p { max-width:55ch; color:var(--color-text-muted); }

.features, .suites, .reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.feature { padding:1.25rem; }
.feature-mark { width:52px; height:52px; border-radius:16px; background:linear-gradient(135deg, rgba(215,170,85,.16), rgba(165,20,53,.16)); display:grid; place-items:center; margin-bottom:.9rem; color:var(--color-gold); }
.feature-mark img { width:28px; height:28px; object-fit:contain; display:block; }
.feature h3, .suite h3, .contact-card h3 { margin-bottom:.45rem; font-size:1.1rem; }
.feature p, .suite p, .contact-card p, .review-card p { color:var(--color-text-muted); }

.suite { overflow:hidden; }
.suite img { aspect-ratio:4/4.8; }
.suite-copy { padding:1.1rem; }
.suite-price { display:flex; justify-content:space-between; align-items:center; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--color-border); }
.suite-price strong { color:var(--color-gold); font-size:1.2rem; }

.site-gallery { display:grid; grid-template-columns:1.3fr .7fr; gap:1rem; align-items:start; }
.gallery-main { display:grid; gap:1rem; }
.gallery-stack { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.gallery-frame { overflow:hidden; position:relative; min-height:220px; }
.gallery-frame.large { min-height:520px; }
.gallery-frame.tall { min-height:420px; }
.gallery-frame.wide { min-height:250px; }
.gallery-frame::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, rgba(8,5,6,.56)); pointer-events:none; }
.gallery-caption { position:absolute; left:1rem; bottom:1rem; z-index:1; background:rgba(15,10,11,.68); padding:.7rem .9rem; border-radius:1rem; border:1px solid rgba(255,255,255,.1); font-size:var(--text-sm); }

.admin-panel, .contact-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:1rem; }
.contact-card { padding:1.25rem; }
.contact-form { display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; }
.full { grid-column:1/-1; }
label { display:grid; gap:.4rem; font-size:var(--text-sm); color:var(--color-text-muted); }
input, textarea, select { width:100%; padding:1rem; border-radius:1rem; border:1px solid var(--color-border); background:var(--color-surface-2); }
textarea { min-height:140px; resize:vertical; }
.admin-list { display:grid; gap:.85rem; margin-top:1rem; }
.admin-item { padding:1rem; border-radius:1rem; background:var(--color-surface-2); border:1px solid var(--color-border); }
.admin-item code { display:block; margin-top:.35rem; color:var(--color-gold); font-size:var(--text-xs); word-break:break-all; }

.review-card { padding:1.2rem; }
.review-card strong { display:block; color:var(--color-gold); margin-bottom:.35rem; }

.map-wrap { overflow:hidden; border-radius:var(--radius-xl); border:1px solid var(--color-border); box-shadow:var(--shadow-sm); min-height:420px; background:var(--color-surface); }
.map-wrap iframe { width:100%; height:100%; min-height:420px; border:0; }

.footer { padding:var(--space-12) 0; color:var(--color-text-muted); }
.footer-wrap { display:flex; justify-content:space-between; gap:1rem; border-top:1px solid var(--color-border); padding-top:1.5rem; }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity:1; transform:none; }

.accordion { display:grid; gap:.75rem; }

.accordion-item {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.accordion-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.2rem 1.4rem;
  font-weight: 600;
  font-size: var(--text-base);
  cursor: pointer;
  list-style: none;
  gap: 1rem;
}

.accordion-header::-webkit-details-marker { display:none; }

.accordion-header::after {
  content: '+';
  font-size: 1.5rem;
  color: var(--color-gold);
  transition: transform .3s ease;
  flex-shrink: 0;
}

details[open] .accordion-header::after { transform:rotate(45deg); }

.accordion-body {
  padding: 1rem 1.4rem 1.2rem;
  color: var(--color-text-muted);
  border-top: 1px solid var(--color-border);
}

@media (max-width: 1024px) {
  .hero-grid, .features, .suites, .site-gallery,
  .admin-panel, .contact-grid, .reviews-grid {
    grid-template-columns: 1fr 1fr;
  }
  .nav-links { display:none; }
  .hero-photo { min-height:460px; }
}

@media (max-width: 760px) {
  .container { width:min(calc(100% - 1rem), var(--content)); }
  .hero-grid, .features, .suites, .site-gallery, .gallery-stack,
  .admin-panel, .reviews-grid, .contact-grid, .contact-form, .hero-stats {
    grid-template-columns: 1fr;
  }
  .hero { padding-top:2rem; }
  h1 { font-size:clamp(2.55rem,15vw,4rem); }
  .hero-photo, .gallery-frame.large, .gallery-frame.tall, .gallery-frame.wide { min-height:auto; }
  .hero-photo { aspect-ratio:4/5; }
  .gallery-frame.large { aspect-ratio:4/5; }
  .gallery-frame.tall, .gallery-frame.wide, .gallery-frame { aspect-ratio:4/3; }
  .section-head { flex-direction:column; align-items:flex-start; }
  .hero-actions, .footer-wrap, .nav-actions { flex-direction:column; align-items:flex-start; }
  .site-header { position:sticky; }
  .nav { padding:.85rem 0; }
  .btn { width:100%; }
  .nav-actions .btn { display:inline-flex; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
}