/* SAYAJI HOTEL - Bootstrap 5 Homepage */
:root{
    --brown:#2b211c;
    --brown-2:#3a2b24;
    --gold:#c7a16a;
    --gold-light:#e5c58e;
    --cream:#f8f4ee;
    --cream-2:#efe7dc;
    --white:#fff;
    --text:#514943;
    --muted:#766e67;
    --border:rgba(43,33,28,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:#fff;color:var(--text);font-family:Inter,Arial,sans-serif;font-size:15px;line-height:1.75}
a{text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4,h5,.display-title,blockquote{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}
.topbar{background:#211a16;color:#ddd8d2;font-size:12px;letter-spacing:.4px;padding:9px 0}
.topbar a{color:#eee}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:18px}
.top-divider{height:15px;width:1px;background:#75665c}
.topbar-right a{color:var(--gold-light)}
.main-nav{position:absolute;z-index:1000;top:38px;left:0;right:0;background:rgba(35,28,24,.86);border-bottom:1px solid rgba(255,255,255,.12);padding:13px 0;transition:.3s}
.main-nav.nav-scrolled{position:fixed;top:0;background:rgba(35,28,24,.97);box-shadow:0 10px 30px rgba(0,0,0,.16)}
.navbar-brand{display:flex;align-items:center;gap:10px;color:#fff!important;min-width:205px}
.brand-mark{width:42px;height:42px;border:1px solid rgba(229,197,142,.65);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--gold-light);font-size:20px}
.brand-text{font-family:"Cormorant Garamond",serif;font-size:29px;letter-spacing:3px;line-height:.75}
.brand-text small{display:block;font-family:Inter,sans-serif;font-size:8px;letter-spacing:4px;margin:8px 0 0 3px;color:#d6c9bd}
.nav-link{color:#f4eee8!important;text-transform:uppercase;font-size:11px;letter-spacing:1.8px;padding:15px 13px!important}
.nav-link:hover,.nav-link.active{color:var(--gold-light)!important}
.btn-gold{background:var(--gold);border:1px solid var(--gold);color:#241b17;font-weight:600;border-radius:2px;padding:11px 22px}
.btn-gold:hover{background:var(--gold-light);border-color:var(--gold-light);color:#241b17}
.nav-book-btn{font-size:12px;text-transform:uppercase;letter-spacing:1px}
.hero-section{position:relative}
.hero-slide{height:min(790px,calc(100vh - 0px));min-height:650px;background-position:center;background-size:cover;position:relative}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,13,9,.78) 0%,rgba(20,13,9,.42) 46%,rgba(20,13,9,.18) 100%)}
.hero-content{position:relative;z-index:2;color:#fff;padding-top:230px}
.eyebrow{display:inline-block;font-size:11px;letter-spacing:3px;font-weight:600;color:var(--gold-light);margin-bottom:13px}
.eyebrow.dark{color:#957454}
.hero-content h1{font-size:clamp(48px,6vw,82px);line-height:.92;margin:0 0 24px;max-width:760px;letter-spacing:-1px}
.hero-content h1 em,.section-heading h2 em,h2 em,h3 em,blockquote em{font-style:italic;color:var(--gold-light)}
.hero-content p{max-width:570px;color:#eee6df;font-size:16px}
.hero-actions{display:flex;gap:12px;margin-top:28px}
.carousel-control-prev,.carousel-control-next{width:7%;z-index:3}
.carousel-indicators{z-index:4}
.quick-booking-wrap{position:absolute;bottom:34px;left:0;right:0;z-index:10}
.quick-booking{max-width:920px;margin:auto;background:rgba(42,32,26,.95);border:1px solid rgba(229,197,142,.28);display:flex;align-items:center;padding:12px 14px;border-radius:2px;box-shadow:0 15px 40px rgba(0,0,0,.25)}
.quick-item{flex:1;display:flex;align-items:center;gap:12px;color:#fff;padding:5px 16px}
.quick-item i{font-size:22px;color:var(--gold-light)}
.quick-item small{display:block;font-size:8px;letter-spacing:1.7px;color:#bcb1a8}
.quick-item strong{font-size:12px;font-weight:500}
.quick-separator{height:34px;width:1px;background:rgba(255,255,255,.18)}
.quick-reserve{background:var(--gold);color:#241b17;padding:14px 24px;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:1px}
.quick-reserve:hover{background:var(--gold-light);color:#241b17}
.section-pad{padding:100px 0}
.about-section,.amenities-section,.gallery-section{background:var(--cream)}
.section-heading h2{font-size:clamp(42px,5vw,62px);line-height:.95;color:var(--brown);margin:0}
.section-intro{max-width:700px;margin:20px auto 0;color:var(--muted)}
.gold-line{width:110px;height:1px;background:var(--gold);margin:17px 0}
.section-heading.text-center .gold-line{margin:17px auto}
.about-image-grid{height:550px;position:relative;padding:0 80px 80px 0}
.about-img{overflow:hidden}
.about-img img{width:100%;height:100%;object-fit:cover}
.about-img-main{height:470px}
.about-img-small{position:absolute;right:0;bottom:0;width:50%;height:250px;border:10px solid var(--cream)}
.experience-badge{position:absolute;left:20px;bottom:40px;background:var(--brown);color:#fff;padding:17px 24px;display:flex;flex-direction:column;text-transform:uppercase;letter-spacing:1px}
.experience-badge strong{font-family:"Cormorant Garamond";font-size:24px;font-weight:500;color:var(--gold-light)}
.experience-badge span{font-size:9px}
.display-title{font-size:47px;line-height:1.02;color:var(--brown)}
.body-copy{color:var(--muted)}
.feature-points{margin:25px 0}
.feature-points div{display:flex;align-items:center;gap:10px;margin:9px 0;font-size:13px}
.feature-points i{color:#a98150}
.text-link{color:var(--brown);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.3px;border-bottom:1px solid var(--gold);padding-bottom:5px}
.text-link i{margin-left:6px}
.stats-section{background:var(--brown);color:#fff;padding:35px 0}
.stat-box{display:flex;align-items:center;justify-content:center;gap:18px;min-height:72px;border-right:1px solid rgba(255,255,255,.16)}
.stat-box:last-child{border:0}
.stat-box strong{font-family:"Cormorant Garamond";font-size:34px;color:var(--gold-light);font-weight:500}
.stat-box span{font-size:10px;text-transform:uppercase;letter-spacing:1.4px;line-height:1.5;color:#d7cec7}
.rooms-section{background:#fff}
.section-side-copy{max-width:380px;color:var(--muted);font-size:13px}
.room-card{background:#fff;border:1px solid var(--border);height:100%;transition:.3s;box-shadow:0 8px 30px rgba(43,33,28,.04)}
.room-card:hover{transform:translateY(-7px);box-shadow:0 20px 40px rgba(43,33,28,.12)}
.room-img{height:280px;position:relative;overflow:hidden}
.room-img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.room-card:hover .room-img img{transform:scale(1.05)}
.room-tag{position:absolute;top:16px;left:16px;background:var(--gold);color:#241b17;padding:5px 10px;font-size:9px;letter-spacing:1px;font-weight:700}
.room-body{padding:25px}
.room-category{font-size:9px;letter-spacing:2px;color:#9b7858;font-weight:700}
.room-body h3{font-size:32px;color:var(--brown);margin:5px 0 8px}
.room-body p{color:var(--muted);font-size:13px;margin-bottom:22px}
.split-section{display:grid;grid-template-columns:1.05fr .95fr;min-height:620px}
.split-image{background-position:center;background-size:cover}
.split-content{background:var(--brown);color:#fff;padding:90px clamp(35px,7vw,110px);display:flex;flex-direction:column;justify-content:center}
.split-content h2,.events-section h2{font-size:58px;line-height:.95;margin:0;color:#fff}
.split-content p,.events-section p{max-width:550px;color:#d5cbc3}
.mini-features{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 30px}
.mini-features span{border:1px solid rgba(255,255,255,.2);padding:8px 12px;font-size:10px;text-transform:uppercase;letter-spacing:1px}
.mini-features i{color:var(--gold-light);margin-right:6px}
.btn-light-outline{color:#fff;border:1px solid rgba(255,255,255,.5);border-radius:2px;padding:11px 20px;width:max-content;font-size:12px;text-transform:uppercase;letter-spacing:1px}
.btn-light-outline:hover{background:#fff;color:var(--brown)}
.amenity{text-align:center;border:1px solid var(--border);padding:25px 8px;height:100%;background:#fff}
.amenity i{font-size:26px;color:#9a7650;display:block;margin-bottom:10px}
.amenity strong{display:block;color:var(--brown);font-family:"Cormorant Garamond";font-size:21px;font-weight:600}
.amenity small{font-size:10px;color:#8b817a}
.events-section{background:var(--cream-2);padding:100px 0}
.event-list{margin:28px 0}
.event-list>div{display:flex;gap:15px;padding:13px 0;border-bottom:1px solid rgba(43,33,28,.14)}
.event-list i{color:#9a7650;font-size:20px}
.event-list strong{display:block;font-size:13px;color:var(--brown)}
.event-list small{display:block;color:var(--muted);font-size:11px}
.event-image-wrap{position:relative;padding:0 0 45px 45px}
.event-image-wrap:before{content:"";position:absolute;left:0;top:45px;bottom:0;width:45%;border:1px solid var(--gold)}
.event-image-wrap img{position:relative;z-index:1;width:100%;height:520px;object-fit:cover}
.event-caption{position:absolute;z-index:2;bottom:10px;left:20px;background:var(--brown);color:#fff;padding:15px 25px;font-family:"Cormorant Garamond";font-size:25px;letter-spacing:1px}
.event-caption span{color:var(--gold-light)}
.gallery-grid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:230px;gap:12px}
.gallery-item{overflow:hidden}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.5s}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-large{grid-row:span 2}
.quote-section{background:var(--brown);color:#fff;text-align:center;padding:90px 20px}
.quote-mark{font-family:Georgia;font-size:85px;color:var(--gold);line-height:.5}
.quote-section blockquote{font-size:45px;line-height:1.08;margin:10px auto 20px;max-width:950px}
.quote-section blockquote em{color:var(--gold-light)}
.quote-section p{font-size:10px;letter-spacing:3px;color:#c9bdb3}
.contact-section{background:#211a16;padding:90px 0}
.contact-box{box-shadow:0 25px 70px rgba(0,0,0,.25)}
.contact-info{background:#30241f;color:#fff;padding:55px}
.contact-info h2{font-size:57px;line-height:.9}
.contact-info p{color:#c8bdb5;font-size:13px}
.contact-detail{display:flex;gap:14px;margin:24px 0}
.contact-detail>i{color:var(--gold-light);font-size:19px}
.contact-detail small{display:block;color:#9f9289;font-size:8px;letter-spacing:1.7px}
.contact-detail a,.contact-detail span{color:#fff;font-size:13px}
.contact-form-wrap{background:#fff;padding:55px}
.form-title span{font-size:9px;letter-spacing:2px;color:#9b7651;font-weight:700}
.form-title h3{font-size:38px;color:var(--brown);margin-bottom:24px}
.contact-form-wrap label{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#6d625b;font-weight:700;margin-bottom:6px}
.form-control,.form-select{border-radius:0;border:1px solid #ddd4ca;padding:11px 13px;font-size:13px;color:var(--text);background:#fff}
.form-control:focus,.form-select:focus{border-color:var(--gold);box-shadow:0 0 0 .2rem rgba(199,161,106,.15)}
.btn-whatsapp{background:#1f9d55;border:1px solid #1f9d55;color:#fff;padding:13px;font-weight:700;border-radius:2px}
.btn-whatsapp:hover{background:#187a43;border-color:#187a43;color:#fff}
.form-note{display:block;text-align:center;color:#81766e;font-size:10px;margin-top:9px}
.footer{background:#17120f;color:#aaa096;padding:60px 0 25px}
.footer-top{text-align:center;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-brand{display:inline-flex;align-items:center;gap:10px;color:#fff;margin-bottom:15px}
.footer-brand .brand-text{font-size:30px}
.footer-top p{font-size:12px;max-width:550px;margin:0 auto 18px}
.footer-social{display:flex;justify-content:center;gap:8px}
.footer-social a{width:34px;height:34px;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:#d7c9bc}
.footer-social a:hover{color:var(--gold-light);border-color:var(--gold)}
.footer-links{padding:42px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-links h5{font-family:Inter;font-size:10px;letter-spacing:2px;color:#e2d8d0;margin-bottom:15px}
.footer-links>a{display:block;color:#9d938b;font-size:12px;margin:7px 0}
.footer-links>a:hover,.footer-contact a:hover{color:var(--gold-light)}
.footer-contact{display:inline-flex;align-items:center;gap:9px;margin:0 20px 8px 0;font-size:12px}
.footer-contact i{color:var(--gold)}
.footer-contact a{color:#b5aaa2}
.footer-bottom{padding-top:20px;display:flex;justify-content:space-between;gap:15px;font-size:10px}
.footer-bottom a{color:#b8ada5}
.floating-whatsapp{position:fixed;right:24px;bottom:24px;z-index:1100;background:#1f9d55;color:#fff;border-radius:50px;padding:11px 17px 11px 13px;display:flex;align-items:center;gap:9px;box-shadow:0 10px 25px rgba(0,0,0,.25);font-size:12px;font-weight:700}
.floating-whatsapp i{font-size:22px}
.floating-whatsapp:hover{color:#fff;background:#187a43;transform:translateY(-2px)}
.back-to-top{position:fixed;right:25px;bottom:85px;width:38px;height:38px;border:1px solid rgba(255,255,255,.15);background:var(--brown);color:#fff;z-index:1090;opacity:0;visibility:hidden;transition:.3s}
.back-to-top.show{opacity:1;visibility:visible}

/* =========================================================
   MOBILE RESPONSIVE HEADER - FINAL FIX
   Topbar scrolls away; header becomes fully fixed on scroll.
========================================================= */

/* =========================================================
   MOBILE HEADER — FINAL FIX
========================================================= */
@media (max-width:991.98px){
    html{overflow-x:hidden;scroll-padding-top:82px;}
    body{overflow-x:hidden;}

    .topbar{
        position:absolute !important;
        top:0;left:0;right:0;width:100%;
        height:38px;padding:0 !important;
        z-index:1200;display:flex;align-items:center;
        background:#211a16;
        border-bottom:1px solid rgba(255,255,255,.10);
        transition:transform .25s ease,opacity .25s ease;
    }
    .topbar.topbar-hidden{
        transform:translateY(-100%);
        opacity:0;
        pointer-events:none;
    }
    .topbar > .container-fluid{
        width:100%;height:38px;
        padding-left:10px !important;padding-right:10px !important;
    }
    .topbar > .container-fluid > .d-flex{
        height:100%;justify-content:center !important;
        flex-wrap:nowrap !important;
    }
    .topbar-left{
        width:100%;height:100%;
        justify-content:center;align-items:center;
        gap:10px;white-space:nowrap;
    }
    .topbar-left a{color:#eee;font-size:10px;line-height:1;}
    .topbar-left a i{color:var(--gold-light);margin-right:4px !important;font-size:10px;}
    .top-divider{display:block;height:13px;width:1px;flex:0 0 1px;background:rgba(255,255,255,.25);}

    .main-nav{
        position:absolute !important;
        top:38px !important;left:0 !important;right:0 !important;
        width:100%;height:82px;min-height:82px;
        z-index:1190;padding:0 !important;margin:0 !important;
        background:rgba(35,28,24,.90);
        border-bottom:1px solid rgba(255,255,255,.12);
        box-shadow:none;transform:none !important;
    }

    .main-nav.nav-scrolled{
        position:fixed !important;
        top:0 !important;left:0 !important;right:0 !important;
        width:100% !important;height:82px !important;min-height:82px !important;
        z-index:1300 !important;
        background:rgba(35,28,24,.98);
        border-bottom:1px solid rgba(229,197,142,.18);
        box-shadow:0 8px 25px rgba(0,0,0,.24);
        transform:translate3d(0,0,0) !important;
        will-change:transform;
    }

    .main-nav > .container-fluid{
        width:100%;height:82px;min-height:82px;
        display:flex;align-items:center;
        padding-left:18px !important;padding-right:18px !important;
    }
    .navbar-brand{
        min-width:0;max-width:calc(100% - 65px);
        height:82px;margin:0 !important;padding:0 !important;
        display:flex;align-items:center;gap:10px;flex-shrink:1;
    }
    .brand-mark{width:46px;height:46px;flex:0 0 46px;font-size:20px;}
    .brand-text{font-size:27px;letter-spacing:3px;line-height:.75;white-space:nowrap;}
    .brand-text small{display:block;font-size:8px;letter-spacing:4px;margin-top:8px;}

    .navbar-toggler{
        width:52px;height:50px;flex:0 0 52px;
        margin-left:auto !important;padding:0 !important;
        display:flex;align-items:center;justify-content:center;
        border:1px solid rgba(229,197,142,.30) !important;
        border-radius:8px;background:rgba(255,255,255,.02);
        box-shadow:none !important;
    }
    .navbar-toggler:focus{box-shadow:none !important;}
    .navbar-toggler-icon{width:27px;height:27px;background-size:27px 27px;}

    .navbar-collapse{
        position:absolute !important;
        top:82px !important;left:0 !important;right:0 !important;
        width:100%;margin:0 !important;
        padding:12px 20px 20px;
        background:rgba(43,33,28,.99);
        border-top:1px solid rgba(229,197,142,.15);
        box-shadow:0 20px 35px rgba(0,0,0,.30);
    }
    .navbar-nav{width:100%;}
    .nav-item{border-bottom:1px solid rgba(255,255,255,.07);}
    .nav-item:last-child{border-bottom:0;}
    .nav-link{display:block;padding:11px 5px !important;font-size:11px;letter-spacing:1.8px;}
    .nav-book-btn{display:block;width:100%;margin-top:14px;text-align:center;}

    .hero-section{position:relative;padding-top:0 !important;margin:0 !important;}
    .hero-slide{height:100svh;min-height:600px;background-position:center center;}
    .hero-content{padding-top:190px;}
    .quick-booking,.quick-booking-wrap{display:none !important;}

    .split-section{grid-template-columns:1fr;}
    .split-image{min-height:430px;}
    .split-content{padding:70px 35px;}
    .about-image-grid{height:470px;}
    .event-image-wrap{margin-top:10px;}
}

@media (max-width:767.98px){
    html{scroll-padding-top:76px;}
    .topbar{height:36px;}
    .topbar > .container-fluid{height:36px;}
    .topbar-left{gap:8px;}
    .topbar-left a{font-size:9px;}
    .top-divider{display:none;}

    .main-nav{top:36px !important;height:76px;min-height:76px;}
    .main-nav.nav-scrolled{top:0 !important;height:76px !important;min-height:76px !important;}
    .main-nav > .container-fluid{height:76px;min-height:76px;}
    .navbar-brand{height:76px;}
    .brand-mark{width:44px;height:44px;flex-basis:44px;}
    .brand-text{font-size:25px;letter-spacing:3px;}
    .brand-text small{font-size:7px;letter-spacing:3.5px;margin-top:7px;}
    .navbar-toggler{width:50px;height:48px;flex-basis:50px;}
    .navbar-collapse{top:76px !important;}

    .hero-slide{height:100svh;min-height:620px;}
    .hero-content{padding:150px 25px 0;}
    .hero-content h1{font-size:49px;line-height:.92;}
    .hero-content p{font-size:13px;line-height:1.65;}
    .hero-actions{flex-direction:column;align-items:flex-start;}
    .hero-actions .btn{font-size:12px;}

    .section-pad{padding:70px 0;}
    .section-heading h2{font-size:43px;}
    .display-title{font-size:39px;}
    .about-image-grid{height:420px;padding-right:40px;padding-bottom:55px;}
    .about-img-main{height:365px;}
    .about-img-small{height:180px;border-width:6px;}
    .experience-badge{left:5px;bottom:20px;}
    .stat-box{border-right:0;border-bottom:1px solid rgba(255,255,255,.14);justify-content:flex-start;padding-left:18px;}
    .stat-box strong{font-size:28px;}
    .split-content h2,.events-section h2{font-size:47px;}
    .event-image-wrap{padding:0 0 35px 25px;}
    .event-image-wrap img{height:390px;}
    .gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:180px;}
    .gallery-large{grid-row:span 2;}
    .contact-section{padding:60px 0;}
    .contact-info,.contact-form-wrap{padding:35px 25px;}
    .contact-info h2{font-size:48px;}
    .footer-bottom{flex-direction:column;}
    .floating-whatsapp{right:15px;bottom:15px;max-width:calc(100vw - 30px);}
}

@media (max-width:430px){
    .topbar-left{gap:6px;}
    .topbar-left a{font-size:8.5px;}
    .main-nav{top:36px !important;height:72px;min-height:72px;}
    .main-nav.nav-scrolled{top:0 !important;height:72px !important;min-height:72px !important;}
    .main-nav > .container-fluid{height:72px;min-height:72px;padding-left:18px !important;padding-right:18px !important;}
    .navbar-brand{height:72px;gap:8px;}
    .brand-mark{width:42px;height:42px;flex-basis:42px;}
    .brand-text{font-size:23px;letter-spacing:2.5px;}
    .navbar-toggler{width:48px;height:46px;flex-basis:48px;}
    .navbar-collapse{top:72px !important;}
    .hero-content{padding-top:130px;}
    .hero-content h1{font-size:43px;}
}
