:root {
  --terracota: #B85C38;
  --terracota-light: #D4785A;
  --cream: #F8F3EE;
  --warm-white: #FDFAF6;
  --piedra: #9B8878;
  --verde-sierra: #3D6B50;
  --dark: #231810;
  --gold: #C9A96E;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--warm-white); font-family:'Jost',sans-serif; color:var(--dark); overflow-x:hidden; }

/* ─── HERO ─── */
.hero {
  position:relative; height:100vh; min-height:640px;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center 55%;
  filter:brightness(0.6) saturate(1.15);
  transform:scale(1.03);
  transition:transform 8s ease;
}
.hero:hover .hero-bg { transform:scale(1); }
.hero-grad {
  position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(35,24,16,0.3) 0%, rgba(35,24,16,0.65) 100%);
}
.hero-content {
  position:relative; z-index:2; text-align:center;
  padding:20px 40px; max-width:860px;
  animation: heroIn 1.2s cubic-bezier(.22,1,.36,1) both;
}
@keyframes heroIn {
  from { opacity:0; transform:translateY(40px); }
  to   { opacity:1; transform:translateY(0); }
}
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  color:var(--gold); font-size:.75rem; font-weight:600;
  letter-spacing:4px; text-transform:uppercase; margin-bottom:22px;
}
.hero-eyebrow::before, .hero-eyebrow::after {
  content:''; width:40px; height:1px; background:var(--gold); opacity:.7;
}
.hero h1 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(3rem,7vw,6.5rem); font-weight:600;
  color:#fff; line-height:1.05; margin-bottom:18px;
  text-shadow:0 4px 30px rgba(0,0,0,0.4);
}
.hero h1 em { color:var(--gold); font-style:italic; }
.hero-desc {
  color:rgba(255,255,255,.82); font-size:1.1rem; font-weight:300;
  letter-spacing:.5px; margin-bottom:38px; line-height:1.7;
}
.hero-pills { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.pill {
  background:rgba(255,255,255,.12); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.25); color:#fff;
  padding:9px 22px; border-radius:40px; font-size:.82rem;
  letter-spacing:.5px; font-weight:400;
}
.scroll-hint {
  position:absolute; bottom:32px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.5); font-size:.72rem; letter-spacing:3px;
  text-transform:uppercase; display:flex; flex-direction:column;
  align-items:center; gap:8px; z-index:3;
}
.scroll-hint::after {
  content:''; width:1px; height:40px;
  background:linear-gradient(to bottom, rgba(255,255,255,.5), transparent);
  animation:scrollLine 2s ease infinite;
}
@keyframes scrollLine {
  0%,100% { opacity:.3; transform:scaleY(1); }
  50% { opacity:1; transform:scaleY(.5) translateY(-10px); }
}

/* ─── STATS BAR ─── */
.stats-bar {
  background:var(--terracota);
  display:flex; justify-content:center; flex-wrap:wrap;
}
.stat {
  padding:24px 44px; color:#fff; text-align:center;
  border-right:1px solid rgba(255,255,255,.18);
  flex:1; min-width:150px;
}
.stat:last-child { border-right:none; }
.stat-num {
  font-family:'Cormorant Garamond',serif;
  font-size:2.2rem; font-weight:600; line-height:1;
  margin-bottom:4px;
}
.stat-label { font-size:.7rem; letter-spacing:2.5px; text-transform:uppercase; opacity:.8; }

/* ─── SECTION HEADERS ─── */
.sec-header { text-align:center; margin-bottom:52px; }
.sec-tag {
  display:inline-block; font-size:.7rem; font-weight:600;
  letter-spacing:4px; text-transform:uppercase;
  color:var(--terracota); margin-bottom:12px;
}
.sec-header h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2rem,4vw,3.2rem); font-weight:600; line-height:1.2;
}
.sec-header h2 em { font-style:italic; color:var(--terracota); }

/* ─── GALLERY ─── */
.gallery-section { padding:90px 40px; background:var(--warm-white); }
.gallery-grid {
  display:grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 300px 300px;
  gap:10px; max-width:1200px; margin:0 auto 10px;
  border-radius:8px; overflow:hidden;
}
.gallery-grid .g-main { grid-row: 1 / 3; }
.g-item {
  overflow:hidden; position:relative; cursor:zoom-in;
}
.g-item img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s ease, filter .4s;
}
.g-item:hover img { transform:scale(1.06); filter:brightness(1.05); }
.g-item .g-label {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(35,24,16,.7), transparent);
  color:#fff; font-size:.7rem; letter-spacing:2px; text-transform:uppercase;
  padding:20px 16px 12px; opacity:0; transition:opacity .3s;
}
.g-item:hover .g-label { opacity:1; }

.gallery-row2 {
  display:grid; grid-template-columns:1fr 1fr 1fr 1fr;
  gap:10px; max-width:1200px; margin:0 auto;
  border-radius:8px; overflow:hidden;
}
.gallery-row2 .g-item { height:200px; }

/* ─── ROOMS ─── */
.rooms-section { padding:90px 40px; background:var(--cream); }
.rooms-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:28px; max-width:1200px; margin:0 auto;
}
.room-card {
  background:#fff; border-radius:8px; overflow:hidden;
  box-shadow:0 2px 24px rgba(0,0,0,.06);
  transition:transform .3s, box-shadow .3s;
}
.room-card:hover {
  transform:translateY(-8px);
  box-shadow:0 16px 48px rgba(0,0,0,.12);
}
.room-img { height:240px; overflow:hidden; }
.room-img img { width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.room-card:hover .room-img img { transform:scale(1.07); }
.room-info { padding:24px; }
.room-name {
  font-family:'Cormorant Garamond',serif;
  font-size:1.4rem; font-weight:600; margin-bottom:8px;
}
.room-desc { font-size:.88rem; color:#7a6860; line-height:1.7; font-weight:300; }
.room-tag {
  display:inline-block; margin-top:12px;
  background:var(--cream); color:var(--terracota);
  padding:4px 12px; border-radius:20px; font-size:.72rem;
  font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
}

/* ─── KITCHEN FEATURE ─── */
.feature-section {
  display:grid; grid-template-columns:1fr 1fr;
  max-width:1200px; margin:0 auto 90px; padding:0 40px;
  gap:0; align-items:stretch;
}
.feature-img { overflow:hidden; border-radius:8px 0 0 8px; }
.feature-img img { width:100%; height:100%; object-fit:cover; min-height:480px; }
.feature-text {
  background:var(--dark); color:#fff;
  padding:60px 56px; border-radius:0 8px 8px 0;
  display:flex; flex-direction:column; justify-content:center;
}
.feature-text .sec-tag { color:var(--gold); }
.feature-text h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:2.4rem; font-weight:600; line-height:1.2;
  margin-bottom:20px; color:#fff;
}
.feature-text h2 em { color:var(--gold); font-style:italic; }
.feature-text p { font-size:.95rem; line-height:1.8; color:rgba(255,255,255,.72); font-weight:300; }
.amenity-chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.chip {
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.85); padding:8px 16px; border-radius:4px;
  font-size:.78rem; letter-spacing:.5px;
}

/* ─── OUTDOOR ─── */
.outdoor-section { padding:90px 40px; background:var(--warm-white); }
.outdoor-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:10px; max-width:1200px; margin:0 auto; border-radius:8px; overflow:hidden;
}
.outdoor-grid .g-item { height:360px; }

/* ─── AMENITIES ─── */
.amenities-section { padding:90px 40px; background:var(--cream); }
.amenities-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:20px; max-width:1100px; margin:0 auto;
}
.amenity-card {
  background:#fff; padding:32px 22px; border-radius:8px; text-align:center;
  box-shadow:0 2px 16px rgba(0,0,0,.05);
  transition:transform .3s, box-shadow .3s;
}
.amenity-card:hover { transform:translateY(-5px); box-shadow:0 12px 32px rgba(0,0,0,.1); }
.a-icon { font-size:2rem; margin-bottom:12px; }
.a-name { font-weight:600; font-size:.9rem; letter-spacing:.3px; margin-bottom:6px; }
.a-desc { font-size:.78rem; color:#9a8880; line-height:1.5; }

/* ─── LOCATION ─── */
.location-section {
  padding:90px 40px; max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;
}
.location-section h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:2.8rem; font-weight:600; line-height:1.15; margin-bottom:20px;
}
.location-section h2 em { font-style:italic; color:var(--terracota); }
.location-section p { font-size:.95rem; line-height:1.8; color:#6a5a50; font-weight:300; margin-bottom:12px; }
.dist-table { width:100%; margin-top:24px; border-collapse:collapse; }
.dist-table tr { border-bottom:1px solid #e8e0d4; }
.dist-table td { padding:12px 0; font-size:.88rem; }
.dist-table td:last-child { color:var(--terracota); font-weight:600; text-align:right; }
.map-box {
  background:linear-gradient(145deg,#c8dfc0,#9ec49a,#6a9e70,#4a7850);
  border-radius:12px; height:380px; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  box-shadow:0 12px 50px rgba(0,0,0,.15); position:relative; overflow:hidden;
}
.map-box::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 30% 40%, rgba(255,255,255,.15), transparent 60%);
}
.map-pin-big { font-size:3.5rem; filter:drop-shadow(0 6px 12px rgba(0,0,0,.3)); }
.map-name {
  margin-top:18px; background:#fff; padding:14px 28px;
  border-radius:40px; font-weight:700; font-size:.95rem;
  box-shadow:0 4px 20px rgba(0,0,0,.18); color:var(--dark); z-index:1;
}
.map-sub { font-size:.75rem; color:#999; margin-top:6px; letter-spacing:.5px; z-index:1; }

/* ─── CTA ─── */
.cta-section {
  position:relative; padding:110px 40px; text-align:center;
  background:var(--dark); overflow:hidden;
}
.cta-bg {
  position:absolute; inset:0; opacity:.25;
  background-size:cover; background-position:center;
  filter:saturate(0.6);
}
.cta-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, var(--dark) 0%, rgba(35,24,16,.85) 100%);
}
.cta-content { position:relative; z-index:2; max-width:700px; margin:0 auto; }
.cta-content h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.2rem,5vw,4rem); font-weight:600;
  color:#fff; margin-bottom:16px;
}
.cta-content h2 em { color:var(--gold); font-style:italic; }
.cta-content p { color:rgba(255,255,255,.7); font-size:1.05rem; font-weight:300; margin-bottom:44px; line-height:1.7; }
.cta-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.btn-main {
  background:var(--terracota); color:#fff;
  padding:18px 48px; border-radius:4px; text-decoration:none;
  font-size:.9rem; font-weight:600; letter-spacing:2px; text-transform:uppercase;
  transition:background .3s, transform .2s;
}
.btn-main:hover { background:var(--terracota-light); transform:translateY(-2px); }
.btn-outline {
  background:transparent; color:#fff;
  padding:18px 48px; border-radius:4px; text-decoration:none;
  font-size:.9rem; letter-spacing:2px; text-transform:uppercase;
  border:1.5px solid rgba(255,255,255,.35);
  transition:border-color .3s, background .3s;
}
.btn-outline:hover { border-color:#fff; background:rgba(255,255,255,.08); }

/* ─── FOOTER ─── */
footer {
  background:#160e08; color:rgba(255,255,255,.4);
  text-align:center; padding:36px 20px; font-size:.78rem; letter-spacing:1px;
}
footer strong { color:rgba(255,255,255,.75); }

/* ─── LIGHTBOX ─── */
.lightbox {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,.93); z-index:1000;
  align-items:center; justify-content:center; cursor:zoom-out;
}
.lightbox.open { display:flex; }
.lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:4px; }
.lb-close {
  position:absolute; top:20px; right:28px;
  color:#fff; font-size:2rem; cursor:pointer; opacity:.7;
  transition:opacity .2s;
}
.lb-close:hover { opacity:1; }

@media(max-width:900px){
  .gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .gallery-grid .g-main { grid-row:auto; }
  .feature-section, .location-section { grid-template-columns:1fr; }
  .feature-img { border-radius:8px 8px 0 0; }
  .feature-text { border-radius:0 0 8px 8px; }
  .outdoor-grid { grid-template-columns:1fr; }
}