/* Datar Villa Girls Hostel — warm luxury beige/brown theme */
:root{
  --background:#F6F0E8;
  --foreground:#2B2118;
  --cream:#F6F0E8;
  --sand:#EFE5D8;
  --card:#FFFDF9;
  --primary:#5B3A1E;          /* mocha brown */
  --primary-foreground:#FFFDF9;
  --secondary:#EFE5D8;
  --muted:#EFE5D8;
  --muted-foreground:#6B5A47;
  --gold:#9C6B3D;
  --gold-foreground:#FFFDF9;
  --border:#DDD0C0;
  --shadow-soft:0 10px 40px -12px rgba(91,58,30,.18);
  --shadow-card:0 20px 50px -20px rgba(91,58,30,.22);
  --shadow-gold:0 14px 40px -14px rgba(156,107,61,.45);
  --gradient-warm:linear-gradient(135deg,#F6F0E8 0%,#EFE5D8 100%);
  --gradient-hero:linear-gradient(180deg,rgba(43,33,24,0) 0%,rgba(43,33,24,.55) 65%,rgba(43,33,24,.85) 100%);
  --font-serif:'Playfair Display',Georgia,serif;
  --font-sans:'Poppins',system-ui,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--background);color:var(--foreground);
  font-family:var(--font-sans);-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--font-serif);letter-spacing:-.01em;color:var(--primary);margin:0}
p{margin:0}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:0;background:transparent;color:inherit}
ul{margin:0;padding:0;list-style:none}

/* utility */
.font-serif{font-family:var(--font-serif)}
.text-primary{color:var(--primary)!important}
.text-gold{color:var(--gold)!important}
.text-muted{color:var(--muted-foreground)!important}
.bg-card{background:var(--card)}
.bg-secondary{background:var(--secondary)}
.bg-primary-c{background:var(--primary);color:var(--primary-foreground)}
.bg-gradient-warm{background:var(--gradient-warm)}
.shadow-soft{box-shadow:var(--shadow-soft)}
.shadow-card{box-shadow:var(--shadow-card)}
.shadow-gold{box-shadow:var(--shadow-gold)}
.rounded-3{border-radius:1rem}
.rounded-4{border-radius:1.5rem}
.rounded-5{border-radius:2rem}
.border-soft{border:1px solid var(--border)}
.text-balance{text-wrap:balance}
.section{padding:5rem 0}
@media(min-width:768px){.section{padding:7rem 0}}
.container-x{max-width:1200px;margin:0 auto;padding:0 1.5rem}

.luxe-divider{
  display:inline-flex;align-items:center;gap:.75rem;color:var(--gold);
  font-size:.75rem;letter-spacing:.35em;text-transform:uppercase;font-weight:500;
}
.luxe-divider::before,.luxe-divider::after{content:"";width:2.5rem;height:1px;background:currentColor;opacity:.6}

.btn-mocha{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--primary);color:var(--primary-foreground);
  border-radius:999px;padding:.7rem 1.4rem;font-size:.875rem;font-weight:500;
  box-shadow:var(--shadow-soft);transition:all .35s ease;
}
.btn-mocha:hover{background:var(--gold);color:var(--gold-foreground);box-shadow:var(--shadow-gold);transform:translateY(-2px)}
.btn-ghost{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(255,253,249,.85);backdrop-filter:blur(8px);
  color:var(--primary);border:1px solid var(--border);
  border-radius:999px;padding:.55rem 1rem;font-size:.875rem;font-weight:500;
  transition:background .3s;
}
.btn-ghost:hover{background:var(--secondary)}

.hover-lift{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease}
.hover-lift:hover{transform:translateY(-6px);box-shadow:var(--shadow-card)}

/* Animations */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.animate-fade-in{animation:fadeIn .7s ease-out both}
.animate-fade-up{animation:fadeUp .8s ease-out both}
.animate-float{animation:float 6s ease-in-out infinite}

/* ===== Navbar ===== */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:50;
  transition:all .5s ease;background:transparent;
}
.site-header.scrolled{
  background:rgba(246,240,232,.85);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);box-shadow:var(--shadow-soft);
}
.site-nav{
  max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.25rem;
}
@media(min-width:768px){.site-nav{padding:1.25rem 2rem}}
.brand{display:flex;align-items:center;gap:.75rem}
.brand-logo{
  width:56px;height:56px;border-radius:999px;background:var(--card);
  box-shadow:var(--shadow-gold);outline:2px solid rgba(156,107,61,.4);
  display:grid;place-items:center;overflow:hidden;transition:transform .3s;
}
@media(min-width:768px){.brand-logo{width:64px;height:64px}}
.brand:hover .brand-logo{transform:scale(1.05)}
.brand-logo img{width:100%;height:100%;object-fit:cover}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text .name{font-family:var(--font-serif);font-size:1.25rem;color:var(--primary)}
@media(min-width:768px){.brand-text .name{font-size:1.4rem}}
.brand-text .sub{font-size:10px;letter-spacing:.35em;text-transform:uppercase;color:var(--gold);margin-top:2px}

.nav-links{display:none;align-items:center;gap:.25rem}
@media(min-width:1024px){.nav-links{display:flex}}
.nav-links a{
  padding:.5rem 1rem;font-size:.875rem;font-weight:500;color:rgba(43,33,24,.8);
  border-radius:999px;transition:all .3s;
}
.nav-links a:hover,.nav-links a.active{color:var(--primary);background:var(--secondary)}

.book-cta{display:none}
@media(min-width:1024px){.book-cta{display:inline-flex}}

.nav-toggle{
  display:grid;place-items:center;width:40px;height:40px;border-radius:999px;
  background:var(--card);border:1px solid var(--border);color:var(--primary);
}
@media(min-width:1024px){.nav-toggle{display:none}}

.mobile-menu{
  display:none;border-top:1px solid var(--border);background:rgba(246,240,232,.95);
  backdrop-filter:blur(20px);animation:fadeIn .3s ease;
}
.mobile-menu.open{display:block}
.mobile-menu ul{max-width:1280px;margin:0 auto;padding:1rem 1.25rem;display:grid;gap:.25rem}
.mobile-menu a{
  display:block;padding:.75rem 1rem;border-radius:1rem;font-size:.875rem;font-weight:500;
  color:rgba(43,33,24,.8);
}
.mobile-menu a:hover,.mobile-menu a.active{background:var(--secondary);color:var(--primary)}
.mobile-menu .book-cta-mobile{
  display:block;text-align:center;background:var(--primary);color:var(--primary-foreground);
  border-radius:999px;padding:.85rem 1rem;font-weight:500;
}

/* ===== Hero ===== */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:7rem 0 2.5rem;overflow:hidden;
}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(246,240,232,.35) 0%,rgba(246,240,232,0) 25%,rgba(246,240,232,0) 70%,rgba(20,12,6,.25) 100%);
}
.hero-glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 32% 45% at 50% 48%,rgba(246,240,232,.78) 0%,rgba(246,240,232,.45) 45%,rgba(246,240,232,0) 75%);
}
.hero-content{
  position:relative;width:100%;max-width:36rem;margin:0 auto;padding:0 1.5rem;text-align:center;
}
.hero-mono{
  width:56px;height:56px;margin:0 auto;border-radius:999px;display:grid;place-items:center;
  background:rgba(255,253,249,.8);backdrop-filter:blur(8px);
  border:1px solid rgba(156,107,61,.3);box-shadow:var(--shadow-soft);overflow:hidden;
}
@media(min-width:768px){.hero-mono{width:64px;height:64px}}
.hero-mono img{width:100%;height:100%;object-fit:cover}
.hero-badge{
  margin-top:1rem;display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid rgba(156,107,61,.4);background:rgba(255,253,249,.85);backdrop-filter:blur(8px);
  border-radius:999px;padding:.25rem .9rem;font-size:11px;font-weight:500;color:var(--primary);
  box-shadow:var(--shadow-soft);
}
.hero h1{
  margin-top:1rem;font-size:clamp(1.5rem,4vw,3rem);line-height:1.1;
}
.hero h1 .italic-gold{display:block;font-style:italic;color:var(--gold);margin-top:.25rem}
.hero p.lead{
  margin:.75rem auto 0;max-width:28rem;font-size:clamp(.75rem,1.5vw,.875rem);
  color:rgba(43,33,24,.85);line-height:1.6;
}
.hero-cta{margin-top:1.25rem;display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}
.hero-chips{
  margin:1.5rem auto 0;max-width:28rem;display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;
}
.hero-chip{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  background:rgba(255,253,249,.7);backdrop-filter:blur(8px);
  border:1px solid rgba(221,208,192,.6);border-radius:.75rem;padding:.5rem;
}
.hero-chip .ic{
  width:28px;height:28px;display:grid;place-items:center;border-radius:999px;
  background:var(--secondary);color:var(--gold);
}
.hero-chip .t{font-family:var(--font-serif);font-size:11px;color:var(--primary);margin-top:.25rem;line-height:1.1}
.hero-chip .s{font-size:9px;color:var(--muted-foreground);line-height:1.2}
.wing-label{
  position:absolute;top:7rem;display:none;align-items:center;gap:.75rem;
  font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:rgba(91,58,30,.8);
}
@media(min-width:1024px){.wing-label{display:flex}}
.wing-label .line{width:40px;height:1px;background:rgba(91,58,30,.4)}
.wing-left{left:2.5rem}
.wing-right{right:2.5rem}

/* ===== Cards ===== */
.feature-card{
  background:var(--card);border:1px solid var(--border);border-radius:1.5rem;padding:1.75rem;
}
.feature-card .ic{
  width:56px;height:56px;display:grid;place-items:center;border-radius:1rem;
  background:var(--secondary);color:var(--primary);transition:all .3s;
}
.feature-card:hover .ic{background:var(--gold);color:var(--gold-foreground)}
.feature-card h3{font-size:1.25rem;margin-top:1.25rem}
.feature-card p{font-size:.875rem;color:var(--muted-foreground);margin-top:.5rem;line-height:1.6}

.room-card{
  display:block;background:var(--card);border:1px solid var(--border);border-radius:1.5rem;
  overflow:hidden;color:inherit;
}
.room-card .img-wrap{position:relative;height:15rem;overflow:hidden}
.room-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.room-card:hover img{transform:scale(1.1)}
.room-card .tag{
  position:absolute;top:.75rem;left:.75rem;background:rgba(255,253,249,.9);color:var(--primary);
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;padding:.25rem .75rem;border-radius:999px;
}
.room-card .body{padding:1.25rem}
.room-card .body h3{font-size:1.125rem;font-family:var(--font-serif)}
.room-card .body p{font-size:.875rem;color:var(--muted-foreground);margin-top:.25rem;line-height:1.6}
.room-card .meta{margin-top:1rem;display:flex;align-items:center;justify-content:space-between}
.room-card .meta .label{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.room-card .meta .arr{
  width:36px;height:36px;display:grid;place-items:center;border-radius:999px;
  background:var(--secondary);color:var(--primary);transition:all .3s;
}
.room-card:hover .meta .arr{background:var(--primary);color:var(--primary-foreground)}

/* Stats */
.stats-section{background:var(--primary);color:var(--primary-foreground);padding:5rem 0}
.stats-grid{display:grid;gap:2.5rem;text-align:center;grid-template-columns:repeat(2,1fr)}
@media(min-width:1024px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
.stat .v{font-family:var(--font-serif);font-size:3rem;color:var(--gold)}
@media(min-width:768px){.stat .v{font-size:3.75rem}}
.stat .l{margin-top:.5rem;font-size:.875rem;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,253,249,.75)}

/* Testimonials */
.testimonial{
  position:relative;background:var(--card);border:1px solid var(--border);border-radius:1.5rem;
  padding:1.75rem;box-shadow:var(--shadow-soft);
}
.testimonial .quote-ic{color:rgba(156,107,61,.6)}
.testimonial .stars{margin-top:.75rem;display:flex;gap:2px;color:var(--gold)}
.testimonial blockquote{margin:1rem 0 0;font-size:.95rem;line-height:1.65;color:rgba(43,33,24,.85)}
.testimonial figcaption{margin-top:1.5rem;display:flex;align-items:center;gap:.75rem}
.testimonial .avatar{
  width:44px;height:44px;display:grid;place-items:center;border-radius:999px;
  background:var(--secondary);color:var(--primary);font-family:var(--font-serif);font-size:1rem;
}
.testimonial .who{font-family:var(--font-serif);font-size:1rem;color:var(--primary);line-height:1.1}
.testimonial .role{font-size:.75rem;color:var(--muted-foreground)}

/* Page banner */
.page-banner{
  position:relative;padding:9rem 0 4rem;background:var(--gradient-warm);overflow:hidden;text-align:center;
}
@media(min-width:768px){.page-banner{padding:11rem 0 6rem}}
.page-banner .blob1{position:absolute;top:-6rem;right:-6rem;width:20rem;height:20rem;border-radius:999px;background:rgba(156,107,61,.1);filter:blur(60px)}
.page-banner .blob2{position:absolute;bottom:-6rem;left:-6rem;width:20rem;height:20rem;border-radius:999px;background:rgba(91,58,30,.1);filter:blur(60px)}
.page-banner h1{font-size:clamp(2rem,5vw,3.75rem);margin-top:1.5rem}
.page-banner p{margin:1.25rem auto 0;max-width:42rem;color:var(--muted-foreground);font-size:1.05rem;line-height:1.6}
.breadcrumbs{margin-top:2rem;font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted-foreground)}
.breadcrumbs .sep{margin:0 .75rem;color:var(--gold)}
.breadcrumbs .curr{color:var(--primary)}

/* About images grid */
.about-img-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.about-img-grid img{height:14rem;width:100%;object-fit:cover;border-radius:1rem;box-shadow:var(--shadow-soft)}
.about-img-grid img:nth-child(2){margin-top:2rem}
.about-img-grid img:nth-child(3){margin-top:-1rem}
.about-img-grid img:nth-child(4){margin-top:1rem}

/* Mission/Vision */
.mv-card{border-radius:1.5rem;padding:2rem;box-shadow:var(--shadow-soft)}
.mv-light{background:var(--card);border:1px solid var(--border)}
.mv-dark{background:var(--primary);color:var(--primary-foreground)}

/* Rooms list page */
.room-row{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center;margin-bottom:4rem}
@media(min-width:992px){.room-row{grid-template-columns:1fr 1fr}}
.room-row.reverse>div:first-child{order:1}
@media(min-width:992px){.room-row.reverse>div:first-child{order:2}}
.room-row .img-frame{position:relative}
.room-row .img-frame::before{
  content:"";position:absolute;inset:-.75rem;border-radius:2rem;background:rgba(156,107,61,.1);filter:blur(32px);
}
.room-row .img-frame img{position:relative;border-radius:2rem;width:100%;height:26rem;object-fit:cover;
  box-shadow:var(--shadow-card);border:1px solid var(--border);
}
.room-price{font-family:var(--font-serif);font-size:2.25rem;color:var(--gold)}
.amenities{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1.25rem}
.amenities li{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:rgba(43,33,24,.8)}
.amenities .chk{
  width:20px;height:20px;display:grid;place-items:center;border-radius:999px;
  background:rgba(156,107,61,.15);color:var(--gold);
}

/* Gallery */
.gallery-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;grid-auto-rows:14rem;
}
@media(min-width:768px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.gallery-grid{grid-template-columns:repeat(4,1fr)}}
.gallery-item{
  position:relative;overflow:hidden;border-radius:1rem;box-shadow:var(--shadow-soft);
  border:1px solid var(--border);display:block;
}
.gallery-item.span2{grid-row:span 2}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.gallery-item:hover img{transform:scale(1.1)}
.gallery-item .overlay{position:absolute;inset:0;background:rgba(91,58,30,0);transition:background .3s}
.gallery-item:hover .overlay{background:rgba(91,58,30,.3)}
.gallery-item .cap{
  position:absolute;bottom:.75rem;left:.75rem;right:.75rem;text-align:left;
  font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .3s;
}
.gallery-item:hover .cap{opacity:1}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;z-index:60;background:rgba(43,33,24,.8);backdrop-filter:blur(12px);
  display:none;align-items:center;justify-content:center;padding:1.5rem;animation:fadeIn .3s;
}
.lightbox.open{display:grid;place-items:center}
.lightbox img{max-height:85vh;max-width:92vw;border-radius:1rem;box-shadow:var(--shadow-card);object-fit:contain}
.lightbox .ctrl{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:48px;display:grid;place-items:center;border-radius:999px;
  background:var(--card);color:var(--primary);box-shadow:var(--shadow-card);transition:all .3s;
}
.lightbox .ctrl:hover{background:var(--gold);color:var(--gold-foreground)}
.lightbox .prev{left:1rem}
.lightbox .next{right:1rem}
@media(min-width:768px){.lightbox .prev{left:2rem}.lightbox .next{right:2rem}}
.lightbox .close{
  position:absolute;top:1.5rem;right:1.5rem;width:44px;height:44px;display:grid;place-items:center;
  border-radius:999px;background:var(--card);color:var(--primary);
}
.lightbox .cap-bottom{
  position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);
  font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,253,249,.9);
  background:rgba(43,33,24,.4);backdrop-filter:blur(8px);padding:.5rem 1rem;border-radius:999px;
}

/* FAQ */
.faq-list{max-width:48rem;margin:0 auto;display:grid;gap:.75rem}
.faq-item{
  border:1px solid var(--border);background:var(--card);border-radius:1rem;
  overflow:hidden;box-shadow:var(--shadow-soft);transition:box-shadow .3s;
}
.faq-item.open{box-shadow:var(--shadow-card)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  text-align:left;padding:1.25rem 1.5rem;font-family:var(--font-serif);font-size:1.1rem;color:var(--primary);
}
.faq-q .ic{
  width:36px;height:36px;display:grid;place-items:center;border-radius:999px;flex-shrink:0;
  background:var(--secondary);color:var(--primary);transition:all .3s;
}
.faq-item.open .faq-q .ic{background:var(--primary);color:var(--primary-foreground)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease,opacity .3s;opacity:0}
.faq-item.open .faq-a{max-height:400px;opacity:1}
.faq-a p{padding:0 1.5rem 1.25rem;font-size:.875rem;color:var(--muted-foreground);line-height:1.6}

/* Contact */
.contact-grid{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:992px){.contact-grid{grid-template-columns:3fr 2fr}}
.form-card{background:var(--card);border:1px solid var(--border);border-radius:1.5rem;padding:2rem;box-shadow:var(--shadow-card)}
@media(min-width:768px){.form-card{padding:2.5rem}}
.form-label{display:block;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-foreground);margin-bottom:.5rem}
.form-input{
  width:100%;border:1px solid var(--border);background:var(--background);
  border-radius:999px;padding:.75rem 1.25rem;font-size:.875rem;outline:none;
  transition:box-shadow .2s,border-color .2s;font-family:inherit;color:inherit;
}
.form-input:focus{border-color:transparent;box-shadow:0 0 0 2px var(--gold)}
.form-textarea{
  width:100%;border:1px solid var(--border);background:var(--background);
  border-radius:1rem;padding:.75rem 1rem;font-size:.875rem;outline:none;
  transition:box-shadow .2s,border-color .2s;font-family:inherit;color:inherit;resize:vertical;
}
.form-textarea:focus{border-color:transparent;box-shadow:0 0 0 2px var(--gold)}
.info-card{
  background:var(--card);border:1px solid var(--border);border-radius:1.5rem;
  padding:1.5rem;display:flex;align-items:flex-start;gap:1rem;box-shadow:var(--shadow-soft);
}
.info-card .ic{
  width:48px;height:48px;display:grid;place-items:center;border-radius:1rem;
  background:rgba(156,107,61,.15);color:var(--gold);flex-shrink:0;
}
.info-card .title{font-family:var(--font-serif);font-size:1.125rem;color:var(--primary)}
.info-card p{font-size:.875rem;color:var(--muted-foreground)}
.wa-card{
  display:flex;align-items:center;gap:1rem;background:var(--primary);color:var(--primary-foreground);
  border-radius:1.5rem;padding:1.5rem;box-shadow:var(--shadow-soft);transition:background .3s;
}
.wa-card:hover{background:var(--gold);color:var(--gold-foreground)}
.wa-card .ic{width:48px;height:48px;display:grid;place-items:center;border-radius:1rem;background:rgba(255,253,249,.15)}
.social-row{display:flex;gap:.75rem;padding-top:.5rem}
.social-row a{
  width:48px;height:48px;display:grid;place-items:center;border-radius:1rem;
  background:var(--card);border:1px solid var(--border);color:var(--primary);transition:all .3s;
}
.social-row a:hover{background:var(--gold);color:var(--gold-foreground)}

/* ===== Footer ===== */
.site-footer{margin-top:6rem;background:var(--primary);color:var(--primary-foreground)}
.footer-grid{
  max-width:1280px;margin:0 auto;padding:4rem 1.5rem;display:grid;gap:3rem;grid-template-columns:1fr;
}
@media(min-width:768px){.footer-grid{grid-template-columns:repeat(4,1fr);padding:5rem 1.5rem}}
.footer-brand .ft-logo{
  width:48px;height:48px;border-radius:999px;background:var(--card);overflow:hidden;
}
.footer-brand .ft-logo img{width:100%;height:100%;object-fit:cover}
.footer h4{font-family:var(--font-serif);font-size:1.125rem;margin-bottom:1rem;color:var(--primary-foreground)}
.footer a{font-size:.875rem;color:rgba(255,253,249,.75);transition:color .2s}
.footer a:hover{color:var(--gold)}
.footer ul li{margin-bottom:.5rem}
.footer .contact-li{display:flex;align-items:flex-start;gap:.75rem;color:rgba(255,253,249,.8);font-size:.875rem;margin-bottom:.75rem}
.footer .contact-li .ic{color:var(--gold);margin-top:2px;flex-shrink:0}
.footer .socials{display:flex;gap:.75rem}
.footer .socials a{
  width:40px;height:40px;display:grid;place-items:center;border-radius:999px;
  background:rgba(255,253,249,.1);color:#fff;transition:background .2s,color .2s;
}
.footer .socials a:hover{background:var(--gold);color:#fff}
.footer-bottom{border-top:1px solid rgba(255,253,249,.1)}
.footer-bottom .inner{
  max-width:1280px;margin:0 auto;padding:1.5rem;display:flex;flex-direction:column;align-items:center;
  justify-content:space-between;gap:.5rem;font-size:.75rem;color:rgba(255,253,249,.6);
}
@media(min-width:640px){.footer-bottom .inner{flex-direction:row}}

/* WhatsApp floating */
.wa-float{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:50;
  width:56px;height:56px;border-radius:999px;display:grid;place-items:center;
  background:#25D366;color:#fff;box-shadow:var(--shadow-gold);
  animation:float 6s ease-in-out infinite;transition:transform .3s;
}
.wa-float:hover{transform:scale(1.1)}
.wa-float svg{width:28px;height:28px}

/* Grids */
.grid-3{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:640px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.grid-4{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr)}}

/* About preview */
.about-preview{display:grid;gap:3.5rem;align-items:center;grid-template-columns:1fr}
@media(min-width:992px){.about-preview{grid-template-columns:1fr 1fr}}
.about-preview .img-frame{position:relative}
.about-preview .img-frame::before{
  content:"";position:absolute;inset:-.75rem;border-radius:2rem;background:rgba(156,107,61,.1);filter:blur(32px);
}
.about-preview .img-frame img{
  position:relative;border-radius:2rem;width:100%;height:28rem;object-fit:cover;
  box-shadow:var(--shadow-card);border:1px solid var(--border);
}
.about-preview .badge-years{
  display:none;position:absolute;bottom:-1.5rem;right:-1.5rem;background:var(--card);
  border:1px solid var(--border);border-radius:1rem;padding:1rem 1.25rem;
  align-items:center;gap:.75rem;box-shadow:var(--shadow-card);
}
@media(min-width:768px){.about-preview .badge-years{display:flex}}
.about-preview .badge-years .num{font-family:var(--font-serif);font-size:1.875rem;color:var(--gold)}
.about-preview .badge-years .lab{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted-foreground);line-height:1.2}
.check-list{margin:1.5rem 0 0;display:grid;grid-template-columns:1fr;gap:.75rem}
@media(min-width:640px){.check-list{grid-template-columns:1fr 1fr}}
.check-list li{display:flex;align-items:center;gap:.75rem;font-size:.875rem;color:rgba(43,33,24,.8)}
.check-list .dot{width:6px;height:6px;border-radius:999px;background:var(--gold)}

/* Visit CTA */
.cta-section{padding:5rem 0;text-align:center}
.cta-section.bg-muted{background:rgba(239,229,216,.6)}

/* Pull quote */
.pullquote{
  background:var(--primary);color:var(--primary-foreground);padding:5rem 0;text-align:center;
}
.pullquote p{font-family:var(--font-serif);font-size:clamp(1.25rem,2.5vw,1.75rem);font-style:italic;line-height:1.6;max-width:48rem;margin:0 auto}
.pullquote .sig{margin-top:1.5rem;font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}

/* Map */
.map-wrap{border-radius:1.5rem;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-soft)}
.map-wrap iframe{width:100%;height:24rem;border:0;display:block}

/* Section heads */
.section-head{text-align:center;margin-bottom:3.5rem}
.section-head h2{font-size:clamp(1.875rem,3vw,3rem);margin-top:1rem}

/* Inline icon wrapper */
.i{display:inline-flex;align-items:center;justify-content:center}
[data-lucide]{width:1em;height:1em}



.brand-new{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:0;
    padding-bottom:0;
}

.main-logo{
    width:120px;
    height:auto;
    object-fit:contain;
    margin-bottom:-10px; /* Move text upward */
}

.girls-hostel-line{
    display:flex;
    align-items:center;
    gap:10px;
}

.girls-hostel-line span{
    width:40px;      /* increase length */
    height:1.5px;      /* increase thickness */
    background:#9C6B3D;
    display:block;
    opacity:0.9;
}

.tagline{
    margin-top:2px;
    font-size:8px;
    letter-spacing:2px;
    text-transform:uppercase;
    color:#6B5A47;
    line-height:1;
}



.hero-modern{
    padding:140px 0 80px;
    background:#F6F0E8;
}

.hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.hero-left h1{
    font-size:55px;
    line-height:1.05;
    color:#5B3A1E;
    margin-top:25px;
}

.hero-left h1 span{
    display:block;
    color:#9C6B3D;
    font-style:italic;
}

.hero-left p{
    margin-top:25px;
    max-width:520px;
    line-height:1.8;
    color:#6B5A47;
    font-size:18px;
}

.hero-buttons{
    display:flex;
    gap:15px;
    margin-top:35px;
}

.hero-badge{
    display:inline-block;
    border:1px solid #DDD0C0;
    border-radius:999px;
    padding:10px 20px;
    color:#9C6B3D;
    font-size:12px;
    letter-spacing:3px;
}

.hero-stats{
    display:flex;
    gap:60px;
    margin-top:50px;
}

.hero-stats h3{
    font-size:42px;
    margin:0;
    color:#5B3A1E;
}

.hero-stats span{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:2px;
    color:#6B5A47;
}

.hero-right{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
}

.hero-slider{
    width:100%;
    max-width:520px;
    height:590px;
    border-radius:35px;
    overflow:hidden;
    position:relative;
}

.slide{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transition:1s;
}

.slide.active{
    opacity:1;
}

.safety-card{
    position:static !important;
    margin-top:10px;
    width:320px;
    background:#fff;
    border-radius:24px;
    padding:20px 25px;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
}

.safety-card i{
    width:50px;
    height:50px;
    background:#9C6B3D;
    color:white;
    padding:20px;
    border-radius:50%;
}



@media(max-width:991px){

.hero-grid{
    grid-template-columns:1fr;
}

.hero-left{
    text-align:center;
}

.hero-left h1{
    font-size:50px;
}

.hero-buttons{
    justify-content:center;
}

.hero-stats{
    justify-content:center;
}

.hero-slider{
    height:450px;
}

.safety-card{
    left:10px;
    bottom:10px;
}
}


@keyframes fadeUp {
  from{
    opacity:0;
    transform:translateY(40px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.hero-badge{
  animation:fadeUp .6s ease forwards;
}

.hero-left h1{
  opacity:0;
  animation:fadeUp .8s ease forwards;
  animation-delay:.2s;
}

.hero-left p{
  opacity:0;
  animation:fadeUp .8s ease forwards;
  animation-delay:.4s;
}

.hero-buttons{
  opacity:0;
  animation:fadeUp .8s ease forwards;
  animation-delay:.6s;
}

.hero-stats{
  opacity:0;
  animation:fadeUp .8s ease forwards;
  animation-delay:.8s;
}


.safety-card{
    position:absolute;
    bottom:-25px;
    left:-25px;
    background:#fff;
    border-radius:24px;
    padding:18px 28px;
    min-width:260px;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
}

.wing-label{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:2px;
    color:#9C6B3D;
    margin-bottom:4px;
}

#wingName{
    margin:0;
    color:#5B3A1E;
    font-size:28px;
    font-family:'Playfair Display',serif;
}

#wingDesc{
    margin-top:4px;
    color:#777;
    font-size:14px;
}

/* Footer Logo Alignment */

.site-footer .brand-new{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    width:100%;
}

.site-footer .main-logo{
    width:110px;
    height:auto;
    margin-bottom:-10px;
}

.site-footer .girls-hostel-line{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
}

.site-footer .girls-hostel-line span{
    width:50px;
    height:1px;
    background:rgba(255,255,255,.5);
}



.site-footer .tagline{
    margin-top:4px;
    color:rgba(255,255,255,.85);
    font-size:8px;
    letter-spacing:2px;
    text-transform:uppercase;
    text-align:center;
}

.footer-brand{
    text-align:center;
}

.footer-brand > p{
    margin-top:18px !important;
    text-align:center;
    max-width:320px;
    margin-left:auto;
    margin-right:auto;
    color:rgba(255,255,255,.9) !important;
    line-height:1.7;
}


.girls-hostel-line p{
    margin:0;
    font-size:12px;
    font-weight:500;
    letter-spacing:2px;
    white-space:nowrap;
}

.site-header .girls-hostel-line p{
    color:#2B2118;
}

/* Common Logo Text Style */

.girls-hostel-line p{
    margin:0;
    font-size:12px;
    font-weight:500;
    letter-spacing:2px;
    white-space:nowrap;
}

.tagline{
    margin-top:4px;
    font-size:8px;
    letter-spacing:2px;
    line-height:1;
    text-transform:uppercase;
}

/* Navbar Colors */

.site-header .girls-hostel-line p{
    color:#2B2118;
}

.site-header .tagline{
    color:#6B5A47;
}

/* Footer Colors */

.site-footer .girls-hostel-line p{
    color:#ffffff;
}

.site-footer .tagline{
    color:rgba(255,255,255,.85);
}

.gallery-video{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .8s ease;
}

.video-card:hover .gallery-video{
    transform:scale(1.08);
}

.play-btn{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:70px;
    height:70px;
    border-radius:50%;
    background:rgba(255,255,255,.85);
    color:#5B3A1E;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    transition:.4s;
}

.video-card:hover .play-btn{
    transform:translate(-50%,-50%) scale(1.1);
}

.play-btn{
    animation:pulse 2s infinite;
}

@keyframes pulse{

    0%{
        box-shadow:0 0 0 0 rgba(255,255,255,.7);
    }

    70%{
        box-shadow:0 0 0 20px rgba(255,255,255,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(255,255,255,0);
    }
}



.footer .socials a{
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    color:#fff;
    font-size:18px;
    transition:.3s;
}

.footer .socials a:hover{
    background:#9C6B3D;
    color:#fff;
}

.footer .socials i{
    font-size:18px;
    line-height:1;
}

.about-preview .img-frame{
    position:relative;
}

.img-caption{
    text-align:center;
    margin-top:20px;

    font-family:'Playfair Display', serif;
    font-size:28px;
    color:#5B3A1E;
    letter-spacing:.5px;
}

/* Back Button */
.back-float{
    position:fixed;
    bottom:90px; /* Above WhatsApp button */
    right:1.5rem;
    width:56px;
    height:56px;
    border-radius:50%;
    background:#7a4e28;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:24px;
    font-weight:700;
    z-index:999;
    box-shadow:0 10px 25px rgba(0,0,0,.15);
    transition:.3s;
}

.back-float:hover{
    transform:scale(1.1);
}

/* WhatsApp Button */
.wa-float{
    position:fixed;
    bottom:1.5rem;
    right:1.5rem;
    z-index:999;
    width:56px;
    height:56px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#25D366;
    color:#fff;
}

html{
    scroll-behavior:smooth;
}

#video-tour{
    scroll-margin-top:100px;
}