/* ============================================================
   AGZ HOTEL — Global Stylesheet
   Design: Coastal Luxury / Ege Boutique
   ============================================================ */

/* ---------- RESET ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

/* ---------- CSS VARIABLES ---------- */
:root{
  /* Core palette */
  --sand:       #F5F0E8;
  --sand-dark:  #E8DFD0;
  --sand-light: #FAF8F4;
  --ocean:      #1B4965;
  --ocean-light:#2D6A8F;
  --ocean-deep: #0F2D42;
  --gold:       #C4944A;
  --gold-light: #D4A85A;
  --gold-dark:  #A67B3D;
  --white:      #FEFDFB;
  --black:      #1A1714;

  /* Text */
  --text:       #2C2825;
  --text-light: #6B6560;
  --text-muted: #9B958E;

  /* Accents */
  --sage:       #7A8B6F;
  --terracotta: #C67B5C;
  --cream:      #FFF9F0;

  /* Spacing */
  --section-pad: clamp(4rem, 8vw, 7rem) clamp(1.5rem, 4vw, 4rem);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 30px;

  /* Shadows */
  --shadow-soft: 0 4px 20px rgba(0,0,0,.05);
  --shadow-card: 0 8px 35px rgba(0,0,0,.07);
  --shadow-hover: 0 20px 50px rgba(0,0,0,.10);

  /* Transitions */
  --ease: cubic-bezier(.16,1,.3,1);
}

/* ---------- BASE ---------- */
html{
  scroll-behavior:smooth;
  font-size:16px;
  scroll-padding-top:80px;
}
body{
  font-family:'DM Sans',sans-serif;
  color:var(--text);
  background:var(--white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.6;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit;transition:color .3s}
ul{list-style:none}
h1,h2,h3,h4,h5{font-family:'Playfair Display',serif;font-weight:600;line-height:1.2}

/* ---------- TYPOGRAPHY ---------- */
.font-display{font-family:'Playfair Display',serif}
.font-body{font-family:'DM Sans',sans-serif}
.font-elegant{font-family:'Cormorant Garamond',serif}

/* ---------- PRELOADER ---------- */
.preloader{
  position:fixed;inset:0;background:var(--ocean-deep);
  z-index:9999;display:flex;align-items:center;justify-content:center;
  transition:opacity .8s ease,visibility .8s ease;
}
.preloader.hidden{opacity:0;visibility:hidden;pointer-events:none}
.preloader-inner{text-align:center}
.preloader-text{
  font-family:'Playfair Display',serif;font-size:clamp(1.5rem,3vw,2.2rem);
  color:var(--sand);letter-spacing:.35em;animation:breathe 2s ease-in-out infinite;
}
.preloader-line{
  width:60px;height:1px;background:var(--gold);margin:1rem auto 0;
  animation:expandLine 2s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes expandLine{0%,100%{width:30px;opacity:.3}50%{width:80px;opacity:1}}

/* ---------- NAVIGATION ---------- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:1.5rem clamp(1.5rem,4vw,3.5rem);
  display:flex;align-items:center;justify-content:space-between;
  transition:all .5s var(--ease);
}
nav.scrolled{
  background:rgba(15,45,66,.96);
  backdrop-filter:blur(25px);
  padding:1rem clamp(1.5rem,4vw,3.5rem);
  box-shadow:0 4px 30px rgba(0,0,0,.15);
}
.nav-logo{
  display:flex;align-items:center;gap:.75rem;
  font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;
  color:var(--white);letter-spacing:.06em;
}
.nav-logo img{height:38px;filter:brightness(0) invert(1)}
.nav-center{display:flex;gap:clamp(1.2rem,2.5vw,2.5rem);align-items:center}
.nav-center a{
  color:rgba(255,255,255,.8);font-size:.78rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;position:relative;
  padding:.3rem 0;transition:color .3s;
}
.nav-center a::after{
  content:'';position:absolute;bottom:0;left:0;width:0;height:1.5px;
  background:var(--gold);transition:width .4s var(--ease);
}
.nav-center a:hover{color:var(--white)}
.nav-center a:hover::after{width:100%}
.nav-center a.active{color:var(--gold)}
.nav-center a.active::after{width:100%;background:var(--gold)}

/* Dropdown */
.nav-dropdown{position:relative}
.nav-dropdown-trigger{cursor:pointer;display:flex;align-items:center;gap:.35rem}
.nav-dropdown-trigger svg{width:10px;height:10px;transition:transform .3s}
.nav-dropdown:hover .nav-dropdown-trigger svg{transform:rotate(180deg)}
.nav-dropdown-menu{
  position:absolute;top:calc(100% + 15px);left:50%;
  transform:translateX(-50%) translateY(10px);
  background:rgba(15,45,66,.97);backdrop-filter:blur(25px);
  border:1px solid rgba(196,148,74,.1);
  border-radius:var(--radius-md);padding:.6rem 0;min-width:290px;
  opacity:0;visibility:hidden;transition:all .35s var(--ease);
  box-shadow:0 20px 50px rgba(0,0,0,.3);
}
.nav-dropdown:hover .nav-dropdown-menu{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
}
.nav-dropdown-menu a{
  display:block;padding:.65rem 1.5rem;font-size:.75rem;letter-spacing:.06em;white-space:nowrap;
}
.nav-dropdown-menu a::after{display:none}
.nav-dropdown-menu a:hover{background:rgba(196,148,74,.1);color:var(--gold)}

/* Nav Right */
.nav-right{display:flex;align-items:center;gap:1.5rem}
.nav-phone{
  display:flex;align-items:center;gap:.45rem;
  color:var(--gold);font-size:.82rem;font-weight:500;letter-spacing:.04em;
}
.nav-phone svg{width:15px;height:15px}

/* Hamburger */
.hamburger{
  display:none;flex-direction:column;gap:5px;cursor:pointer;
  z-index:101;padding:5px;
}
.hamburger span{
  width:24px;height:2px;background:var(--white);
  transition:all .3s;border-radius:2px;
}
.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* Mobile Menu */
.mobile-menu{
  position:fixed;inset:0;background:var(--ocean-deep);z-index:99;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2rem;opacity:0;visibility:hidden;transition:all .4s var(--ease);
}
.mobile-menu.active{opacity:1;visibility:visible}
.mobile-menu a{
  font-family:'Playfair Display',serif;font-size:1.4rem;
  color:var(--white);transition:color .3s;
}
.mobile-menu a:hover{color:var(--gold)}
.mobile-menu .mobile-phone{
  font-family:'DM Sans',sans-serif;font-size:.95rem;
  color:var(--gold);margin-top:1rem;letter-spacing:.05em;
}

/* ---------- PAGE HEADER (for inner pages) ---------- */
.page-header{
  position:relative;padding:10rem 0 4rem;
  background:var(--ocean-deep);overflow:hidden;
  text-align:center;
}
.page-header::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 600px 400px at 20% 80%, rgba(196,148,74,.06), transparent),
    radial-gradient(ellipse 500px 500px at 80% 20%, rgba(45,106,143,.08), transparent);
}
.page-header-content{position:relative;z-index:2;padding:0 clamp(1.5rem,4vw,4rem)}
.page-header .breadcrumb{
  font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1rem;display:flex;align-items:center;
  justify-content:center;gap:.5rem;
}
.page-header .breadcrumb a{color:rgba(255,255,255,.5);transition:color .3s}
.page-header .breadcrumb a:hover{color:var(--white)}
.page-header h1{
  font-family:'Playfair Display',serif;font-size:clamp(2rem,5vw,3.5rem);
  color:var(--white);margin-bottom:1rem;
}
.page-header p{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1rem,2vw,1.25rem);color:rgba(255,255,255,.55);
  max-width:600px;margin:0 auto;line-height:1.7;
}
.page-header-wave{position:absolute;bottom:-2px;left:0;right:0;z-index:3}

/* ---------- SECTION SHARED ---------- */
.section{padding:var(--section-pad)}
.section-label{
  font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:1rem;
  display:flex;align-items:center;gap:.75rem;
}
.section-label::before{content:'';width:30px;height:1px;background:var(--gold)}
.section-title{
  font-family:'Playfair Display',serif;
  font-size:clamp(1.8rem,4vw,3rem);color:var(--ocean-deep);
  line-height:1.2;margin-bottom:.75rem;
}
.section-title em{font-style:italic;color:var(--gold)}
.section-desc{
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--text-light);max-width:580px;line-height:1.8;
}
.section-header-center{text-align:center;margin-bottom:3.5rem}
.section-header-center .section-label{justify-content:center}
.section-header-center .section-label::before{display:none}
.section-header-center .section-desc{margin:0 auto}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.9rem 2rem;border-radius:var(--radius-sm);
  font-size:.82rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;transition:all .4s var(--ease);
  cursor:pointer;border:none;font-family:'DM Sans',sans-serif;
}
.btn-primary{background:var(--gold);color:var(--white)}
.btn-primary:hover{
  background:var(--gold-light);transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(196,148,74,.3);
}
.btn-outline{
  background:transparent;color:var(--white);
  border:1px solid rgba(255,255,255,.3);
}
.btn-outline:hover{border-color:var(--white);background:rgba(255,255,255,.06)}
.btn-dark{background:var(--ocean);color:var(--white)}
.btn-dark:hover{background:var(--ocean-light);transform:translateY(-2px)}
.btn-ghost{
  background:transparent;color:var(--gold);
  border:1px solid var(--gold);
}
.btn-ghost:hover{background:var(--gold);color:var(--white)}
.btn svg{width:16px;height:16px}

/* ---------- CARDS ---------- */
.card{
  background:var(--white);border-radius:var(--radius-md);
  overflow:hidden;transition:all .5s var(--ease);
}
.card:hover{
  transform:translateY(-6px);box-shadow:var(--shadow-hover);
}

/* ---------- HERO (index) ---------- */
.hero{
  position:relative;height:100vh;min-height:700px;
  display:flex;align-items:flex-end;overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;
  background:linear-gradient(160deg,#1B4965 0%,#0F2D42 45%,#162D3E 100%);
}
.hero-bg::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 500px 500px at 15% 85%, rgba(196,148,74,.08), transparent),
    radial-gradient(ellipse 400px 400px at 85% 15%, rgba(45,106,143,.06), transparent);
}
/* Subtle wave pattern */
.hero-bg::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:40%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='rgba(196,148,74,0.02)' d='M0,192L60,186.7C120,181,240,171,360,176C480,181,600,203,720,213.3C840,224,960,224,1080,208C1200,192,1320,160,1380,144L1440,128L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z'/%3E%3C/svg%3E") bottom/cover no-repeat;
}
.hero-wave{position:absolute;bottom:-2px;left:0;right:0;z-index:2}
.hero-content{
  position:relative;z-index:3;
  padding:0 clamp(2rem,6vw,6.5rem) clamp(5rem,8vw,8rem);
  max-width:900px;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.5rem 1.25rem;border:1px solid rgba(196,148,74,.35);
  border-radius:50px;margin-bottom:2rem;
  animation:fadeUp .8s var(--ease) .5s both;
}
.hero-badge .stars{color:var(--gold);font-size:.6rem;letter-spacing:.15em}
.hero-badge span{
  color:var(--gold);font-size:.72rem;letter-spacing:.2em;
  text-transform:uppercase;font-weight:500;
}
.hero-title{
  font-size:clamp(2.5rem,6vw,4.8rem);
  color:var(--white);line-height:1.08;margin-bottom:1.5rem;
  animation:fadeUp .8s var(--ease) .7s both;
}
.hero-title em{font-style:italic;color:var(--gold)}
.hero-subtitle{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.05rem,2vw,1.35rem);
  color:rgba(255,255,255,.65);line-height:1.75;
  max-width:520px;margin-bottom:2.5rem;font-weight:300;
  animation:fadeUp .8s var(--ease) .9s both;
}
.hero-actions{
  display:flex;gap:1.25rem;flex-wrap:wrap;
  animation:fadeUp .8s var(--ease) 1.1s both;
}
.hero-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:5;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  color:rgba(255,255,255,.4);font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;
  animation:fadeUp .8s var(--ease) 1.4s both;
}
.hero-scroll .line{
  width:1px;height:35px;
  background:linear-gradient(to bottom,var(--gold),transparent);
  animation:scrollLine 2s ease-in-out infinite;
}
@keyframes scrollLine{0%,100%{opacity:1;transform:scaleY(1)}50%{opacity:.3;transform:scaleY(.5)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

/* ---------- ROOMS GRID ---------- */
.rooms{background:var(--sand);position:relative;overflow:hidden}
.rooms::before{
  content:'';position:absolute;top:-80px;right:-80px;
  width:350px;height:350px;border-radius:50%;
  background:radial-gradient(circle,rgba(196,148,74,.06),transparent);
  pointer-events:none;
}
.rooms-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:2rem;max-width:1300px;margin:0 auto;
}
.room-card{background:var(--white);border-radius:var(--radius-md);overflow:hidden;transition:all .5s var(--ease)}
.room-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover)}
.room-img{position:relative;height:280px;overflow:hidden}
.room-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.room-card:hover .room-img img{transform:scale(1.06)}
.room-img-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(15,45,66,.5),transparent 60%);
  opacity:0;transition:opacity .5s;
}
.room-card:hover .room-img-overlay{opacity:1}
.room-info{padding:1.75rem}
.room-name{
  font-family:'Playfair Display',serif;font-size:1.2rem;
  color:var(--ocean-deep);margin-bottom:1rem;
}
.room-features{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.5rem}
.room-feature{
  display:flex;align-items:center;gap:.35rem;
  font-size:.78rem;color:var(--text-light);
  padding:.3rem .7rem;background:var(--sand);border-radius:50px;
}
.room-feature svg{width:13px;height:13px;color:var(--ocean-light)}
.room-link{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.78rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold);transition:gap .3s;
}
.room-link:hover{gap:.85rem}
.room-link svg{width:16px;height:16px}

/* ---------- LOCATION / ENVIRONMENT ---------- */
.location-wrapper{
  display:grid;grid-template-columns:1fr 1fr;
  gap:4rem;max-width:1300px;margin:0 auto;
}
.loc-categories{display:flex;flex-direction:column;gap:1.75rem;margin-top:2.5rem}
.loc-cat{
  border:1px solid rgba(196,148,74,.12);border-radius:var(--radius-md);
  padding:1.5rem 1.75rem;
  background:linear-gradient(135deg,rgba(245,240,232,.2),transparent);
  transition:all .4s var(--ease);
}
.loc-cat:hover{border-color:rgba(196,148,74,.3);box-shadow:0 6px 25px rgba(196,148,74,.06)}
.loc-cat-title{
  font-family:'Playfair Display',serif;font-size:1.05rem;
  color:var(--ocean-deep);margin-bottom:.8rem;
  display:flex;align-items:center;gap:.65rem;
}
.loc-cat-title svg{width:18px;height:18px;color:var(--gold)}
.loc-item{
  display:flex;justify-content:space-between;align-items:center;
  padding:.45rem 0;border-bottom:1px solid rgba(0,0,0,.04);font-size:.85rem;
}
.loc-item:last-child{border-bottom:none}
.loc-item-name{color:var(--text)}
.loc-item-dist{color:var(--text-muted);font-weight:500;font-size:.78rem;white-space:nowrap}
.loc-toggle{
  margin-top:.65rem;font-size:.75rem;color:var(--gold);
  cursor:pointer;font-weight:600;letter-spacing:.05em;
  display:inline-flex;align-items:center;gap:.35rem;transition:gap .3s;
}
.loc-toggle:hover{gap:.6rem}
.location-map{
  position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:500px;
  box-shadow:var(--shadow-card);
}
.location-map iframe{width:100%;height:100%;border:none}
.loc-note{
  font-size:.75rem;color:var(--text-muted);font-style:italic;margin-top:1rem;
}

/* ---------- FAQ ---------- */
.faq{
  background:var(--ocean-deep);color:var(--white);
  position:relative;overflow:hidden;
}
.faq::before{
  content:'';position:absolute;top:0;right:0;width:50%;height:100%;
  background:radial-gradient(ellipse 600px 600px at 90% 50%,rgba(196,148,74,.03),transparent);
  pointer-events:none;
}
.faq-wrapper{max-width:850px;margin:0 auto;position:relative;z-index:1}
.faq-header{text-align:center;margin-bottom:3.5rem}
.faq-header .section-title{color:var(--white)}
.faq-header .section-desc{margin:0 auto;color:rgba(255,255,255,.45)}
.faq-item{border-bottom:1px solid rgba(255,255,255,.07);overflow:hidden}
.faq-q{
  padding:1.4rem 0;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;
  gap:2rem;transition:color .3s;
}
.faq-q:hover{color:var(--gold)}
.faq-q h3{
  font-family:'Playfair Display',serif;font-size:1.02rem;
  font-weight:400;line-height:1.5;flex:1;
}
.faq-q .icon{
  width:28px;height:28px;border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .4s var(--ease);
}
.faq-q .icon svg{width:12px;height:12px;transition:transform .4s var(--ease)}
.faq-item.active .faq-q{color:var(--gold)}
.faq-item.active .faq-q .icon{border-color:var(--gold);background:rgba(196,148,74,.12)}
.faq-item.active .faq-q .icon svg{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease),padding .3s}
.faq-item.active .faq-a{max-height:400px;padding-bottom:1.5rem}
.faq-a p,.faq-a ul{
  color:rgba(255,255,255,.55);font-size:.92rem;line-height:1.8;font-weight:300;
}
.faq-a ul{padding-left:1.2rem}
.faq-a ul li{margin-bottom:.3rem}
.faq-a ul li::before{content:'·';margin-right:.5rem;color:var(--gold)}

/* ---------- CONTACT SECTION ---------- */
.contact{background:var(--sand)}
.contact-wrapper{
  display:grid;grid-template-columns:1fr 1fr;
  gap:4rem;max-width:1200px;margin:0 auto;
}
.contact-cards{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}
.contact-card{
  display:flex;align-items:center;gap:1.25rem;
  padding:1.2rem 1.5rem;background:var(--white);
  border-radius:var(--radius-md);transition:all .4s var(--ease);
  border:1px solid transparent;
}
.contact-card:hover{border-color:rgba(196,148,74,.3);transform:translateX(4px)}
.contact-card-icon{
  width:46px;height:46px;border-radius:var(--radius-md);
  background:linear-gradient(135deg,var(--ocean),var(--ocean-light));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.contact-card-icon svg{width:18px;height:18px;color:var(--white)}
.contact-card-label{
  font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--text-muted);margin-bottom:.2rem;
}
.contact-card-value{font-size:.92rem;color:var(--ocean-deep);font-weight:500}

/* Social */
.contact-social{display:flex;gap:.8rem;margin-top:1.5rem}
.social-link{
  width:42px;height:42px;border-radius:50%;
  border:1px solid var(--sand-dark);
  display:flex;align-items:center;justify-content:center;
  transition:all .3s var(--ease);
}
.social-link:hover{background:var(--ocean);border-color:var(--ocean)}
.social-link:hover svg{color:var(--white)}
.social-link svg{width:17px;height:17px;color:var(--text-light);transition:color .3s}

/* Info boxes */
.info-box{
  background:var(--white);border-radius:var(--radius-lg);
  padding:2rem 2.25rem;
}
.info-box h3{
  font-family:'Playfair Display',serif;font-size:1.2rem;
  color:var(--ocean-deep);margin-bottom:.5rem;
}
.info-box p{color:var(--text-light);font-size:.88rem;line-height:1.7}

/* Amenity tags */
.amenities-grid{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.amenity-tag{
  padding:.35rem .8rem;background:var(--sand);
  border-radius:50px;font-size:.76rem;color:var(--text-light);
}

/* ---------- ABOUT PAGE ---------- */
.about-intro{
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;
  max-width:1200px;margin:0 auto;align-items:start;
}
.about-text{font-size:.95rem;line-height:1.85;color:var(--text-light)}
.about-text p+p{margin-top:1rem}
.about-highlights{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:2rem}
.highlight-card{
  background:var(--sand);border-radius:var(--radius-md);
  padding:1.5rem;text-align:center;transition:all .4s var(--ease);
  border:1px solid transparent;
}
.highlight-card:hover{border-color:rgba(196,148,74,.2);transform:translateY(-3px)}
.highlight-card svg{width:28px;height:28px;color:var(--gold);margin-bottom:.75rem}
.highlight-card h4{
  font-family:'Playfair Display',serif;font-size:.95rem;
  color:var(--ocean-deep);margin-bottom:.3rem;
}
.highlight-card p{font-size:.8rem;color:var(--text-muted)}

/* About amenities section */
.amenities-section{background:var(--sand)}
.amenities-categories{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:2rem;max-width:1200px;margin:0 auto;
}
.amenity-category{
  background:var(--white);border-radius:var(--radius-md);
  padding:2rem;transition:all .4s var(--ease);
}
.amenity-category:hover{box-shadow:var(--shadow-card);transform:translateY(-3px)}
.amenity-category h3{
  font-family:'Playfair Display',serif;font-size:1.1rem;
  color:var(--ocean-deep);margin-bottom:1.25rem;
  display:flex;align-items:center;gap:.6rem;
}
.amenity-category h3 svg{width:20px;height:20px;color:var(--gold)}
.amenity-list{display:flex;flex-direction:column;gap:.55rem}
.amenity-list li{
  display:flex;align-items:center;gap:.6rem;
  font-size:.88rem;color:var(--text-light);
  padding:.35rem 0;border-bottom:1px solid rgba(0,0,0,.03);
}
.amenity-list li:last-child{border-bottom:none}
.amenity-list li svg{width:14px;height:14px;color:var(--sage);flex-shrink:0}
.amenity-list li .tag-paid{
  margin-left:auto;font-size:.65rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--terracotta);font-weight:600;
  padding:.15rem .5rem;background:rgba(198,123,92,.08);border-radius:50px;
}

/* Important info */
.important-info{
  max-width:900px;margin:0 auto;
  background:var(--white);border-radius:var(--radius-lg);
  padding:clamp(2rem,4vw,3rem);border-left:3px solid var(--gold);
}
.important-info h3{
  font-family:'Playfair Display',serif;font-size:1.2rem;
  color:var(--ocean-deep);margin-bottom:1rem;
}
.important-info p{
  font-size:.9rem;color:var(--text-light);line-height:1.85;margin-bottom:.8rem;
}
.important-info p:last-child{margin-bottom:0}

/* ---------- ROOM DETAIL PAGE ---------- */
.room-detail{max-width:1200px;margin:0 auto}
.room-detail-top{
  display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;
  align-items:start;margin-bottom:3rem;
}
.room-gallery{display:flex;flex-direction:column;gap:1rem}
.room-gallery-main{
  border-radius:var(--radius-lg);overflow:hidden;
  aspect-ratio:16/10;position:relative;
}
.room-gallery-main img{width:100%;height:100%;object-fit:cover}
.room-gallery-thumbs{display:flex;gap:.75rem}
.room-gallery-thumbs .thumb{
  width:100px;height:70px;border-radius:var(--radius-sm);
  overflow:hidden;cursor:pointer;opacity:.6;transition:all .3s;
  border:2px solid transparent;
}
.room-gallery-thumbs .thumb:hover,.room-gallery-thumbs .thumb.active{
  opacity:1;border-color:var(--gold);
}
.room-gallery-thumbs .thumb img{width:100%;height:100%;object-fit:cover}

.room-detail-info h2{
  font-family:'Playfair Display',serif;font-size:clamp(1.5rem,3vw,2rem);
  color:var(--ocean-deep);margin-bottom:.75rem;
}
.room-detail-info .room-desc{
  font-size:.95rem;color:var(--text-light);line-height:1.8;margin-bottom:1.5rem;
}
.room-detail-specs{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;
  margin-bottom:2rem;
}
.spec-item{
  text-align:center;padding:1.25rem;
  background:var(--sand);border-radius:var(--radius-md);
}
.spec-item svg{width:22px;height:22px;color:var(--gold);margin-bottom:.5rem}
.spec-item .spec-label{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.2rem}
.spec-item .spec-value{font-size:.95rem;font-weight:600;color:var(--ocean-deep)}

.room-price-box{
  background:linear-gradient(135deg,var(--ocean),var(--ocean-light));
  border-radius:var(--radius-md);padding:2rem;color:var(--white);
  text-align:center;margin-bottom:1.5rem;
}
.room-price-box .price-label{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:.3rem}
.room-price-box .price{font-family:'Playfair Display',serif;font-size:2.2rem;font-weight:700}
.room-price-box .price-note{font-size:.78rem;color:rgba(255,255,255,.5);margin-top:.3rem}

.room-contact-buttons{display:flex;flex-direction:column;gap:.75rem}
.room-contact-btn{
  display:flex;align-items:center;gap:.75rem;
  padding:1rem 1.25rem;border-radius:var(--radius-md);
  font-size:.85rem;font-weight:500;transition:all .3s var(--ease);
}
.room-contact-btn.whatsapp{background:#25D366;color:var(--white)}
.room-contact-btn.whatsapp:hover{background:#1DA851;transform:translateY(-2px)}
.room-contact-btn.phone{background:var(--ocean);color:var(--white)}
.room-contact-btn.phone:hover{background:var(--ocean-light);transform:translateY(-2px)}
.room-contact-btn.email{background:var(--sand);color:var(--ocean-deep);border:1px solid var(--sand-dark)}
.room-contact-btn.email:hover{border-color:var(--gold);transform:translateY(-2px)}
.room-contact-btn svg{width:18px;height:18px;flex-shrink:0}

/* Room features list */
.room-features-section{
  background:var(--sand);border-radius:var(--radius-lg);
  padding:2.5rem;
}
.room-features-section h3{
  font-family:'Playfair Display',serif;font-size:1.2rem;
  color:var(--ocean-deep);margin-bottom:1.5rem;
}
.room-features-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.6rem;
}
.room-feat-item{
  display:flex;align-items:center;gap:.5rem;
  font-size:.85rem;color:var(--text-light);padding:.4rem 0;
}
.room-feat-item svg{width:16px;height:16px;color:var(--sage);flex-shrink:0}
.room-feat-item .tag-paid{
  font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--terracotta);font-weight:600;
  padding:.12rem .4rem;background:rgba(198,123,92,.08);border-radius:50px;
  margin-left:.25rem;
}

/* ---------- CONTACT PAGE ---------- */
.contact-page-grid{
  display:grid;grid-template-columns:1fr 1.2fr;
  gap:3rem;max-width:1200px;margin:0 auto;
}
.contact-page-info h3{
  font-family:'Playfair Display',serif;font-size:1.15rem;
  color:var(--ocean-deep);margin-bottom:1.5rem;
}
.contact-page-items{display:flex;flex-direction:column;gap:1.25rem;margin-bottom:2.5rem}
.contact-page-item{display:flex;align-items:flex-start;gap:1rem}
.contact-page-item-icon{
  width:44px;height:44px;border-radius:var(--radius-md);
  background:linear-gradient(135deg,var(--ocean),var(--ocean-light));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.contact-page-item-icon svg{width:18px;height:18px;color:var(--white)}
.contact-page-item-label{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);margin-bottom:.2rem}
.contact-page-item-value{font-size:.92rem;color:var(--text);font-weight:500;line-height:1.6}
.contact-page-socials{display:flex;gap:.8rem;margin-top:.5rem}
.contact-page-map{
  border-radius:var(--radius-lg);overflow:hidden;min-height:450px;
  box-shadow:var(--shadow-card);
}
.contact-page-map iframe{width:100%;height:100%;min-height:450px;border:none}
.reservation-note{
  margin-top:2rem;padding:1.5rem 2rem;
  background:linear-gradient(135deg,rgba(196,148,74,.08),rgba(196,148,74,.02));
  border-radius:var(--radius-md);border-left:3px solid var(--gold);
}
.reservation-note p{font-size:.9rem;color:var(--text-light);line-height:1.7}
.reservation-note strong{color:var(--ocean-deep)}

/* ---------- FOOTER ---------- */
.footer{
  background:var(--ocean-deep);position:relative;overflow:hidden;
}
.footer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(to right,transparent,rgba(196,148,74,.2),transparent);
}
.footer-main{
  padding:4rem clamp(1.5rem,4vw,4rem) 3rem;
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:3rem;max-width:1300px;margin:0 auto;
}
.footer-brand .footer-logo{
  font-family:'Playfair Display',serif;font-size:1.4rem;
  color:var(--white);letter-spacing:.06em;margin-bottom:1rem;
  display:flex;align-items:center;gap:.6rem;
}
.footer-brand .footer-logo img{height:35px;filter:brightness(0) invert(1)}
.footer-brand p{
  font-size:.85rem;color:rgba(255,255,255,.4);line-height:1.7;
  max-width:280px;
}
.footer-col h4{
  font-family:'DM Sans',sans-serif;font-size:.72rem;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:1.25rem;
}
.footer-col a{
  display:block;font-size:.85rem;color:rgba(255,255,255,.5);
  padding:.35rem 0;transition:all .3s;
}
.footer-col a:hover{color:var(--white);padding-left:.3rem}
.footer-bottom{
  padding:1.5rem clamp(1.5rem,4vw,4rem);
  border-top:1px solid rgba(255,255,255,.05);
  display:flex;align-items:center;justify-content:center;
}
.footer-bottom p{
  font-size:.78rem;color:rgba(255,255,255,.3);letter-spacing:.04em;
}

/* ---------- SCROLL REVEAL ---------- */
.reveal{opacity:0;transform:translateY(35px);transition:all .8s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1024px){
  .rooms-grid{grid-template-columns:repeat(2,1fr)}
  .location-wrapper,.contact-wrapper,.about-intro,.contact-page-grid{grid-template-columns:1fr}
  .location-map{min-height:350px}
  .room-detail-top{grid-template-columns:1fr}
  .footer-main{grid-template-columns:1fr 1fr;gap:2rem}
  .amenities-categories{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  nav{padding:1rem 1.25rem}
  nav.scrolled{padding:.75rem 1.25rem}
  .nav-center,.nav-phone{display:none}
  .hamburger{display:flex}
  .rooms-grid{grid-template-columns:1fr}
  .hero-actions{flex-direction:column}
  .btn{justify-content:center;width:100%}
  .footer-main{grid-template-columns:1fr;gap:2rem}
  .room-detail-specs{grid-template-columns:1fr 1fr}
  .about-highlights{grid-template-columns:1fr}
  .amenities-categories{grid-template-columns:1fr}
  .contact-page-grid{grid-template-columns:1fr}
}