:root {
  --sand: #efe4d0;
  --sand-2: #e4d4b8;
  --ochre: #c8862a;
  --terracotta: #a84b2a;
  --earth: #3b2a1e;
  --night: #1e1712;
  --olive: #5d6234;
  --text: #2a1f17;
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Work Sans', system-ui, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--sans); color: var(--text); background: var(--sand); line-height: 1.65; }
img, video { display: block; max-width: 100%; }
a { color: inherit; }

/* Nav */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center;
  padding: 22px 5vw; color: #fff; transition: background .3s, padding .3s;
}
.nav.scrolled { background: var(--night); padding: 14px 5vw; }
.logo { display: flex; align-items: center; gap: 12px; font-family: var(--serif); font-size: 1.5rem; letter-spacing: .12em; text-decoration: none; font-weight: 600; }
.logo img { height: 52px; width: auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.4)); transition: height .3s; }
.nav.scrolled .logo img { height: 40px; }
.logo span { color: var(--ochre); }
.nav:not(.scrolled) .logo span { color: #f6e7c1; }
.logo .brand1, .nav:not(.scrolled) .logo .brand1 { color: inherit; }
.split video { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.card video { aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.nav:not(.scrolled) { text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.hero .eyebrow { color: #f6e7c1; text-shadow: 0 1px 8px rgba(0,0,0,.6); }
.hero h1, .hero-sub { text-shadow: 0 2px 14px rgba(0,0,0,.5); }
.nav nav { display: flex; gap: 32px; }
.nav nav a { text-decoration: none; font-size: .85rem; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.nav nav a:hover { opacity: 1; color: var(--ochre); }

/* Hero */
.hero {
  position: relative; height: 100vh; height: 100svh; min-height: 560px;
  display: flex; align-items: flex-end;
  background: var(--night); overflow: hidden;
  color: #fff; padding: 0 5vw 14vh;
}
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; z-index: 0; }
.hero::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(30,23,18,.85), rgba(30,23,18,.2) 60%, rgba(30,23,18,.45)); }
.hero-content, .scroll-hint { position: relative; z-index: 2; }
.scroll-hint { position: absolute; }
.hero-content { max-width: 640px; }
.hero h1 { font-family: var(--serif); font-weight: 500; font-size: clamp(3.2rem, 9vw, 7rem); line-height: .95; margin: 10px 0 20px; }
.hero-sub { font-size: 1.1rem; max-width: 460px; opacity: .9; margin-bottom: 32px; }
.scroll-hint { position: absolute; right: 5vw; bottom: 6vh; text-decoration: none; font-size: 1.4rem; animation: bob 2s infinite; }
@keyframes bob { 50% { transform: translateY(8px); } }

.eyebrow { font-size: .75rem; letter-spacing: .25em; text-transform: uppercase; color: var(--ochre); font-weight: 500; }

.btn {
  display: inline-block; padding: 14px 30px; background: var(--ochre); color: #fff;
  text-decoration: none; font-size: .85rem; letter-spacing: .1em; text-transform: uppercase;
  transition: background .2s;
}
.btn:hover { background: var(--terracotta); }
.btn-dark { background: var(--earth); }
.btn-dark:hover { background: var(--night); }

/* Sections */
.section { padding: 110px 5vw; }
.section h2 { font-family: var(--serif); font-weight: 500; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.1; margin: 10px 0 24px; max-width: 640px; }
.section p { max-width: 560px; margin-bottom: 16px; }
.section-dark { background: var(--earth); color: var(--sand); }
.section-ochre { background: var(--sand-2); }

.split { display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; align-items: center; }
.split img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 40px; }
.card { background: var(--night); }
.card img { aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.card-body { padding: 24px; }
.card h3 { font-family: var(--serif); font-size: 1.6rem; font-weight: 500; color: var(--ochre); margin-bottom: 6px; }
.card p { font-size: .95rem; opacity: .85; margin: 0; }

.facts { list-style: none; border-top: 1px solid rgba(59,42,30,.25); }
.facts li { padding: 18px 0; border-bottom: 1px solid rgba(59,42,30,.25); display: flex; justify-content: space-between; gap: 20px; }
.facts strong { font-weight: 500; color: var(--terracotta); }

/* Carousel strips (section dividers) */
.strip { overflow: hidden; background: var(--night); padding: 10px 0; }
.strip-track { display: flex; gap: 10px; width: max-content; animation: slide 45s linear infinite; }
.strip-reverse .strip-track { animation-direction: reverse; }
.strip:hover .strip-track { animation-play-state: paused; }
.strip-track > * { height: 200px; width: 300px; object-fit: cover; flex-shrink: 0; }
@keyframes slide { to { transform: translateX(-50%); } }

/* Gallery */
.gallery { columns: 3 280px; column-gap: 14px; margin-top: 40px; }
.gallery-item { break-inside: avoid; margin-bottom: 14px; cursor: pointer; position: relative; overflow: hidden; background: var(--sand-2); }
.gallery-item img, .gallery-item video { width: 100%; transition: transform .5s; }
.gallery-item:hover img, .gallery-item:hover video { transform: scale(1.03); }
.gallery-item .play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 2.4rem; text-shadow: 0 2px 10px rgba(0,0,0,.5); pointer-events: none; }
.gallery-item figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 14px; color: #fff; font-size: .85rem; background: linear-gradient(transparent, rgba(0,0,0,.6)); }
.empty { color: var(--earth); opacity: .7; }

/* Lightbox */
.lightbox { position: fixed; inset: 0; background: rgba(20,15,11,.95); z-index: 100; display: flex; align-items: center; justify-content: center; }
.lightbox[hidden] { display: none; }
.lb-media img, .lb-media video { max-width: 88vw; max-height: 86vh; }
.lightbox button { background: none; border: 0; color: #fff; cursor: pointer; font-size: 3rem; padding: 0 20px; opacity: .7; }
.lightbox button:hover { opacity: 1; }
.lb-close { position: absolute; top: 14px; right: 14px; }

/* WhatsApp */
.wa-float {
  position: fixed; right: 22px; bottom: 22px; z-index: 60;
  width: 58px; height: 58px; border-radius: 50%; background: #25d366;
  display: grid; place-items: center; box-shadow: 0 6px 18px rgba(0,0,0,.25); transition: transform .2s;
}
.wa-float:hover { transform: scale(1.08); }

.footer { display: flex; justify-content: space-between; padding: 28px 5vw; background: var(--night); color: var(--sand-2); font-size: .8rem; letter-spacing: .05em; }
.credit { color: var(--ochre); font-weight: 500; text-decoration: none; transition: color .2s; }
.credit:hover { color: #f6e7c1; text-decoration: underline; }

@media (max-width: 860px) {
  .nav nav { display: none; }
  .split, .cards { grid-template-columns: 1fr; }
  .section { padding: 80px 6vw; }
  .strip-track > * { height: 140px; width: 210px; }
  .footer { flex-direction: column; gap: 6px; }
}