:root{
  --bg:#f7f3ee;
  --dark:#2b1f1b;
  --gold:#c9a24d;
  --green:#25D366;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Poppins',sans-serif;background:var(--bg);color:#2a2a2a}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}

/* HEADER */
header{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  background:rgba(255,255,255,0.9);backdrop-filter:blur(8px);
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 24px;border-bottom:1px solid #eee;
}
.logo{font-weight:800;font-size:20px;color:var(--dark)}
nav a{margin:0 10px;font-weight:600;color:#333}
nav a:hover{color:var(--gold)}
.top-actions .btn{margin-left:8px}

/* BUTTONS */
.btn{display:inline-block;padding:10px 18px;border-radius:8px;font-weight:700}
.btn.gold{background:var(--gold);color:#2b1f1b}
.btn.green{background:var(--green);color:#fff}
.btn.outline{border:2px solid var(--gold);color:var(--gold)}
.btn.full{width:100%;text-align:center}

/* HERO */
.hero{margin-top:70px;position:relative;min-height:90vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-slider{position:absolute;inset:0}
.hero-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}
.hero-slider img.active{opacity:1}
.hero-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.45)}
.hero-container{position:relative;z-index:2;max-width:1200px;width:100%;padding:20px;display:grid;grid-template-columns:1.1fr .9fr;gap:30px}
.hero-content{color:#fff}
.pill{display:inline-block;background:rgba(255,255,255,0.2);padding:6px 12px;border-radius:999px;margin-bottom:12px}
.hero h1{font-family:'Playfair Display',serif;font-size:56px}
.hero h1 span{color:#ffd36a}
.hero-buttons{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}
.trust-badges{margin-top:14px;display:flex;gap:12px;flex-wrap:wrap}
.trust-badges span{background:rgba(255,255,255,0.2);padding:6px 10px;border-radius:8px}

/* HERO BOOKING */
.hero-booking{background:#fff;border-radius:16px;padding:20px;box-shadow:0 20px 50px rgba(0,0,0,0.25)}
.hero-booking input,.hero-booking select,.hero-booking textarea{
  width:100%;padding:10px;border-radius:8px;border:1px solid #ddd;margin-bottom:8px
}

/* SECTIONS */
.section{padding:90px 20px}
.section.dark{background:#1f1a16;color:#fff}
.section-title{font-family:'Playfair Display',serif;font-size:40px;text-align:center;margin-bottom:20px}
.center{text-align:center}

/* STATS */
.stats{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.stat{background:#fff;padding:16px 22px;border-radius:14px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,0.08)}

/* ROOMS */
.rooms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;max-width:1100px;margin:0 auto}
.room-card{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.1)}
.room-card img{height:200px;object-fit:cover}
.room-card .pad{padding:16px}
.price{font-size:22px;font-weight:800;color:var(--gold)}

/* AMENITIES */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;max-width:1000px;margin:0 auto}
.box{background:#fff;padding:18px;border-radius:14px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,0.08)}

/* GALLERY */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;max-width:1100px;margin:0 auto}
.gallery img{height:160px;object-fit:cover;border-radius:12px}

/* REVIEWS */
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;max-width:1000px;margin:0 auto}
.review{background:#fff;color:#333;padding:18px;border-radius:14px}

/* MAP */
.map iframe{width:100%;height:420px;border:0;border-radius:16px}

/* FOOTER */
footer{background:#16120f;color:#ddd;padding:40px 20px;text-align:center}

/* FLOATING */
.float{position:fixed;right:18px;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;z-index:3000;color:#fff}
.float.wa{bottom:18px;background:#25D366;box-shadow:0 0 30px rgba(37,211,102,.8)}
.float.call{bottom:84px;background:#c9a24d}

/* MOBILE */
@media(max-width:900px){
  .hero-container{grid-template-columns:1fr}
  .hero h1{font-size:38px}
}
/* =========================
   MOBILE FIXES
========================= */
@media (max-width: 768px){

  /* HEADER FIX */
  header{
    flex-direction: row;
    padding: 10px 12px;
  }

  nav{
    display: none; /* mobile me menu hide */
  }

  .logo{
    font-size: 16px;
  }

  .top-actions{
    display: flex;
    gap: 6px;
  }

  .top-actions .btn{
    padding: 8px 12px;
    font-size: 13px;
  }

  /* HERO FIX */
  .hero{
    min-height: auto;
  }

  .hero-container{
    grid-template-columns: 1fr;
    padding: 10px;
    gap: 15px;
  }

  .hero h1{
    font-size: 28px;
    line-height: 1.2;
  }

  .hero p{
    font-size: 14px;
  }

  .hero-buttons{
    flex-direction: column;
    gap: 10px;
  }

  .hero-buttons .btn{
    width: 100%;
    text-align: center;
  }

  .trust-badges{
    gap: 6px;
  }

  .trust-badges span{
    font-size: 12px;
    padding: 5px 8px;
  }

  /* BOOKING FORM FIX */
  .hero-booking{
    margin-top: 10px;
    padding: 14px;
  }

  .hero-booking h3{
    font-size: 18px;
  }

  .hero-booking input,
  .hero-booking select,
  .hero-booking textarea{
    font-size: 14px;
    padding: 9px;
  }

  /* FLOAT BUTTONS FIX */
  .float.call{
    bottom: 140px;
  }

  .float.wa{
    bottom: 70px;
  }

  .float{
    width: 50px;
    height: 50px;
    font-size: 20px;
  }

  /* SECTION TITLES */
  .section-title{
    font-size: 26px;
  }

}