:root {
    --gold: #c9973a;
    --gold-light: #e0b55a;
    --dark: #0b1710;
    --dark2: #111e16;
    --green: #1a3325;
    --green2: #1c3828;
    --cream: #f2ebe0;
    --text: #a89f92;
    --r: 8px;
    --tr: .45s cubic-bezier(.4, 0, .2, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Jost', sans-serif;
    background: var(--dark);
    color: var(--cream);
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: inherit;
}

.tag {
    font-size: .7rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: .7rem;
}

.h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.9rem, 4vw, 3rem);
    font-weight: 300;
    line-height: 1.15;
}

.h2 em {
    color: var(--gold-light);
    font-style: italic;
}

.sub {
    color: var(--text);
    font-size: .9rem;
    line-height: 1.85;
    max-width: 520px;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .68rem 1.9rem;
    background: var(--gold);
    color: var(--dark);
    font-size: .78rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-weight: 600;
    border: none;
    cursor: pointer;
    border-radius: var(--r);
    transition: var(--tr);
}

.btn:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(201, 151, 58, .35);
}

.btn-o {
    background: transparent;
    border: 1.5px solid var(--gold);
    color: var(--gold);
}

.btn-o:hover {
    background: var(--gold);
    color: var(--dark);
}

/* TOP BAR */
#topbar {
    background: #080f0b;
    padding: .48rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
    font-size: .78rem;
    border-bottom: 1px solid rgba(201, 151, 58, .18);
}

#topbar a {
    color: var(--text);
    transition: color .3s;
}

#topbar a:hover {
    color: var(--gold);
}

.tb-l,
.tb-r {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}

#topbar i {
    color: var(--gold);
    margin-right: .3rem;
}

/* NAVBAR */
#navbar {
    position: sticky;
    top: 0;
    z-index: 999;
    background: rgba(11, 23, 16, .96);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(201, 151, 58, .13);
}

.nav-in {
    max-width: 1300px;
    margin: auto;
    padding: .85rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.logo {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    font-weight: 600;
    color: var(--cream);
}

.logo em {
    color: var(--gold);
    font-style: normal;
}

/* Desktop nav */
.nav-ul {
    display: flex;
    align-items: center;
    gap: .1rem;
    list-style: none;
}

.nav-ul>li {
    position: relative;
}

.nav-ul>li>a {
    padding: .5rem .85rem;
    font-size: .79rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: .3rem;
    transition: color .3s;
    border-radius: var(--r);
    cursor: pointer;
}

.nav-ul>li>a:hover {
    color: var(--gold);
}

.nav-ul>li>a i {
    font-size: .55rem;
    transition: transform .3s;
}

.nav-ul>li.drop-open>a i {
    transform: rotate(180deg);
}

/* Desktop dropdown — hover only on desktop */
.drop {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #0d1a11;
    border: 1px solid rgba(201, 151, 58, .2);
    border-radius: var(--r);
    min-width: 195px;
    padding: .45rem 0;
    z-index: 1000;
    box-shadow: 0 22px 44px rgba(0, 0, 0, .65);
}

.drop li {
    list-style: none;
}

.drop li a {
    display: block;
    padding: .55rem 1.2rem;
    font-size: .78rem;
    color: var(--text);
    transition: all .28s;
}

.drop li a:hover {
    color: var(--gold);
    padding-left: 1.6rem;
    background: rgba(201, 151, 58, .07);
}

@media(min-width:769px) {
    .nav-ul>li:hover .drop {
        display: block;
        animation: fd .28s ease;
    }
}

@keyframes fd {
    from {
        opacity: 0;
        transform: translateY(-7px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* Hamburger */
.ham {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: .35rem;
}

.ham span {
    width: 23px;
    height: 2px;
    background: var(--cream);
    transition: var(--tr);
}

.ham.open span:nth-child(1) {
    transform: rotate(45deg)translate(5px, 5px);
}

.ham.open span:nth-child(2) {
    opacity: 0;
}

.ham.open span:nth-child(3) {
    transform: rotate(-45deg)translate(5px, -5px);
}

/* Mobile nav */
.mob-nav {
    display: none;
    flex-direction: column;
    background: #0d1a11;
    border-top: 1px solid rgba(201, 151, 58, .15);
    padding: 0;
}

.mob-nav.open {
    display: flex;
}

.mob-item {
    border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.mob-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1.5rem;
    font-size: .83rem;
    color: var(--text);
    cursor: pointer;
    transition: color .28s;
}

.mob-row:hover {
    color: var(--gold);
}

.mob-row i {
    font-size: .6rem;
    transition: transform .3s;
}

.mob-row.open-sub i {
    transform: rotate(180deg);
}

.mob-sub-list {
    display: none;
    flex-direction: column;
    background: rgba(0, 0, 0, .2);
}

.mob-sub-list.open {
    display: flex;
}

.mob-sub-list a {
    padding: .55rem 1.5rem .55rem 2.5rem;
    font-size: .78rem;
    color: var(--text);
    border-bottom: 1px solid rgba(255, 255, 255, .04);
    transition: color .28s;
}

.mob-sub-list a:hover {
    color: var(--gold);
}

.mob-link {
    display: block;
    padding: .7rem 1.5rem;
    font-size: .83rem;
    color: var(--text);
    border-bottom: 1px solid rgba(255, 255, 255, .05);
    transition: color .28s;
}

.mob-link:hover {
    color: var(--gold);
}

.mob-book {
    padding: .9rem 1.5rem;
}

.mob-book .btn {
    width: 100%;
    justify-content: center;
}

/* HERO CAROUSEL */
/* #hero{position:relative;height:100vh;min-height:560px;overflow:hidden;}
.h-slides{display:flex;height:100%;transition:transform .95s cubic-bezier(.77,0,.18,1);}
.h-slide{min-width:100%;height:100%;position:relative;flex-shrink:0;}
.h-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.h-overlay{position:absolute;inset:0;background:linear-gradient(125deg,rgba(11,23,16,.88) 0%,rgba(11,23,16,.45) 55%,rgba(11,23,16,.15) 100%);}
.h-content{position:absolute;inset:0;display:flex;align-items:center;padding:0 8%;}
.h-text{max-width:640px;}
.h-text h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,5.5vw,5rem);font-weight:300;line-height:1.1;margin-bottom:1.1rem;}
.h-text h1 em{color:var(--gold-light);font-style:italic;}
.h-text p{color:rgba(242,235,224,.82);font-size:.95rem;line-height:1.85;margin-bottom:1.9rem;max-width:470px;}
.h-btns{display:flex;gap:.9rem;flex-wrap:wrap;}
.h-arrows{position:absolute;bottom:2.5rem;right:3rem;z-index:3;display:flex;gap:.6rem;}
.h-arrows button{width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(201,151,58,.45);background:rgba(11,23,16,.65);color:var(--gold);font-size:.9rem;cursor:pointer;transition:var(--tr);}
.h-arrows button:hover{background:var(--gold);color:var(--dark);}
.h-dots{position:absolute;bottom:3rem;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:.55rem;}
.h-dots span{width:26px;height:3px;background:rgba(255,255,255,.28);border-radius:2px;cursor:pointer;transition:var(--tr);}
.h-dots span.on{background:var(--gold);width:46px;} */

/* HERO */
#hero {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.h-slides {
    display: flex;
    height: 100%;
    transition: transform .8s ease;
}

.h-slide {
    min-width: 100%;
    height: 100%;
    position: relative;
}

.h-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.h-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right,
            rgba(0, 0, 0, .75),
            rgba(0, 0, 0, .35),
            rgba(0, 0, 0, .15));
}

.h-content {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 8%;
}

.h-text {
    max-width: 700px;
}

.h-text h1 {
    font-size: clamp(2rem, 6vw, 6rem);
    line-height: 1.1;
    margin-bottom: 1rem;
}

.h-text p {
    font-size: clamp(.9rem, 1.5vw, 1.1rem);
    line-height: 1.8;
    max-width: 550px;
    margin-bottom: 2rem;
}

.h-btns {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* arrows */
.h-arrows {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 30px;
    z-index: 10;
}

.h-arrows button {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    background: rgba(255, 255, 255, .15);
    backdrop-filter: blur(10px);
    color: #fff;
}

/* dots */
.h-dots {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.h-dots span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .4);
    cursor: pointer;
}

.h-dots span.on {
    background: #c9973a;
}

/* Tablet */
@media(max-width:991px) {
    #hero {
        height: 85vh;
    }

    .h-content {
        padding: 0 6%;
    }
}

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

    #hero {
        height: 80vh;
        min-height: 500px;
    }

    .h-content {
        justify-content: center;
        text-align: center;
        padding: 0 20px;
    }

    .h-text {
        max-width: 100%;
    }

    .h-btns {
        justify-content: center;
    }

    .h-arrows {
        padding: 0 10px;
    }

    .h-arrows button {
        width: 42px;
        height: 42px;
    }
}

/* Small Mobile */
@media(max-width:480px) {

    .h-text h1 {
        font-size: 2rem;
    }

    .h-text p {
        font-size: .9rem;
    }

    .h-btns .btn {
        width: 100%;
        justify-content: center;
    }

    .h-arrows {
        display: none;
    }
}

/* ABOUT */
#about {
    padding: 6rem 1.5rem;
    background: var(--dark2);
}

.ab-in {
    max-width: 1200px;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
}

.ab-img {
    position: relative;
}

.ab-img img {
    width: 100%;
    height: 460px;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .6);
    position: relative;
    z-index: 1;
}

.ab-img::before {
    content: '';
    position: absolute;
    top: -16px;
    left: -16px;
    right: 16px;
    bottom: 16px;
    border: 1.5px solid rgba(201, 151, 58, .22);
    border-radius: 16px;
    z-index: 0;
}

.ab-badge {
    position: absolute;
    bottom: -18px;
    right: -18px;
    background: var(--gold);
    color: var(--dark);
    padding: 1.3rem 1.8rem;
    border-radius: var(--r);
    font-family: 'Cormorant Garamond', serif;
    z-index: 2;
}

.ab-badge .bn {
    font-size: 2.6rem;
    font-weight: 600;
    display: block;
    line-height: 1;
}

.ab-badge .bl {
    font-size: .7rem;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.ab-feats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .9rem;
    margin-top: 1.8rem;
}

.af {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
}

.af i {
    color: var(--gold);
    font-size: 1rem;
    margin-top: .1rem;
}

.af strong {
    display: block;
    color: var(--cream);
    font-size: .86rem;
    margin-bottom: .15rem;
}

.af p {
    font-size: .78rem;
    color: var(--text);
    line-height: 1.5;
}

/* SECTION */
.sec {
    padding: 6rem 1.5rem;
}

.sec-head {
    text-align: center;
    max-width: 580px;
    margin: 0 auto 3.5rem;
}

.sec-head .sub {
    margin: .75rem auto 0;
}

/* =====================================================
   SERVICES — FLAT INFINITE LOOP SLIDER (like testimonials)
===================================================== */
#services {
    padding: 6rem 0;
    background: var(--dark);
    overflow: hidden;
}

#services .sec-head {
    padding: 0 1.5rem;
}

.svc-outer {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 1rem 0 1rem;
}

/* clipping mask — fade edges */
.svc-outer::before,
.svc-outer::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 80px;
    z-index: 2;
    pointer-events: none;
}

.svc-outer::before {
    left: 0;
    background: linear-gradient(to right, var(--dark), transparent);
}

.svc-outer::after {
    right: 0;
    background: linear-gradient(to left, var(--dark), transparent);
}

.svc-track {
    display: flex;
    gap: 1.5rem;
    transition: transform .55s cubic-bezier(.4, 0, .2, 1);
    will-change: transform;
    padding: 1rem 0;
}

.svc-card {
    flex: 0 0 300px;
    width: 300px;
    background: var(--dark2);
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(201, 151, 58, .12);
    transition: transform .35s, box-shadow .35s, border-color .35s;
}

.svc-card:hover {
    transform: translateY(-7px);
    border-color: rgba(201, 151, 58, .45);
    box-shadow: 0 22px 55px rgba(0, 0, 0, .55);
}

.svc-card img {
    width: 100%;
    height: 190px;
    object-fit: cover;
    display: block;
}

.svc-body {
    padding: 1.35rem;
}

.svc-body h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.22rem;
    margin-bottom: .4rem;
    color: var(--cream);
}

.svc-body p {
    font-size: .8rem;
    color: var(--text);
    line-height: 1.7;
    margin-bottom: .85rem;
}

.svc-price {
    font-size: .74rem;
    color: var(--gold);
    letter-spacing: .06em;
}

.svc-price a {
    color: var(--gold-light);
}

.svc-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    margin-top: 2rem;
    padding: 0 1.5rem;
}

.svc-nav button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid rgba(201, 151, 58, .38);
    background: transparent;
    color: var(--gold);
    cursor: pointer;
    font-size: .9rem;
    transition: var(--tr);
    flex-shrink: 0;
}

.svc-nav button:hover {
    background: var(--gold);
    color: var(--dark);
}

.svc-dots {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
    justify-content: center;
}

.svc-dots span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(201, 151, 58, .28);
    cursor: pointer;
    transition: var(--tr);
}

.svc-dots span.on {
    background: var(--gold);
    transform: scale(1.35);
}

/* =====================================================
   TESTIMONIALS — RESPONSIVE 3D CAROUSEL
===================================================== */
.c3d-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 1rem 0 3rem;
}

.c3d-stage {
    perspective: 1400px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* height adapts to card */
    min-height: 300px;
}

.c3d-track {
    position: relative;
    transform-style: preserve-3d;
    transition: transform .75s cubic-bezier(.4, 0, .2, 1);
    /* width/height set by JS based on viewport */
}

.tc-item {
    position: absolute;
    backface-visibility: hidden;
    border-radius: 14px;
    overflow: hidden;
    background: var(--dark);
    border: 1px solid rgba(201, 151, 58, .12);
    box-shadow: 0 18px 45px rgba(0, 0, 0, .5);
    transition: box-shadow .4s, opacity .4s;
    /* width set by JS */
}

.tc-item.active-card {
    box-shadow: 0 28px 65px rgba(201, 151, 58, .3), 0 0 0 1.5px var(--gold);
}

.tc-inner {
    padding: 1.8rem;
}

.stars {
    color: var(--gold);
    font-size: .85rem;
    margin-bottom: .75rem;
    letter-spacing: .08rem;
}

.tc-inner p {
    font-size: .84rem;
    color: var(--text);
    line-height: 1.85;
    font-style: italic;
    margin-bottom: 1.2rem;
}

.tc-author strong {
    color: var(--cream);
    font-size: .88rem;
}

.tc-author span {
    color: var(--gold);
    font-size: .73rem;
    display: block;
    margin-top: .15rem;
}

.c3d-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    margin-top: 47px;
}

.c3d-nav button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid rgba(201, 151, 58, .38);
    background: transparent;
    color: var(--gold);
    cursor: pointer;
    font-size: .9rem;
    transition: var(--tr);
    flex-shrink: 0;
}

.c3d-nav button:hover {
    background: var(--gold);
    color: var(--dark);
}

.c3d-dots {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
    justify-content: center;
}

.c3d-dots span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(201, 151, 58, .28);
    cursor: pointer;
    transition: var(--tr);
}

.c3d-dots span.on {
    background: var(--gold);
    transform: scale(1.35);
}

/* BOOKING */
#booking {
    padding: 5.5rem 1.5rem;
    background: linear-gradient(140deg, var(--green2), var(--green));
}

.bk-in {
    max-width: 1100px;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4.5rem;
    align-items: center;
}

.bk-form {
    background: rgba(11, 23, 16, .72);
    border: 1px solid rgba(201, 151, 58, .2);
    border-radius: 16px;
    padding: 2.5rem;
}

.bk-form h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.75rem;
    margin-bottom: 1.5rem;
    color: var(--cream);
}

.fg {
    display: flex;
    flex-direction: column;
    gap: .38rem;
    margin-bottom: 1rem;
}

.fg label {
    font-size: .7rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gold);
}

.fg input,
.fg select {
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(201, 151, 58, .22);
    border-radius: var(--r);
    padding: .68rem 1rem;
    color: var(--cream);
    font-family: 'Jost', sans-serif;
    font-size: .84rem;
    width: 100%;
    outline: none;
    transition: border-color .3s;
}

.fg input:focus,
.fg select:focus {
    border-color: var(--gold);
}

.fg select option {
    background: #0d1a11;
}

.fg2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.bk-info .h2 {
    margin-bottom: 1.1rem;
}

.bk-info p {
    color: var(--text);
    line-height: 1.85;
    margin-bottom: 1.5rem;
    font-size: .9rem;
}

.bk-contact a {
    display: flex;
    align-items: center;
    gap: .7rem;
    color: var(--text);
    font-size: .87rem;
    margin-bottom: .7rem;
    transition: color .3s;
}

.bk-contact a:hover {
    color: var(--gold);
}

.bk-contact i {
    color: var(--gold);
    width: 18px;
}

/* STATS */
#stats {
    padding: 3.5rem 1.5rem;
    background: var(--dark2);
    border-top: 1px solid rgba(201, 151, 58, .1);
    border-bottom: 1px solid rgba(201, 151, 58, .1);
}

.st-in {
    max-width: 1100px;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    text-align: center;
}

.st-n {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.2rem;
    font-weight: 600;
    color: var(--gold);
    line-height: 1;
}

.st-l {
    font-size: .73rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--text);
    margin-top: .4rem;
}

/* 3×N GRID */
.grid3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

/* AMENITY CARD */
.am-card {
    text-align: center;
    padding: 2rem 1.2rem;
    background: var(--dark2);
    border-radius: 14px;
    border: 1px solid rgba(201, 151, 58, .1);
    transition: var(--tr);
}

.am-card:hover {
    border-color: var(--gold);
    transform: translateY(-5px);
    box-shadow: 0 18px 45px rgba(0, 0, 0, .45);
}

.am-card i {
    font-size: 2.1rem;
    color: var(--gold);
    margin-bottom: 1rem;
}

.am-card h4 {
    color: var(--cream);
    font-size: .93rem;
    margin-bottom: .4rem;
}

.am-card p {
    font-size: .78rem;
    color: var(--text);
    line-height: 1.6;
}

/* NEARBY CARD */
.nb-card {
    border-radius: 14px;
    overflow: hidden;
    background: var(--dark);
    border: 1px solid rgba(201, 151, 58, .1);
    transition: var(--tr);
}

.nb-card:hover {
    transform: translateY(-6px);
    border-color: var(--gold);
    box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
}

.nb-img {
    height: 185px;
    position: relative;
    overflow: hidden;
}

.nb-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}

.nb-card:hover .nb-img img {
    transform: scale(1.07);
}

.nb-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(11, 23, 16, .85), transparent 55%);
}

.nb-body {
    padding: 1.2rem;
}

.nb-body h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    color: var(--cream);
    margin-bottom: .3rem;
}

.nb-body p {
    font-size: .78rem;
    color: var(--text);
    line-height: 1.5;
}

.nb-dist {
    font-size: .7rem;
    color: var(--gold);
    margin-top: .45rem;
    letter-spacing: .06em;
}

/* FAQ */
#faq {
    padding: 6rem 1.5rem;
    background: var(--dark);
}

.faq-in {
    max-width: 820px;
    margin: auto;
}

.faq-hd {
    text-align: center;
    margin-bottom: 3rem;
}

.faq-item {
    border-bottom: 1px solid rgba(201, 151, 58, .13);
}

.faq-q {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 0;
    cursor: pointer;
    gap: 1rem;
}

.faq-q span {
    font-size: .93rem;
    color: var(--cream);
    font-weight: 500;
    transition: color .3s;
}

.faq-q:hover span {
    color: var(--gold);
}

.faq-ic {
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    border: 1.5px solid rgba(201, 151, 58, .38);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gold);
    font-size: 1.1rem;
    flex-shrink: 0;
    transition: var(--tr);
    line-height: 1;
}

.faq-item.open .faq-ic {
    background: var(--gold);
    color: var(--dark);
    border-color: var(--gold);
}

.faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .42s ease;
}

.faq-a p {
    font-size: .85rem;
    color: var(--text);
    line-height: 1.85;
    padding-bottom: 1.2rem;
}

.faq-item.open .faq-a {
    max-height: 220px;
}

/* FOOTER */
#footer {
    background: #080f0b;
    border-top: 1px solid rgba(201, 151, 58, .18);
    padding: 4rem 1.5rem 2rem;
}

.ft-in {
    max-width: 1260px;
    margin: auto;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 3rem;
    margin-bottom: 3rem;
}

.ft-brand .logo {
    font-size: 1.7rem;
    margin-bottom: 1rem;
}

.ft-brand p {
    font-size: .8rem;
    color: var(--text);
    line-height: 1.85;
    margin-bottom: 1.4rem;
}

.ft-social {
    display: flex;
    gap: .65rem;
}

.ft-social a {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(201, 151, 58, .28);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
    font-size: .82rem;
    transition: var(--tr);
}

.ft-social a:hover {
    background: var(--gold);
    color: var(--dark);
    border-color: var(--gold);
}

.ft-col h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.05rem;
    color: var(--cream);
    margin-bottom: 1.1rem;
    padding-bottom: .6rem;
    position: relative;
}

.ft-col h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 28px;
    height: 1.5px;
    background: var(--gold);
}

.ft-col ul {
    list-style: none;
}

.ft-col ul li {
    margin-bottom: .55rem;
}

.ft-col ul li a {
    font-size: .8rem;
    color: var(--text);
    transition: color .3s;
}

.ft-col ul li a:hover {
    color: var(--gold);
}

.ft-ci {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin-bottom: .8rem;
    font-size: .8rem;
    color: var(--text);
}

.ft-ci i {
    color: var(--gold);
    margin-top: .12rem;
    width: 13px;
}

.ft-ci a {
    color: var(--text);
}

.ft-ci a:hover {
    color: var(--gold);
}

.ft-bot {
    border-top: 1px solid rgba(255, 255, 255, .06);
    padding-top: 1.4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.ft-bot p {
    /* font-size:.75rem; */
    color: var(--text);
}

/* FADE IN */
.fi {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .65s ease, transform .65s ease;
}

.fi.vis {
    opacity: 1;
    transform: none;
}

/* ======== RESPONSIVE ======== */
@media(max-width:1024px) {
    .ab-in {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .ab-img img {
        height: 340px;
    }

    .bk-in {
        grid-template-columns: 1fr;
    }

    .ft-in {
        grid-template-columns: 1fr 1fr;
    }

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

@media(max-width:900px) {
    .grid3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media(max-width:768px) {

    .nav-ul,
    .nav-cta {
        display: none;
    }

    .ham {
        display: flex;
    }

    #hero {
        height: 88vh;
    }

    .h-arrows {
        right: 1rem;
        bottom: 1.2rem;
    }

    #topbar .tb-r {
        display: none;
    }

    .ab-feats {
        grid-template-columns: 1fr;
    }

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

    .st-in {
        grid-template-columns: 1fr 1fr;
    }

    .ft-in {
        grid-template-columns: 1fr;
    }

    .ft-bot {
        flex-direction: column;
        text-align: center;
    }

    .svc-outer::before,
    .svc-outer::after {
        width: 32px;
    }
}

@media(max-width:540px) {
    .grid3 {
        grid-template-columns: 1fr;
    }

    .h-btns {
        flex-direction: column;
        gap: .6rem;
    }

    .h-btns .btn {
        width: 100%;
        justify-content: center;
    }
}



/* ====================================
   ABOUT PAGE BANNER
==================================== */

.vr-about-banner-wrap {
    position: relative;
    width: 100%;
    height: 420px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vr-about-banner-bg {
    position: absolute;
    inset: 0;
}

.vr-about-banner-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.vr-about-banner-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg,
            rgba(4, 18, 10, 0.92),
            rgba(8, 32, 18, 0.72));
}

.vr-about-banner-content {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 0 20px;
    max-width: 900px;
}

.vr-about-mini-title {
    display: block;
    color: #c9973a;
    font-size: 14px;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.vr-about-main-title {
    color: #fff;
    font-size: clamp(2.2rem, 6vw, 5rem);
    font-weight: 300;
    line-height: 1.1;
    margin-bottom: 20px;
    font-family: 'Cormorant Garamond', serif;
}

.vr-about-breadcrumb-area {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.vr-about-breadcrumb-link {
    color: #ffffff;
    text-decoration: none;
    transition: .3s;
    font-size: 15px;
}

.vr-about-breadcrumb-link:hover {
    color: #c9973a;
}

.vr-about-breadcrumb-divider {
    color: #c9973a;
}

.vr-about-breadcrumb-current {
    color: #c9973a;
    font-weight: 500;
}

@media(max-width:991px) {

    .vr-about-banner-wrap {
        height: 350px;
    }

    .vr-about-main-title {
        font-size: 3rem;
    }

}

@media(max-width:768px) {

    .vr-about-banner-wrap {
        height: 300px;
    }

    .vr-about-mini-title {
        font-size: 12px;
        letter-spacing: 3px;
    }

    .vr-about-main-title {
        font-size: 2.3rem;
    }

}

@media(max-width:480px) {

    .vr-about-banner-wrap {
        height: 260px;
    }

    .vr-about-main-title {
        font-size: 1.9rem;
    }

    .vr-about-breadcrumb-area {
        gap: 8px;
    }

    .vr-about-breadcrumb-link,
    .vr-about-breadcrumb-current {
        font-size: 13px;
    }

}

/* ============================================================
   EXECUTIVE SUITES — executive-suites.css
   All classes prefixed with  es-  to avoid conflicts
   ============================================================ */

/* ── BANNER ──────────────────────────────────────────────── */
.es-banner {
  position: relative;
  width: 100%;
  height: 480px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.es-banner-bg {
  position: absolute;
  inset: 0;
}

.es-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
  transform: scale(1.04);
  animation: es-zoom-in 8s ease forwards;
}

@keyframes es-zoom-in {
  to { transform: scale(1); }
}

.es-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(4, 14, 8, 0.88) 0%,
    rgba(10, 30, 18, 0.65) 55%,
    rgba(20, 50, 30, 0.45) 100%
  );
}

.es-banner-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0 20px;
  max-width: 860px;
  animation: es-fade-up 0.9s ease both;
}

@keyframes es-fade-up {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: none; }
}

.es-banner-tag {
  display: inline-block;
  color: var(--gold);
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  margin-bottom: 1rem;
  border: 1px solid rgba(201,151,58,.35);
  padding: 0.35rem 1.1rem;
  border-radius: 50px;
}

.es-banner-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.4rem, 6.5vw, 5.2rem);
  font-weight: 300;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 1rem;
}

.es-banner-title em {
  color: var(--gold-light);
  font-style: italic;
}

.es-banner-desc {
  color: rgba(242,235,224,.78);
  font-size: clamp(.85rem, 1.5vw, 1rem);
  line-height: 1.85;
  max-width: 560px;
  margin: 0 auto 1.6rem;
}

.es-banner-bread {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
}

.es-bread-link {
  font-size: 0.8rem;
  color: rgba(255,255,255,.75);
  transition: color .3s;
  text-decoration: none;
}

.es-bread-link:hover { color: var(--gold); }

.es-bread-sep {
  color: var(--gold);
  font-size: 0.55rem;
}

.es-bread-cur {
  font-size: 0.8rem;
  color: var(--gold);
  font-weight: 500;
}

/* ── CONTENT SECTION ─────────────────────────────────────── */
.es-content-sec {
  background: var(--dark);
  padding: 5rem 1.5rem 0;
}

.es-content-wrap {
  max-width: 1240px;
  margin: 0 auto;
}

/* Shared labels & headings inside content */
.es-label {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.7rem;
}

.es-h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.85rem, 3.8vw, 2.9rem);
  font-weight: 300;
  line-height: 1.15;
  color: var(--cream);
}

.es-h2 em {
  color: var(--gold-light);
  font-style: italic;
}

.es-para {
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.9;
  max-width: 540px;
  margin-bottom: 1rem;
}

/* ── INTRO ───────────────────────────────────────────────── */
.es-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.es-intro-text { }

.es-intro-img {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 32px 70px rgba(0,0,0,.55);
}

.es-intro-img img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.es-intro-img:hover img { transform: scale(1.04); }

.es-intro-badge {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  background: var(--gold);
  color: var(--dark);
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.45rem 1.1rem;
  border-radius: 50px;
  letter-spacing: 0.06em;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

/* ── FEATURES ────────────────────────────────────────────── */
.es-features-head {
  text-align: center;
  padding: 5rem 0 2.5rem;
}

.es-features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.8rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.es-feat-card {
  background: var(--dark2);
  border: 1px solid rgba(201,151,58,.1);
  border-radius: 14px;
  padding: 2rem 1.5rem;
  transition: transform .4s ease, border-color .4s ease, box-shadow .4s ease;
}

.es-feat-card:hover {
  transform: translateY(-6px);
  border-color: var(--gold);
  box-shadow: 0 22px 55px rgba(0,0,0,.45);
}

.es-feat-icon {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(201,151,58,.1);
  border: 1px solid rgba(201,151,58,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.2rem;
}

.es-feat-icon i {
  font-size: 1.3rem;
  color: var(--gold);
}

.es-feat-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem;
  color: var(--cream);
  margin-bottom: 0.6rem;
  font-weight: 400;
}

.es-feat-card p {
  font-size: 0.82rem;
  color: var(--text);
  line-height: 1.75;
}

/* ── GALLERY ─────────────────────────────────────────────── */
.es-gallery-head {
  text-align: center;
  padding: 5rem 0 2.5rem;
}

.es-gallery {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 220px 220px;
  gap: 1rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.es-gal-item {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
}

.es-gal-wide {
  grid-row: 1 / 3;
}

.es-gal-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s ease;
}

.es-gal-item:hover img { transform: scale(1.06); }

.es-gal-item::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(11,23,16,.8) 0%, transparent 55%);
}

.es-gal-label {
  position: absolute;
  bottom: 0.9rem;
  left: 1rem;
  z-index: 2;
  font-size: 0.75rem;
  color: var(--cream);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ── AMENITIES ───────────────────────────────────────────── */
.es-amenities-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding: 5rem 0;
}

.es-incl-list {
  list-style: none;
  margin-top: 1.6rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem 1.5rem;
}

.es-incl-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.5;
}

.es-incl-list li i {
  color: var(--gold);
  font-size: 0.9rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

.es-amenities-img {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 32px 70px rgba(0,0,0,.5);
}

.es-amenities-img img {
  width: 100%;
  height: 460px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.es-amenities-img:hover img { transform: scale(1.04); }

/* ── CONCLUSION ──────────────────────────────────────────── */
.es-conclusion {
  position: relative;
  background-image: url('https://images.unsplash.com/photo-1501854140801-50d01698950b?w=1600&q=80');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  padding: 7rem 1.5rem;
  text-align: center;
}

.es-conclusion-overlay {
  position: absolute;
  inset: 0;
  background: rgba(6,16,10,.82);
}

.es-conclusion-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}

.es-conclusion-btns {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.es-conclusion-info {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: rgba(242,235,224,.65);
}

.es-conclusion-info div {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.es-conclusion-info i { color: var(--gold); }

/* ── FAQ ─────────────────────────────────────────────────── */
.es-faq-sec {
  padding: 6rem 1.5rem;
  background: var(--dark2);
}

.es-faq-wrap {
  max-width: 820px;
  margin: 0 auto;
}

.es-faq-head {
  text-align: center;
  margin-bottom: 3rem;
}

.es-faq-item {
  border-bottom: 1px solid rgba(201,151,58,.13);
}

.es-faq-q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.2rem 0;
  cursor: pointer;
  gap: 1rem;
}

.es-faq-q span {
  font-size: 0.93rem;
  color: var(--cream);
  font-weight: 500;
  transition: color .3s;
}

.es-faq-q:hover span { color: var(--gold); }

.es-faq-ic {
  min-width: 27px;
  height: 27px;
  border-radius: 50%;
  border: 1.5px solid rgba(201,151,58,.38);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: all .4s ease;
  line-height: 1;
}

.es-faq-item.open .es-faq-ic {
  background: var(--gold);
  color: var(--dark);
  border-color: var(--gold);
}

.es-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .42s ease;
}

.es-faq-a p {
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.85;
  padding-bottom: 1.2rem;
}

.es-faq-item.open .es-faq-a { max-height: 260px; }

/* ── FADE-IN ANIMATION ───────────────────────────────────── */
.es-fadein {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}

.es-fadein.es-vis {
  opacity: 1;
  transform: none;
}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .es-intro { grid-template-columns: 1fr; gap: 3rem; }
  .es-amenities-wrap { grid-template-columns: 1fr; gap: 3rem; }
  .es-features-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .es-banner { height: 360px; }
  .es-gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 180px 180px 180px;
  }
  .es-gal-wide { grid-row: auto; }
  .es-incl-list { grid-template-columns: 1fr; }
  .es-conclusion { background-attachment: scroll; }
  .es-conclusion-info { flex-direction: column; gap: 0.8rem; align-items: center; }
}

@media (max-width: 540px) {
  .es-banner { height: 300px; }
  .es-features-grid { grid-template-columns: 1fr; }
  .es-gallery {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .es-gal-item { height: 200px; }
  .es-intro-img img { height: 280px; }
  .es-amenities-img img { height: 280px; }
}

/* ============================================================
   VINTAGE HOUSE — vintage-house.css
   All classes prefixed with  vh-  to avoid conflicts
   ============================================================ */

/* ── BANNER ──────────────────────────────────────────────── */
.vh-banner {
  position: relative;
  width: 100%;
  height: 480px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vh-banner-bg {
  position: absolute;
  inset: 0;
}

.vh-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  display: block;
  transform: scale(1.05);
  animation: vh-zoom 9s ease forwards;
}

@keyframes vh-zoom {
  to { transform: scale(1); }
}

.vh-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(8, 20, 12, 0.9) 0%,
    rgba(14, 35, 22, 0.68) 50%,
    rgba(22, 50, 30, 0.4) 100%
  );
}

.vh-banner-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0 20px;
  max-width: 860px;
  animation: vh-slide-up 0.95s ease both;
}

@keyframes vh-slide-up {
  from { opacity: 0; transform: translateY(35px); }
  to   { opacity: 1; transform: none; }
}

.vh-banner-tag {
  display: inline-block;
  color: var(--gold);
  font-size: 0.68rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  margin-bottom: 1.1rem;
  padding: 0.38rem 1.3rem;
  border: 1px solid rgba(201,151,58,.4);
  border-radius: 2px;
}

.vh-banner-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.6rem, 7vw, 5.5rem);
  font-weight: 300;
  line-height: 1.08;
  color: #fff;
  margin-bottom: 1rem;
}

.vh-banner-title em {
  color: var(--gold-light);
  font-style: italic;
}

.vh-banner-desc {
  color: rgba(242,235,224,.75);
  font-size: clamp(.85rem, 1.4vw, 1rem);
  line-height: 1.9;
  max-width: 580px;
  margin: 0 auto 1.7rem;
}

.vh-banner-bread {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
}

.vh-bread-link {
  font-size: 0.8rem;
  color: rgba(255,255,255,.72);
  transition: color .3s;
  text-decoration: none;
}

.vh-bread-link:hover { color: var(--gold); }

.vh-bread-sep {
  color: var(--gold);
  font-size: 0.55rem;
}

.vh-bread-cur {
  font-size: 0.8rem;
  color: var(--gold);
  font-weight: 500;
}

/* Decorative SVG ornament */
.vh-banner-ornament {
  position: absolute;
  bottom: 1.5rem;
  right: 2rem;
  width: 90px;
  height: 90px;
  opacity: 0.5;
  z-index: 2;
  animation: vh-spin 20s linear infinite;
}

@keyframes vh-spin {
  to { transform: rotate(360deg); }
}

/* ── CONTENT ─────────────────────────────────────────────── */
.vh-content-sec {
  background: var(--dark);
  padding: 5rem 1.5rem 0;
}

.vh-content-wrap {
  max-width: 1240px;
  margin: 0 auto;
}

.vh-label {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.7rem;
}

.vh-h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.85rem, 3.8vw, 2.9rem);
  font-weight: 300;
  line-height: 1.15;
  color: var(--cream);
}

.vh-h2 em {
  color: var(--gold-light);
  font-style: italic;
}

.vh-para {
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.9;
  max-width: 540px;
  margin-bottom: 1rem;
}

/* ── INTRO ───────────────────────────────────────────────── */
.vh-intro {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.vh-intro-img-block {
  position: relative;
}

.vh-main-img {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 30px 65px rgba(0,0,0,.55);
}

.vh-main-img img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.vh-main-img:hover img { transform: scale(1.04); }

.vh-small-img {
  position: absolute;
  bottom: -2rem;
  right: -2rem;
  width: 180px;
  border-radius: 12px;
  overflow: hidden;
  border: 4px solid var(--dark);
  box-shadow: 0 18px 40px rgba(0,0,0,.5);
}

.vh-small-img img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;
}

.vh-years-badge {
  position: absolute;
  top: 1.5rem;
  left: -1.5rem;
  background: var(--gold);
  color: var(--dark);
  border-radius: 10px;
  padding: 0.8rem 1rem;
  text-align: center;
  box-shadow: 0 12px 30px rgba(201,151,58,.4);
}

.vh-yb-num {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 0.2rem;
}

.vh-yb-lbl {
  display: block;
  font-size: 0.6rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
}

.vh-intro-pills {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
  margin-top: 1.5rem;
}

.vh-intro-pills span {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(201,151,58,.1);
  border: 1px solid rgba(201,151,58,.25);
  color: var(--gold);
  font-size: 0.75rem;
  padding: 0.35rem 0.85rem;
  border-radius: 50px;
  letter-spacing: 0.05em;
}

/* ── TIMELINE ────────────────────────────────────────────── */
.vh-timeline-head {
  text-align: center;
  padding: 5rem 0 3rem;
}

.vh-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.vh-timeline::before {
  content: '';
  position: absolute;
  top: 2.1rem;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(201,151,58,.4), transparent);
}

.vh-tl-item {
  text-align: center;
  padding: 0 1.5rem;
  position: relative;
}

.vh-tl-num {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: var(--dark2);
  border: 2px solid var(--gold);
  color: var(--gold);
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.3rem;
  position: relative;
  z-index: 1;
}

.vh-tl-body h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  color: var(--cream);
  margin-bottom: 0.6rem;
  font-weight: 400;
}

.vh-tl-body p {
  font-size: 0.8rem;
  color: var(--text);
  line-height: 1.75;
}

/* ── FEATURES GRID ───────────────────────────────────────── */
.vh-features-head {
  text-align: center;
  padding: 5rem 0 2.5rem;
}

.vh-features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.2rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.vh-feat-card {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  height: 320px;
  cursor: pointer;
}

.vh-feat-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s ease;
}

.vh-feat-card:hover img { transform: scale(1.08); }

.vh-feat-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(4,14,8,.92) 0%, rgba(4,14,8,.35) 55%, transparent 100%);
  transition: background .4s ease;
}

.vh-feat-card:hover .vh-feat-overlay {
  background: linear-gradient(to top, rgba(4,14,8,.96) 0%, rgba(4,14,8,.6) 55%, rgba(4,14,8,.2) 100%);
}

.vh-feat-text {
  position: absolute;
  bottom: 1.4rem;
  left: 1.2rem;
  right: 1.2rem;
  z-index: 2;
}

.vh-feat-text i {
  font-size: 1.4rem;
  color: var(--gold);
  margin-bottom: 0.6rem;
  display: block;
}

.vh-feat-text h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  color: #fff;
  margin-bottom: 0.4rem;
  font-weight: 400;
}

.vh-feat-text p {
  font-size: 0.78rem;
  color: rgba(242,235,224,.75);
  line-height: 1.6;
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s ease;
}

.vh-feat-card:hover .vh-feat-text p { max-height: 120px; }

/* ── AMENITIES ───────────────────────────────────────────── */
.vh-amenities {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding: 5rem 0;
}

.vh-amenities-img {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 30px 65px rgba(0,0,0,.5);
}

.vh-amenities-img img {
  width: 100%;
  height: 460px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.vh-amenities-img:hover img { transform: scale(1.04); }

.vh-check-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.8rem 1.5rem;
  margin-top: 1.6rem;
}

.vh-check-item {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.84rem;
  color: var(--text);
  line-height: 1.5;
}

.vh-check-item i {
  color: var(--gold);
  font-size: 0.85rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

/* ── CONCLUSION ──────────────────────────────────────────── */
.vh-conclusion {
  position: relative;
  background-image: url('https://images.unsplash.com/photo-1476514525535-07fb3b4ae5f1?w=1600&q=80');
  background-size: cover;
  background-position: center 40%;
  background-attachment: fixed;
  padding: 7rem 1.5rem;
  text-align: center;
}

.vh-conclusion-overlay {
  position: absolute;
  inset: 0;
  background: rgba(5,14,9,.85);
}

.vh-conclusion-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}

.vh-conclusion-btns {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 3rem;
}

.vh-conclusion-stats {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
}

.vh-cstat span {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.2rem;
  color: var(--gold);
  font-weight: 300;
  line-height: 1;
}

.vh-cstat p {
  font-size: 0.75rem;
  color: rgba(242,235,224,.6);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 0.3rem;
}

.vh-cstat-div {
  width: 1px;
  height: 50px;
  background: rgba(201,151,58,.3);
}

/* ── FAQ ─────────────────────────────────────────────────── */
.vh-faq-sec {
  padding: 6rem 1.5rem;
  background: var(--dark2);
}

.vh-faq-wrap {
  max-width: 820px;
  margin: 0 auto;
}

.vh-faq-head {
  text-align: center;
  margin-bottom: 3rem;
}

.vh-faq-item {
  border-bottom: 1px solid rgba(201,151,58,.13);
}

.vh-faq-q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.2rem 0;
  cursor: pointer;
  gap: 1rem;
}

.vh-faq-q span {
  font-size: 0.93rem;
  color: var(--cream);
  font-weight: 500;
  transition: color .3s;
}

.vh-faq-q:hover span { color: var(--gold); }

.vh-faq-ic {
  min-width: 27px;
  height: 27px;
  border-radius: 50%;
  border: 1.5px solid rgba(201,151,58,.38);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: all .4s ease;
  line-height: 1;
}

.vh-faq-item.open .vh-faq-ic {
  background: var(--gold);
  color: var(--dark);
  border-color: var(--gold);
}

.vh-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .42s ease;
}

.vh-faq-a p {
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.85;
  padding-bottom: 1.2rem;
}

.vh-faq-item.open .vh-faq-a { max-height: 260px; }

/* ── FADE-IN ─────────────────────────────────────────────── */
.vh-fadein {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}

.vh-fadein.vh-vis {
  opacity: 1;
  transform: none;
}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1100px) {
  .vh-features-grid { grid-template-columns: repeat(2, 1fr); }
  .vh-timeline { grid-template-columns: repeat(2, 1fr); gap: 2.5rem; }
  .vh-timeline::before { display: none; }
}

@media (max-width: 1024px) {
  .vh-intro { grid-template-columns: 1fr; gap: 4rem; }
  .vh-amenities { grid-template-columns: 1fr; gap: 3rem; }
  .vh-small-img { right: 1rem; bottom: -1rem; }
}

@media (max-width: 768px) {
  .vh-banner { height: 360px; }
  .vh-banner-ornament { display: none; }
  .vh-conclusion { background-attachment: scroll; }
  .vh-check-grid { grid-template-columns: 1fr; }
  .vh-cstat-div { width: 40px; height: 1px; }
}

@media (max-width: 540px) {
  .vh-banner { height: 300px; }
  .vh-features-grid { grid-template-columns: 1fr; }
  .vh-timeline { grid-template-columns: 1fr; }
  .vh-main-img img { height: 260px; }
  .vh-amenities-img img { height: 280px; }
  .vh-small-img { width: 130px; }
}

/* sky lounge css */
/* ============================================================
   SKY LOUNGE — sky-lounge.css
   All classes prefixed with  sl-  to avoid conflicts
   ============================================================ */

/* ── BANNER ──────────────────────────────────────────────── */
.sl-banner {
  position: relative;
  width: 100%;
  height: 480px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sl-banner-bg {
  position: absolute;
  inset: 0;
}

.sl-banner-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
  transform: scale(1.06);
  animation: sl-ken-burns 10s ease forwards;
}

@keyframes sl-ken-burns {
  to { transform: scale(1); }
}

.sl-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(4, 12, 22, 0.75) 0%,
    rgba(6, 20, 35, 0.60) 40%,
    rgba(4, 12, 22, 0.85) 100%
  );
}

/* Floating light-dot particles */
.sl-particles {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.sl-particles span {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(201,151,58,.6);
  animation: sl-float linear infinite;
}

.sl-particles span:nth-child(1) { left:15%;  animation-duration:8s;  animation-delay:0s;   top:80%; }
.sl-particles span:nth-child(2) { left:35%;  animation-duration:11s; animation-delay:2s;   top:70%; }
.sl-particles span:nth-child(3) { left:58%;  animation-duration:9s;  animation-delay:1s;   top:90%; }
.sl-particles span:nth-child(4) { left:78%;  animation-duration:13s; animation-delay:3.5s; top:75%; }
.sl-particles span:nth-child(5) { left:90%;  animation-duration:7s;  animation-delay:1.5s; top:85%; }

@keyframes sl-float {
  0%   { transform: translateY(0) scale(1); opacity: 0.8; }
  50%  { opacity: 0.4; }
  100% { transform: translateY(-400px) scale(0.3); opacity: 0; }
}

.sl-banner-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0 20px;
  max-width: 860px;
  animation: sl-rise 1s ease both;
}

@keyframes sl-rise {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: none; }
}

.sl-banner-tag {
  display: inline-block;
  color: var(--gold);
  font-size: 0.68rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  margin-bottom: 1.1rem;
  padding: 0.38rem 1.4rem;
  border-top: 1px solid rgba(201,151,58,.5);
  border-bottom: 1px solid rgba(201,151,58,.5);
}

.sl-banner-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.8rem, 7.5vw, 6rem);
  font-weight: 300;
  line-height: 1.05;
  color: #fff;
  margin-bottom: 1rem;
  letter-spacing: 0.02em;
}

.sl-banner-title em {
  color: var(--gold-light);
  font-style: italic;
}

.sl-banner-desc {
  color: rgba(242,235,224,.78);
  font-size: clamp(.85rem, 1.4vw, 1rem);
  line-height: 1.9;
  max-width: 560px;
  margin: 0 auto 1.7rem;
}

.sl-banner-bread {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
}

.sl-bread-link {
  font-size: 0.8rem;
  color: rgba(255,255,255,.72);
  transition: color .3s;
  text-decoration: none;
}

.sl-bread-link:hover { color: var(--gold); }
.sl-bread-sep { color: var(--gold); font-size: 0.55rem; }
.sl-bread-cur { font-size: 0.8rem; color: var(--gold); font-weight: 500; }

/* Scroll indicator */
.sl-banner-scroll {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.sl-scroll-line {
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  animation: sl-scroll-anim 1.8s ease infinite;
}

@keyframes sl-scroll-anim {
  0%, 100% { opacity: 1; transform: scaleY(1); transform-origin: top; }
  50% { opacity: 0.4; transform: scaleY(0.5); }
}

.sl-banner-scroll span {
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
}

/* ── CONTENT ─────────────────────────────────────────────── */
.sl-content-sec {
  background: var(--dark);
  padding: 5rem 1.5rem 0;
}

.sl-content-wrap {
  max-width: 1240px;
  margin: 0 auto;
}

.sl-label {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.7rem;
}

.sl-h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.85rem, 3.8vw, 2.9rem);
  font-weight: 300;
  line-height: 1.15;
  color: var(--cream);
  margin-bottom: 1rem;
}

.sl-h2 em {
  color: var(--gold-light);
  font-style: italic;
}

.sl-para {
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.9;
  max-width: 530px;
  margin-bottom: 1rem;
}

/* ── INTRO ───────────────────────────────────────────────── */
.sl-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.sl-intro-tags {
  display: flex;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin-top: 1.4rem;
}

.sl-intro-tags span {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(201,151,58,.08);
  border: 1px solid rgba(201,151,58,.22);
  color: var(--gold);
  font-size: 0.72rem;
  padding: 0.3rem 0.8rem;
  border-radius: 50px;
}

.sl-intro-visual {
  position: relative;
}

.sl-vis-main {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 35px 75px rgba(0,0,0,.55);
}

.sl-vis-main img {
  width: 100%;
  height: 430px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.sl-vis-main:hover img { transform: scale(1.04); }

.sl-vis-stat {
  position: absolute;
  background: var(--dark2);
  border: 1px solid rgba(201,151,58,.3);
  border-radius: 10px;
  padding: 0.7rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  box-shadow: 0 12px 30px rgba(0,0,0,.4);
}

.sl-vs-top { top: 1.5rem; left: -2rem; }
.sl-vs-bot { bottom: 1.5rem; right: -2rem; }

.sl-vis-stat i {
  color: var(--gold);
  font-size: 1.1rem;
}

.sl-vis-stat span {
  font-size: 0.75rem;
  color: var(--cream);
  line-height: 1.4;
}

/* ── TIME-OF-DAY GRID ────────────────────────────────────── */
.sl-tod-head {
  text-align: center;
  padding: 5rem 0 2.5rem;
}

.sl-tod-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.sl-tod-card {
  background: var(--dark2);
  border: 1px solid rgba(201,151,58,.1);
  border-radius: 14px;
  padding: 2rem 1.4rem;
  transition: transform .4s ease, border-color .4s, box-shadow .4s;
  position: relative;
  overflow: hidden;
}

.sl-tod-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(201,151,58,.05) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .4s;
}

.sl-tod-card:hover {
  transform: translateY(-6px);
  border-color: var(--gold);
  box-shadow: 0 22px 55px rgba(0,0,0,.45);
}

.sl-tod-card:hover::before { opacity: 1; }

.sl-tod-icon {
  font-size: 1.6rem;
  color: var(--gold);
  margin-bottom: 0.6rem;
}

.sl-tod-time {
  font-size: 0.68rem;
  color: var(--gold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.8rem;
  border-left: 2px solid var(--gold);
  padding-left: 0.6rem;
}

.sl-tod-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem;
  color: var(--cream);
  margin-bottom: 0.6rem;
  font-weight: 400;
}

.sl-tod-card p {
  font-size: 0.8rem;
  color: var(--text);
  line-height: 1.75;
}

/* ── SPLIT SECTIONS ──────────────────────────────────────── */
.sl-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  padding: 5rem 0;
  border-bottom: 1px solid rgba(201,151,58,.1);
}

.sl-split-rev { direction: rtl; }
.sl-split-rev > * { direction: ltr; }

.sl-split-img {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 30px 65px rgba(0,0,0,.5);
}

.sl-split-img img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.sl-split-img:hover img { transform: scale(1.04); }

.sl-list {
  list-style: none;
  margin-top: 1.4rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.sl-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.5;
}

.sl-list li i {
  color: var(--gold);
  font-size: 0.9rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

/* ── OCCASIONS ───────────────────────────────────────────── */
.sl-occasions-head {
  text-align: center;
  padding: 5rem 0 2.5rem;
}

.sl-occasions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  padding-bottom: 5rem;
}

.sl-occ-item {
  text-align: center;
  padding: 2rem 1.2rem;
  background: var(--green2);
  border-radius: 14px;
  border: 1px solid rgba(201,151,58,.1);
  transition: transform .4s, border-color .4s, box-shadow .4s;
}

.sl-occ-item:hover {
  transform: translateY(-5px);
  border-color: var(--gold);
  box-shadow: 0 18px 45px rgba(0,0,0,.45);
}

.sl-occ-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(201,151,58,.1);
  border: 1px solid rgba(201,151,58,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.2rem;
  transition: background .4s;
}

.sl-occ-item:hover .sl-occ-icon { background: rgba(201,151,58,.2); }

.sl-occ-icon i {
  font-size: 1.3rem;
  color: var(--gold);
}

.sl-occ-item h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  color: var(--cream);
  margin-bottom: 0.5rem;
  font-weight: 400;
}

.sl-occ-item p {
  font-size: 0.8rem;
  color: var(--text);
  line-height: 1.7;
}

/* ── CONCLUSION ──────────────────────────────────────────── */
.sl-conclusion {
  position: relative;
  background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1600&q=80');
  background-size: cover;
  background-position: center 25%;
  background-attachment: fixed;
  padding: 7rem 1.5rem;
  text-align: center;
}

.sl-conclusion-overlay {
  position: absolute;
  inset: 0;
  background: rgba(3,9,18,.88);
}

.sl-conclusion-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}

.sl-conclusion-btns {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
}

.sl-open-hours {
  display: flex;
  justify-content: center;
  gap: 3rem;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: rgba(242,235,224,.6);
}

.sl-open-hours div {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.sl-open-hours i { color: var(--gold); }

/* ── FAQ ─────────────────────────────────────────────────── */
.sl-faq-sec {
  padding: 6rem 1.5rem;
  background: var(--dark2);
}

.sl-faq-wrap {
  max-width: 820px;
  margin: 0 auto;
}

.sl-faq-head {
  text-align: center;
  margin-bottom: 3rem;
}

.sl-faq-item {
  border-bottom: 1px solid rgba(201,151,58,.13);
}

.sl-faq-q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.2rem 0;
  cursor: pointer;
  gap: 1rem;
}

.sl-faq-q span {
  font-size: 0.93rem;
  color: var(--cream);
  font-weight: 500;
  transition: color .3s;
}

.sl-faq-q:hover span { color: var(--gold); }

.sl-faq-ic {
  min-width: 27px;
  height: 27px;
  border-radius: 50%;
  border: 1.5px solid rgba(201,151,58,.38);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: all .4s ease;
  line-height: 1;
}

.sl-faq-item.open .sl-faq-ic {
  background: var(--gold);
  color: var(--dark);
  border-color: var(--gold);
}

.sl-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .42s ease;
}

.sl-faq-a p {
  font-size: 0.85rem;
  color: var(--text);
  line-height: 1.85;
  padding-bottom: 1.2rem;
}

.sl-faq-item.open .sl-faq-a { max-height: 260px; }

/* ── FADE-IN ─────────────────────────────────────────────── */
.sl-fadein {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}

.sl-fadein.sl-vis {
  opacity: 1;
  transform: none;
}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1100px) {
  .sl-tod-grid { grid-template-columns: repeat(2, 1fr); }
  .sl-occasions { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1024px) {
  .sl-intro { grid-template-columns: 1fr; gap: 3.5rem; }
  .sl-split { grid-template-columns: 1fr; gap: 3rem; }
  .sl-split-rev { direction: ltr; }
}

@media (max-width: 768px) {
  .sl-banner { height: 360px; }
  .sl-banner-scroll { display: none; }
  .sl-conclusion { background-attachment: scroll; }
  .sl-vs-top { left: 0.5rem; top: 0.5rem; }
  .sl-vs-bot { right: 0.5rem; bottom: 0.5rem; }
  .sl-open-hours { flex-direction: column; gap: 0.8rem; align-items: center; }
}

@media (max-width: 540px) {
  .sl-banner { height: 300px; }
  .sl-tod-grid { grid-template-columns: 1fr; }
  .sl-occasions { grid-template-columns: 1fr; }
  .sl-split-img img { height: 260px; }
  .sl-vis-main img { height: 280px; }
}
/* ============================================================
   GARDEN OASIS — all classes prefixed  go-
   ============================================================ */

/* ── BANNER ─────────────────────────────────────────────── */
.go-banner{
  position:relative;width:100%;height:480px;
  overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.go-banner-bg{position:absolute;inset:0;}
.go-banner-bg img{
  width:100%;height:100%;object-fit:cover;object-position:center 55%;
  display:block;transform:scale(1.06);
  animation:go-ken 10s ease forwards;
}
@keyframes go-ken{to{transform:scale(1);}}

.go-banner-overlay{
  position:absolute;inset:0;
  background:linear-gradient(150deg,rgba(4,18,8,.88) 0%,rgba(10,30,14,.62) 50%,rgba(18,50,20,.38) 100%);
}

/* Leaf-vein decorative lines */
.go-vein{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.go-vein svg{position:absolute;bottom:0;right:0;opacity:.18;width:420px;}

.go-banner-content{
  position:relative;z-index:2;text-align:center;
  padding:0 20px;max-width:860px;
  animation:go-rise .95s ease both;
}
@keyframes go-rise{from{opacity:0;transform:translateY(35px);}to{opacity:1;transform:none;}}

.go-banner-tag{
  display:inline-block;color:var(--gold);font-size:.68rem;
  letter-spacing:.32em;text-transform:uppercase;margin-bottom:1.1rem;
  padding:.38rem 1.3rem;
  border:1px solid rgba(201,151,58,.38);border-radius:50px;
}
.go-banner-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.6rem,7vw,5.6rem);
  font-weight:300;line-height:1.07;color:#fff;margin-bottom:1rem;
}
.go-banner-title em{color:var(--gold-light);font-style:italic;}
.go-banner-desc{
  color:rgba(242,235,224,.76);font-size:clamp(.85rem,1.4vw,1rem);
  line-height:1.9;max-width:580px;margin:0 auto 1.7rem;
}
.go-banner-bread{display:flex;justify-content:center;align-items:center;gap:.7rem;flex-wrap:wrap;}
.go-bread-link{font-size:.8rem;color:rgba(255,255,255,.72);transition:color .3s;text-decoration:none;}
.go-bread-link:hover{color:var(--gold);}
.go-bread-sep{color:var(--gold);font-size:.55rem;}
.go-bread-cur{font-size:.8rem;color:var(--gold);font-weight:500;}

/* Scroll indicator */
.go-banner-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  z-index:3;display:flex;flex-direction:column;align-items:center;gap:.5rem;
}
.go-scroll-line{
  width:1px;height:40px;
  background:linear-gradient(to bottom,var(--gold),transparent);
  animation:go-scroll-anim 1.8s ease infinite;
}
@keyframes go-scroll-anim{
  0%,100%{opacity:1;transform:scaleY(1);transform-origin:top;}
  50%{opacity:.4;transform:scaleY(.5);}
}
.go-banner-scroll span{font-size:.6rem;letter-spacing:.2em;color:rgba(255,255,255,.5);text-transform:uppercase;}

/* ── SHARED INSIDE PAGE ─────────────────────────────────── */
.go-content-sec{background:var(--dark);padding:5rem 1.5rem 0;}
.go-content-wrap{max-width:1240px;margin:0 auto;}

.go-label{
  display:block;font-size:.7rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;
}
.go-h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.85rem,3.8vw,2.9rem);
  font-weight:300;line-height:1.15;color:var(--cream);margin-bottom:1rem;
}
.go-h2 em{color:var(--gold-light);font-style:italic;}
.go-para{color:var(--text);font-size:.9rem;line-height:1.9;max-width:530px;margin-bottom:1rem;}

/* ── INTRO ──────────────────────────────────────────────── */
.go-intro{
  display:grid;grid-template-columns:1fr 1fr;
  gap:5rem;align-items:center;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.go-intro-tags{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem;}
.go-intro-tags span{
  display:flex;align-items:center;gap:.4rem;
  background:rgba(201,151,58,.08);border:1px solid rgba(201,151,58,.22);
  color:var(--gold);font-size:.72rem;padding:.3rem .8rem;border-radius:50px;
}
.go-intro-visual{position:relative;}
.go-vis-main{border-radius:16px;overflow:hidden;box-shadow:0 35px 75px rgba(0,0,0,.55);}
.go-vis-main img{
  width:100%;height:430px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.go-vis-main:hover img{transform:scale(1.04);}

.go-vis-stat{
  position:absolute;background:var(--dark2);
  border:1px solid rgba(201,151,58,.3);border-radius:10px;
  padding:.7rem 1rem;display:flex;align-items:center;gap:.6rem;
  box-shadow:0 12px 30px rgba(0,0,0,.4);
}
.go-vs-top{top:1.5rem;left:-2rem;}
.go-vs-bot{bottom:1.5rem;right:-2rem;}
.go-vis-stat i{color:var(--gold);font-size:1.1rem;}
.go-vis-stat span{font-size:.75rem;color:var(--cream);line-height:1.4;}

/* ── SEASONS GRID (replaces time-of-day) ───────────────── */
.go-season-head{text-align:center;padding:5rem 0 2.5rem;}
.go-season-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.go-season-card{
  background:var(--dark2);border:1px solid rgba(201,151,58,.1);
  border-radius:14px;padding:2rem 1.4rem;
  transition:transform .4s,border-color .4s,box-shadow .4s;
  position:relative;overflow:hidden;
}
.go-season-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(40,100,55,.12) 0%,transparent 60%);
  opacity:0;transition:opacity .4s;
}
.go-season-card:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 22px 55px rgba(0,0,0,.45);}
.go-season-card:hover::before{opacity:1;}
.go-season-icon{font-size:1.6rem;color:var(--gold);margin-bottom:.6rem;}
.go-season-label{
  font-size:.68rem;color:var(--gold);letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:.8rem;
  border-left:2px solid var(--gold);padding-left:.6rem;
}
.go-season-card h3{
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--cream);margin-bottom:.6rem;font-weight:400;
}
.go-season-card p{font-size:.8rem;color:var(--text);line-height:1.75;}

/* ── SPLIT SECTIONS ─────────────────────────────────────── */
.go-split{
  display:grid;grid-template-columns:1fr 1fr;gap:5rem;
  align-items:center;padding:5rem 0;
  border-bottom:1px solid rgba(201,151,58,.1);
}
.go-split-rev{direction:rtl;}
.go-split-rev>*{direction:ltr;}
.go-split-img{border-radius:16px;overflow:hidden;box-shadow:0 30px 65px rgba(0,0,0,.5);}
.go-split-img img{
  width:100%;height:420px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.go-split-img:hover img{transform:scale(1.04);}
.go-list{list-style:none;margin-top:1.4rem;display:flex;flex-direction:column;gap:.7rem;}
.go-list li{display:flex;align-items:flex-start;gap:.65rem;font-size:.85rem;color:var(--text);line-height:1.5;}
.go-list li i{color:var(--gold);font-size:.9rem;margin-top:.15rem;flex-shrink:0;}

/* ── HIGHLIGHTS (replaces occasions) ────────────────────── */
.go-highlights-head{text-align:center;padding:5rem 0 2.5rem;}
.go-highlights{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding-bottom:5rem;}
.go-hl-item{
  text-align:center;padding:2rem 1.2rem;
  background:var(--green2);border-radius:14px;
  border:1px solid rgba(201,151,58,.1);
  transition:transform .4s,border-color .4s,box-shadow .4s;
}
.go-hl-item:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 18px 45px rgba(0,0,0,.45);}
.go-hl-icon{
  width:60px;height:60px;border-radius:50%;
  background:rgba(201,151,58,.1);border:1px solid rgba(201,151,58,.25);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1.2rem;transition:background .4s;
}
.go-hl-item:hover .go-hl-icon{background:rgba(201,151,58,.2);}
.go-hl-icon i{font-size:1.3rem;color:var(--gold);}
.go-hl-item h4{
  font-family:'Cormorant Garamond',serif;font-size:1.1rem;
  color:var(--cream);margin-bottom:.5rem;font-weight:400;
}
.go-hl-item p{font-size:.8rem;color:var(--text);line-height:1.7;}

/* ── CONCLUSION ─────────────────────────────────────────── */
.go-conclusion{
  position:relative;
  background-image:url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1600&q=80');
  background-size:cover;background-position:center 40%;
  background-attachment:fixed;padding:7rem 1.5rem;text-align:center;
}
.go-conclusion-overlay{position:absolute;inset:0;background:rgba(4,16,7,.86);}
.go-conclusion-content{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.go-conclusion-btns{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem;}
.go-open-hours{
  display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;
  font-size:.82rem;color:rgba(242,235,224,.6);
}
.go-open-hours div{display:flex;align-items:center;gap:.5rem;}
.go-open-hours i{color:var(--gold);}

/* ── FAQ ─────────────────────────────────────────────────── */
.go-faq-sec{padding:6rem 1.5rem;background:var(--dark2);}
.go-faq-wrap{max-width:820px;margin:0 auto;}
.go-faq-head{text-align:center;margin-bottom:3rem;}
.go-faq-item{border-bottom:1px solid rgba(201,151,58,.13);}
.go-faq-q{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.2rem 0;cursor:pointer;gap:1rem;
}
.go-faq-q span{font-size:.93rem;color:var(--cream);font-weight:500;transition:color .3s;}
.go-faq-q:hover span{color:var(--gold);}
.go-faq-ic{
  min-width:27px;height:27px;border-radius:50%;
  border:1.5px solid rgba(201,151,58,.38);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:1.1rem;flex-shrink:0;
  transition:all .4s ease;line-height:1;
}
.go-faq-item.open .go-faq-ic{background:var(--gold);color:var(--dark);border-color:var(--gold);}
.go-faq-a{max-height:0;overflow:hidden;transition:max-height .42s ease;}
.go-faq-a p{font-size:.85rem;color:var(--text);line-height:1.85;padding-bottom:1.2rem;}
.go-faq-item.open .go-faq-a{max-height:260px;}

/* ── FADE-IN ─────────────────────────────────────────────── */
.go-fadein{opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s ease;}
.go-fadein.go-vis{opacity:1;transform:none;}

/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:1100px){
  .go-season-grid{grid-template-columns:repeat(2,1fr);}
  .go-highlights{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:1024px){
  .go-intro{grid-template-columns:1fr;gap:3.5rem;}
  .go-split{grid-template-columns:1fr;gap:3rem;}
  .go-split-rev{direction:ltr;}
}
@media(max-width:768px){
  .go-banner{height:360px;}
  .go-banner-scroll{display:none;}
  .go-conclusion{background-attachment:scroll;}
  .go-vs-top{left:.5rem;top:.5rem;}
  .go-vs-bot{right:.5rem;bottom:.5rem;}
  .go-open-hours{flex-direction:column;gap:.8rem;align-items:center;}
}
@media(max-width:540px){
  .go-banner{height:300px;}
  .go-season-grid{grid-template-columns:1fr;}
  .go-highlights{grid-template-columns:1fr;}
  .go-split-img img{height:260px;}
  .go-vis-main img{height:280px;}
}

/* ============================================================
   BARBEQUE PLACE — all classes prefixed  bp-
   ============================================================ */

/* ── BANNER ─────────────────────────────────────────────── */
.bp-banner{
  position:relative;width:100%;height:480px;
  overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.bp-banner-bg{position:absolute;inset:0;}
.bp-banner-bg img{
  width:100%;height:100%;object-fit:cover;object-position:center 60%;
  display:block;transform:scale(1.06);
  animation:bp-ken 10s ease forwards;
}
@keyframes bp-ken{to{transform:scale(1);}}

.bp-banner-overlay{
  position:absolute;inset:0;
  background:linear-gradient(
    150deg,
    rgba(20,8,4,.92) 0%,
    rgba(35,14,6,.68) 50%,
    rgba(50,20,8,.42) 100%
  );
}

/* Ember / spark particles */
.bp-embers{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.bp-embers span{
  position:absolute;border-radius:50%;
  background:radial-gradient(circle,rgba(255,160,40,.9),rgba(220,80,10,.4));
  animation:bp-ember linear infinite;
}
.bp-embers span:nth-child(1){width:5px;height:5px;left:12%;animation-duration:6s; animation-delay:0s;  top:95%;}
.bp-embers span:nth-child(2){width:3px;height:3px;left:30%;animation-duration:9s; animation-delay:1.5s;top:90%;}
.bp-embers span:nth-child(3){width:6px;height:6px;left:52%;animation-duration:7s; animation-delay:0.8s;top:92%;}
.bp-embers span:nth-child(4){width:4px;height:4px;left:70%;animation-duration:11s;animation-delay:2.2s;top:88%;}
.bp-embers span:nth-child(5){width:3px;height:3px;left:85%;animation-duration:8s; animation-delay:1s;  top:94%;}
.bp-embers span:nth-child(6){width:5px;height:5px;left:42%;animation-duration:10s;animation-delay:3s;  top:96%;}

@keyframes bp-ember{
  0%  {transform:translateY(0) translateX(0) scale(1);opacity:.9;}
  40% {opacity:.6;}
  70% {transform:translateY(-280px) translateX(20px) scale(.6);opacity:.3;}
  100%{transform:translateY(-420px) translateX(-10px) scale(.1);opacity:0;}
}

.bp-banner-content{
  position:relative;z-index:2;text-align:center;
  padding:0 20px;max-width:860px;
  animation:bp-rise .95s ease both;
}
@keyframes bp-rise{from{opacity:0;transform:translateY(35px);}to{opacity:1;transform:none;}}

.bp-banner-tag{
  display:inline-block;color:var(--gold);font-size:.68rem;
  letter-spacing:.32em;text-transform:uppercase;margin-bottom:1.1rem;
  padding:.38rem 1.3rem;
  border:1px solid rgba(201,151,58,.4);border-radius:50px;
}
.bp-banner-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.6rem,7vw,5.6rem);
  font-weight:300;line-height:1.07;color:#fff;margin-bottom:1rem;
}
.bp-banner-title em{color:var(--gold-light);font-style:italic;}
.bp-banner-desc{
  color:rgba(242,235,224,.76);font-size:clamp(.85rem,1.4vw,1rem);
  line-height:1.9;max-width:580px;margin:0 auto 1.7rem;
}
.bp-banner-bread{display:flex;justify-content:center;align-items:center;gap:.7rem;flex-wrap:wrap;}
.bp-bread-link{font-size:.8rem;color:rgba(255,255,255,.72);transition:color .3s;text-decoration:none;}
.bp-bread-link:hover{color:var(--gold);}
.bp-bread-sep{color:var(--gold);font-size:.55rem;}
.bp-bread-cur{font-size:.8rem;color:var(--gold);font-weight:500;}

/* Scroll indicator */
.bp-banner-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  z-index:3;display:flex;flex-direction:column;align-items:center;gap:.5rem;
}
.bp-scroll-line{
  width:1px;height:40px;
  background:linear-gradient(to bottom,var(--gold),transparent);
  animation:bp-scroll-anim 1.8s ease infinite;
}
@keyframes bp-scroll-anim{
  0%,100%{opacity:1;transform:scaleY(1);transform-origin:top;}
  50%{opacity:.4;transform:scaleY(.5);}
}
.bp-banner-scroll span{font-size:.6rem;letter-spacing:.2em;color:rgba(255,255,255,.5);text-transform:uppercase;}

/* ── SHARED INSIDE PAGE ─────────────────────────────────── */
.bp-content-sec{background:var(--dark);padding:5rem 1.5rem 0;}
.bp-content-wrap{max-width:1240px;margin:0 auto;}

.bp-label{
  display:block;font-size:.7rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;
}
.bp-h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.85rem,3.8vw,2.9rem);
  font-weight:300;line-height:1.15;color:var(--cream);margin-bottom:1rem;
}
.bp-h2 em{color:var(--gold-light);font-style:italic;}
.bp-para{color:var(--text);font-size:.9rem;line-height:1.9;max-width:530px;margin-bottom:1rem;}

/* ── INTRO ──────────────────────────────────────────────── */
.bp-intro{
  display:grid;grid-template-columns:1fr 1fr;
  gap:5rem;align-items:center;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.bp-intro-tags{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem;}
.bp-intro-tags span{
  display:flex;align-items:center;gap:.4rem;
  background:rgba(201,151,58,.08);border:1px solid rgba(201,151,58,.22);
  color:var(--gold);font-size:.72rem;padding:.3rem .8rem;border-radius:50px;
}
.bp-intro-visual{position:relative;}
.bp-vis-main{border-radius:16px;overflow:hidden;box-shadow:0 35px 75px rgba(0,0,0,.6);}
.bp-vis-main img{
  width:100%;height:430px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.bp-vis-main:hover img{transform:scale(1.04);}
.bp-vis-stat{
  position:absolute;background:var(--dark2);
  border:1px solid rgba(201,151,58,.3);border-radius:10px;
  padding:.7rem 1rem;display:flex;align-items:center;gap:.6rem;
  box-shadow:0 12px 30px rgba(0,0,0,.45);
}
.bp-vs-top{top:1.5rem;left:-2rem;}
.bp-vs-bot{bottom:1.5rem;right:-2rem;}
.bp-vis-stat i{color:var(--gold);font-size:1.1rem;}
.bp-vis-stat span{font-size:.75rem;color:var(--cream);line-height:1.4;}

/* ── EXPERIENCE GRID (grill sessions) ───────────────────── */
.bp-exp-head{text-align:center;padding:5rem 0 2.5rem;}
.bp-exp-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.bp-exp-card{
  background:var(--dark2);border:1px solid rgba(201,151,58,.1);
  border-radius:14px;padding:2rem 1.4rem;
  transition:transform .4s,border-color .4s,box-shadow .4s;
  position:relative;overflow:hidden;
}
.bp-exp-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(180,70,10,.1) 0%,transparent 60%);
  opacity:0;transition:opacity .4s;
}
.bp-exp-card:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 22px 55px rgba(0,0,0,.48);}
.bp-exp-card:hover::before{opacity:1;}
.bp-exp-icon{font-size:1.6rem;color:var(--gold);margin-bottom:.6rem;}
.bp-exp-label{
  font-size:.68rem;color:var(--gold);letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:.8rem;
  border-left:2px solid var(--gold);padding-left:.6rem;
}
.bp-exp-card h3{
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--cream);margin-bottom:.6rem;font-weight:400;
}
.bp-exp-card p{font-size:.8rem;color:var(--text);line-height:1.75;}

/* ── SPLIT SECTIONS ─────────────────────────────────────── */
.bp-split{
  display:grid;grid-template-columns:1fr 1fr;gap:5rem;
  align-items:center;padding:5rem 0;
  border-bottom:1px solid rgba(201,151,58,.1);
}
.bp-split-rev{direction:rtl;}
.bp-split-rev>*{direction:ltr;}
.bp-split-img{border-radius:16px;overflow:hidden;box-shadow:0 30px 65px rgba(0,0,0,.5);}
.bp-split-img img{
  width:100%;height:420px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.bp-split-img:hover img{transform:scale(1.04);}
.bp-list{list-style:none;margin-top:1.4rem;display:flex;flex-direction:column;gap:.7rem;}
.bp-list li{display:flex;align-items:flex-start;gap:.65rem;font-size:.85rem;color:var(--text);line-height:1.5;}
.bp-list li i{color:var(--gold);font-size:.9rem;margin-top:.15rem;flex-shrink:0;}

/* ── HIGHLIGHTS ─────────────────────────────────────────── */
.bp-highlights-head{text-align:center;padding:5rem 0 2.5rem;}
.bp-highlights{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding-bottom:5rem;}
.bp-hl-item{
  text-align:center;padding:2rem 1.2rem;
  background:var(--green2);border-radius:14px;
  border:1px solid rgba(201,151,58,.1);
  transition:transform .4s,border-color .4s,box-shadow .4s;
}
.bp-hl-item:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 18px 45px rgba(0,0,0,.45);}
.bp-hl-icon{
  width:60px;height:60px;border-radius:50%;
  background:rgba(201,151,58,.1);border:1px solid rgba(201,151,58,.25);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1.2rem;transition:background .4s;
}
.bp-hl-item:hover .bp-hl-icon{background:rgba(201,151,58,.2);}
.bp-hl-icon i{font-size:1.3rem;color:var(--gold);}
.bp-hl-item h4{
  font-family:'Cormorant Garamond',serif;font-size:1.1rem;
  color:var(--cream);margin-bottom:.5rem;font-weight:400;
}
.bp-hl-item p{font-size:.8rem;color:var(--text);line-height:1.7;}

/* ── CONCLUSION ─────────────────────────────────────────── */
.bp-conclusion{
  position:relative;
  background-image:url('https://images.unsplash.com/photo-1555939594-58d7cb561ad1?w=1600&q=80');
  background-size:cover;background-position:center 50%;
  background-attachment:fixed;padding:7rem 1.5rem;text-align:center;
}
.bp-conclusion-overlay{position:absolute;inset:0;background:rgba(12,5,2,.88);}
.bp-conclusion-content{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.bp-conclusion-btns{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem;}
.bp-open-hours{
  display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;
  font-size:.82rem;color:rgba(242,235,224,.6);
}
.bp-open-hours div{display:flex;align-items:center;gap:.5rem;}
.bp-open-hours i{color:var(--gold);}

/* ── FAQ ─────────────────────────────────────────────────── */
.bp-faq-sec{padding:6rem 1.5rem;background:var(--dark2);}
.bp-faq-wrap{max-width:820px;margin:0 auto;}
.bp-faq-head{text-align:center;margin-bottom:3rem;}
.bp-faq-item{border-bottom:1px solid rgba(201,151,58,.13);}
.bp-faq-q{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.2rem 0;cursor:pointer;gap:1rem;
}
.bp-faq-q span{font-size:.93rem;color:var(--cream);font-weight:500;transition:color .3s;}
.bp-faq-q:hover span{color:var(--gold);}
.bp-faq-ic{
  min-width:27px;height:27px;border-radius:50%;
  border:1.5px solid rgba(201,151,58,.38);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:1.1rem;flex-shrink:0;
  transition:all .4s ease;line-height:1;
}
.bp-faq-item.open .bp-faq-ic{background:var(--gold);color:var(--dark);border-color:var(--gold);}
.bp-faq-a{max-height:0;overflow:hidden;transition:max-height .42s ease;}
.bp-faq-a p{font-size:.85rem;color:var(--text);line-height:1.85;padding-bottom:1.2rem;}
.bp-faq-item.open .bp-faq-a{max-height:260px;}

/* ── FADE-IN ─────────────────────────────────────────────── */
.bp-fadein{opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s ease;}
.bp-fadein.bp-vis{opacity:1;transform:none;}

/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:1100px){
  .bp-exp-grid{grid-template-columns:repeat(2,1fr);}
  .bp-highlights{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:1024px){
  .bp-intro{grid-template-columns:1fr;gap:3.5rem;}
  .bp-split{grid-template-columns:1fr;gap:3rem;}
  .bp-split-rev{direction:ltr;}
}
@media(max-width:768px){
  .bp-banner{height:360px;}
  .bp-banner-scroll{display:none;}
  .bp-conclusion{background-attachment:scroll;}
  .bp-vs-top{left:.5rem;top:.5rem;}
  .bp-vs-bot{right:.5rem;bottom:.5rem;}
  .bp-open-hours{flex-direction:column;gap:.8rem;align-items:center;}
}
@media(max-width:540px){
  .bp-banner{height:300px;}
  .bp-exp-grid{grid-template-columns:1fr;}
  .bp-highlights{grid-template-columns:1fr;}
  .bp-split-img img{height:260px;}
  .bp-vis-main img{height:280px;}
}

/* ============================================================
   GOURMET DELIGHTS — all classes prefixed  gd-
   ============================================================ */

/* ── BANNER ─────────────────────────────────────────────── */
.gd-banner{
  position:relative;width:100%;height:480px;
  overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.gd-banner-bg{position:absolute;inset:0;}
.gd-banner-bg img{
  width:100%;height:100%;object-fit:cover;object-position:center 50%;
  display:block;transform:scale(1.06);
  animation:gd-ken 10s ease forwards;
}
@keyframes gd-ken{to{transform:scale(1);}}

.gd-banner-overlay{
  position:absolute;inset:0;
  background:linear-gradient(
    150deg,
    rgba(12,6,2,.92) 0%,
    rgba(25,12,4,.68) 50%,
    rgba(38,18,6,.42) 100%
  );
}

/* Steam / shimmer particles */
.gd-steam{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.gd-steam span{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.12);
  filter:blur(6px);
  animation:gd-rise-steam ease-in-out infinite;
}
.gd-steam span:nth-child(1){width:18px;height:18px;left:20%; animation-duration:7s; animation-delay:0s;  bottom:10%;}
.gd-steam span:nth-child(2){width:12px;height:12px;left:40%; animation-duration:9s; animation-delay:1.8s;bottom:8%;}
.gd-steam span:nth-child(3){width:22px;height:22px;left:60%; animation-duration:8s; animation-delay:0.6s;bottom:12%;}
.gd-steam span:nth-child(4){width:10px;height:10px;left:75%; animation-duration:11s;animation-delay:2.5s;bottom:6%;}
.gd-steam span:nth-child(5){width:16px;height:16px;left:88%; animation-duration:6s; animation-delay:1.2s;bottom:10%;}

@keyframes gd-rise-steam{
  0%  {transform:translateY(0) scale(1);opacity:.35;}
  50% {opacity:.15;}
  100%{transform:translateY(-320px) scale(2.5);opacity:0;}
}

.gd-banner-content{
  position:relative;z-index:2;text-align:center;
  padding:0 20px;max-width:860px;
  animation:gd-rise .95s ease both;
}
@keyframes gd-rise{from{opacity:0;transform:translateY(35px);}to{opacity:1;transform:none;}}

.gd-banner-tag{
  display:inline-block;color:var(--gold);font-size:.68rem;
  letter-spacing:.32em;text-transform:uppercase;margin-bottom:1.1rem;
  padding:.38rem 1.3rem;
  border:1px solid rgba(201,151,58,.4);border-radius:50px;
}
.gd-banner-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.6rem,7vw,5.6rem);
  font-weight:300;line-height:1.07;color:#fff;margin-bottom:1rem;
}
.gd-banner-title em{color:var(--gold-light);font-style:italic;}
.gd-banner-desc{
  color:rgba(242,235,224,.76);font-size:clamp(.85rem,1.4vw,1rem);
  line-height:1.9;max-width:600px;margin:0 auto 1.7rem;
}
.gd-banner-bread{display:flex;justify-content:center;align-items:center;gap:.7rem;flex-wrap:wrap;}
.gd-bread-link{font-size:.8rem;color:rgba(255,255,255,.72);transition:color .3s;text-decoration:none;}
.gd-bread-link:hover{color:var(--gold);}
.gd-bread-sep{color:var(--gold);font-size:.55rem;}
.gd-bread-cur{font-size:.8rem;color:var(--gold);font-weight:500;}

/* Scroll indicator */
.gd-banner-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  z-index:3;display:flex;flex-direction:column;align-items:center;gap:.5rem;
}
.gd-scroll-line{
  width:1px;height:40px;
  background:linear-gradient(to bottom,var(--gold),transparent);
  animation:gd-scroll-anim 1.8s ease infinite;
}
@keyframes gd-scroll-anim{
  0%,100%{opacity:1;transform:scaleY(1);transform-origin:top;}
  50%{opacity:.4;transform:scaleY(.5);}
}
.gd-banner-scroll span{font-size:.6rem;letter-spacing:.2em;color:rgba(255,255,255,.5);text-transform:uppercase;}

/* ── SHARED INSIDE PAGE ─────────────────────────────────── */
.gd-content-sec{background:var(--dark);padding:5rem 1.5rem 0;}
.gd-content-wrap{max-width:1240px;margin:0 auto;}

.gd-label{
  display:block;font-size:.7rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;
}
.gd-h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.85rem,3.8vw,2.9rem);
  font-weight:300;line-height:1.15;color:var(--cream);margin-bottom:1rem;
}
.gd-h2 em{color:var(--gold-light);font-style:italic;}
.gd-para{color:var(--text);font-size:.9rem;line-height:1.9;max-width:530px;margin-bottom:1rem;}

/* ── INTRO ──────────────────────────────────────────────── */
.gd-intro{
  display:grid;grid-template-columns:1fr 1fr;
  gap:5rem;align-items:center;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.gd-intro-tags{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem;}
.gd-intro-tags span{
  display:flex;align-items:center;gap:.4rem;
  background:rgba(201,151,58,.08);border:1px solid rgba(201,151,58,.22);
  color:var(--gold);font-size:.72rem;padding:.3rem .8rem;border-radius:50px;
}
.gd-intro-visual{position:relative;}
.gd-vis-main{border-radius:16px;overflow:hidden;box-shadow:0 35px 75px rgba(0,0,0,.6);}
.gd-vis-main img{
  width:100%;height:430px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.gd-vis-main:hover img{transform:scale(1.04);}
.gd-vis-stat{
  position:absolute;background:var(--dark2);
  border:1px solid rgba(201,151,58,.3);border-radius:10px;
  padding:.7rem 1rem;display:flex;align-items:center;gap:.6rem;
  box-shadow:0 12px 30px rgba(0,0,0,.45);
}
.gd-vs-top{top:1.5rem;left:-2rem;}
.gd-vs-bot{bottom:1.5rem;right:-2rem;}
.gd-vis-stat i{color:var(--gold);font-size:1.1rem;}
.gd-vis-stat span{font-size:.75rem;color:var(--cream);line-height:1.4;}

/* ── DINING JOURNEY GRID (meal-by-meal) ─────────────────── */
.gd-journey-head{text-align:center;padding:5rem 0 2.5rem;}
.gd-journey-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;
  padding-bottom:5rem;border-bottom:1px solid rgba(201,151,58,.1);
}
.gd-journey-card{
  background:var(--dark2);border:1px solid rgba(201,151,58,.1);
  border-radius:14px;padding:2rem 1.4rem;
  transition:transform .4s,border-color .4s,box-shadow .4s;
  position:relative;overflow:hidden;
}
.gd-journey-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(180,120,10,.1) 0%,transparent 60%);
  opacity:0;transition:opacity .4s;
}
.gd-journey-card:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 22px 55px rgba(0,0,0,.48);}
.gd-journey-card:hover::before{opacity:1;}
.gd-journey-icon{font-size:1.6rem;color:var(--gold);margin-bottom:.6rem;}
.gd-journey-label{
  font-size:.68rem;color:var(--gold);letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:.8rem;
  border-left:2px solid var(--gold);padding-left:.6rem;
}
.gd-journey-card h3{
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--cream);margin-bottom:.6rem;font-weight:400;
}
.gd-journey-card p{font-size:.8rem;color:var(--text);line-height:1.75;}

/* ── SPLIT SECTIONS ─────────────────────────────────────── */
.gd-split{
  display:grid;grid-template-columns:1fr 1fr;gap:5rem;
  align-items:center;padding:5rem 0;
  border-bottom:1px solid rgba(201,151,58,.1);
}
.gd-split-rev{direction:rtl;}
.gd-split-rev>*{direction:ltr;}
.gd-split-img{border-radius:16px;overflow:hidden;box-shadow:0 30px 65px rgba(0,0,0,.5);}
.gd-split-img img{
  width:100%;height:420px;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.gd-split-img:hover img{transform:scale(1.04);}
.gd-list{list-style:none;margin-top:1.4rem;display:flex;flex-direction:column;gap:.7rem;}
.gd-list li{display:flex;align-items:flex-start;gap:.65rem;font-size:.85rem;color:var(--text);line-height:1.5;}
.gd-list li i{color:var(--gold);font-size:.9rem;margin-top:.15rem;flex-shrink:0;}

/* ── HIGHLIGHTS ─────────────────────────────────────────── */
.gd-highlights-head{text-align:center;padding:5rem 0 2.5rem;}
.gd-highlights{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding-bottom:5rem;}
.gd-hl-item{
  text-align:center;padding:2rem 1.2rem;
  background:var(--green2);border-radius:14px;
  border:1px solid rgba(201,151,58,.1);
  transition:transform .4s,border-color .4s,box-shadow .4s;
}
.gd-hl-item:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 18px 45px rgba(0,0,0,.45);}
.gd-hl-icon{
  width:60px;height:60px;border-radius:50%;
  background:rgba(201,151,58,.1);border:1px solid rgba(201,151,58,.25);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 1.2rem;transition:background .4s;
}
.gd-hl-item:hover .gd-hl-icon{background:rgba(201,151,58,.2);}
.gd-hl-icon i{font-size:1.3rem;color:var(--gold);}
.gd-hl-item h4{
  font-family:'Cormorant Garamond',serif;font-size:1.1rem;
  color:var(--cream);margin-bottom:.5rem;font-weight:400;
}
.gd-hl-item p{font-size:.8rem;color:var(--text);line-height:1.7;}

/* ── CONCLUSION ─────────────────────────────────────────── */
.gd-conclusion{
  position:relative;
  background-image:url('https://images.unsplash.com/photo-1414235077428-338989a2e8c0?w=1600&q=80');
  background-size:cover;background-position:center 45%;
  background-attachment:fixed;padding:7rem 1.5rem;text-align:center;
}
.gd-conclusion-overlay{position:absolute;inset:0;background:rgba(10,5,2,.88);}
.gd-conclusion-content{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.gd-conclusion-btns{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem;}
.gd-open-hours{
  display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;
  font-size:.82rem;color:rgba(242,235,224,.6);
}
.gd-open-hours div{display:flex;align-items:center;gap:.5rem;}
.gd-open-hours i{color:var(--gold);}

/* ── FAQ ─────────────────────────────────────────────────── */
.gd-faq-sec{padding:6rem 1.5rem;background:var(--dark2);}
.gd-faq-wrap{max-width:820px;margin:0 auto;}
.gd-faq-head{text-align:center;margin-bottom:3rem;}
.gd-faq-item{border-bottom:1px solid rgba(201,151,58,.13);}
.gd-faq-q{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.2rem 0;cursor:pointer;gap:1rem;
}
.gd-faq-q span{font-size:.93rem;color:var(--cream);font-weight:500;transition:color .3s;}
.gd-faq-q:hover span{color:var(--gold);}
.gd-faq-ic{
  min-width:27px;height:27px;border-radius:50%;
  border:1.5px solid rgba(201,151,58,.38);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-size:1.1rem;flex-shrink:0;
  transition:all .4s ease;line-height:1;
}
.gd-faq-item.open .gd-faq-ic{background:var(--gold);color:var(--dark);border-color:var(--gold);}
.gd-faq-a{max-height:0;overflow:hidden;transition:max-height .42s ease;}
.gd-faq-a p{font-size:.85rem;color:var(--text);line-height:1.85;padding-bottom:1.2rem;}
.gd-faq-item.open .gd-faq-a{max-height:260px;}

/* ── FADE-IN ─────────────────────────────────────────────── */
.gd-fadein{opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s ease;}
.gd-fadein.gd-vis{opacity:1;transform:none;}

/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:1100px){
  .gd-journey-grid{grid-template-columns:repeat(2,1fr);}
  .gd-highlights{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:1024px){
  .gd-intro{grid-template-columns:1fr;gap:3.5rem;}
  .gd-split{grid-template-columns:1fr;gap:3rem;}
  .gd-split-rev{direction:ltr;}
}
@media(max-width:768px){
  .gd-banner{height:360px;}
  .gd-banner-scroll{display:none;}
  .gd-conclusion{background-attachment:scroll;}
  .gd-vs-top{left:.5rem;top:.5rem;}
  .gd-vs-bot{right:.5rem;bottom:.5rem;}
  .gd-open-hours{flex-direction:column;gap:.8rem;align-items:center;}
}
@media(max-width:540px){
  .gd-banner{height:300px;}
  .gd-journey-grid{grid-template-columns:1fr;}
  .gd-highlights{grid-template-columns:1fr;}
  .gd-split-img img{height:260px;}
  .gd-vis-main img{height:280px;}
}
    /* ============================================================
       GALLERY ARCHITECTURE — ISOLATED PAGE STYLES
       All custom declarations are strictly prefixed with 'gal-'
       ============================================================ */

    .gal-body-wrapper {
      overflow-x: hidden;
      background: var(--dark);
    }

    /* ── BANNER HERO LAYOUT ── */
    .gal-hero-banner {
      position: relative;
      width: 100%;
      height: 450px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .gal-hero-bg-media {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .gal-hero-bg-media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 50%;
      display: block;
      transform: scale(1.05);
      animation: galScaleMotion 9s cubic-bezier(.4,0,.2,1) forwards;
    }

    @keyframes galScaleMotion {
      to { transform: scale(1); }
    }

    .gal-hero-shading-overlay {
      position: absolute;
      inset: 0;
      z-index: 2;
      background: linear-gradient(
        135deg,
        rgba(11, 23, 16, 0.94) 0%,
        rgba(17, 30, 22, 0.75) 60%,
        rgba(28, 56, 40, 0.45) 100%
      );
    }

    .gal-hero-container {
      position: relative;
      z-index: 3;
      text-align: center;
      padding: 0 24px;
      max-width: 900px;
      animation: galFadeUpMotion 0.85s cubic-bezier(.4,0,.2,1) both;
    }

    @keyframes galFadeUpMotion {
      from { opacity: 0; transform: translateY(35px); }
      to   { opacity: 1; transform: none; }
    }

    .gal-hero-badge-tag {
      display: inline-block;
      color: var(--gold);
      font-size: 0.72rem;
      letter-spacing: 0.32em;
      text-transform: uppercase;
      margin-bottom: 1.2rem;
      border: 1px solid rgba(201, 151, 58, 0.4);
      padding: 0.4rem 1.25rem;
      border-radius: 40px;
    }

    .gal-hero-title-main {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(2.5rem, 6.5vw, 5.2rem);
      font-weight: 300;
      line-height: 1.1;
      color: var(--cream);
      margin-bottom: 1.2rem;
    }

    .gal-hero-title-main em {
      color: var(--gold-light);
      font-style: italic;
    }

    .gal-hero-paragraph-sub {
      color: var(--text);
      font-size: clamp(0.9rem, 1.6vw, 1.05rem);
      line-height: 1.85;
      max-width: 620px;
      margin: 0 auto 2rem;
    }

    .gal-hero-breadcrumbs-nav {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0.75rem;
      flex-wrap: wrap;
    }

    .gal-breadcrumb-anchor {
      font-size: 0.82rem;
      color: rgba(242, 235, 224, 0.8);
      transition: color 0.3s ease;
    }

    .gal-breadcrumb-anchor:hover {
      color: var(--gold);
    }

    .gal-breadcrumb-pointer {
      color: var(--gold);
      font-size: 0.6rem;
    }

    .gal-breadcrumb-current-page {
      font-size: 0.82rem;
      color: var(--gold);
      font-weight: 500;
    }

    /* ── MULTI-COLUMN INTERACTIVE MEDIA MATRIX (3xN Grid) ── */
    .gal-display-grid-sec {
      padding: 6rem 1.5rem;
      background: var(--dark);
    }

    .gal-maxbounding-box {
      max-width: 1200px;
      margin: 0 auto;
    }

    .gal-matrix-container {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2rem;
    }

    .gal-media-node {
      position: relative;
      border-radius: 14px;
      overflow: hidden;
      aspect-ratio: 4 / 3;
      border: 1px solid rgba(201, 151, 58, 0.12);
      background: var(--dark2);
      cursor: pointer;
      box-shadow: 0 15px 35px rgba(0,0,0,0.4);
      transition: transform 0.45s cubic-bezier(.4,0,.2,1), border-color 0.45s ease, box-shadow 0.45s ease;
    }

    .gal-media-node:hover {
      transform: translateY(-8px);
      border-color: var(--gold);
      box-shadow: 0 25px 55px rgba(201, 151, 58, 0.15), 0 0 0 1px var(--gold);
    }

    .gal-node-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.75s ease;
    }

    .gal-media-node:hover .gal-node-img {
      transform: scale(1.06);
    }

    /* Hover Interaction Overlay Frame */
    .gal-node-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(11, 23, 16, 0.9) 0%, rgba(11, 23, 16, 0.2) 100%);
      opacity: 0;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 1.5rem;
      z-index: 2;
      transition: opacity 0.4s ease;
    }

    .gal-media-node:hover .gal-node-overlay {
      opacity: 1;
    }

    .gal-overlay-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) scale(0.8);
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background: var(--gold);
      color: var(--dark);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.2rem;
      box-shadow: 0 10px 25px rgba(0,0,0,0.3);
      transition: transform 0.4s cubic-bezier(.175, .885, .32, 1.275);
    }

    .gal-media-node:hover .gal-overlay-icon {
      transform: translate(-50%, -50%) scale(1);
    }

    .gal-node-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.35rem;
      color: var(--cream);
      font-weight: 400;
      transform: translateY(15px);
      transition: transform 0.45s cubic-bezier(.4,0,.2,1);
    }

    .gal-media-node:hover .gal-node-title {
      transform: translateY(0);
    }

    .gal-node-tag {
      font-size: 0.68rem;
      color: var(--gold);
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-top: 0.25rem;
    }

    /* ── IMMERSIVE LIGHTBOX MODAL PREVIEW LAYOUT ── */
    .gal-lightbox-modal {
      position: fixed;
      inset: 0;
      z-index: 10000;
      background: rgba(4, 10, 6, 0.98);
      backdrop-filter: blur(12px);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.4s ease;
    }

    .gal-lightbox-modal.gal-modal-active {
      opacity: 1;
      pointer-events: auto;
    }

    /* Stage Area for Image Render */
    .gal-lightbox-stage {
      position: relative;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 60px;
    }

    .gal-viewport-container {
      max-width: 85vw;
      max-height: 75vh;
      overflow: hidden;
      border-radius: 8px;
      box-shadow: 0 30px 90px rgba(0,0,0,0.8);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .gal-preview-render-img {
      max-width: 100%;
      max-height: 75vh;
      object-fit: contain;
      transform: scale(1);
      transition: transform 0.3s cubic-bezier(.4,0,.2,1);
      user-select: none;
      display: block;
    }

    /* Control Toolbar Row Layout */
    .gal-lightbox-toolbar {
      position: absolute;
      top: 1.5rem;
      right: 1.5rem;
      display: flex;
      align-items: center;
      gap: 1rem;
      z-index: 10010;
    }

    .gal-tool-btn {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.05);
      border: 1px solid rgba(255, 255, 255, 0.1);
      color: #fff;
      font-size: 1rem;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .gal-tool-btn:hover {
      background: var(--gold);
      color: var(--dark);
      border-color: var(--gold);
    }

    /* Sync Circular Navigation Arrows */
    .gal-nav-arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 55px;
      height: 55px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.03);
      border: 1px solid rgba(255, 255, 255, 0.1);
      color: #fff;
      font-size: 1.1rem;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10005;
      transition: all 0.3s ease;
    }

    .gal-nav-arrow:hover {
      background: var(--gold);
      color: var(--dark);
      border-color: var(--gold);
      box-shadow: 0 0 25px rgba(201,151,58,0.4);
    }

    .gal-arrow-left { left: 2rem; }
    .gal-arrow-right { right: 2rem; }

    /* Floating Image Index Caption */
    .gal-lightbox-caption {
      position: absolute;
      bottom: 2rem;
      left: 50%;
      transform: translateX(-50%);
      background: rgba(0,0,0,0.6);
      padding: 0.5rem 1.5rem;
      border-radius: 30px;
      border: 1px solid rgba(255,255,255,0.1);
      font-size: 0.85rem;
      color: var(--cream);
      letter-spacing: 0.05em;
      z-index: 10005;
      text-align: center;
    }

    /* ── BREAKPOINTS RESPONSIVE MATRIX ── */
    @media (max-width: 1024px) {
      .gal-matrix-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
      }
    }

    @media (max-width: 768px) {
      .gal-hero-banner {
        height: 360px;
      }
      .gal-display-grid-sec {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
      }
      .gal-nav-arrow {
        width: 44px;
        height: 44px;
        font-size: 0.95rem;
      }
      .gal-arrow-left { left: 1rem; }
      .gal-arrow-right { right: 1rem; }
    }

    @media (max-width: 560px) {
      .gal-matrix-container {
        grid-template-columns: 1fr;
        gap: 1.4rem;
      }
      .gal-lightbox-stage {
        padding: 40px 15px;
      }
      .gal-viewport-container {
        max-width: 95vw;
      }
    }
  
    /* ============================================================
       CONTACT US ARCHITECTURE — ISOLATED PAGE STYLES
       All custom layout elements are strictly prefixed with 'con-'
       ============================================================ */

    .con-body-wrapper {
      overflow-x: hidden;
      background: var(--dark);
    }

    /* ── BANNER HERO LAYOUT ── */
    .con-hero-banner {
      position: relative;
      width: 100%;
      height: 450px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .con-hero-bg-media {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .con-hero-bg-media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 50%;
      display: block;
      transform: scale(1.05);
      animation: conScaleMotion 9s cubic-bezier(.4,0,.2,1) forwards;
    }

    @keyframes conScaleMotion {
      to { transform: scale(1); }
    }

    .con-hero-shading-overlay {
      position: absolute;
      inset: 0;
      z-index: 2;
      background: linear-gradient(
        135deg,
        rgba(11, 23, 16, 0.94) 0%,
        rgba(17, 30, 22, 0.75) 60%,
        rgba(28, 56, 40, 0.45) 100%
      );
    }

    .con-hero-container {
      position: relative;
      z-index: 3;
      text-align: center;
      padding: 0 24px;
      max-width: 900px;
      animation: conFadeUpMotion 0.85s cubic-bezier(.4,0,.2,1) both;
    }

    @keyframes conFadeUpMotion {
      from { opacity: 0; transform: translateY(35px); }
      to   { opacity: 1; transform: none; }
    }

    .con-hero-badge-tag {
      display: inline-block;
      color: var(--gold);
      font-size: 0.72rem;
      letter-spacing: 0.32em;
      text-transform: uppercase;
      margin-bottom: 1.2rem;
      border: 1px solid rgba(201, 151, 58, 0.4);
      padding: 0.4rem 1.25rem;
      border-radius: 40px;
    }

    .con-hero-title-main {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(2.5rem, 6.5vw, 5.2rem);
      font-weight: 300;
      line-height: 1.1;
      color: var(--cream);
      margin-bottom: 1.2rem;
    }

    .con-hero-title-main em {
      color: var(--gold-light);
      font-style: italic;
    }

    .con-hero-paragraph-sub {
      color: var(--text);
      font-size: clamp(0.9rem, 1.6vw, 1.05rem);
      line-height: 1.85;
      max-width: 620px;
      margin: 0 auto 2rem;
    }

    .con-hero-breadcrumbs-nav {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0.75rem;
      flex-wrap: wrap;
    }

    .con-breadcrumb-anchor {
      font-size: 0.82rem;
      color: rgba(242, 235, 224, 0.8);
      transition: color 0.3s ease;
    }

    .con-breadcrumb-anchor:hover {
      color: var(--gold);
    }

    .con-breadcrumb-pointer {
      color: var(--gold);
      font-size: 0.6rem;
    }

    .con-breadcrumb-current-page {
      font-size: 0.82rem;
      color: var(--gold);
      font-weight: 500;
    }

    /* ── MAIN SPLIT WRAPPER SECTIONS ── */
    .con-split-layout-sec {
      padding: 6rem 1.5rem;
      background: var(--dark);
    }

    .con-maxbounding-box {
      max-width: 1200px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 5rem;
      align-items: start;
    }

    .con-mini-label {
      display: block;
      font-size: 0.72rem;
      letter-spacing: 0.26em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 0.8rem;
    }

    .con-section-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.9rem, 4vw, 3_0rem);
      font-weight: 300;
      line-height: 1.15;
      color: var(--cream);
      margin-bottom: 1.2rem;
    }

    .con-section-title em {
      color: var(--gold-light);
      font-style: italic;
    }

    .con-lead-text {
      color: var(--text);
      font-size: 0.92rem;
      line-height: 1.8;
      margin-bottom: 2.5rem;
    }

    /* Details Panel Cards */
    .con-info-blocks-stack {
      display: flex;
      flex-direction: column;
      gap: 2rem;
    }

    .con-detail-node {
      display: flex;
      align-items: flex-start;
      gap: 1.2rem;
      background: var(--dark2);
      border: 1px solid rgba(201, 151, 58, 0.08);
      padding: 1.6rem;
      border-radius: 12px;
      transition: border-color 0.35s ease;
    }

    .con-detail-node:hover {
      border-color: rgba(201, 151, 58, 0.3);
    }

    .con-icon-container {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: rgba(201, 151, 58, 0.08);
      border: 1px solid rgba(201, 151, 58, 0.2);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gold);
      font-size: 1.1rem;
      flex-shrink: 0;
    }

    .con-text-block-layout h4 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.25rem;
      color: var(--cream);
      margin-bottom: 0.35rem;
      font-weight: 500;
      letter-spacing: 0.02em;
    }

    .con-text-block-layout p,
    .con-text-block-layout a {
      font-size: 0.88rem;
      color: var(--text);
      line-height: 1.6;
      transition: color 0.3s ease;
    }

    .con-text-block-layout a:hover {
      color: var(--gold);
    }

    /* Form Card Container Elements */
    .con-form-card-panel {
      background: var(--dark2);
      border: 1px solid rgba(201, 151, 58, 0.12);
      border-radius: 16px;
      padding: 3rem 2.5rem;
      box-shadow: 0 30px 65px rgba(0, 0, 0, 0.5);
    }

    .con-form-card-panel h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.65rem;
      color: var(--cream);
      margin-bottom: 1.5rem;
      font-weight: 400;
    }

    .con-input-group-field {
      display: flex;
      flex-direction: column;
      gap: 0.45rem;
      margin-bottom: 1.4rem;
    }

    .con-input-group-field label {
      font-size: 0.7rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gold);
      font-weight: 500;
    }

    .con-input-group-field input,
    .con-input-group-field select,
    .con-input-group-field textarea {
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid rgba(201, 151, 58, 0.2);
      border-radius: var(--r);
      padding: 0.75rem 1.1rem;
      color: var(--text);
      font-family: 'Jost', sans-serif;
      font-size: 0.86rem;
      width: 100%;
      outline: none;
      transition: border-color 0.3s ease, background-color 0.3s ease;
    }

    .con-input-group-field input:focus,
    .con-input-group-field select:focus,
    .con-input-group-field textarea:focus {
      border-color: var(--gold);
      background: rgba(255, 255, 255, 0.06);
    }

    .con-input-group-field textarea {
      resize: vertical;
      min-height: 110px;
    }

    .con-form-row-2col {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1.2rem;
    }

    /* ── IMMERSIVE MAP AREA ── */
    .con-map-embed-sec {
      width: 100%;
      height: 480px;
      background: var(--dark2);
      border-top: 2px solid var(--gold); /* Adds a premium luxury border dividing line */
      border-bottom: 2px solid var(--gold);
      position: relative;
      box-shadow: inset 0 0 20px rgba(0,0,0,0.8);
    }

    .con-map-embed-sec iframe {
      width: 100%;
      height: 100%;
      border: none;
      filter: none; /* REMOVED dark/black filters to show original crisp map colors */
      opacity: 1;   /* Set to maximum brightness */
      display: block;
    }
    /* ── BREAKPOINTS RESPONSIVE MATRIX ── */
    @media (max-width: 1024px) {
      .con-maxbounding-box {
        grid-template-columns: 1fr;
        gap: 4rem;
      }
    }

    @media (max-width: 768px) {
      .con-hero-banner {
        height: 360px;
      }
      .con-split-layout-sec {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
      }
      .con-form-card-panel {
        padding: 2.5rem 1.8rem;
      }
      .con-map-embed-sec {
        height: 350px;
      }
    }

    @media (max-width: 540px) {
      .con-form-row-2col {
        grid-template-columns: 1fr;
        gap: 0;
      }
    }

    @media (max-width: 480px) {
      .con-hero-banner {
        height: 300px;
      }
      .con-hero-badge-tag {
        font-size: 0.65rem;
        letter-spacing: 0.24em;
        padding: 0.35rem 1rem;
      }
    }
    /* ============================================================
       TOURIST SPOTS IMMERSIVE ARCHITECTURE — ISOLATED PAGE STYLES
       All custom layout elements are prefixed with 'tsp-'
       ============================================================ */

    .tsp-body-wrapper {
      overflow-x: hidden;
      background: var(--dark);
    }

    /* ── IMMERSIVE MAP & EXPLORATION HEADER ── */
    .tsp-exploration-header {
      padding: 5rem 1.5rem 2rem;
      background: linear-gradient(to bottom, var(--dark2), var(--dark));
      text-align: center;
      border-bottom: 1px solid rgba(201, 151, 58, 0.1);
    }

    .tsp-maxbound-container {
      max-width: 1200px;
      margin: 0 auto;
    }

    .tsp-mini-label {
      display: block;
      font-size: 0.72rem;
      letter-spacing: 0.28em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 0.8rem;
    }

    .tsp-main-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(2.2rem, 5vw, 4rem);
      font-weight: 300;
      line-height: 1.15;
      color: var(--cream);
      margin-bottom: 1.2rem;
    }

    .tsp-main-title em {
      color: var(--gold-light);
      font-style: italic;
    }

    .tsp-lead-paragraph {
      color: var(--text);
      font-size: clamp(0.9rem, 1.5vw, 1.05rem);
      line-height: 1.8;
      max-width: 700px;
      margin: 0 auto 3rem;
    }

    /* Interactive Category Filter Menu */
    .tsp-filter-navbar {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 1rem;
      flex-wrap: wrap;
      margin-bottom: 2rem;
    }

    .tsp-filter-btn {
      background: rgba(255, 255, 255, 0.03);
      border: 1px solid rgba(201, 151, 58, 0.2);
      color: var(--text);
      padding: 0.6rem 1.5rem;
      font-family: 'Jost', sans-serif;
      font-size: 0.8rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      font-weight: 500;
      border-radius: 30px;
      cursor: pointer;
      transition: all 0.35s cubic-bezier(.4,0,.2,1);
    }

    .tsp-filter-btn:hover,
    .tsp-filter-btn.tsp-active-tab {
      background: var(--gold);
      color: var(--dark);
      border-color: var(--gold);
      box-shadow: 0 8px 20px rgba(201, 151, 58, 0.25);
      transform: translateY(-2px);
    }

    /* ── EXPANDED INTERACTIVE SPOT GRID ── */
    .tsp-spots-display-grid {
      padding: 3rem 1.5rem 6rem;
      background: var(--dark);
    }

    .tsp-grid-matrix {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2.5rem 2rem;
      transition: all 0.5s ease;
    }

    .tsp-destination-node {
      background: var(--dark2);
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid rgba(201, 151, 58, 0.1);
      display: flex;
      flex-direction: column;
      transition: transform 0.45s cubic-bezier(.4,0,.2,1), border-color 0.45s ease, box-shadow 0.45s ease;
    }

    .tsp-destination-node:hover {
      transform: translateY(-10px);
      border-color: var(--gold);
      box-shadow: 0 30px 65px rgba(0, 0, 0, 0.6);
    }

    .tsp-media-wrapper {
      height: 240px;
      position: relative;
      overflow: hidden;
    }

    .tsp-media-wrapper img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.8s ease;
    }

    .tsp-destination-node:hover .tsp-media-wrapper img {
      transform: scale(1.08);
    }

    .tsp-media-wrapper::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(17, 30, 22, 0.9) 0%, transparent 60%);
    }

    .tsp-region-badge {
      position: absolute;
      top: 1rem;
      right: 1rem;
      background: rgba(11, 23, 16, 0.85);
      backdrop-filter: blur(8px);
      border: 1px solid rgba(201, 151, 58, 0.3);
      color: var(--gold-light);
      font-size: 0.68rem;
      padding: 0.35rem 0.85rem;
      border-radius: 40px;
      letter-spacing: 0.04em;
      font-weight: 500;
      z-index: 2;
    }

    .tsp-text-content-card {
      padding: 2rem 1.8rem;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
    }

    .tsp-text-content-card h3 {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.6rem;
      color: var(--cream);
      margin-bottom: 0.75rem;
      font-weight: 400;
      letter-spacing: 0.01em;
    }

    .tsp-spot-description {
      font-size: 0.86rem;
      color: var(--text);
      line-height: 1.7;
      margin-bottom: 1.5rem;
      flex-grow: 1;
    }

    /* Structural Info Panels inside Cards */
    .tsp-card-metadata-box {
      border-top: 1px solid rgba(201, 151, 58, 0.12);
      padding-top: 1.2rem;
      margin-top: auto;
      display: flex;
      flex-direction: column;
      gap: 0.6rem;
    }

    .tsp-meta-row {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      font-size: 0.78rem;
      color: var(--text);
    }

    .tsp-meta-row i {
      color: var(--gold);
      width: 14px;
      text-align: center;
      font-size: 0.85rem;
    }

    .tsp-meta-row strong {
      color: var(--cream);
      font-weight: 500;
    }

    /* ── BREAKPOINTS RESPONSIVE MATRIX ── */
    @media (max-width: 1024px) {
      .tsp-grid-matrix {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.8rem;
      }
    }

    @media (max-width: 768px) {
      .tsp-exploration-header {
        padding-top: 4rem;
      }
      .tsp-spots-display-grid {
        padding-top: 2rem;
        padding-bottom: 4.5rem;
      }
    }

    @media (max-width: 640px) {
      .tsp-grid-matrix {
        grid-template-columns: 1fr;
        gap: 1.6rem;
      }
      .tsp-media-wrapper {
        height: 210px;
      }
      .tsp-filter-navbar {
        gap: 0.6rem;
      }
      .tsp-filter-btn {
        padding: 0.5rem 1.1rem;
        font-size: 0.74rem;
      }
    }
    
    /* ============================================================
       ABOUT US ELITE ARCHITECTURE — ISOLATED COMPONENT STYLES
       All custom declarations are strictly prefixed with 'abu-'
       ============================================================ */

    .abu-body-wrapper {
      overflow-x: hidden;
      background: var(--dark);
    }

    /* ── BANNER HERO LAYOUT ── */
    .abu-hero-banner {
      position: relative;
      width: 100%;
      height: 480px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .abu-hero-bg-media {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .abu-hero-bg-media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center 40%;
      display: block;
      transform: scale(1.05);
      animation: abuScaleMotion 9s cubic-bezier(.4,0,.2,1) forwards;
    }

    @keyframes abuScaleMotion {
      to { transform: scale(1); }
    }

    .abu-hero-shading-overlay {
      position: absolute;
      inset: 0;
      z-index: 2;
      background: linear-gradient(
        135deg,
        rgba(11, 23, 16, 0.96) 0%,
        rgba(17, 30, 22, 0.78) 60%,
        rgba(28, 56, 40, 0.45) 100%
      );
    }

    .abu-hero-container {
      position: relative;
      z-index: 3;
      text-align: center;
      padding: 0 24px;
      max-width: 900px;
      animation: abuFadeUpMotion 0.85s cubic-bezier(.4,0,.2,1) both;
    }

    @keyframes abuFadeUpMotion {
      from { opacity: 0; transform: translateY(35px); }
      to   { opacity: 1; transform: none; }
    }

    .abu-hero-badge-tag {
      display: inline-block;
      color: var(--gold);
      font-size: 0.72rem;
      letter-spacing: 0.32em;
      text-transform: uppercase;
      margin-bottom: 1.2rem;
      border: 1px solid rgba(201, 151, 58, 0.4);
      padding: 0.4rem 1.25rem;
      border-radius: 40px;
    }

    .abu-hero-title-main {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(2.5rem, 6.5vw, 5.2rem);
      font-weight: 300;
      line-height: 1.1;
      color: var(--cream);
      margin-bottom: 1.2rem;
    }

    .abu-hero-title-main em {
      color: var(--gold-light);
      font-style: italic;
    }

    .abu-hero-paragraph-sub {
      color: var(--text);
      font-size: clamp(0.9rem, 1.6vw, 1.05rem);
      line-height: 1.85;
      max-width: 620px;
      margin: 0 auto 2rem;
    }

    .abu-hero-breadcrumbs-nav {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0.75rem;
      flex-wrap: wrap;
    }

    .abu-breadcrumb-anchor {
      font-size: 0.82rem;
      color: rgba(242, 235, 224, 0.8);
      transition: color 0.3s ease;
    }

    .abu-breadcrumb-anchor:hover {
      color: var(--gold);
    }

    .abu-breadcrumb-pointer {
      color: var(--gold);
      font-size: 0.6rem;
    }

    .abu-breadcrumb-current-page {
      font-size: 0.82rem;
      color: var(--gold);
      font-weight: 500;
    }

    /* ── CORE SHARED LAYOUT STYLES ── */
    .abu-maxbound-box {
      max-width: 1200px;
      margin: 0 auto;
    }

    .abu-mini-label {
      display: block;
      font-size: 0.72rem;
      letter-spacing: 0.26em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 0.8rem;
    }

    .abu-section-title-heading {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(1.9rem, 4vw, 3.2rem);
      font-weight: 300;
      line-height: 1.15;
      color: var(--cream);
    }

    .abu-section-title-heading em {
      color: var(--gold-light);
      font-style: italic;
    }

    .abu-body-text-p {
      color: var(--text);
      font-size: 0.92rem;
      line-height: 1.9;
      margin-top: 1.4rem;
    }

    /* ── SECTION 1: FOUNDER'S VISION LAYER ── */
    .abu-vision-split-sec {
      padding: 7rem 1.5rem;
      background: var(--dark);
    }

    .abu-split-grid-2col {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 5rem;
      align-items: center;
    }

    .abu-visual-wrapper-frame {
      position: relative;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 35px 75px rgba(0, 0, 0, 0.6);
    }

    .abu-visual-wrapper-frame img {
      width: 100%;
      height: 480px;
      object-fit: cover;
      display: block;
      transition: transform 0.8s ease;
    }

    .abu-visual-wrapper-frame:hover img {
      transform: scale(1.05);
    }

    .abu-blockquote-pullout {
      margin-top: 2rem;
      padding-left: 1.5rem;
      border-left: 2px solid var(--gold);
      font-family: 'Cormorant Garamond', serif;
      font-style: italic;
      font-size: 1.25rem;
      color: var(--cream);
      line-height: 1.6;
    }

    /* ── SECTION 2: CHRONOLOGICAL MILESTONES ── */
    .abu-timeline-sec {
      padding: 7rem 1.5rem;
      background: var(--dark2);
      border-top: 1px solid rgba(201, 151, 58, 0.1);
      border-bottom: 1px solid rgba(201, 151, 58, 0.1);
    }

    .abu-center-header {
      text-align: center;
      max-width: 600px;
      margin: 0 auto 4.5rem;
    }

    .abu-timeline-track {
      position: relative;
      max-width: 850px;
      margin: 0 auto;
      padding: 1rem 0;
    }

    .abu-timeline-track::before {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 1px;
      background: rgba(201, 151, 58, 0.25);
      transform: translateX(-50%);
    }

    .abu-timeline-node {
      position: relative;
      width: 50%;
      padding: 2rem 3rem;
      box-sizing: border-box;
    }

    .abu-timeline-node::after {
      content: '';
      position: absolute;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: var(--dark);
      border: 2px solid var(--gold);
      top: 2.4rem;
      z-index: 5;
    }

    .abu-node-left {
      left: 0;
      text-align: right;
    }

    .abu-node-left::after {
      right: -7px;
    }

    .abu-node-right {
      left: 50%;
      text-align: left;
    }

    .abu-node-right::after {
      left: -5px;
    }

    .abu-timeline-content-card {
      background: var(--dark);
      border: 1px solid rgba(201, 151, 58, 0.1);
      padding: 1.8rem;
      border-radius: 12px;
      transition: border-color 0.4s ease, transform 0.4s ease;
    }

    .abu-timeline-content-card:hover {
      border-color: var(--gold);
      transform: translateY(-3px);
    }

    .abu-timeline-year {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.8rem;
      font-weight: 600;
      color: var(--gold);
      line-height: 1;
      margin-bottom: 0.5rem;
    }

    .abu-timeline-card-title {
      font-size: 0.95rem;
      color: var(--cream);
      font-weight: 500;
      letter-spacing: 0.02em;
      margin-bottom: 0.5rem;
    }

    .abu-timeline-card-desc {
      font-size: 0.84rem;
      color: var(--text);
      line-height: 1.6;
    }

    /* ── SECTION 3: ARCHITECTURAL CRAFTSMANSHIP MATRIX ── */
    .abu-craft-sec {
      padding: 7rem 1.5rem;
      background: var(--dark);
    }

    .abu-matrix-grid-layout {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1.8rem;
    }

    .abu-matrix-card-item {
      background: var(--dark2);
      border: 1px solid rgba(201, 151, 58, 0.1);
      border-radius: 14px;
      padding: 3rem 2rem;
      transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
    }

    .abu-matrix-card-item:hover {
      transform: translateY(-6px);
      border-color: var(--gold);
      box-shadow: 0 25px 60px rgba(0,0,0,0.55);
    }

    .abu-matrix-icon-box {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: rgba(201, 151, 58, 0.08);
      border: 1px solid rgba(201, 151, 58, 0.25);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.5rem;
    }

    .abu-matrix-icon-box i {
      font-size: 1.3rem;
      color: var(--gold);
    }

    .abu-matrix-card-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.35rem;
      color: var(--cream);
      margin-bottom: 0.7rem;
      font-weight: 400;
    }

    .abu-matrix-card-desc {
      font-size: 0.84rem;
      color: var(--text);
      line-height: 1.75;
    }

    /* ── BREAKPOINTS RESPONSIVE MATRIX ── */
    @media (max-width: 1024px) {
      .abu-split-grid-2col {
        grid-template-columns: 1fr;
        gap: 4rem;
      }
      .abu-matrix-grid-layout {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 768px) {
      .abu-hero-banner {
        height: 380px;
      }
      .abu-vision-split-sec,
      .abu-timeline-sec,
      .abu-craft-sec {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
      }
      /* Timeline Responsive Collapse to Single Column */
      .abu-timeline-track::before {
        left: 20px;
      }
      .abu-timeline-node {
        width: 100%;
        padding-left: 45px;
        padding-right: 0;
        text-align: left;
      }
      .abu-timeline-node::after {
        left: 14px;
        top: 2.4rem;
      }
      .abu-node-right {
        left: 0;
      }
    }

    @media (max-width: 640px) {
      .abu-matrix-grid-layout {
        grid-template-columns: 1fr;
        gap: 1.4rem;
      }
      .abu-visual-wrapper-frame img {
        height: 340px;
      }
    }

    @media (max-width: 480px) {
      .abu-hero-banner {
        height: 320px;
      }
      .abu-hero-badge-tag {
        font-size: 0.65rem;
        letter-spacing: 0.24em;
        padding: 0.35rem 1rem;
      }
    }