:root{
    --charcoal:#1c1c1e;
    --charcoal-2:#2a2a2d;
    --beige:#c9b89a;
    --beige-soft:#e9dfcf;
    --cream:#f7f3ec;
    --gold:#c2a26a;
    --gold-deep:#a07f48;
    --white-soft:#fbfaf7;
  }
  *{ -webkit-font-smoothing:antialiased; }
  html{ scroll-behavior:smooth; }
  body{
    font-family:'Inter', sans-serif;
    color:var(--charcoal);
    background:var(--white-soft);
  }
  .font-serif-lux{ font-family:'Cormorant Garamond', serif; letter-spacing:.01em; }
  .text-gold{ color:var(--gold); }
  .bg-charcoal{ background:var(--charcoal); }
  .bg-cream{ background:var(--cream); }
  .bg-beige{ background:var(--beige); }

  /* Nav */
  .nav-glass{
    background:rgba(28,28,30,.18);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(255,255,255,.08);
    transition:all .4s ease;
  }
  .nav-glass.scrolled{
    background:rgba(28,28,30,.88);
    border-bottom:1px solid rgba(194,162,106,.25);
  }
  .nav-link{ position:relative; }
  .nav-link::after{
    content:""; position:absolute; left:0; bottom:-6px; height:1px; width:0;
    background:var(--gold); transition:width .35s ease;
  }
  .nav-link:hover::after{ width:100%; }

  /* Hero */
  .hero{
    position:relative;
    min-height:100vh;
    background:
      linear-gradient(180deg, rgba(28,28,30,.55) 0%, rgba(28,28,30,.35) 35%, rgba(28,28,30,.75) 100%),
      url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?auto=format&fit=crop&w=2000&q=80') center/cover no-repeat;
    overflow:hidden;
  }
  .hero-content{ animation: fadeUp 1.2s ease both; }
  @keyframes fadeUp{
    from{ opacity:0; transform:translateY(30px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .ken-burns{ animation: ken 20s ease-in-out infinite alternate; }
  @keyframes ken{
    from{ transform:scale(1); }
    to{ transform:scale(1.08); }
  }

  /* Buttons */
  .btn-gold{
    background:linear-gradient(135deg,var(--gold) 0%,var(--gold-deep) 100%);
    color:#fff; padding:14px 30px; border-radius:2px; letter-spacing:.15em;
    text-transform:uppercase; font-size:12px; font-weight:600;
    transition:all .35s ease; display:inline-flex; align-items:center; gap:10px;
    box-shadow:0 10px 30px -10px rgba(194,162,106,.55);
  }
  .btn-gold:hover{ transform:translateY(-2px); box-shadow:0 18px 40px -10px rgba(194,162,106,.7); }
  .btn-outline-white{
    border:1px solid rgba(255,255,255,.7); color:#fff; padding:14px 30px; border-radius:2px;
    letter-spacing:.15em; text-transform:uppercase; font-size:12px; font-weight:600;
    transition:all .35s ease; display:inline-flex; align-items:center; gap:10px;
  }
  .btn-outline-white:hover{ background:#fff; color:var(--charcoal); }
  .btn-dark{
    background:var(--charcoal); color:#fff; padding:12px 26px; border-radius:2px;
    letter-spacing:.15em; text-transform:uppercase; font-size:11px; font-weight:600;
    transition:all .35s ease; display:inline-flex; align-items:center; gap:8px;
  }
  .btn-dark:hover{ background:var(--gold-deep); }

  /* Booking widget */
  .booking-widget{
    background:#fff;
    box-shadow:0 30px 70px -20px rgba(0,0,0,.25);
    border-top:3px solid var(--gold);
  }
  .booking-field label{
    font-size:10px; letter-spacing:.18em; text-transform:uppercase;
    color:#888; font-weight:600;
  }
  .booking-field input, .booking-field select{
    width:100%; border:none; outline:none; padding:6px 0;
    font-family:'Inter',sans-serif; color:var(--charcoal); font-weight:500;
    background:transparent;
  }

  /* Section labels */
  .eyebrow{
    font-size:11px; letter-spacing:.4em; text-transform:uppercase;
    color:var(--gold-deep); font-weight:600;
  }
  .divider-line{
    width:50px; height:1px; background:var(--gold); display:inline-block; margin:0 12px;
    vertical-align:middle;
  }

  /* Cards */
  .room-card{
    background:#fff; transition:all .5s ease; overflow:hidden;
    box-shadow:0 4px 20px rgba(0,0,0,.06);
  }
  .room-card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px -20px rgba(0,0,0,.2); }
  .room-card .img-wrap{ overflow:hidden; }
  .room-card .img-wrap img{ transition:transform .9s ease; }
  .room-card:hover .img-wrap img{ transform:scale(1.08); }

  .facility-card{
    background:#fff; padding:42px 28px; border-radius:4px;
    box-shadow:0 4px 20px rgba(0,0,0,.05); transition:all .4s ease;
    border:1px solid rgba(0,0,0,.04);
  }
  .facility-card:hover{
    transform:translateY(-6px); box-shadow:0 25px 50px -15px rgba(0,0,0,.15);
    border-color:var(--gold);
  }
  .facility-icon{
    width:64px; height:64px; border-radius:50%;
    background:linear-gradient(135deg, var(--cream), var(--beige-soft));
    display:flex; align-items:center; justify-content:center; color:var(--gold-deep);
    font-size:24px; margin-bottom:22px;
  }

  /* Gallery */
  .gallery-item{ overflow:hidden; position:relative; cursor:pointer; border-radius:4px; }
  .gallery-item img{ transition:transform .8s ease; width:100%; height:100%; object-fit:cover; }
  .gallery-item:hover img{ transform:scale(1.1); }
  .gallery-item::after{
    content:"\f00e"; font-family:"Font Awesome 6 Free"; font-weight:900;
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background:rgba(28,28,30,.45); color:#fff; font-size:22px; opacity:0;
    transition:opacity .4s ease;
  }
  .gallery-item:hover::after{ opacity:1; }
  .filter-btn{
    padding:8px 22px; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
    color:#666; transition:all .3s ease; border-bottom:1px solid transparent;
    font-weight:600;
  }
  .filter-btn.active, .filter-btn:hover{ color:var(--gold-deep); border-color:var(--gold); }

  /* Lightbox */
  .lightbox{
    position:fixed; inset:0; background:rgba(0,0,0,.95); z-index:200;
    display:none; align-items:center; justify-content:center; padding:30px;
  }
  .lightbox.active{ display:flex; animation: fade .3s ease; }
  @keyframes fade{ from{opacity:0;} to{opacity:1;} }
  .lightbox img{ max-width:90vw; max-height:85vh; border-radius:4px; }
  .lightbox-close{
    position:absolute; top:25px; right:30px; color:#fff; font-size:30px; cursor:pointer;
  }

  /* Reveal animations */
  .reveal{ opacity:0; transform:translateY(40px); transition:all 1s ease; }
  .reveal.visible{ opacity:1; transform:translateY(0); }

  /* Floating mobile booking */
  .floating-book{
    position:fixed; bottom:20px; left:20px; right:20px; z-index:90;
    display:none;
  }
  @media (max-width: 768px){
    .floating-book{ display:block; }
  }

  /* Mobile menu */
  .mobile-menu{
    position:fixed; inset:0; background:var(--charcoal); z-index:120;
    transform:translateX(100%); transition:transform .5s ease;
    display:flex; flex-direction:column; justify-content:center; align-items:center; gap:30px;
  }
  .mobile-menu.open{ transform:translateX(0); }

  /* Testimonial */
  .testimonial-card{
    background:#fff; padding:40px 32px; border-radius:4px;
    box-shadow:0 10px 40px -10px rgba(0,0,0,.08); border:1px solid rgba(0,0,0,.04);
  }

  /* Map */
  .map-wrap{ filter:grayscale(20%) contrast(1.05); border-radius:4px; overflow:hidden; }

  /* Promo */
  .promo-card{
    position:relative; overflow:hidden; border-radius:6px; min-height:380px;
    display:flex; flex-direction:column; justify-content:flex-end;
    padding:32px; color:#fff;
  }
  .promo-card::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(28,28,30,.1) 0%, rgba(28,28,30,.9) 100%);
    z-index:1;
  }
  .promo-card > *{ position:relative; z-index:2; }

  /* Footer */
  footer{ background:#15151a; color:#bcbcc2; }
  footer h4{ color:#fff; }
  .footer-link{ transition:color .3s ease; }
  .footer-link:hover{ color:var(--gold); }
  .social-icon{
    width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.06); color:#bcbcc2; transition:all .3s ease;
  }
  .social-icon:hover{ background:var(--gold); color:#fff; }

  /* Scroll indicator */
  .scroll-indicator{
    position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
    color:#fff; font-size:12px; letter-spacing:.3em; text-transform:uppercase;
    animation: bob 2s ease-in-out infinite;
  }
  @keyframes bob{
    0%,100%{ transform:translate(-50%,0); }
    50%{ transform:translate(-50%,-10px); }
  }

  /* Stat */
  .stat-num{ font-family:'Cormorant Garamond',serif; font-size:48px; line-height:1; color:var(--gold-deep); font-weight:500; }