/* =========================
ROOT VARIABLES
========================= */
:root{

--primary:#0f172a;
--primary-light:#1e293b;
--secondary:#f59e0b;
--secondary-dark:#d97706;

--white:#ffffff;
--light:#f8fafc;
--dark:#111827;
--muted:#64748b;
--border:#e5e7eb;

--radius-sm:4px;
--radius-md:10px;
--radius-lg:30px;

--shadow-sm:0 10px 30px rgba(0,0,0,.08);
--shadow-md:0 18px 40px rgba(0,0,0,.12);

--transition:.35s ease;
--container:1400px;
}

/* RESET */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Poppins',sans-serif;color:var(--dark);background:var(--white);overflow-x:hidden;}
a{text-decoration:none;}
img{max-width:100%;display:block;}
.container{width:95%;max-width:var(--container);margin:auto;}
/* TOP HEADER */
.top-header{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:var(--white);font-size:14px;}
.top-header-wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px 0;flex-wrap:wrap;}
.top-left,.top-right{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.top-item{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.92);transition:var(--transition);}
.top-item i{color:var(--secondary);}
.top-item:hover{color:var(--secondary);}
.social{display:flex;gap:10px;}
.social a{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);color:var(--white);transition:var(--transition);}
.social a:hover{background:var(--secondary);transform:translateY(-3px);}
.book-btn{padding:11px 22px;border-radius:var(--radius-md);background:var(--secondary);color:var(--white);font-weight:600;transition:var(--transition);}
.book-btn:hover{background:var(--secondary-dark);transform:translateY(-2px);}
/* NAVBAR */
.nav-header{position:sticky;top:0;z-index:999;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);box-shadow:var(--shadow-sm);}
.navbar{display:flex;justify-content:space-between;align-items:center;padding:10px 0;gap:20px;}
.logo img{width: 200px; height: auto;}
nav ul {display: flex;align-items: center;gap: 28px;list-style: none;}
nav ul li {position: relative;}
nav ul li a {color: var(--primary);font-weight: 600;font-size: 17px;padding: 0 10px 0 0;display: block;transition: var(--transition);border-right: 2px solid var(--primary);}
/* remove border from last menu item */
nav ul li:last-child a {border-right: none;}
nav ul li a:hover {color: var(--secondary);}
/* MEGA MENU */
.mega-menu{position:absolute;top:120%;left:0;width:860px;background:var(--white);border-radius:var(--radius-md);padding:28px;box-shadow:var(--shadow-md);display:grid;grid-template-columns:repeat(4,1fr);gap:24px;opacity:0;visibility:hidden;transform:translateY(15px);transition:var(--transition);}
.has-mega:hover .mega-menu{opacity:1;visibility:visible;transform:translateY(0);}
.mega-box h4{font-size:16px;margin-bottom:12px;color:var(--secondary);}
.mega-box a{display:block;padding:7px 0;font-size:16px;font-weight:500;color:var(--dark);}
.mega-box a:hover{padding-left:6px;}
/* RIGHT ICONS */
.header-right{display:flex;align-items:center;gap:10px;position:relative;}
.icon-btn,.menu-toggle{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--light);cursor:pointer;font-size:18px;transition:var(--transition);color:var(--primary);}
.icon-btn:hover,.menu-toggle:hover{background:var(--secondary);color:var(--white);}
.menu-toggle{display:none;}
/* SEARCH */
.search-wrapper{position:absolute;right:58px;top:50%;transform:translateY(-50%);width:0;opacity:0;overflow:hidden;transition:var(--transition);}
.search-wrapper.active{width:300px;opacity:1;}
.search-box{display:flex;align-items:center;background:var(--white);border:1px solid var(--border);border-radius:40px;padding:6px 8px 6px 16px;box-shadow:var(--shadow-sm);}
.search-box input{border:none;outline:none;width:100%;font-family:inherit;font-size:14px;}
.search-close{width:40px;height:35px;border:none;border-radius:50%;background:var(--secondary);color:var(--white);cursor:pointer;}
/* ======================== HERO ========================= */
.hero-slider{overflow:hidden;}
.hero-slide{position:relative;min-height:92vh;background-size:cover;background-position:center;display:flex !important;align-items:center;justify-content:center;text-align:center;padding:40px 20px;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to right, rgba(0,0,0,.72), rgba(0,0,0,.45));}
.hero-content{position:relative;z-index:2;max-width:860px;color:var(--white);animation:fadeUp 1s ease;}
.hero-content span{display:inline-block;padding:10px 22px;border:1px solid rgba(255,255,255,.35);border-radius:50px;font-size:14px;letter-spacing:1px;margin-bottom:22px;backdrop-filter:blur(6px);}
.hero-content h1{font-size:64px;line-height:1.2;font-weight:800;margin-bottom:20px;}
.hero-content p{font-size:18px;line-height:1.9;color:rgba(255,255,255,.92);margin-bottom:35px;}
.hero-buttons{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;}
.hero-buttons a{padding:16px 32px;border-radius:var(--radius-md);font-weight:700;transition:.4s ease;}
.btn1{background:var(--secondary);color:var(--white);}
.btn2{border:1px solid var(--white);color:var(--white);}
.btn1:hover,.btn2:hover{transform:translateY(-5px);}
/* Slick Arrows */
.slick-prev,.slick-next{width:52px;height:52px;border:none;border-radius:50%;background:rgba(255,255,255,.12);backdrop-filter:blur(10px);z-index:99;transition:.3s;}
.slick-prev:hover,.slick-next:hover{background:var(--secondary);}
.slick-prev{left:30px;}
.slick-next{right:30px;}
.slick-prev:before,.slick-next:before{display:none;}
.slick-prev i,.slick-next i{color:var(--white);font-size:18px;}
/* Dots */
.slick-dots{bottom:30px;}
.slick-dots li button:before{font-size:12px;color:var(--white);opacity:.5;}
.slick-dots li.slick-active button:before{color:var(--secondary);opacity:1;}
/* Animation */
@keyframes fadeUp{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}
/* Responsive */
@media(max-width:991px){.hero-content h1{font-size:48px;}}
@media(max-width:576px){.hero-slide{min-height:85vh;}
.hero-content h1{font-size:34px;}.hero-content p{font-size:16px;}
.slick-prev,.slick-next{display:none !important;}
}

/* RESPONSIVE */
@media(max-width:992px){
.menu-toggle{display:flex;}
nav{position:absolute;top:100%;left:-100%;width:100%;background:var(--white);padding:24px;box-shadow:var(--shadow-md);transition:var(--transition);}
nav.active{left:0;}
nav ul{flex-direction:column;align-items:flex-start;gap:16px;}
nav ul li a{border-right: none;}
.mega-menu{position:static;width:100%;display:none;grid-template-columns:1fr;padding:16px 0 0;box-shadow:none;opacity:1;visibility:visible;transform:none;}
.has-mega.active .mega-menu{display:grid;}
.search-wrapper{top:65px;right:0;transform:none;width:100%;padding:0 10px;}
.hero-content h1{font-size:42px;}
.top-header-wrap{justify-content:center;}
}

@media(max-width:576px){
.top-left,.top-right{justify-content:center;}
.book-btn{width:100%;text-align:center;}
}


/* ------------- About SECTION ------------ */
.about-section{position:relative;padding:80px 20px 0;text-align:center;overflow:hidden;}
.about-section::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:500px;height:500px;background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23d1d5db' stroke-width='1.2'%3E%3C!-- Outer luxury frame --%3E%3Crect x='100' y='100' width='600' height='600' rx='40'/%3E%3C!-- Hotel-like roof shape --%3E%3Cpath d='M200 320 L400 160 L600 320'/%3E%3Cpath d='M250 320 V520 H550 V320'/%3E%3C!-- Central mandala circle (luxury focus) --%3E%3Ccircle cx='400' cy='400' r='180'/%3E%3Ccircle cx='400' cy='400' r='120'/%3E%3Ccircle cx='400' cy='400' r='60'/%3E%3C!-- Cross symmetry lines --%3E%3Cpath d='M400 100 V700'/%3E%3Cpath d='M100 400 H700'/%3E%3C!-- Decorative diamonds --%3E%3Cpath d='M400 200 L420 220 L400 240 L380 220 Z'/%3E%3Cpath d='M400 560 L420 580 L400 600 L380 580 Z'/%3E%3Cpath d='M200 400 L220 420 L200 440 L180 420 Z'/%3E%3Cpath d='M600 400 L620 420 L600 440 L580 420 Z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;background-position: center;background-size: cover;background-size:contain;opacity:0.6;z-index:0;}
.about-content{position:relative;max-width:900px;margin:auto;z-index:2;}
.about-content h1{font-family:'Poppins',sans-serif;font-size:42px;font-weight:800;color:var(--primary);margin-bottom:1rem;}
.about-content p{font-size:18px;color:var(--muted);line-height:1.7;margin-bottom:20px;text-align: center;}
.about-content h1::after{content:"";display:block;width:80px;height:2px;background:#d1d5db;margin:15px auto 0;}

/* ------------- Hotel Room SECTION -------------------*/
.hotel-section{padding:5rem 5% ;text-align:center;}
.hotel-section h2::after{content:"";display:block;width:80px;height:2px;background:#d1d5db;margin:15px auto 0;}
.hotel-section p.desc{max-width:900px;margin:0 auto 50px;font-size:18px;line-height:1.7;color:var(--muted);}
/* GRID */
.room-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:28px;}
/* CARD */
.room-card{position:relative;border-radius:var(--radius-md);overflow:hidden;cursor:pointer;}
/* IMAGE */
.room-card img{width:100%;height:320px;object-fit:cover;display:block;transition:0.6s ease;}
/* hover zoom */
.room-card:hover img{transform:scale(1.1);filter:brightness(0.6);}
/* OVERLAY */
.room-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(2,6,23,0.95), rgba(2,6,23,0.2));display:flex;align-items:flex-end;padding:20px;opacity:0;transform:translateY(20px);transition:0.5s ease;}
.room-card:hover .room-overlay{opacity:1;transform:translateY(0);}
.room-content{color:var(--white);width:100%;transform:translateY(20px);transition:0.5s ease;}
.room-card:hover .room-content{transform:translateY(0);}
.room-content h3{font-size:22px;margin-bottom:8px;font-family:'Poppins', sans-serif;}
.room-content p{font-size:14px;opacity:0.85;margin-bottom:10px;}
.room-content ul{list-style:none;padding:0;margin:0 0 12px;}
.room-content ul li{font-size:13px;margin-bottom:5px;opacity:0.9;}
/* BUTTON */
.room-book-btn{display:inline-block;padding:8px 14px;background:var(--secondary);color:var(--primary);font-weight:600;font-size:13px;border-radius:var(--radius-sm);text-decoration:none;transition:0.3s ease;}
/* BADGE */
.badge{position:absolute;top:15px;left:15px;background:var(--secondary);color:var(--primary);font-size:12px;padding:5px 10px;border-radius:var(--radius-lg);font-weight:600;z-index:2;}
/* responsive */
@media(max-width:768px){.hotel-section h2{font-size:30px;}}


/* ------- Hotel Menu --------- */
img{max-width:100%;display:block;}
.hotel-menu{position:relative;overflow:hidden;padding:5rem 5%;background:linear-gradient(180deg,var(--light) 0%, #eef2f7 100%);}
.hotel-menu__bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:.5;}
.hotel-menu__bg svg{width:min(900px,90vw);height:min(900px,90vw);}
.hotel-menu__container{max-width:var(--container);margin:auto;position:relative;z-index:2;}
.hotel-menu__heading{text-align:center;margin-bottom:45px;}
.hotel-menu__slider-wrap{position:relative;}
.hotel-menu__slider{visibility:hidden;}
.hotel-menu__slider.slick-initialized{visibility:visible;}
.hotel-menu__slide{padding:12px;}
.hotel-menu__card{background:var(--white);border-radius:var(--radius-md);overflow:hidden;transition:var(--transition);border:1px solid var(--border);}
.hotel-menu__card:hover{transform:translateY(-5px);}
.hotel-menu__card img{width:100%;height:250px;object-fit:cover;}
.hotel-menu__content{padding:18px;}
.hotel-menu__content h3{font-size:18px;font-weight:600;color:var(--primary);margin-bottom:6px;}
.hotel-menu__content p{font-size:14px;color:var(--muted);line-height:1.7;}
.hotel-menu__nav{display:flex;justify-content:center;gap:14px;margin-top:2rem;}
.hotel-menu__arrow{width:52px;height:52px;border:none;border-radius:50%;background:var(--white);color:var(--primary);cursor:pointer;box-shadow:var(--shadow-sm);transition:var(--transition);display:flex;align-items:center;justify-content:center;}
.hotel-menu__arrow:hover{background:var(--secondary);color:var(--white);transform:translateY(-3px);}
.hotel-menu__arrow svg{width:18px;height:18px;}
.hotel-menu__cta{text-align:center;margin-top:45px;}
.hotel-menu__cta a{display:inline-block;padding:16px 38px;background:var(--secondary);color:var(--white);text-decoration:none;font-weight:600;border-radius:var(--radius-md);transition:var(--transition);box-shadow:var(--shadow-sm);}
.hotel-menu__cta a:hover{background:var(--secondary-dark);transform:translateY(-3px);}
.slick-dots{display:none !important;}
@media(max-width:991px){
.hotel-menu{padding:70px 18px;}
.hotel-menu__card img{height:240px;}}
@media(max-width:575px){
.hotel-menu{padding:55px 14px;}
.hotel-menu__card img{height:280px;}
.hotel-menu__arrow{width:46px;height:46px;}}

/* ----- Gallery Sections ----- */
.gallery-section{padding:3rem 5%;text-align:center;background: var(--light);}
.section-title{font-size:42px;font-weight:800;}
.section-title span{color:var(--secondary);}
.section-subtitle{color:var(--muted);margin-top:10px;}
.gallery-grid{margin-top:50px;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:220px;gap:12px;}
.gallery-item{position:relative;overflow:hidden;border-radius:var(--radius-md);cursor:pointer;}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:0.5s;}
.gallery-item:hover img{transform:scale(1.1);}
.gallery-item.hero{grid-row:span 2;}
.overlay{position:absolute;inset:0;display:flex;align-items:flex-end;padding:18px;background:linear-gradient(to top, rgba(0,0,0,0.7), transparent);opacity:0;transition:0.3s;}
.overlay span{color: var(--white);padding:6px 12px;background:rgba(255,255,255,0.15);backdrop-filter:blur(8px);border-radius:var(--radius-lg);font-size:14px;}
.gallery-item:hover .overlay{opacity:1;}
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:9999;}
.model-sec{display:flex;justify-content:center;align-items: center !important;}
.modal-box{width:90%;max-width:1000px;position:relative;margin-top: 5rem;}
.close{position:absolute;top:-50px;right:0;font-size:26px;color: var(--white);background:rgba(255,255,255,0.1);border:none;width:42px;height:42px;border-radius:50%;}
.slick img{width:100%;height:500px;object-fit:cover;border-radius:var(--radius-md);}
@media(max-width:992px){.gallery-grid{grid-template-columns:repeat(2,1fr);}.gallery-item.hero{grid-row:auto;height:260px;}.slick img{height:380px;}}
@media(max-width:600px){.gallery-grid{grid-template-columns:1fr;}.slick img{height:300px;}}

/* ----------- Explore Heritage ----- */
.explore-heritage{position:relative;min-height:100vh;padding:3rem 5%;display:flex;align-items:center;overflow:hidden;}
.explore-heritage::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(15,23,42,.76),rgba(15,23,42,.82)),url("images/swimming\ with\ mountain\ view.jpg");background-size:cover;background-position:center;z-index:-3;}
.explore-heritage::after{content:"";position:absolute;top:-100px;right:-100px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,var(--secondary),transparent 50%);opacity:.16;z-index:-2;}
.explore-heritage-container{width:100%;max-width:var(--container);margin:auto;display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:center;}
.explore-heritage-badge{display:inline-block;padding:9px 18px;border-radius:50px;font-size:13px;font-weight:500;letter-spacing:.7px;color:var(--white);background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);margin-bottom:18px;backdrop-filter:blur(8px);}
.explore-heritage-title{font-family:'poppins',sans-serif;font-size:clamp(30px,5vw,60px);line-height:1.1;font-weight:700;color:var(--white);margin-bottom:1.5rem;}
.explore-heritage-title span{color:var(--secondary);}
.explore-heritage-desc{max-width:620px;font-size:16px;line-height:1.9;color:rgba(255,255,255,.88);margin-bottom:28px;}
.explore-heritage-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:30px;}
.explore-heritage-list div{padding:14px 16px;border-radius:var(--radius-md);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:var(--white);font-size:14px;}
.explore-heritage-btns{display:flex;gap:14px;flex-wrap:wrap;}
.explore-heritage-btn{padding:14px 28px;border-radius:var(--radius-md);font-size:15px;font-weight:600;transition:var(--transition);display:inline-flex;align-items:center;justify-content:center;}
.explore-heritage-btn-main{background:var(--secondary);color:var(--white);}
.explore-heritage-btn-main:hover{background:var(--secondary-dark);transform:translateY(-3px);}
.explore-heritage-btn-outline{border:1px solid rgba(255,255,255,.55);color:var(--white);}
.explore-heritage-btn-outline:hover{background:var(--white);color:var(--primary);}
.explore-heritage-form{background:rgba(255,255,255,.97);padding:34px;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);position:relative;overflow:hidden;}
.explore-heritage-form::before{content:"";position:absolute;top:-70px;right:-70px;width:180px;height:180px;border-radius:50%;background:linear-gradient(45deg,var(--secondary),transparent);opacity:.18;}
.explore-heritage-form h3{font-size:30px;color:var(--primary);margin-bottom:8px;}
.explore-heritage-form p{font-size:14px;color:var(--muted);margin-bottom:24px;}
.explore-heritage-group{margin-bottom:15px;}
.explore-heritage-group label{display:block;font-size:13px;font-weight:600;margin-bottom:7px;color:var(--primary);}
.explore-heritage-control{width:100%;height:52px;padding:0 16px;border:1px solid var(--border);border-radius:var(--radius-md);outline:none;font-size:14px;transition:var(--transition);}
textarea.explore-heritage-control{height:110px;padding:14px 16px;resize:none;}
.explore-heritage-control:focus{border-color:var(--secondary);}
.explore-heritage-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.explore-heritage-grid-2{display: flex;}
.explore-heritage-submit{width:100%;height:54px;border:none;border-radius:var(--radius-md);background:var(--primary);color:var(--white);font-size:15px;font-weight:700;cursor:pointer;transition:var(--transition);}
.explore-heritage-submit:hover{background:var(--secondary);}
.explore-heritage-note{margin-top:12px;text-align:center;font-size:13px;color:var(--muted);}
.explore-heritage-wave{position:absolute;bottom:0;left:0;width:100%;line-height:0;z-index:-1;}
@media(max-width:992px){
.explore-heritage-container{grid-template-columns:1fr;gap:35px;}
.explore-heritage-left{text-align:center;}
.explore-heritage-desc{margin:auto auto 28px;}
.explore-heritage-btns{justify-content:center;}}
@media(max-width:576px){.explore-heritage{padding:70px 16px;}.explore-heritage-list,.explore-heritage-grid{grid-template-columns:1fr;}.explore-heritage-form{padding:24px;}}


/* ------- Testimonials Section ------- */
        .testimonial-section {
            position: relative;
            width: 100%;
            min-height: 100vh;
            padding: 60px 5%;
            background-color: var(--primary);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            background-blend-mode: luminosity;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .testimonial-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(to right,
                    rgba(138, 138, 138, 0.85) 0%,
                    rgba(138, 138, 138, 0.7) 50%,
                    rgba(138, 138, 138, 0.45) 100%);
            z-index: 1;
        }

        /* ===== Wrapper Layout ===== */
        .testimonial-wrapper {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: 1200px;
            display: grid;
            grid-template-columns: 1fr 1.2fr;
            gap: 60px;
            align-items: center;
        }

        /* ===== Brand Panel ===== */
        .brand-panel {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .brand-frame {
            border: 1.5px solid rgba(255, 255, 255, 0.85);
            padding: 70px 50px;
            width: 100%;
            max-width: 420px;
            display: flex;
            align-items: center;
            justify-content: center;
        }


        .brand-logo {
            text-align: center;
            color: var(--primary);
        }

        .brand-icon {
            font-size: 26px;
            color: var(--primary);
            margin-bottom: 10px;
            display: block;
        }

        .brand-name {
            font-family: 'Great Vibes', cursive;
            font-size: 54px;
            font-weight: 400;
            line-height: 1;
            color: var(--primary);
            margin-bottom: 14px;
        }

        .brand-subtitle {
            font-family: 'Inter', sans-serif;
            font-size: 13px;
            font-weight: 500;
            letter-spacing: 6px;
            color: #4a4a4a;
        }

        /* ===== Slider Panel ===== */
        .slider-panel {
            position: relative;
            display: flex;
            align-items: center;
            gap: 20px;
        }

        .testimonial-slider {
            flex: 1;
            position: relative;
            overflow: hidden;
            min-height: 240px;
        }

        .testimonial-track {
            position: relative;
            width: 100%;
            min-height: 240px;
        }

        /* ===== Slide ===== */
        .testimonial-slide {
            position: absolute;
            inset: 0;
            opacity: 0;
            transform: translateX(40px);
            transition: opacity 0.6s ease, transform 0.6s ease;
            pointer-events: none;
            color: var(--secondary);
        }

        .testimonial-slide.active {
            opacity: 1;
            transform: translateX(0);
            pointer-events: auto;
        }

        .quote-icon {
            font-size: 34px;
            color: var(--white);
            margin-bottom: 12px;
            display: inline-block;
            transform: scaleX(-1);
        }

        .testimonial-text {
            font-size: 16px;
            font-weight: 400;
            line-height: 1.7;
            color: var(--primary);
            margin-bottom: 28px;
            max-width: 540px;
        }

        .testimonial-author {
            font-size: 17px;
            font-weight: 700;
            color: var(--white);
            margin-bottom: 6px;
        }

        .testimonial-location {
            font-size: 14px;
            font-weight: 400;
            color: var(--light);
        }

        /* ===== Navigation Buttons ===== */
        .nav-btn {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            border: none;
            background: rgba(255, 255, 255, 0.9);
            color: var(--primary);
            font-size: 16px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            transition: all 0.3s ease;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
        }

        .nav-btn:hover {
            background: var(--secondary-dark);
            color: var(--white);
            transform: scale(1.08);
        }

        .nav-btn:active {
            transform: scale(0.95);
        }

        /* ===== Dots ===== */
        .slider-dots {
            display: flex;
            justify-content: flex-start;
            gap: 8px;
            margin-top: 24px;
        }

        .dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.5);
            border: none;
            cursor: pointer;
            transition: all 0.3s ease;
            padding: 0;
        }

        .dot.active {
            background: #1f1f1f;
            width: 24px;
            border-radius: 4px;
        }

        .dot:hover:not(.active) {
            background: rgba(255, 255, 255, 0.9);
        }

        /* ===== Responsive ===== */
        @media (max-width: 900px) {
            .testimonial-section {
                padding: 50px 20px;
            }

            .testimonial-wrapper {
                grid-template-columns: 1fr;
                gap: 40px;
            }

            .brand-frame {
                padding: 50px 30px;
                max-width: 360px;
            }

            .brand-name {
                font-size: 44px;
            }

            .slider-panel {
                gap: 10px;
            }

            .nav-btn {
                width: 40px;
                height: 40px;
                font-size: 14px;
            }

            .testimonial-text {
                font-size: 15px;
            }
        }

        @media (max-width: 540px) {
            .brand-name {
                font-size: 36px;
            }

            .brand-subtitle {
                font-size: 11px;
                letter-spacing: 4px;
            }

            .testimonial-text {
                font-size: 14px;
            }

            .testimonial-slider {
                min-height: 280px;
            }

            .testimonial-track {
                min-height: 280px;
            }
        }

        /* ----------- FOOTER   ------------ */
        
/* SECTION */
.stay-connected{
    padding:3rem 5% 1rem;
    background: var(--white);
    border-top:1px solid var(--border);
}

/* HEADER */
.section-header{
    text-align:center;
    margin-bottom:30px;
}

.section-header h2{
    font-size:30px;
    font-weight:700;
    color:var(--primary);
    margin-bottom:8px;
}

.section-header h2 span{
    color:var(--secondary);
}

.section-header p{
    font-size:14px;
    color:var(--muted);
}

/* FORM */
.subscribe-form{
    display:flex;
    gap:12px;
    justify-content:center;
    flex-wrap:wrap;
}

/* INPUT */
.input-box{
    position:relative;
    flex:1;
    min-width:220px;
}

.input-box i{
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    color:var(--secondary);
    font-size:16px;
}

.input-box input{
    width:100%;
    padding:12px 12px 12px 38px;
    border:1px solid var(--border);
    border-radius:var(--radius-sm);
    outline:none;
    font-size:14px;
    transition:var(--transition);
    background:var(--white);
}

.input-box input:focus{
    border-color:var(--secondary);
}

/* BUTTON */
.subscribe-btn{
    padding:12px 22px;
    background:var(--secondary);
    color:var(--white);
    border:none;
    border-radius:var(--radius-md);
    font-weight:600;
    cursor:pointer;
    transition:var(--transition);
    display:flex;
    align-items:center;
    gap:6px;
}

.subscribe-btn:hover{
    background:var(--secondary-dark);
}

.site-footer {
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(14px);
  padding: 70px 5% 24px;
  font-family: 'Inter', sans-serif;
  color: var(--primary);
}

/* Recommendation Section */
.footer-recommendation{
  font-family:'Poppins',sans-serif;
  background:var(--white);
  padding:3rem 5% 0;
  border-top:1px solid var(--border);
}

.footer-recommendation .container{
  max-width:var(--container);
  margin:auto;
}

.recommendation-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

.recommendation-item{
  background:var(--light);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:1rem;
  text-align:center;
}

.recommendation-item img{
  max-width:150px;
  width:100%;
  height:45px;
  object-fit:contain;
}

.recommendation-text{
  text-align:center;
  font-size:15px;
  color:var(--muted);
  max-width:760px;
  margin:28px auto 0;
  line-height:1.8;
}

/* Responsive */
@media(max-width:991px){
  .recommendation-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:576px){
  .recommendation-grid{
    grid-template-columns:1fr;
  }
  .recommendation-item{
    padding:18px;
  }
}

.footer-wrapper {max-width: 1200px;margin: 0 auto;display: grid;grid-template-columns: 1.2fr 1fr 1.2fr;gap: 60px;align-items: start;}
.footer-col {min-width: 0;}
/* ----- Brand column ----- */
.footer-logo {display: flex;align-items: center;gap: 12px;margin-bottom: 20px;}
.footer-logo img {width: 250px;height: auto;display: block;}
.footer-tagline {font-size: 16px;font-weight: 400;line-height: 1.6;color: var(--primary);}
/* ----- Headings & lines ----- */
.footer-heading {font-size: 22px;font-weight: 700;color: var(--primary);margin-bottom: 16px;}
.footer-heading-mt {margin-top: 28px;}
.footer-line {font-size: 16px;font-weight: 400;line-height: 1.7;color: var(--primary);margin-bottom: 6px;}
/* ----- Social icons ----- */
.social-icons {display: flex;gap: 12px;}
.social-icon {width: 38px;height: 38px;border: 1.5px solid var(--primary);border-radius: var(--radius-sm);display: flex;align-items: center;justify-content: center;text-decoration: none;transition: all 0.25s ease;background: transparent;color: var(--primary);}
.social-icon i {font-size: 18px;line-height: 1;transition: color 0.25s ease;}
.social-icon:hover {background: var(--primary);transform: translateY(-3px);}
.social-icon:hover i {color: var(--white);}
.footer-map {margin-top: 16px;width: 100%;max-width: 320px;height: 150px;border-radius: var(--radius-sm);overflow: hidden;}
.footer-map iframe {width: 100%;height: 100%;border: 0;display: block;}
.footer-divider {max-width: 1200px;margin: 50px auto 20px;height: 1px;background: rgba(0, 0, 0, 0.15);}
.footer-copyright {text-align: center;font-size: 14px;font-weight: 400;color: #1a1a1a;}
/* ----- Responsive ----- */
@media (max-width: 900px) {.site-footer {padding: 50px 24px 20px;}
  .footer-wrapper {grid-template-columns: 1fr;gap: 40px;}
  .footer-map {max-width: 100%;}
  .footer-divider {margin: 36px auto 18px;}}

/* ======================================= */
/* ----------- Contact Us ------------ */
.contact-main{background: var(--light);color: var(--dark);}
.contact-hero {background: linear-gradient(rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.85)),url('images/swimming\ with\ mountain\ view.jpg') center/cover no-repeat;padding: 150px 20px;text-align: center;color: var(--white);}
.contact-hero h1 {font-size: 42px;font-weight: 700;margin-bottom: 10px;}
.contact-hero p {color: #cbd5e1;font-size: 16px;}
.contct-container {max-width: 1200px;margin: auto;padding: 60px 20px;}
.contact-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 40px;}
.info-box {background: var(--white);padding: 30px;border-radius: var(--radius-md);box-shadow: var(--shadow);}
.info-box h2 {margin-bottom: 15px;color: var(--primary);}
.info-item {display: flex;gap: 15px;margin-bottom: 20px;align-items: flex-start;}
.info-item i {color: var(--secondary);font-size: 22px;margin-top: 5px;}
.info-item h4 {font-size: 17px;margin-bottom: 5px;}
.info-item p {font-size: 16px;color: var(--muted);}
.form-box {background: var(--white);padding: 30px;border-radius: var(--radius-md);box-shadow: var(--shadow);}
.form-box h2 {margin-bottom: 15px;color: var(--primary);}
.form-group {margin-bottom: 15px;}
.form-group input,.form-group textarea {width: 100%;padding: 12px 15px;border: 1px solid var(--border);border-radius: var(--radius-sm);outline: none;font-size: 15px;}
.form-group textarea {height: 120px;resize: none;}
.btn {background: var(--secondary);color: var(--white);border: none;padding: 12px 20px;border-radius: var(--radius-sm);cursor: pointer;font-weight: 500;transition: 0.3s;width: 100%;}
.btn:hover {background: var(--secondary-dark);}
.map {margin-top: 40px;border-radius: var(--radius-md);overflow: hidden;box-shadow: var(--shadow);}
iframe {width: 100%;height: 500px;border: 0;}
@media(max-width:768px) {.contact-grid {grid-template-columns: 1fr;}.contact-hero h1 {font-size: 32px;}}


/* =========================== */
/* ------- Room Details ----- */

/* HERO */
.room-details-hero{
background:
linear-gradient(rgba(15,23,42,.75),rgba(15,23,42,.70)),
url('images/room.jpg') center/cover no-repeat;
padding:200px 0 ;
text-align:center;
color:var(--white);
}

.room-details-sub{
font-family:'Great Vibes',cursive;
font-size:42px;
color:var(--secondary);
display:block;
margin-bottom:8px;
}

.room-details-heading{
font-size:62px;
font-weight:800;
line-height:1.1;
margin-bottom:18px;
}

.room-details-text{
max-width:760px;
margin:auto;
font-size:16px;
opacity:.95;
}

/* MAIN */
.room-details-main{
margin-top:-85px;
padding-bottom:2rem;
}

.room-details-grid{
display:grid;
grid-template-columns:1.7fr .8fr;
gap:30px;
align-items:start;
}

.room-details-box{
background:var(--white);
border-radius:var(--radius-md);
overflow:hidden;
box-shadow:var(--shadow-sm);
}

.room-details-gallery{
position:relative;
height:520px;
overflow:hidden;
}

.room-details-gallery img{
height:100%;
object-fit:cover;
transition:1s;
}

.room-details-box:hover .room-details-gallery img{
transform:scale(1.05);
}

.room-details-tag{
position:absolute;
top:25px;
left:25px;
background:var(--secondary);
color: var(--white);
padding:10px 18px;
border-radius:var(--radius-md);
font-size:13px;
font-weight:700;
}

.room-details-price{
position:absolute;
bottom:25px;
right:25px;
background: var(--white);
padding:14px 18px;
border-radius:var(--radius-md);
font-weight:700;
color:var(--primary);
box-shadow:var(--shadow-sm);
}

.room-details-content{
padding:40px;
}

.room-details-script{
font-family:'Italianno',cursive;
font-size:52px;
color:var(--secondary);
line-height:1;
}

.room-details-title{
font-size:44px;
font-weight:800;
color:var(--primary);
margin-bottom:12px;
}

.room-details-location{
color:var(--muted);
font-size:15px;
margin-bottom:20px;
}

.room-details-location i{
color:var(--secondary);
margin-right:6px;
}

.room-details-desc{
color:var(--muted);
margin-bottom:30px;
}

.room-details-head{
font-size:22px;
font-weight:700;
color:var(--primary);
margin-bottom:18px;
margin-top:10px;
}

/* FEATURES */
.room-details-features{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:14px;
margin-bottom:30px;
}

.room-details-feature{
background:var(--light);
border:1px solid var(--border);
padding:16px;
border-radius:var(--radius-sm);
font-size:14px;
font-weight:600;
display:flex;
align-items:center;
gap:10px;
transition:var(--transition);
}

.room-details-feature:hover{
transform:translateY(-3px);
border-color:var(--secondary);
}

.room-details-feature i{
font-size:20px;
color:var(--secondary);
}

/* POLICY */
.room-details-policy{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:15px;
margin-bottom:35px;
}

.room-details-policy-box{
background:var(--light);
border:1px solid var(--border);
padding:18px;
border-radius:var(--radius-sm);
font-size:14px;
}

/* BUTTONS */
.room-details-btns{
display:flex;
gap:15px;
flex-wrap:wrap;
}

.room-details-btn{
padding:15px 28px;
border-radius:var(--radius-md);
font-weight:700;
transition:.3s;
display:inline-block;
}

.room-details-btn-main{
background:var(--secondary);
color:var(--white);
border:none;
cursor:pointer;
}

.room-details-btn-main:hover{
background:var(--secondary-dark);
}

.room-details-btn-border{
border:1px solid var(--border);
color:var(--primary);
}

.room-details-btn-border:hover{
background:var(--primary);
color: var(--white);
}

/* SIDEBAR */
.room-details-sidebar{
background: var(--white);
border-radius:var(--radius-md);
padding:35px;
box-shadow:var(--shadow-sm);
position:sticky;
top:25px;
}

.room-details-side-title{
font-size:30px;
font-weight:800;
margin-bottom:20px;
color:var(--primary);
}

.room-details-group{
margin-bottom:14px;
}

.room-details-group label{
display:block;
font-size:14px;
font-weight:600;
margin-bottom:8px;
}

.room-details-control{
width:100%;
padding:14px 15px;
border:1px solid var(--border);
border-radius:var(--radius-sm);
font-family:'Poppins',sans-serif;
outline:none;
}

.room-details-control:focus{
border-color:var(--secondary);
}

.room-details-book-btn{
width:100%;
margin-top:8px;
}

.room-details-side-list{
margin-top:25px;
}

.room-details-side-item{
display:flex;
justify-content:space-between;
padding:14px 0;
border-bottom:1px solid var(--border);
font-size:14px;
gap:15px;
}

.room-details-side-item i{
color:var(--secondary);
margin-right:7px;
}

/* RESPONSIVE */
@media(max-width:1100px){
.room-details-grid{
grid-template-columns:1fr;
}

.room-details-sidebar{
position:relative;
top:0;
}
}

@media(max-width:768px){

.room-details-heading{
font-size:42px;
}

.room-details-gallery{
height:340px;
}

.room-details-title{
font-size:34px;
}

.room-details-features{
grid-template-columns:1fr;
}

.room-details-policy{
grid-template-columns:1fr;
}

.room-details-btns{
flex-direction:column;
}
}



/* ----- Reviews Section ----------- */

.room-details-reviews-container{
max-width:900px;
margin:auto;
background:var(--white);
padding:50px;
position:relative;
overflow:hidden;
}

.room-details-reviews-container::before{
content:"";
position:absolute;
top:-100px;
right:-100px;
width:220px;
height:220px;
background:rgba(245,158,11,.08);
border-radius:50%;
}

.room-details-reviews-container::after{
content:"";
position:absolute;
bottom:-90px;
left:-90px;
width:200px;
height:200px;
background:rgba(15,23,42,.05);
border-radius:50%;
}

/* Header */
.room-details-reviews-head{
position:relative;
z-index:2;
margin-bottom:35px;
}

.room-details-reviews-sub{
font-size:14px;
font-weight:600;
letter-spacing:2px;
color:var(--secondary);
text-transform:uppercase;
margin-bottom:10px;
display:block;
}

.room-details-reviews-title{
font-size:42px;
font-weight:700;
color:var(--primary);
line-height:1.1;
}

.room-details-reviews-text{
margin-top:12px;
color:var(--muted);
font-size:15px;
max-width:650px;
}

/* Form */
.room-details-reviews-form{
position:relative;
z-index:2;
}

.room-details-reviews-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
margin-bottom:20px;
}

.room-details-reviews-group{
margin-bottom:20px;
}

.room-details-reviews-form input,
.room-details-reviews-form textarea{
width:100%;
padding:16px 18px;
border:1px solid var(--border);
border-radius:var(--radius-sm);
font-family:'Poppins',sans-serif;
font-size:15px;
outline:none;
background:var(--light);
transition:var(--transition);
}

.room-details-reviews-form textarea{
min-height:220px;
resize:vertical;
}

.room-details-reviews-form input:focus,
.room-details-reviews-form textarea:focus{
border-color:var(--secondary);
background:var(--white);
}

/* Button */
.room-details-reviews-btn{
display:inline-flex;
align-items:center;
gap:10px;
padding:15px 34px;
background:linear-gradient(135deg,var(--secondary),var(--secondary-dark));
color:var(--white);
border:none;
border-radius:var(--radius-md);
font-size:15px;
font-weight:600;
cursor:pointer;
}


.room-details-reviews-btn i{
font-size:18px;
}

/* Responsive */
@media(max-width:768px){

.room-details-reviews-container{
padding:35px 25px;
}

.room-details-reviews-grid{
grid-template-columns:1fr;
gap:16px;
}

.room-details-reviews-title{
font-size:34px;
}

.room-details-reviews-form textarea{
min-height:180px;
}

}

@media(max-width:480px){

.room-details-reviews-section{
padding:60px 15px;
}

.room-details-reviews-container{
padding:28px 18px;
}

.room-details-reviews-title{
font-size:28px;
}

.room-details-reviews-btn{
width:100%;
justify-content:center;
}

}

.room-details-other-rooms{
    padding:3rem 5%;
    background:#f8fafc;
    font-family:'Poppins',sans-serif;
}

.room-details-container{
    max-width:1200px;
    margin:auto;
}

.other-room-details-title{
    text-align:center;
    font-size:34px;
    font-weight:700;
    color:#0f172a;
}

.other-room-details-title span{
    color:#f59e0b;
}

.room-details-subtitle{
    text-align:center;
    color:#64748b;
    margin-bottom:40px;
}

/* Card */
.room-details-card{
    background:#fff;
    border-radius:var(--radius-md);
    overflow:hidden;
    margin:0 15px;
}

.room-details-img{
    position:relative;
}

.room-details-img img{
    width:100%;
    height:260px;
    object-fit:cover;
    transition:.4s;
}

.room-details-card:hover img{
    transform:scale(1.05);
}

.room-details-badge{
    position:absolute;
    top:15px;
    left:15px;
    background:#f59e0b;
    color:#fff;
    padding:5px 12px;
    font-size:12px;
    border-radius:20px;
}

/* Content */
.room-details-content{
    padding:20px;
}

.room-details-content h3{
    font-size:20px;
    margin-bottom:8px;
    color:#111827;
}

.room-details-content p{
    font-size:14px;
    color:#64748b;
    margin-bottom:12px;
}

.room-details-content ul{
    padding:0;
    list-style:none;
    margin-bottom:15px;
}

.room-details-content ul li{
    font-size:13px;
    color:#334155;
    margin-bottom:5px;
}

/* Button */
.other-room-details-btn{
    display:inline-block;
    padding:10px 18px;
    background:#0f172a;
    color:#fff;
    border-radius:8px;
    text-decoration:none;
    transition:.3s;
}

.other-room-details-btn:hover{
    background:#f59e0b;
}

/* Arrows Bottom */
.room-details-arrows{
    text-align:center;
    margin-top:25px;
}

.room-details-prev,
.room-details-next{
    background:#0f172a;
    color:#fff;
    border:none;
    width:45px;
    height:45px;
    border-radius:50%;
    font-size:22px;
    cursor:pointer;
    margin:0 10px;
    transition:.3s;
}

.room-details-prev:hover,
.room-details-next:hover{
    background:#f59e0b;
}


/* ====================================== */
/* --------------- Book Now ---------- */

/* BOOK NOW SECTION */
.book-now-section{
padding:80px 0;
background:linear-gradient(rgba(15,23,42,.75),rgba(15,23,42,.70)),
url('images/hotel-view.jpg') center/cover;
}

.book-now-wrapper{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:center;
}

/* LEFT CONTENT */
.book-now-content{
color:var(--white);
}

.book-now-tag{
display:inline-block;
padding:8px 16px;
background:rgba(245,158,11,.15);
border:1px solid rgba(245,158,11,.35);
color:var(--secondary);
border-radius:50px;
font-size:14px;
font-weight:600;
margin-bottom:18px;
}

.book-now-content h1{
font-size:46px;
font-weight:800;
line-height:1.2;
margin-bottom:18px;
}

.book-now-content p{
font-size:16px;
color:#dbe3ef;
max-width:560px;
margin-bottom:30px;
}

.book-now-features{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:16px;
}

.book-now-feature-box{
display:flex;
align-items:center;
gap:12px;
font-size:15px;
}

.book-now-feature-box i{
width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:rgba(255,255,255,.08);
color:var(--secondary);
font-size:18px;
}

/* FORM */
.book-now-card{
background:var(--white);
padding:35px;
border-radius:var(--radius-md);
box-shadow:var(--shadow-md);
}

.book-now-card h2{
font-size:28px;
margin-bottom:8px;
color:var(--primary);
}

.book-now-card p{
font-size:14px;
color:var(--muted);
margin-bottom:25px;
}

.book-now-form-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
}

.book-now-group{
display:flex;
flex-direction:column;
}

.book-now-group label{
font-size:14px;
font-weight:600;
margin-bottom:8px;
color:var(--primary);
}

.book-now-group input,
.book-now-group select,
.book-now-group textarea{
width:100%;
padding:14px 15px;
border:1px solid var(--border);
border-radius:var(--radius-md);
font-family:'Poppins',sans-serif;
font-size:15px;
outline:none;
transition:var(--transition);
background:#fff;
}

.book-now-group input:focus,
.book-now-group select:focus,
.book-now-group textarea:focus{
border-color:var(--secondary);
box-shadow:0 0 0 4px rgba(245,158,11,.12);
}

.book-now-full{
grid-column:1/-1;
}

.book-now-group textarea{
resize:none;
height:110px;
}

.book-now-btn{
width:100%;
border:none;
padding:16px;
font-size:16px;
font-weight:700;
border-radius:var(--radius-md);
background:var(--secondary);
color:var(--white);
cursor:pointer;
transition:var(--transition);
margin-top:5px;
}

.book-now-btn:hover{
background:var(--secondary-dark);
transform:translateY(-2px);
}

.book-now-note{
margin-top:18px;
font-size:13px;
color:var(--muted);
text-align:center;
}

/* RESPONSIVE */
@media(max-width:991px){
.book-now-wrapper{
grid-template-columns:1fr;
}
.book-now-content h1{
font-size:38px;
}
}

@media(max-width:768px){
.book-now-section{
padding:60px 0;
}

.book-now-form-grid,
.book-now-features{
grid-template-columns:1fr;
}

.book-now-card{
padding:25px;
}

.book-now-content h1{
font-size:32px;
}
}

/* About Sections */

    /* Hero */
    .about-hero {
        background: linear-gradient(rgba(15, 23, 42, .7), rgba(15, 23, 42, .7)),
            url('images/swimming\ with\ mountain\ view.jpg') center/cover;
        height: 60vh;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        color: var(--white);
    }

    .about-hero h1 {
        font-size: 48px;
        font-weight: 700;
    }

    .about-hero p {
        margin-top: 10px;
        color: #e2e8f0;
    }

    /* Section */
    .section {
        padding: 5rem 5%;
    }

    .about-section-title {
        text-align: center;
        margin-bottom: 2rem;
    }

    .about-section-title h2 {
        font-size: 42px;
        font-weight: 700;
        color: var(--primary);
    }

    .about-section-title span {
        color: var(--secondary);
        font-family: "Great Vibes", cursive;
        font-size: 28px;
    }

    /* About grid */
    .about-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 50px;
        align-items: center;
    }

    .about-img img {
        width: 100%;
        border-radius: var(--radius-sm);
        box-shadow: var(--shadow-md);
    }

    .about-content h3 {
        font-size: 28px;
        margin-bottom: 15px;
        color: var(--primary);
    }

    .about-content p {
        color: var(--muted);
        line-height: 1.7;
        margin-bottom: 15px;
    }

    /* Features */
    .features {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        margin-top: 30px;
    }

    .feature-box {
        background: var(--white);
        padding: 20px;
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-sm);
        text-align: center;
        transition: var(--transition);
    }

    .feature-box:hover {
        transform: translateY(-5px);
    }

    .feature-box i {
        font-size: 28px;
        color: var(--secondary);
        margin-bottom: 10px;
    }

    /* Stats */
    .stats {
        background: var(--primary);
        color: var(--white);
        padding: 60px 0;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
        text-align: center;
    }

    .stat-box h3 {
        font-size: 32px;
        color: var(--secondary);
    }

    .stat-box p {
        margin-top: 5px;
        color: #cbd5e1;
    }

    /* Mission */
    .mission {
        background: var(--white);
        padding: 80px 0;
    }

    .mission-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }

    .mission-box {
        padding: 25px;
        border: 1px solid var(--border);
        border-radius: var(--radius-md);
        transition: var(--transition);
    }

    .mission-box:hover {
        box-shadow: var(--shadow-sm);
    }

    .mission-box i {
        font-size: 26px;
        color: var(--secondary);
        margin-bottom: 10px;
    }

    /* CTA */
    .cta {
        background: linear-gradient(135deg, var(--primary), var(--primary-light));
        color: var(--white);
        text-align: center;
        padding: 70px 20px;
    }

    .cta h2 {
        font-size: 34px;
        margin-bottom: 10px;
    }

    .cta button {
        margin-top: 20px;
        padding: 12px 30px;
        border: none;
        border-radius: var(--radius-lg);
        background: var(--secondary);
        color: var(--white);
        cursor: pointer;
        font-weight: 600;
        transition: var(--transition);
    }

    .cta button:hover {
        background: var(--secondary-dark);
    }

    /* Responsive */
    @media(max-width:900px) {

        .about-grid,
        .mission-grid {
            grid-template-columns: 1fr;
        }

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

        .stats-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

/* CMS menu nested mega + footer link columns */
.mega-sub-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}
.mega-sub-group strong {
    font-size: 14px;
    margin-bottom: 4px;
}
.mega-sub-group strong a,
.mega-box h4 a {
    color: inherit;
    text-decoration: none;
}
.mega-box h4 {
    margin: 0 0 10px;
    font-size: 15px;
}
.footer-link-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.footer-link-list a {
    color: inherit;
    text-decoration: none;
    opacity: 0.9;
}
.footer-link-list a:hover {
    opacity: 1;
    text-decoration: underline;
}
.footer-wrapper:has(.footer-links) {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}