:root{--navy:#0A2342;--gold:#D4A056;--white:#ffffff;--muted:#f4f4f4;--text:#333333;--radius:6px;--max-width:1250px;}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;color:var(--text);background:var(--white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;}
.header{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--g200);position:sticky;top:0;z-index:40;}
.nav-inner{height:70px;display:flex;align-items:center;justify-content:space-between;gap:16px}
/* ===== STICKY NAV ===== */
.nav{background: #002744;position: sticky; top: 71px;z-index: 9;}
.brand{max-width: 160px;}
.brand img{max-width:100%;border-radius: 0px;position: relative;top: 28px;}
.nav ul{list-style:none;display:flex;margin:0;padding:0;padding-left: 170px;}
nav.nav li a {color: #fff;padding: 12px;display: block;text-decoration: none;}
.num {font-size: 26px;font-weight: bold;    text-decoration: none;color: #ff2f2b;}
.callSec {display: flex;align-items: center;gap: 40px;}
.callSecMobile {display: none;}
.nav {background: #002744;position: sticky;top: 71px;z-index: 9;}
.mobile-nav-trigger {display: none;padding: 0;position: fixed;right: 8px;top: 8px;z-index:99999;line-height: 0;}
.mobile-nav-trigger .bi-list {-webkit-transition: all .4s;transition: all .4s;font-size: 38px;}
.bi-x {display: none;-webkit-transition: all .4s;transition: all .4s;}
/* Container */
.container{max-width:var(--max-width);margin:0 auto;padding:0 20px;}

/* Header */


.cta {background:var(--gold);color:var(--navy);padding:10px 14px;border-radius:8px;font-weight:700;border:none;cursor:pointer}
.cta:hover{opacity:.95;transform:translateY(-1px)}
/* Mobile nav */
.hamburger{display:none;border:0;background:none;font-size:22px;cursor:pointer}

/* Hero */
.hero{position:relative;overflow:hidden;color:var(--white);  padding:0;}
img.slide {width: 100%;}
/*.overlap {background: linear-gradient(0deg, rgb(20 43 72 / 48%), rgb(10 35 66 / 29%));position: absolute;top: 0;left: 0;right: 0;bottom: 0;}*/
.hero .inner {display:flex;align-items:center;gap:40px;flex-wrap:wrap;max-width:var(--max-width);margin:0 auto;padding:0 20px;position: absolute;top: 0;left: 0;right: 0;bottom: 0;    z-index: 1;}
.hero-left{flex:1;max-width:500px;background:#002744;padding:20px;height:100%;margin-left: auto; padding-top:50px;}
.eyebrow{background:rgba(255,255,255,0.06);padding:8px 12px;border-radius:20px;display:inline-block;margin-bottom:18px;font-weight:600;color:rgba(255,255,255,0.95)}
.hero h2{font-family:Poppins;font-size:36px;margin:0 0 14px;line-height:52px;}
.hero p{margin:0 0 20px;max-width:560px;opacity:.95}
.hero .btns{display:flex;gap:12px;flex-wrap:wrap}
.btn-primary{background:#002744;color:#fff;padding:12px 18px;border-radius:8px;font-weight:700;border:none;cursor:pointer}
.btn-outline{background:#ff2f2b;border:1.5px solid rgba(255,255,255,0.85);color:var(--white);padding:10px 16px;border-radius:8px;font-weight:600;    text-decoration: none;}
.hero-right{width:420px;min-width:280px;align-self:flex-end}
.booking-card{background:var(--white);border-radius:10px;padding:16px;box-shadow:0 10px 30px rgba(10,35,66,0.08);color:var(--navy)}
.booking-card label{display:block;font-size:13px;margin-top:8px;font-weight:600}
.booking-row{display:flex;gap:8px}
input[type="date"], input[type="number"], select, input[type="text"], input[type="email"], textarea{width:100%;padding:10px;border-radius:8px;border:1px solid #ddd;font-size:14px;}
.small-muted{font-size:13px;color:#666;margin-top:6px}

/* Sections */
section{padding:56px 0}
.section-title{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.section-title h3{margin:0;font-family:Poppins;color:var(--navy)}
.grid{display:grid;gap:18px}
/* Rooms */
.rooms-grid{grid-template-columns:repeat(3,1fr)}
.room-card{background:var(--white);border-radius:12px;overflow:hidden;border:1px solid #eee;box-shadow:0 8px 18px rgba(10,35,66,0.04)}
.room-card img{width:100%;height:180px;object-fit:cover;display:block}
.room-card .room-body{padding:14px}
.price{color:var(--navy);font-weight:700;margin-top:8px}
.room-actions{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.link-ghost{background:transparent;border:0;color:var(--navy);font-weight:600;cursor:pointer}

/* Why choose us */
.icon-grid{grid-template-columns:repeat(4,1fr);align-items:stretch}
.icon-box{background:var(--muted);padding:18px;border-radius:10px;text-align:center}
.icon{font-size:28px;margin-bottom:8px;color:var(--navy);font-weight:700}

/* Attractions */
.attractions{grid-template-columns:repeat(4,1fr)}
.attraction{border-radius:10px;overflow:hidden;background:#fafafa}
.attraction img{width:100%;height:140px;object-fit:cover;display:block}
.attraction .meta{padding:10px}

/* Reviews */
.reviews{grid-template-columns:repeat(3,1fr)}
.review-card{background:var(--white);padding:16px;border-radius:8px;border:1px solid #eee}

/* About */
.about-layout{display:grid;grid-template-columns:1fr 2fr;gap:24px;align-items:center}
.about-layout img{width:100%;height:320px;object-fit:cover;border-radius:10px}
.youtubeIfrem {
    border-radius: 15px;
}
article#book-now{background: #ffffff;border-radius: 12px;padding: 24px 24px 20px;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);}
.meta-label {
    font-weight: bold;
}
.facebook-strip {margin-top: 20px;padding-top: 16px;border-top: 1px solid #eee;display: flex;align-items: center;gap: 14px;}
.facebook-strip img {max-width: 150px;}
/* Gallery */
.gallery{grid-template-columns:repeat(4,1fr)}
.gallery img{width:100%;height:160px;object-fit:cover;border-radius:8px}

/* Map */
.map {height:260px;background:#e9eef6;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--navy);font-weight:700}

/* Footer */
footer{background:#002744;padding:28px 0;border-top:1px solid #eee; color:#fff;}
footer .wrap{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap}
footer .col{min-width:200px}
footer a{color:#fff;}
.btn-book {text-decoration: none;font-size: 20px;background: #002744;color: #fff;}
.btn-book:hover{background:#fd2e2c; color:#fff;}
/* Booking Modal */
.modal {position:fixed;inset:0;background:rgba(0,0,0,0.45);display:flex;align-items:center;justify-content:center;z-index:120;opacity:0;pointer-events:none;transition:all .18s}
.modal.show{opacity:1;pointer-events:auto}
.modal-card{background:var(--white);width:960px;max-width:96%;border-radius:12px;padding:18px;display:grid;grid-template-columns:1fr 360px;gap:18px;max-height:88vh;overflow:auto}
.stepper{display:flex;gap:8px;margin-bottom:10px}
.step{padding:8px 12px;border-radius:8px;background:#f3f6fb;color:var(--navy);font-weight:700}
.room-select{display:grid;gap:10px}
.room-card-choose{display:flex;gap:12px;padding:10px;border-radius:8px;border:1px solid #e6e9f0;align-items:center}
.room-card-choose img{width:120px;height:80px;object-fit:cover;border-radius:6px}
.summary{background:#fbfbfd;padding:12px;border-radius:8px;border:1px solid #efefef}
.awards-grid2{display: flex;align-items: center;gap: 20px;justify-content: space-between; flex-wrap:wrap;}
.awards-grid2 img {height:120px;width: auto;object-fit: contain;border-radius: 10px;}
.awards-grid2 span {display: flex;border: 1px dashed #4CAF50;padding: 5px;border-radius: 10px;background: #eee;}
.conference-layout {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 4fr);
    gap: 2.5rem;
    align-items: flex-start;
}

ul.nav {margin-left: auto;}


/* Responsive */
@media (max-width:980px){
.rooms-grid{grid-template-columns:repeat(2,1fr)}
.attractions{grid-template-columns:repeat(2,1fr)}
.hero-right{width:360px}
.about-layout{grid-template-columns:1fr}
.gallery{grid-template-columns:repeat(2,1fr)}
nav ul{display:none}
.hamburger{display:block}
}
@media (max-width:640px){
.rooms-grid{grid-template-columns:1fr}
.reviews{grid-template-columns:1fr}
.hero h2{font-size:24px;    line-height: 32px;}
.hero-right{order:2;width:100%}
.hero-left{order:1;width:100%}
.modal-card{grid-template-columns:1fr;max-width:96%}
.gallery img{height:120px}
}

/* small helpers */
.muted{color:#666;font-size:13px}
.center{text-align:center}
.star{color:gold;font-weight:700}


@media screen and (min-width:100px) and (max-width:767px){
.nav-inner{flex-wrap:wrap;    height: 50px;} 
.shell {flex-wrap: wrap;}
.sidebar{max-width:100%;min-width:100%;}  
.sidebar{top: 0;position: relative;}
nav.nav.mobile-menu {position: fixed;    left: 0;background:#002744;overflow: auto;top: 0;display: block;margin: 0;bottom: 0;max-width: 75%;width: 350px;z-index: 999;left: -75%;-webkit-transition: all .4s;transition: all .4s;padding-top: 20px;}
nav.nav.mobile-menu.open {left: 0;}
.mobile-nav-trigger{display: block;}    
.nav ul{display: block;    padding-left: 0;}    
.tmi-grid{    grid-template-columns: 1fr;}
.callSec {display:none;}
.brand {max-width:65px;}
.callSecMobile {display: flex;text-align: center;padding:5px 10px;position: fixed; background:#fd2f2a;align-items: center;justify-content: space-between;z-index: 99;right: 0;left: 0;top: 51px;}
.num{display: block;color: #fff;font-size: 22px;}
span.chip img {display: block;margin: auto;}
.feature-group.mb-3{display: block;}
.container{padding: 0 10px;}
span.chip {position: fixed;top:13px;font-size: 12px;max-width: 160px;right: 55px;line-height: 13px;}
.btn-book {max-width: 118px;}
.main {margin-top: 90px;}
#lightbox-container-image-box{max-width:95%;height: auto !important;}
header.header {position: fixed;background: #fff;z-index: 999;left: 0;top: 0;right: 0;}
main {margin-top: 105px;}
.hero .inner{position: relative; padding:0;}
.brand img{top:0;}
}