/* ═══════════════════════════════════════════════════
   KIBO PALACE HOTELS — Website Styles
   Primary: #820D17 (Deep Burgundy)
   Accent:  #BC9F67 (Antique Gold)
   Neutral: #231F20 (Charcoal Black)
   Light:   #F7F2E8 (Warm Ivory)
   ═══════════════════════════════════════════════════ */

/* ─── Reset & Base ─────────────────────────────── */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

:root {
    --burgundy-900: #4a0810;
    --burgundy-800: #620a12;
    --burgundy-700: #720c14;
    --burgundy-600: #820D17;
    --burgundy-500: #9e1a25;
    --burgundy-400: #b8303b;
    --burgundy-300: #d45a64;
    --burgundy-200: #eaa0a6;
    --burgundy-100: #f8d6d9;

    --espresso-900: #1a1210;
    --espresso-800: #2a1d18;
    --espresso-700: #3A2A24;
    --espresso-600: #4d3a32;
    --espresso-500: #634d43;

    --gold-600: #8a7540;
    --gold-500: #a88b52;
    --gold-400: #BC9F67;
    --gold-300: #d0b880;
    --gold-200: #e0d0a0;
    --gold-100: #efe8d0;

    --ivory: #F7F2E8;
    --ivory-dark: #ece4d6;
    --stone: #D8CBB5;
    --stone-light: #e5dbcc;
    --white: #ffffff;
    --black: #0d0d0d;
    --text: #231F20;
    --text-light: #6b6b6b;

    --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --nav-height: 80px;
    --nav-height-max: 150px;
    --container-max: 1280px;
    --section-pad: 120px;
    --section-pad-mobile: 72px;
    --ease-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

    scroll-behavior: smooth;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body {
    font-family: var(--font-body);
    color: var(--text);
    background: var(--white);
    line-height: 1.6;
    overflow-x: hidden;
    max-width: 100vw
}

img {
    display: block;
    max-width: 100%;
    height: auto
}

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

ul {
    list-style: none
}

[x-cloak] {
    display: none !important
}

/* ─── Utility ──────────────────────────────────── */
.container {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px
}

@media(min-width:768px) {
    .container {
        padding: 0 48px
    }
}

.section {
    padding: var(--section-pad-mobile) 0
}

@media(min-width:768px) {
    .section {
        padding: var(--section-pad) 0
    }
}

.section__label {
    font-family: var(--font-body);
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: var(--gold-400);
    margin-bottom: 16px
}

.section__label--light {
    color: var(--burgundy-300)
}

.section__label--center {
    text-align: center
}

.section__title {
    font-family: var(--font-heading);
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 500;
    color: var(--espresso-700);
    line-height: 1.15;
    margin-bottom: 24px
}

.section__title em {
    font-style: italic;
    color: var(--burgundy-600)
}

.section__title--light {
    color: var(--ivory)
}

.section__title--light em {
    color: var(--burgundy-300)
}

.section__title--center {
    text-align: center
}

.section__intro {
    font-size: 1.125rem;
    color: var(--text-light);
    max-width: 640px;
    line-height: 1.7;
    margin: 0 auto;
    margin-bottom: 48px
}

.section__intro_left {

    margin-left: 0;
}

.group {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em
}

.text-center {
    text-align: center
}

.bg-sand {
    background: var(--ivory)
}

.divider {
    border: none;
    border-top: 1px solid var(--ivory-dark);
    margin: 0
}

/* ─── Navigation ───────────────────────────────── */
.nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    height: var(--nav-height-max);
    transition: all .4s var(--ease-out)
}

.nav--scrolled {
    height: var(--nav-height);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 1px 0 rgba(19, 81, 122, .1)
}

.nav__inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media(min-width:768px) {
    .nav__inner {
        padding: 0 48px
    }
}

.nav__logo {
    display: flex;
    align-items: center;
    z-index: 101
}

.nav__logo-img {
    display: block;
    width: auto;
    height: calc(var(--nav-height-max) - 30px);
    max-height: 120px;
    object-fit: contain;
    padding: .85rem;
    transition: height .4s var(--ease-out), max-height .4s var(--ease-out), padding .4s var(--ease-out), filter .3s var(--ease-out)
}

/* .nav:not(.nav--scrolled) .nav__logo-img {
    filter: brightness(0) invert(1) 

    background: rgba(255, 255, 255, 0.5);

} */

.nav:not(.nav--scrolled) {
    color: var(--white);
}

.nav--scrolled .nav__logo-img {
    height: calc(var(--nav-height) - 18px);
    max-height: 62px;
    padding: .35rem;
    filter: none
}

/* Fallback text logo */
.nav__logo-mark {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.nav__logo-title {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    line-height: 1;
    letter-spacing: .02em
}

.nav__logo-subtitle {
    font-size: .58rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    opacity: .8
}


.nav--scrolled .nav__logo-mark {
    color: var(--espresso-900)
}

.nav__links {
    display: none;
    align-items: center;
    gap: 20px
}

@media(min-width:1024px) {
    .nav__links {
        display: flex
    }
}

.nav__link {
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: .05em;
    text-transform: uppercase;
    transition: color .3s;
    position: relative;
    white-space: nowrap
}



.nav--scrolled .nav__link {
    color: var(--espresso-700)
}

.nav__link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1.5px;
    background: var(--burgundy-600);
    transition: width .3s var(--ease-out)
}

.nav__link:hover::after,
.nav__link.active::after {
    width: 100%
}

.nav__link--cta {
    padding: 10px 22px;
    background: var(--burgundy-600);
    color: var(--white) !important;
    transition: background .3s
}

.nav__link--cta::after {
    display: none
}

.nav__link--cta:hover {
    background: var(--burgundy-700)
}

.nav__burger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 101
}

@media(min-width:1024px) {
    .nav__burger {
        display: none
    }
}

.nav__burger-line {
    width: 100%;
    height: 2px;
    background: var(--white);
    transition: all .3s var(--ease-out);
    transform-origin: center
}

.nav--scrolled .nav__burger-line {
    background: var(--espresso-700)
}

.nav__burger-line--open:nth-child(1) {
    transform: translateY(8px) rotate(45deg)
}

.nav__burger-line--open:nth-child(2) {
    opacity: 0
}

.nav__burger-line--open:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg)
}

.nav__mobile {
    position: fixed;
    inset: 0;
    background: rgba(7, 30, 45, .97);
    backdrop-filter: blur(20px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 99
}

.nav__mobile-links {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 24px
}

.nav__mobile-link {
    font-family: var(--font-heading);
    font-size: 2rem;
    color: var(--ivory);
    font-weight: 400;
    transition: color .3s
}

.nav__mobile-link:hover,
.nav__mobile-link.active {
    color: var(--burgundy-400)
}

.nav__mobile-link--cta {
    display: inline-block;
    margin-top: 16px;
    padding: 14px 40px;
    border: 1.5px solid var(--burgundy-400);
    color: var(--burgundy-400) !important;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase
}

/* ─── Hero ─────────────────────────────────────── */
.hero {
    position: relative;
    height: 100vh;
    min-height: 600px;
    max-height: 1200px;
    display: flex;
    align-items: center;
    overflow: hidden
}

.hero__bg {
    position: absolute;
    inset: 0
}

.hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%
}

.hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(7, 30, 45, .5) 0%, rgba(7, 30, 45, .2) 50%, rgba(7, 30, 45, .65) 100%);
    /* background: linear-gradient(to bottom, rgba(7, 30, 45, .7) 0%, rgba(7, 30, 45, .2) 50%, rgba(7, 30, 45, .65) 100%); */
}

.hero__overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: -20%;
    width: 140%;
    height: 100%;
    background: linear-gradient(120deg, black, rgba(0, 0, 0, 0.25), #0000);
}

.hero__content {
    position: relative;
    z-index: 2;
    color: var(--white);
    padding: 0 24px;
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto
}

@media(min-width:768px) {
    .hero__content {
        padding: 0 48px
    }
}

.hero__label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3em;
    color: var(--burgundy-300);
    margin-bottom: 16px
}

.hero__title {
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 7vw, 5rem);
    font-weight: 500;
    line-height: 1.05;
    margin-bottom: 16px;
    text-shadow: 0 2px 20px rgba(0, 0, 0, .3)
}

.hero__tagline {
    font-family: var(--font-heading);
    font-size: clamp(1rem, 2.5vw, 1.375rem);
    font-weight: 400;
    font-style: italic;
    color: rgba(255, 255, 255, .85);
    margin-bottom: 32px
}

.hero__scroll {
    display: inline-block;
    margin-top: 48px;
    width: 1px;
    height: 64px
}

.hero__scroll-line {
    display: block;
    width: 1px;
    height: 100%;
    background: linear-gradient(to bottom, var(--burgundy-400), transparent);
    animation: scrollPulse 2s var(--ease-in-out) infinite
}

@keyframes scrollPulse {

    0%,
    100% {
        opacity: .4;
        transform: scaleY(.6)
    }

    50% {
        opacity: 1;
        transform: scaleY(1)
    }
}

/* Page hero (inner pages) */
.page-hero {
    position: relative;
    height: 60vh;
    min-height: 420px;
    max-height: 700px;
    display: flex;
    align-items: flex-end;
    overflow: hidden
}

.page-hero__bg {
    position: absolute;
    inset: 0
}

.page-hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 50%
}

.page-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(7, 30, 45, .3) 0%, rgba(7, 30, 45, .72) 100%)
}

.page-hero__content {
    position: relative;
    z-index: 2;
    color: var(--white);
    padding: 48px 24px;
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto
}

@media(min-width:768px) {
    .page-hero__content {
        padding: 64px 48px
    }
}

.page-hero__label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .25em;
    color: var(--burgundy-300);
    margin-bottom: 12px
}

.page-hero__title {
    font-family: var(--font-heading);
    font-size: clamp(2.25rem, 6vw, 4rem);
    font-weight: 500;
    line-height: 1.1
}

/* ─── Booking Widget ───────────────────────────── */
.booking-widget {
    background: var(--white);
    padding: 24px 32px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .12);
    margin: -60px auto 0;
    max-width: 1000px;
    width: calc(100% - 48px);
    position: relative;
    z-index: 10
}

.booking-widget__form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    align-items: end
}

@media(min-width:640px) {
    .booking-widget__form {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .booking-widget__form {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px
    }
}

.booking-widget__field {
    display: flex;
    flex-direction: column
}

.booking-widget__label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--text-light);
    margin-bottom: 8px
}

.booking-widget__input {
    padding: 14px 16px;
    border: 1px solid #ddd;
    background: var(--white);
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--text);
    transition: border-color .3s
}

.booking-widget__input:focus {
    outline: none;
    border-color: var(--burgundy-600)
}

.booking-widget__button {
    padding: 16px 32px;
    background: var(--espresso-700);
    color: var(--white);
    border: none;
    font-family: var(--font-body);
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .3s
}

.booking-widget__button:hover {
    background: var(--espresso-900)
}

/* ─── About ────────────────────────────────────── */
.about__grid {
    display: grid;
    gap: 48px;
    align-items: center
}

@media(min-width:768px) {
    .about__grid {
        grid-template-columns: 1fr 1fr;
        gap: 80px
    }
}

.about__lead {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    line-height: 1.6;
    color: var(--espresso-900);
    margin-bottom: 20px
}

.about__body {
    font-size: 1rem;
    color: var(--text-light);
    line-height: 1.75;
    margin-bottom: 24px
}

.about__award {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: var(--burgundy-100);
    border-left: 3px solid var(--burgundy-600);
    margin-top: 8px
}

.about__award i {
    color: var(--burgundy-600);
    font-size: 1.25rem
}

.about__award span {
    font-size: .875rem;
    font-weight: 600;
    color: var(--burgundy-800)
}

.about__image-wrap {
    position: relative
}

.about__image {
    width: 100%;
    height: 500px;
    object-fit: cover;
    position: relative;
    z-index: 1
}

.about__image-accent {
    position: absolute;
    top: 20px;
    right: -16px;
    bottom: -20px;
    left: 16px;
    border: 2px solid var(--burgundy-600);
    z-index: 0;
    opacity: .35
}

@media(max-width:767px) {
    .about__image-accent {
        display: none
    }
}

/* ─── Facts strip ─────────────────────────────── */
.facts-strip {
    background: var(--espresso-700);
    padding: 56px 0
}

.facts-strip__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px
}

@media(min-width:640px) {
    .facts-strip__grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media(min-width:1024px) {
    .facts-strip__grid {
        grid-template-columns: repeat(5, 1fr)
    }
}

.facts-strip__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    color: var(--ivory)
}

.facts-strip__icon {
    /* font-size: 1.75rem; */
    font-size: 3rem;
    color: var(--burgundy-300);
    margin-bottom: 4px
}

.facts-strip__value {
    font-family: var(--font-heading);
    font-size: 1.8rem;
    font-weight: 500
}

.facts-strip__label {
    font-size: .78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: rgba(255, 255, 255, .6)
}

/* ─── Room Cards ───────────────────────────────── */
.rooms {
    background: var(--white)
}

.rooms__grid {
    display: grid;
    gap: 32px
}

@media(min-width:768px) {
    .rooms__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px
    }
}

@media(min-width:1200px) {
    .rooms__grid {
        grid-template-columns: repeat(3, 1fr)
    }

    .rooms__grid.x2 {
        grid-template-columns: repeat(2, 1fr)
    }
}

.room-card {
    background: var(--ivory);
    overflow: hidden;
    transition: box-shadow .4s var(--ease-out)
}

.room-card:hover {
    box-shadow: 0 20px 60px rgba(19, 81, 122, .12)
}

.room-card__image-wrap {
    overflow: hidden;
    height: 380px
}

.room-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s var(--ease-out)
}

.room-card__image--hover {
    transform: scale(1.05)
}

.room-card__body {
    padding: 28px 32px
}

.room-card__meta {
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--gold-400);
    margin-bottom: 8px
}

.room-card__title {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 12px
}

.room-card__desc {
    font-size: .9375rem;
    color: var(--text-light);
    line-height: 1.65;
    margin-bottom: 20px
}

.room-card__features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.room-card__feature {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: .8rem;
    font-weight: 500;
    color: var(--espresso-700);
    background: var(--white);
    border: 1px solid var(--burgundy-200)
}

.room-card__feature i {
    color: var(--burgundy-600);
    font-size: .85rem
}

.room-card__rate {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--ivory-dark);
    font-size: .9375rem;
    color: var(--text-light)
}

.room-card__rate strong {
    color: var(--espresso-700);
    font-size: 1.1rem
}

.room-card__cta {
    display: inline-block;
    margin-top: 14px;
    padding: 12px 28px;
    background: var(--burgundy-600);
    color: var(--white);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: background .3s
}

.room-card__cta:hover {
    background: var(--espresso-700)
}

.rooms__cta {
    margin-top: 48px;
    text-align: center
}

/* Room carousel (accommodation page) */
.room-detail {
    padding: var(--section-pad-mobile) 0
}

.room-detail:nth-child(even) {
    background: var(--ivory)
}

@media(min-width:768px) {
    .room-detail {
        padding: var(--section-pad) 0
    }
}

.room-detail__grid {
    display: grid;
    gap: 48px;
    align-items: center
}

@media(min-width:968px) {
    .room-detail__grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px
    }
}

@media(min-width:968px) {
    .room-detail__grid--reversed .image__carousel {
        order: 2
    }

    .room-detail__grid--reversed .room-detail__info {
        order: 1
    }
}

.image__carousel {
    position: relative;
    overflow: hidden;
    background: var(--espresso-900)
}

.carousel__track {
    display: flex;
    transition: transform .5s var(--ease-out)
}

.carousel__slide {
    min-width: 100%;
    aspect-ratio: 4/3;
    overflow: hidden
}

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

.carousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, .85);
    border: none;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.2rem;
    color: var(--espresso-700);
    transition: background .3s;
    z-index: 5
}

.carousel__btn:hover {
    background: var(--burgundy-600);
    color: var(--white)
}

.carousel__btn--prev {
    left: 12px
}

.carousel__btn--next {
    right: 12px
}

.carousel__dots {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px
}

.carousel__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .5);
    border: none;
    cursor: pointer;
    padding: 0;
    transition: background .3s
}

.carousel__dot--active,
.carousel__dot:hover {
    background: var(--white)
}

.room-detail__label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: var(--gold-400);
    margin-bottom: 10px
}

.room-detail__title {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 16px;
    line-height: 1.2
}

.room-detail__desc {
    font-size: 1rem;
    color: var(--text-light);
    line-height: 1.75;
    margin-bottom: 24px
}

.room-detail__amenities {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px
}

.room-detail__amenity {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1px solid var(--burgundy-200);
    font-size: .8125rem;
    font-weight: 500;
    color: var(--espresso-700);
    background: var(--white)
}

.room-detail__amenity i {
    color: var(--burgundy-600);
    font-size: .9rem
}

.room-detail__rate {
    font-size: 1rem;
    color: var(--text-light);
    margin-bottom: 20px
}

.room-detail__rate strong {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    color: var(--espresso-700)
}

/* Room includes strip */
.room-includes {
    background: var(--espresso-700);
    padding: 56px 0
}

.room-includes__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 32px 40px
}

.room-includes__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: var(--ivory);
    font-size: .875rem;
    text-align: center;
    min-width: 80px
}

.room-includes__icon {
    font-size: 1.75rem;
    color: var(--burgundy-300)
}

/* ─── Dining ───────────────────────────────────── */
.dining {
    background: var(--ivory)
}

.dining__intro {
    max-width: 700px;
    margin-bottom: 56px
}

.outlet-cards {
    display: grid;
    gap: 32px
}

@media(min-width:768px) {
    .outlet-cards {
        grid-template-columns: repeat(2, 1fr)
    }
}

.outlet-card {
    overflow: hidden;
    background: var(--white);
    box-shadow: 0 4px 24px rgba(0, 0, 0, .06);
    transition: transform .3s, box-shadow .3s
}

.outlet-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(19, 81, 122, .1)
}

.outlet-card__img-wrap {
    height: 280px;
    overflow: hidden
}

.outlet-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ease-out)
}

.outlet-card:hover .outlet-card__img {
    transform: scale(1.04)
}

.outlet-card__body {
    padding: 28px 32px
}

.outlet-card__tag {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: var(--gold-400);
    margin-bottom: 8px
}

.outlet-card__title {
    font-family: var(--font-heading);
    font-size: 1.625rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 12px
}

.outlet-card__desc {
    font-size: .9375rem;
    color: var(--text-light);
    line-height: 1.65;
    margin-bottom: 16px
}

.outlet-card__meta {
    display: flex;
    gap: 20px;
    flex-wrap: wrap
}

.outlet-card__hours {
    font-size: .875rem;
    color: var(--burgundy-700);
    font-weight: 500
}

.outlet-card__hours i {
    margin-right: 6px
}

.dining__cta {
    margin-top: 48px;
    text-align: center
}

/* ─── Activities ───────────────────────────────── */
.activities-grid {
    display: grid;
    gap: 32px;
    margin-top: 48px
}

@media(min-width:640px) {
    .activities-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .activities-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.activity-card {
    overflow: hidden;
    background: var(--white);
    box-shadow: 0 2px 16px rgba(0, 0, 0, .06);
    transition: transform .3s, box-shadow .3s
}

.activity-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(19, 81, 122, .1)
}

.activity-card__img-wrap {
    height: 220px;
    overflow: hidden
}

.activity-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s
}

.activity-card:hover .activity-card__img {
    transform: scale(1.05)
}

.activity-card__body {
    padding: 24px
}

.activity-card__icon {
    font-size: 1.5rem;
    color: var(--burgundy-600);
    margin-bottom: 12px
}

.activity-card__title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 8px
}

.activity-card__desc {
    font-size: .9375rem;
    color: var(--text-light);
    line-height: 1.6
}

.activities__cta {
    margin-top: 48px;
    text-align: center
}

/* Nearby attractions */
.nearby-grid {
    display: grid;
    gap: 24px
}

@media(min-width:640px) {
    .nearby-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .nearby-grid {
        grid-template-columns: repeat(4, 1fr)
    }
}

.nearby-card {
    padding: 28px;
    background: var(--ivory);
    border-bottom: 3px solid var(--burgundy-600);
    transition: transform .3s
}

.nearby-card:hover {
    transform: translateY(-4px)
}

.nearby-card__icon {
    font-size: 1.75rem;
    color: var(--burgundy-600);
    margin-bottom: 14px
}

.nearby-card__title {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 8px
}

.nearby-card__desc {
    font-size: .9rem;
    color: var(--text-light);
    line-height: 1.6
}

/* ─── Conferences ──────────────────────────────── */
.conf-intro {
    display: grid;
    gap: 48px
}

@media(min-width:768px) {
    .conf-intro {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: center
    }
}

.conf-intro__img-wrap {
    height: 500px;
    overflow: hidden
}

.conf-intro__img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.conf-features {
    gap: 24px;
    margin-top: 48px
}

@media(min-width:640px) {
    .conf-features {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .conf-features {
        grid-template-columns: repeat(3, 1fr)
    }
}

.conf-feature {
    padding: 28px;
    background: var(--ivory);
    border-left: 3px solid var(--burgundy-600)
}

.conf-feature__icon {
    font-size: 1.75rem;
    color: var(--burgundy-600);
    margin-bottom: 16px
}

.conf-feature__title {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 8px
}

.conf-feature__text {
    font-size: .9375rem;
    color: var(--text-light);
    line-height: 1.6
}

.capacity-table-wrap {
    overflow-x: auto;
    margin-top: 32px
}

.capacity-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
    min-width: 600px
}

.capacity-table th {
    background: var(--espresso-700);
    color: var(--white);
    padding: 14px 16px;
    text-align: left;
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase
}

.capacity-table th:not(:first-child) {
    text-align: center
}

.capacity-table td {
    padding: 14px 16px;
    border-bottom: 1px solid #e8ecf0;
    color: var(--text)
}

.capacity-table td:not(:first-child) {
    text-align: center;
    font-weight: 500;
    color: var(--espresso-700)
}

.capacity-table tr:last-child td {
    border-bottom: none
}

.capacity-table tr:nth-child(even) td {
    background: var(--ivory)
}

.capacity-table tr:hover td {
    background: var(--burgundy-100)
}

.packages-grid {
    display: grid;
    gap: 24px;
    margin-top: 48px
}

@media(min-width:640px) {
    .packages-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .packages-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.package-card {
    padding: 32px;
    background: var(--white);
    border: 1px solid var(--burgundy-200);
    transition: all .3s;
    text-align: center
}

.package-card:hover {
    border-color: var(--burgundy-600);
    box-shadow: 0 8px 32px rgba(26, 164, 177, .12);
    transform: translateY(-4px)
}

.package-card__icon {
    font-size: 2.5rem;
    color: var(--burgundy-600);
    margin-bottom: 16px
}

.package-card__title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--espresso-700);
    margin-bottom: 10px
}

.package-card__text {
    font-size: .9375rem;
    color: var(--text-light);
    line-height: 1.6
}

/* ─── Contact ──────────────────────────────────── */
.contact__grid {
    display: grid;
    gap: 48px
}

@media(min-width:768px) {
    .contact__grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: start
    }
}

.contact__desc {
    font-size: 1.0625rem;
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 32px
}

.contact__details {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 40px
}

.contact__detail-label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: var(--burgundy-600);
    margin-bottom: 4px
}

.contact__detail p {
    font-size: 1rem;
    color: var(--text);
    line-height: 1.6
}

.contact__detail a {
    color: var(--espresso-700);
    transition: color .3s
}

.contact__detail a:hover {
    color: var(--burgundy-600)
}

.contact__map-wrap {
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .1)
}

.contact__map-wrap iframe {
    display: block;
    width: 100%;
    height: 480px;
    border: 0
}

.social-links {
    display: flex;
    gap: 12px;
    flex-wrap: wrap
}

.social-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1.5px solid var(--burgundy-600);
    color: var(--espresso-700);
    font-size: .875rem;
    font-weight: 500;
    transition: all .3s
}

.social-link:hover {
    background: var(--burgundy-600);
    color: var(--white);
    border-color: var(--burgundy-600)
}

.social-link i {
    font-size: 1rem
}

/* Contact form */
.contact__form {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.form__group {
    display: grid;
    gap: 16px
}

@media(min-width:640px) {
    .form__group {
        grid-template-columns: repeat(2, 1fr)
    }
}

.form__field {
    display: flex;
    flex-direction: column;
    gap: 6px
}

.form__label {
    font-size: .8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--text-light)
}

.form__input,
.form__textarea,
.form__select {
    padding: 14px 16px;
    border: 1px solid #ddd;
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--text);
    background: var(--white);
    transition: border-color .3s
}

.form__input:focus,
.form__textarea:focus,
.form__select:focus {
    outline: none;
    border-color: var(--burgundy-600)
}

.form__textarea {
    resize: vertical;
    min-height: 140px
}

/* ─── Gallery ──────────────────────────────────── */
.gallery {
    background: var(--white);
    overflow: hidden;
    padding-bottom: 80px
}

@media(min-width:768px) {
    .gallery {
        padding-bottom: var(--section-pad)
    }
}

.gallery__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
    margin-top: 48px
}

@media(min-width:768px) {
    .gallery__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 6px
    }
}

.gallery__grid.gallery__square {
    grid-template-columns: repeat(4, 1fr);
    gap: 3px
}

.gallery__grid.gallery__square .gallery__item {
    height: auto;
    aspect-ratio: 1 / 1
}

.gallery__item {
    overflow: hidden;
    cursor: pointer;
    position: relative;
    height: 260px
}

@media(min-width:768px) {
    .gallery__item {
        height: 320px
    }

    .gallery__item--wide {
        grid-column: span 2
    }

    .gallery__item--tall {
        grid-row: span 2;
        height: 100%
    }
}

.gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s var(--ease-out)
}

.gallery__item:hover .gallery__img {
    transform: scale(1.06)
}

.gallery__item::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(7, 30, 45, 0);
    transition: background .4s
}

.gallery__item:hover::after {
    background: rgba(7, 30, 45, .25)
}

.gallery__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 32px 0 0
}

.gallery__filter-btn {
    padding: 9px 22px;
    border-radius: 999px;
    border: 1.5px solid var(--burgundy-200);
    background: transparent;
    color: var(--burgundy-900);
    font-family: var(--font-body);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s
}

.gallery__filter-btn:hover {
    border-color: var(--burgundy-600);
    color: var(--burgundy-800)
}

.gallery__filter-btn--active {
    background: var(--burgundy-900);
    border-color: var(--burgundy-900);
    color: var(--white)
}

.lightbox {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(7, 30, 45, .93);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px;
    cursor: pointer
}

.lightbox__close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    background: none;
    border: none;
    color: var(--ivory);
    font-size: 2rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color .3s
}

.lightbox__close:hover {
    color: var(--burgundy-400)
}

.lightbox__img {
    max-width: 90vw;
    max-height: 85vh;
    object-fit: contain;
    cursor: default
}

.gallery__view-all {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    background: var(--burgundy-600);
    color: var(--white);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: background .3

}


.gallery__view-all i {
    font-size: 2rem;;
}


/* ─── Image Break ──────────────────────────────── */
.image-break {
    position: relative;
    height: 60vh;
    min-height: 400px;
    max-height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.image-break__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.image-break__overlay {
    position: absolute;
    inset: 0;
    background: rgba(7, 30, 45, .55)
}

.image-break__quote {
    position: relative;
    z-index: 1;
    max-width: 720px;
    padding: 0 32px;
    text-align: center
}

.image-break__quote p {
    font-family: var(--font-heading);
    font-size: clamp(1.125rem, 3vw, 1.625rem);
    font-style: italic;
    font-weight: 400;
    color: var(--ivory);
    line-height: 1.6
}

/* ─── CTA Banner ───────────────────────────────── */
.cta-banner {
    padding: 80px 0;
    text-align: center
}

.cta-banner--teal {
    background: var(--burgundy-600)
}

.cta-banner--navy {
    background: var(--espresso-700)
}

.cta-banner__label {
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .7);
    margin-bottom: 12px
}

.cta-banner__title {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 4vw, 3rem);
    color: var(--white);
    margin-bottom: 12px;
    line-height: 1.2
}

.cta-banner__text {
    font-size: 1.0625rem;
    color: rgba(255, 255, 255, .8);
    max-width: 560px;
    margin: 0 auto 32px
}

.cta-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center
}

/* ─── Buttons ──────────────────────────────────── */
.btn {
    display: inline-block;
    padding: 16px 40px;
    font-family: var(--font-body);
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    transition: all .4s var(--ease-out)
}

.btn--primary {
    background: var(--burgundy-600);
    color: var(--white)
}

.btn--primary:hover {
    background: var(--burgundy-700);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(26, 164, 177, .25)
}

.btn--secondary {
    background: transparent;
    color: var(--white);
    border: 1.5px solid rgba(255, 255, 255, .7)
}

.btn--secondary:hover {
    background: rgba(255, 255, 255, .15);
    border-color: var(--white)
}

.btn--dark {
    background: var(--espresso-700);
    color: var(--white)
}

.btn--dark:hover {
    background: var(--espresso-900)
}

.btn--outline {
    background: transparent;
    color: var(--espresso-700);
    border: 1.5px solid var(--espresso-700)
}

.btn--outline:hover {
    background: var(--espresso-700);
    color: var(--white)
}

.btn--white {
    background: var(--white);
    color: var(--espresso-700)
}

.btn--white:hover {
    background: var(--ivory)
}

.btn--video {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: var(--espresso-700);
    border: 1.5px solid var(--espresso-700);
    transition: background .3s, color .3s, border-color .3s
}

.btn--video:hover {
    background: var(--espresso-700);
    color: var(--white);
    border-color: var(--espresso-700)
}

.btn-link {
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--burgundy-600);
    transition: color .3s
}

.btn-link:hover {
    color: var(--espresso-700)
}

/* ─── Scroll Animations ─────────────────────────── */
.fade-in {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s var(--ease-out), transform .7s var(--ease-out)
}

.fade-in--visible {
    opacity: 1;
    transform: none
}

/* ─── Footer ───────────────────────────────────── */
.footer {
    background: var(--espresso-900);
    color: var(--ivory);
    padding: 64px 0 32px
}

.footer__grid {
    display: grid;
    gap: 48px;
    margin-bottom: 48px
}

@media(min-width:640px) {
    .footer__grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .footer__grid {
        grid-template-columns: 2fr 1fr 1fr 1fr;
        gap: 32px
    }
}

.footer__heading {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    margin-bottom: 4px;
    color: var(--white)
}

.footer__tagline {
    font-size: .9375rem;
    color: rgba(255, 255, 255, .6);
    line-height: 1.6;
    margin-bottom: 20px
}

.footer__detail {
    font-size: .9375rem;
    line-height: 1.9
}

.footer__detail p,
.footer__detail a {
    color: rgba(255, 255, 255, .6);
    transition: color .3s
}

.footer__detail a:hover {
    color: var(--burgundy-300)
}

.footer__detail strong {
    color: rgba(255, 255, 255, .9);
    font-weight: 600
}

.footer__nav-title {
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgba(255, 255, 255, .4);
    margin-bottom: 16px
}

.footer__links {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.footer__links a {
    font-size: .9375rem;
    color: rgba(255, 255, 255, .6);
    transition: color .3s
}

.footer__links a:hover {
    color: var(--burgundy-300)
}

.footer__social {
    display: flex;
    gap: 12px;
    margin-top: 20px
}

.footer__social a {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .2);
    color: rgba(255, 255, 255, .6);
    font-size: 1rem;
    transition: all .3s
}

.footer__social a:hover {
    background: var(--burgundy-600);
    border-color: var(--burgundy-600);
    color: var(--white)
}

.footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding-top: 24px;
    font-size: .875rem;
    color: rgba(255, 255, 255, .4);
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between
}

.footer__bottom a {
    color: rgba(255, 255, 255, .4);
    transition: color .3s
}

.footer__bottom a:hover {
    color: var(--burgundy-300)
}

/* ─── Outlet Detail (Restaurants page) ──────────*/
.outlet-detail {
    padding-block: var(--section-pad)
}

.outlet-detail__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center
}

.outlet-detail__grid--reversed .outlet-detail__images {
    order: 2
}

.outlet-detail__grid--reversed .outlet-detail__info {
    order: 1
}

.outlet-detail__images {
    display: grid;
    grid-template-rows: auto auto;
    gap: 12px
}

.outlet-detail__images--single {
    display: block
}

.image__carousel {
    position: relative;
    overflow: hidden;
    background: var(--espresso-900)
}

.outlet-detail__grid--reversed .image__carousel {
    order: 2
}


.outlet-detail__img-secondary img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.outlet-detail__img-main {
    aspect-ratio: 4/3;
    overflow: hidden
}

.outlet-detail__img-secondary {
    aspect-ratio: 16/7;
    overflow: hidden
}

.outlet-detail__tag {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--burgundy-600);
    margin-bottom: 12px
}

.outlet-detail__title {
    font-family: var(--font-heading);
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.15;
    margin-bottom: 20px;
    color: var(--espresso-700)
}

.outlet-detail__desc {
    font-size: 1.0625rem;
    line-height: 1.75;
    color: var(--text-light);
    margin-bottom: 24px
}

.outlet-detail__info-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px
}

.outlet-detail__info-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: .9375rem;
    color: var(--text-light)
}

.outlet-detail__info-list li i {
    color: var(--burgundy-600);
    margin-top: 2px;
    flex-shrink: 0
}

.outlet-detail__info-list li strong {
    color: var(--text);
    font-weight: 600
}

.outlet-detail__meal-times {
    display: block;
    font-size: .8125rem;
    color: var(--text-light);
    margin-top: 4px;
    padding-left: 24px;
    opacity: .85
}

.outlets-note {
    background: var(--burgundy-100);
    border-left: 4px solid var(--burgundy-600);
    padding: 32px 40px
}

.outlets-note__inner {
    display: flex;
    gap: 24px;
    align-items: flex-start
}

.outlets-note__icon {
    font-size: 2rem;
    color: var(--burgundy-600);
    flex-shrink: 0;
    margin-top: 4px
}

.outlets-note__title {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    color: var(--espresso-700);
    margin-bottom: 8px
}

.outlets-note__text {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--text-light)
}

/* ─── Room Detail / Includes Strip ─────────────*/
.room-detail {
    padding-block: var(--section-pad)
}

.room-detail__grid {
    display: grid;
    grid-template-columns: 55% 45%;
    gap: 60px;
    align-items: start
}

.room-detail__grid--reversed .image__carousel {
    order: 2
}

.room-detail__grid--reversed .room-detail__info {
    order: 1
}

.room-detail__tag {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--burgundy-600);
    margin-bottom: 12px
}

.room-detail__title {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 2.5vw, 2.5rem);
    line-height: 1.2;
    margin-bottom: 12px;
    color: var(--espresso-700)
}

.room-detail__rate {
    font-size: 1rem;
    margin-bottom: 20px;
    color: var(--text-light)
}

.room-detail__rate strong {
    color: var(--burgundy-700);
    font-size: 1.2rem
}

.room-detail__rate a {
    color: var(--burgundy-600)
}

.room-detail__rate-usd {
    font-size: .875rem;
    opacity: .7
}

.room-detail__beds {
    margin-bottom: 20px;
    padding: 16px 20px;
    background: var(--ivory-dark);
    border-left: 3px solid var(--burgundy-600)
}

.room-detail__beds-label {
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-light);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px
}

.room-detail__beds-label i {
    color: var(--burgundy-600)
}

.room-detail__bed-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.room-detail__bed-option {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--espresso-700);
    padding: 5px 12px;
    background: var(--white);
    border: 1px solid var(--ivory-dark)
}

.room-detail__bed-option i {
    color: var(--burgundy-600)
}

.room-detail__desc {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--text-light);
    margin-bottom: 24px
}

.room-detail__features {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
    margin-bottom: 28px
}

.room-detail__features li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .9rem;
    color: var(--text)
}

.room-detail__features li i {
    color: var(--burgundy-600);
    font-size: 1rem
}

.includes-strip {
    background: var(--espresso-700);
    padding: 56px 0
}

.includes-strip__title {
    text-align: center;
    color: rgba(255, 255, 255, .6);
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 32px
}

.includes-strip__grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px;
    max-width: 900px;
    margin: 0 auto
}

.includes-strip__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center
}

.includes-strip__item i {
    font-size: 1.5rem;
    color: var(--burgundy-400)
}

.includes-strip__item span {
    font-size: .8rem;
    color: rgba(255, 255, 255, .7);
    font-weight: 500
}

/* ─── Conference features ────────────────────── */
.conf-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
    margin-bottom: 0
}

.conf-intro__text {
    font-size: 1.0625rem;
    line-height: 1.75;
    color: var(--text-light);
    margin-bottom: 16px
}

.conf-intro__highlights {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    background: var(--ivory-dark);
    padding: 32px
}

.conf-intro__highlight {
    text-align: center;
    padding: 20px
}

.conf-intro__stat {
    display: block;
    font-family: var(--font-heading);
    font-size: 2.5rem;
    color: var(--burgundy-600);
    font-weight: 600;
    line-height: 1
}

.conf-intro__stat-label {
    display: block;
    font-size: .8rem;
    color: var(--text-light);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-top: 6px
}

.conf-packages_promo {
        background: var(--burgundy-600);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 28px;
    border-radius: 4px;
    margin-top: 28px;
    flex-wrap: wrap;

    border-left: 4px solid var(--burgundy-900);
}

.conf-packages_promo i {
        font-size: 2rem;
        display: block;
    }

.conf-features {
    padding-block: var(--section-pad)
}

.conf-features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px
}

.conf-feature {
    background: var(--white);
    padding: 32px;
    text-align: center
}

.conf-feature__icon {
    font-size: 2rem;
    color: var(--burgundy-600);
    margin-bottom: 16px;
    display: block
}

.conf-feature__title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    color: var(--espresso-700);
    margin-bottom: 8px
}

.conf-feature__desc {
    font-size: .9rem;
    line-height: 1.6;
    color: var(--text-light)
}

.conf-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px
}

.conf-gallery__item img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    display: block
}

.conf-gallery__item--wide img {
    height: 100%
}

.capacity-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

.capacity-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9375rem
}

.capacity-table th {
    background: var(--espresso-700);
    color: var(--white);
    padding: 14px 16px;
    text-align: center;
    font-weight: 600;
    font-size: .875rem;
    white-space: nowrap
}

.capacity-table th:first-child {
    text-align: left
}

.capacity-table td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--ivory-dark);
    text-align: center;
    color: var(--text)
}

.capacity-table__room {
    text-align: left !important;
    font-weight: 600;
    color: var(--espresso-700)
}

.capacity-table tbody tr:nth-child(even) {
    background: var(--ivory-dark)
}

.capacity-table tbody tr:hover {
    background: var(--burgundy-100)
}

.capacity-table__highlight td {
    background: var(--burgundy-100) !important;
    font-weight: 700;
    color: var(--burgundy-700) !important
}

.capacity-table__note {
    font-size: .875rem;
    color: var(--text-light);
    margin-top: 16px;
    font-style: italic;
    text-align: center
}

.packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px
}

.package-card {
    background: var(--white);
    border: 1px solid var(--ivory-dark);
    padding: 32px;
    display: flex;
    flex-direction: column;
    transition: box-shadow .3s, border-color .3s
}

.package-card:hover {
    box-shadow: 0 8px 32px rgba(26, 164, 177, .1);
    border-color: var(--burgundy-300)
}

.package-card__icon {
    font-size: 1.8rem;
    color: var(--burgundy-600);
    margin-bottom: 16px
}

.package-card__title {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    color: var(--espresso-700);
    margin-bottom: 10px
}

.package-card__desc {
    font-size: .9rem;
    line-height: 1.65;
    color: var(--text-light);
    flex: 1;
    margin-bottom: 20px
}

.package-card__cta {
    display: inline-block;
    font-size: .875rem;
    font-weight: 600;
    color: var(--burgundy-600);
    letter-spacing: .05em;
    text-decoration: none;
    border-bottom: 2px solid var(--burgundy-200);
    padding-bottom: 2px;
    transition: color .3s, border-color .3s;
    width: fit-content
}

.package-card__cta:hover {
    color: var(--espresso-700);
    border-color: var(--espresso-700)
}

/* ─── Activities detail ──────────────────────── */
.activities-detail-grid {
    display: flex;
    flex-direction: column;
    gap: 80px
}

.activity-detail {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center
}

.activity-detail--reversed .activity-detail__img-wrap {
    order: 2
}

.activity-detail--reversed .activity-detail__body {
    order: 1
}

.activity-detail__img-wrap {
    overflow: hidden;
    aspect-ratio: 4/3
}

.activity-detail__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .6s var(--ease-out)
}

.activity-detail__img-wrap:hover img {
    transform: scale(1.04)
}

.activity-detail__icon {
    font-size: 2rem;
    color: var(--burgundy-600);
    margin-bottom: 12px;
    display: block
}

.activity-detail__tag {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--burgundy-600);
    margin-bottom: 8px
}

.activity-detail__title {
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 2.2vw, 2rem);
    color: var(--espresso-700);
    margin-bottom: 12px
}

/* ─── Day Pass Strip (Activities page) ──────────*/
.day-pass-strip {
    background: var(--burgundy-600);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 28px;
    border-radius: 4px;
    margin-top: 28px;
    flex-wrap: wrap
}

.day-pass-strip__text {
    display: flex;
    align-items: center;
    gap: 14px
}

.day-pass-strip__icon {
    font-size: 1.6rem;
    opacity: .85;
    flex-shrink: 0
}

.day-pass-strip__title {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    color: var(--white);
    margin-bottom: 2px
}

.day-pass-strip__sub {
    font-size: .85rem;
    color: rgba(255, 255, 255, .8)
}

/* ─── Offers Page ──────────────────────────────── */
.offer-featured {
    background: var(--espresso-900);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 56px;
    display: grid;
    min-height: 420px
}

@media(min-width:768px) {
    .offer-featured {
        grid-template-columns: 1fr 1fr
    }
}

.offer-featured__img-wrap {
    position: relative;
    min-height: 280px
}

.offer-featured__img-wrap img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.offer-featured__body {
    padding: 48px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: var(--espresso-800)
}

@media(max-width:767px) {
    .offer-featured__body {
        padding: 36px 24px
    }
}

.offer-featured__badge {
    display: inline-block;
    background: var(--gold-400);
    color: var(--white);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 2px;
    margin-bottom: 20px;
    width: fit-content
}

.offer-featured__title {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 2.8vw, 2.4rem);
    color: var(--white);
    margin-bottom: 14px;
    line-height: 1.15
}

.offer-featured__desc {
    color: rgba(255, 255, 255, .75);
    font-size: .9375rem;
    line-height: 1.7;
    margin-bottom: 24px
}

.offer-featured__includes {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 32px
}

.offer-featured__includes li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: .9375rem;
    color: rgba(255, 255, 255, .85)
}

.offer-featured__includes li i {
    color: var(--burgundy-400);
    margin-top: 2px;
    flex-shrink: 0
}

.offer-featured__validity {
    font-size: .8rem;
    color: rgba(255, 255, 255, .45);
    margin-top: -20px;
    margin-bottom: 28px
}

.offer-grid {
    display: grid;
    gap: 28px
}

@media(min-width:640px) {
    .offer-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .offer-grid--3 {
        grid-template-columns: repeat(3, 1fr)
    }
}

.offer-card {
    background: var(--white);
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 2px 16px rgba(0, 0, 0, .07);
    transition: transform .3s var(--ease-out), box-shadow .3s;
    display: flex;
    flex-direction: column
}

.offer-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 40px rgba(0, 0, 0, .13)
}

.offer-card__img-wrap {
    aspect-ratio: 16/9;
    overflow: hidden;
    position: relative
}

.offer-card__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ease-out)
}

.offer-card:hover .offer-card__img-wrap img {
    transform: scale(1.04)
}

.offer-card__badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: var(--gold-400);
    color: var(--white);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 2px
}

.offer-card__badge--teal {
    background: var(--burgundy-600)
}

.offer-card__body {
    padding: 26px 26px 30px;
    display: flex;
    flex-direction: column;
    flex: 1
}

.offer-card__tag {
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--burgundy-600);
    margin-bottom: 8px
}

.offer-card__title {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    color: var(--espresso-800);
    margin-bottom: 10px;
    line-height: 1.25
}

.offer-card__desc {
    color: var(--text-light);
    font-size: .9375rem;
    line-height: 1.7;
    margin-bottom: 18px;
    flex: 1
}

.offer-card__includes {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 22px
}

.offer-card__includes li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: .875rem;
    color: var(--text)
}

.offer-card__includes li i {
    color: var(--burgundy-600);
    font-size: .9rem;
    margin-top: 2px;
    flex-shrink: 0
}

.offer-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: auto
}

.offer-card__validity {
    font-size: .8rem;
    color: var(--text-light)
}

.offer-day-pass {
    display: grid;
    gap: 0;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(6, 58, 64, .08);
    background: var(--burgundy-900);
    box-shadow: 0 18px 48px rgba(7, 30, 45, .12)
}

@media(min-width:900px) {
    .offer-day-pass {
        grid-template-columns: 1fr 1fr
    }
}

.offer-day-pass__img-wrap {
    position: relative;
    min-height: 320px;
    overflow: hidden
}

.offer-day-pass__img-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(6, 58, 64, 0) 0%, rgba(6, 58, 64, .18) 100%)
}

.offer-day-pass__img-wrap img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .9s var(--ease-out)
}

.offer-day-pass:hover .offer-day-pass__img-wrap img {
    transform: scale(1.04)
}

.offer-day-pass__body {
    padding: 52px 44px;
    background: radial-gradient(circle at top right, rgba(128, 227, 235, .18), transparent 36%), linear-gradient(180deg, var(--burgundy-800) 0%, var(--burgundy-900) 100%);
    color: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media(max-width:899px) {
    .offer-day-pass__body {
        padding: 40px 24px
    }
}

.offer-day-pass__badge {
    display: inline-block;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .25);
    color: var(--burgundy-200);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 2px;
    margin-bottom: 18px;
    width: fit-content
}

.offer-day-pass__title {
    font-family: var(--font-heading);
    font-size: clamp(1.7rem, 2.5vw, 2.2rem);
    color: var(--white);
    margin-bottom: 12px;
    line-height: 1.15
}

.offer-day-pass__desc {
    color: rgba(255, 255, 255, .72);
    font-size: .9375rem;
    line-height: 1.7;
    margin-bottom: 24px
}

/* ── Day Pass Package Cards ─────────────────────── */
.dp-packages {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 28px
}

.dp-card {
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, .1);
    background: rgba(255, 255, 255, .05);
    transition: background .2s ease
}

.dp-card:hover {
    background: rgba(255, 255, 255, .09)
}

/* Featured card */
.dp-card--featured {
    padding: 22px 24px;
    border-color: rgba(212, 151, 78, .45);
    background: linear-gradient(135deg, rgba(194, 127, 56, .22) 0%, rgba(255, 255, 255, .04) 60%)
}

.dp-card--featured:hover {
    background: linear-gradient(135deg, rgba(194, 127, 56, .30) 0%, rgba(255, 255, 255, .06) 60%)
}

.dp-card__featured-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px
}

.dp-card__badge {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gold-300);
    background: rgba(212, 151, 78, .15);
    border: 1px solid rgba(212, 151, 78, .3);
    padding: 4px 10px;
    border-radius: 999px
}

/* Row cards */
.dp-card--row {
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px
}

.dp-card__info {
    flex: 1;
    min-width: 0
}

/* Shared elements */
.dp-card__name {
    font-weight: 700;
    color: var(--white);
    margin-bottom: 0
}

.dp-card--featured .dp-card__name {
    font-size: 1.05rem;
    margin-bottom: 6px
}

.dp-card--row .dp-card__name {
    font-size: .9rem;
    margin-bottom: 3px
}

.dp-card__desc {
    font-size: .82rem;
    color: rgba(255, 255, 255, .6);
    line-height: 1.5
}

.dp-card__desc i {
    color: var(--burgundy-300);
    margin-right: 3px
}

.dp-card__rate {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--white);
    white-space: nowrap
}

.dp-card--featured .dp-card__rate {
    font-size: 1.45rem
}

.dp-card--row .dp-card__rate {
    font-size: .875rem;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid rgba(184, 241, 245, .2);
    background: rgba(184, 241, 245, .1);
    color: var(--burgundy-100)
}

.offer-day-pass__validity {
    font-size: .8rem;
    color: rgba(255, 255, 255, .6);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px
}

.offer-day-pass__validity i {
    color: var(--gold-300)
}

.offer-day-pass__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap
}

.offer-seasonal-grid {
    display: grid;
    gap: 24px
}

@media(min-width:640px) {
    .offer-seasonal-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(min-width:1024px) {
    .offer-seasonal-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.seasonal-card {
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .15);
    transition: transform .3s var(--ease-out)
}

.seasonal-card:hover {
    transform: translateY(-4px)
}

.seasonal-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ease-out)
}

.seasonal-card:hover .seasonal-card__img {
    transform: scale(1.04)
}

.seasonal-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(7, 30, 45, .9) 0%, rgba(7, 30, 45, .3) 60%, transparent 100%)
}

.seasonal-card__body {
    position: relative;
    padding: 28px 24px
}

.seasonal-card__tag {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--burgundy-300);
    margin-bottom: 6px
}

.seasonal-card__title {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    color: var(--white);
    margin-bottom: 6px;
    line-height: 1.2
}

.seasonal-card__desc {
    font-size: .875rem;
    color: rgba(255, 255, 255, .75);
    line-height: 1.6;
    margin-bottom: 14px
}

.seasonal-card__link {
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--burgundy-300);
    display: flex;
    align-items: center;
    gap: 6px;
    transition: gap .3s
}

.seasonal-card__link:hover {
    gap: 10px
}

.activity-detail__desc {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--text-light);
    margin-bottom: 16px
}

.activity-detail__list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px
}

.activity-detail__list li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .9375rem;
    color: var(--text)
}

.activity-detail__list li i {
    color: var(--burgundy-600)
}

.kids-klub {
    background: linear-gradient(135deg, var(--burgundy-700) 0%, var(--espresso-700) 100%);
    padding: 72px 0;
    color: var(--white)
}

.kids-klub__inner {
    display: flex;
    gap: 40px;
    align-items: flex-start;
    max-width: 760px;
    margin: 0 auto
}

.kids-klub__badge {
    width: 64px;
    height: 64px;
    background: rgba(255, 255, 255, .15);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.kids-klub__badge i {
    font-size: 2rem;
    color: var(--white)
}

.kids-klub__title {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 2.5vw, 2.4rem);
    color: var(--white);
    margin-bottom: 12px
}

.kids-klub__text {
    font-size: 1rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, .8);
    margin-bottom: 20px
}

.kids-klub__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.kids-klub__tag {
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .06em;
    padding: 4px 12px;
    background: rgba(255, 255, 255, .15);
    color: var(--white)
}

.kids-klub__gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 32px
}

.kids-klub__gallery img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    display: block
}

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

.nearby-card {
    background: var(--white);
    overflow: hidden;
    transition: box-shadow .3s
}

.nearby-card:hover {
    box-shadow: 0 8px 32px rgba(19, 81, 122, .12)
}

.nearby-card__img-wrap {
    aspect-ratio: 16/10;
    overflow: hidden
}

.nearby-card__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .6s var(--ease-out)
}

.nearby-card:hover .nearby-card__img-wrap img {
    transform: scale(1.05)
}

.nearby-card__body {
    padding: 20px
}

.nearby-card__title {
    font-family: var(--font-heading);
    font-size: 1rem;
    color: var(--espresso-700);
    margin-bottom: 6px
}

.nearby-card__meta {
    font-size: .8rem;
    color: var(--burgundy-600);
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 4px
}

.nearby-card__desc {
    font-size: .875rem;
    line-height: 1.6;
    color: var(--text-light)
}

.nearby-note {
    text-align: center;
    font-size: .9rem;
    color: var(--text-light);
    margin-top: 32px;
    font-style: italic
}

/* ─── Contact Page ───────────────────────────── */
.contact__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start
}

.contact__details {
    padding-top: 8px
}

.contact__block {
    margin-bottom: 40px
}

.contact__block-title {
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-light);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px
}

.contact__block-title i {
    color: var(--burgundy-600)
}

.contact__address {
    font-style: normal;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--text-light);
    margin-bottom: 12px
}

.contact__links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.contact__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .9375rem;
    color: var(--text);
    text-decoration: none;
    transition: color .3s
}

.contact__link:hover {
    color: var(--burgundy-600)
}

.contact__link i {
    color: var(--burgundy-600);
    width: 16px;
    flex-shrink: 0
}

.contact__link--whatsapp {
    color: var(--text)
}

.contact__link--whatsapp i {
    color: #25D366
}

.contact__link--whatsapp:hover {
    color: #25D366
}

.contact__info-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px
}

.contact__info-list li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .9375rem;
    color: var(--text-light)
}

.contact__info-list li i {
    color: var(--burgundy-600);
    width: 16px
}

.contact__note {
    font-size: .875rem;
    color: var(--text-light);
    font-style: italic;
    margin-top: 4px
}

.contact__map-wrap {
    position: sticky;
    top: calc(var(--nav-height) + 24px)
}

.contact__map {
    overflow: hidden;
    border: 2px solid var(--ivory-dark)
}

.contact__map iframe {
    display: block
}

.contact__map-cta {
    margin-top: 12px;
    text-align: center
}

.contact__directions-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px
}

.social-links {
    display: flex;
    gap: 12px;
    margin-top: 4px
}

.social-link {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ivory-dark);
    color: var(--text);
    font-size: 1.1rem;
    text-decoration: none;
    transition: background .3s, color .3s
}

.social-link:hover {
    background: var(--burgundy-600);
    color: var(--white)
}

.enquiry-form-wrap {
    max-width: 800px;
    margin: 0 auto
}

.enquiry-form {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.enquiry-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px
}

.enquiry-form__field {
    display: flex;
    flex-direction: column;
    gap: 6px
}

.enquiry-form__field--full {
    grid-column: 1/-1
}

.enquiry-form__label {
    font-size: .875rem;
    font-weight: 600;
    color: var(--text);
    letter-spacing: .02em
}

.enquiry-form__label span {
    color: var(--burgundy-600)
}

.enquiry-form__input,
.enquiry-form__textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--ivory-dark);
    background: var(--white);
    font-family: var(--font-body);
    font-size: .9375rem;
    color: var(--text);
    outline: none;
    transition: border-color .3s;
    -webkit-appearance: none
}

.enquiry-form__input:focus,
.enquiry-form__textarea:focus {
    border-color: var(--burgundy-600)
}

.enquiry-form__textarea {
    resize: vertical;
    min-height: 140px
}

.enquiry-form__submit {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap
}

.enquiry-form__alt {
    font-size: .875rem;
    color: var(--text-light)
}

.enquiry-form__alt a {
    color: var(--burgundy-600);
    font-weight: 600
}

/* ─── Responsive helpers ─────────────────────────*/
@media(max-width:1024px) {

    .outlet-detail__grid,
    .outlet-detail__grid--reversed .outlet-detail__images,
    .outlet-detail__grid--reversed .image__carousel,
    .outlet-detail__grid--reversed .outlet-detail__info {
        grid-template-columns: 1fr;
        display: flex;
        flex-direction: column
    }

    .outlet-detail__grid {
        display: flex;
        flex-direction: column;
        gap: 32px
    }

    .room-detail__grid {
        grid-template-columns: 1fr;
        gap: 32px
    }

    .room-detail__grid--reversed .image__carousel,
    .room-detail__grid--reversed .room-detail__info {
        order: unset
    }

    .conf-intro {
        grid-template-columns: 1fr;
        gap: 40px
    }

    .conf-features__grid {
        grid-template-columns: 1fr 1fr
    }

    .conf-gallery {
        grid-template-columns: 1fr 1fr
    }

    .packages-grid {
        grid-template-columns: 1fr 1fr
    }

    .contact__grid {
        grid-template-columns: 1fr;
        gap: 48px
    }

    .contact__map-wrap {
        position: static
    }

    .nearby-grid {
        grid-template-columns: 1fr 1fr
    }

    .activity-detail {
        grid-template-columns: 1fr;
        gap: 32px
    }

    .activity-detail--reversed .activity-detail__img-wrap,
    .activity-detail--reversed .activity-detail__body {
        order: unset
    }

    .includes-strip__grid {
        grid-template-columns: repeat(5, 1fr)
    }
}

@media(max-width:767px) {
    .dining__images {
        grid-template-columns: 1fr
    }

    .conf-features__grid {
        grid-template-columns: 1fr
    }

    .packages-grid {
        grid-template-columns: 1fr
    }

    .enquiry-form__row {
        grid-template-columns: 1fr
    }

    .nearby-grid {
        grid-template-columns: 1fr
    }

    .includes-strip__grid {
        grid-template-columns: repeat(2, 1fr)
    }

    .kids-klub__inner {
        flex-direction: column;
        gap: 20px
    }

    .kids-klub__gallery {
        grid-template-columns: 1fr
    }

    .outlets-note__inner {
        flex-direction: column;
        gap: 16px
    }
}