/* =========================================================
   SAN VISTA - COMPLETE CLEAN CSS  (assets/css/san.css)
   Navy / Gold / Ivory
   Order: 1 Header  2 Footer  3 Facilities  4 Dining/Food
          5 Food carousel  6 Hero  7 About (svab)  8 Floating
          buttons  9 About Us page (sv-ab)  10 Policies
          11 Scroll animation
========================================================= */


/* =========================================================
   1. HEADER
========================================================= */

.header.header-2 {
    --svx-navy: #1c2d47;
    --svx-navy-deep: #1b2b44;
    --svx-ink: #14233d;
    --svx-gold: #e2b073;
    --svx-paper: #f6f4ef;
    --svx-line: #cfd2d8;

    position: relative;
    z-index: 999;
    width: 100%;
    font-family: "Poppins", sans-serif;
}

/* ---------- Top contact strip ---------- */

.header.header-2 .header-top {
    background: var(--svx-paper) !important;
    border-bottom: 1px solid var(--svx-line);
    padding: 10px 0;
}

.header.header-2 .header-top .container-fluid {
    padding-left: 40px;
    padding-right: 40px;
}

.header.header-2 .header-contact-info ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 30px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.header.header-2 .header-contact-info ul li {
    margin: 0;
    padding: 0;
    color: var(--svx-ink);
}

.header.header-2 .header-contact-info ul li p {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: var(--svx-ink);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
}

.header.header-2 .header-contact-info ul li i {
    color: var(--svx-gold);
    font-size: 14px;
}

/* ---------- Main navy bar ---------- */

.header.header-2 .header-lower {
    background: var(--svx-navy-deep) !important;
    border-bottom: 2px solid var(--svx-gold);
    box-shadow: 0 5px 20px rgba(20, 35, 61, 0.12);
}

.header.header-2 .header-lower > .container-fluid {
    padding-left: 40px;
    padding-right: 40px;
}

/* ---------- Logo ---------- */

.header.header-2 .header-left {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 22px;
}

.header.header-2 .header-left .header-sidebar {
    flex: 0 0 auto;
}

.header.header-2 .logo-box {
    display: flex;
    align-items: center;
    padding-right: 30px;
    border-right: 1px solid rgba(226, 176, 115, 0.5);
}

.header.header-2 .logo-box .logo,
.header.header-2 .logo-box figure {
    margin: 0;
    padding: 0;
}

.header.header-2 .logo-box .logo a {
    display: inline-flex;
    align-items: center;
}

.header.header-2 .logo-box .logo img {
    display: block;
    width: 175px;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Gold corner brackets around the logo */

.header-left .logo a {
    position: relative;
    display: inline-flex;
    padding: 9px 14px;
}

.header-left .logo a::before,
.header-left .logo a::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid #e2b073;
    transition: width 0.4s ease, height 0.4s ease;
    pointer-events: none;
}

.header-left .logo a::before {
    top: 0;
    left: 0;
    border-right: 0;
    border-bottom: 0;
}

.header-left .logo a::after {
    right: 0;
    bottom: 0;
    border-left: 0;
    border-top: 0;
}

.header-left .logo a:hover::before,
.header-left .logo a:hover::after {
    width: 100%;
    height: 100%;
}

/* ---------- Navigation links ---------- */

.header.header-2 .header-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-width: 0;
}

.header.header-2 .main-menu {
    display: flex;
    align-items: center;
}

.header.header-2 .main-menu nav {
    display: block;
}

.header.header-2 .main-menu nav > ul {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.header.header-2 .main-menu nav > ul > li {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}

.header.header-2 .main-menu nav > ul > li > a {
    position: relative;
    display: block;
    padding: 35px 12px;
    color: #fff !important;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.3s ease;
}

/* Gold underline animation */

.header.header-2 .main-menu nav > ul > li > a::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 25px;
    height: 2px;
    background: var(--svx-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.header.header-2 .main-menu nav > ul > li:hover > a,
.header.header-2 .main-menu nav > ul > li.active > a,
.header.header-2 .main-menu nav > ul > li.current > a {
    color: var(--svx-gold) !important;
}

.header.header-2 .main-menu nav > ul > li:hover > a::after,
.header.header-2 .main-menu nav > ul > li.active > a::after,
.header.header-2 .main-menu nav > ul > li.current > a::after {
    transform: scaleX(1);
}

/* ---------- "More" dropdown (desktop) ---------- */

.header.header-2 .main-menu nav > ul > li.dropdown > a i {
    margin-left: 2px;
    font-size: 9px;
    color: #e2b073;
    transition: transform 0.3s ease;
}

.header.header-2 .main-menu nav > ul > li.dropdown:hover > a i {
    transform: rotate(180deg);
}

.header.header-2 .main-menu nav > ul > li.dropdown > .dropdown-menu {
    display: block !important;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    margin: 0;
    padding: 8px 0;
    list-style: none;
    background: #1b2b44;
    border: 0;
    border-top: 2px solid #e2b073;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 14px 28px rgba(20, 35, 61, 0.28);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
    z-index: 1000;
}

.header.header-2 .main-menu nav > ul > li.dropdown:hover > .dropdown-menu,
.header.header-2 .main-menu nav > ul > li.dropdown:focus-within > .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.header.header-2 .main-menu .dropdown-menu li {
    display: block;
    margin: 0;
    padding: 0;
}

.header.header-2 .main-menu .dropdown-menu li > a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    color: #fff !important;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.25s ease, color 0.25s ease, padding-left 0.25s ease;
}

.header.header-2 .main-menu .dropdown-menu li > a::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 12px;
    color: #e2b073;
}

.header.header-2 .main-menu .dropdown-menu li > a:hover {
    background: rgba(226, 176, 115, 0.12);
    color: #e2b073 !important;
    padding-left: 26px;
}

/* ---------- Right-side controls ---------- */

.header.header-2 .header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    gap: 22px !important;
}

.header.header-2 .header-sidebar {
    display: flex;
    align-items: center;
    justify-content: center;
}

.header.header-2 .header-sidebar .sidebar-toggler {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 6px;
    width: 32px;
    height: 40px;
    padding: 5px;
    color: var(--svx-gold) !important;
    text-decoration: none;
    cursor: pointer;
}

.header.header-2 .header-sidebar .sidebar-toggler span {
    display: block;
    width: 25px;
    height: 2px;
    border-radius: 2px;
    background: var(--svx-gold) !important;
    transition: width 0.3s ease, background 0.3s ease;
}

.header.header-2 .header-sidebar .sidebar-toggler span:last-child {
    width: 17px;
}

.header.header-2 .header-sidebar .sidebar-toggler:hover span:last-child {
    width: 25px;
}

.header.header-2 .header-button {
    display: flex;
    align-items: center;
}

/* Toggle position: desktop = beside logo, tablet/phone = right side */

@media (min-width: 1200px) {
    .header.header-2 .header-left {
        gap: 32px;
    }

    .header.header-2 .header-right .header-sidebar {
        display: none !important;
    }
}

@media (max-width: 1199.98px) {
    .header.header-2 .header-left .header-sidebar {
        display: none !important;
    }
}

/* ---------- Offcanvas sidebar ---------- */

#offcanvas-sidebar {
    background: #f6f4ef;
    color: #14233d;
    border-left: 2px solid #e2b073;
}

#offcanvas-sidebar.offcanvas-start {
    border-left: 0;
    border-right: 2px solid #e2b073;
}

#offcanvas-sidebar .offcanvas-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px;
    border-bottom: 1px solid #cfd2d8;
}

#offcanvas-sidebar .offcanvas-logo figure {
    margin: 0;
}

#offcanvas-sidebar .offcanvas-logo img {
    display: block;
    width: 160px;
    max-width: 100%;
    height: auto;
}

#offcanvas-sidebar .offcanvas-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid #cfd2d8;
    border-radius: 50%;
    color: #14233d;
    font-size: 21px;
    transition: all 0.3s ease;
}

#offcanvas-sidebar .offcanvas-close:hover {
    background: #1c2d47;
    border-color: #e2b073;
    color: #e2b073;
}

#offcanvas-sidebar .offcanvas-body {
    padding: 25px;
}

#offcanvas-sidebar .offcanvas-about p {
    color: #4a5a76;
    font-size: 14px;
    line-height: 1.8;
}

#offcanvas-sidebar .widget-title h3 {
    color: #1c2d47;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 25px;
    font-weight: 500;
}

#offcanvas-sidebar .offcanvas-cta-list {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 20px;
}

#offcanvas-sidebar .offcanvas-cta-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border: 1px solid #e2b073;
    border-radius: 50%;
    color: #1c2d47;
    background: rgba(226, 176, 115, 0.15);
}

#offcanvas-sidebar .offcanvas-cta-content,
#offcanvas-sidebar .offcanvas-cta-content p,
#offcanvas-sidebar .offcanvas-cta-content a {
    color: #14233d;
    font-size: 14px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

#offcanvas-sidebar .offcanvas-cta-content p {
    margin: 0;
}

#offcanvas-sidebar .offcanvas-cta-content a {
    text-decoration: none;
    transition: color 0.3s ease;
}

#offcanvas-sidebar .offcanvas-cta-content a:hover {
    color: #a97c3f;
}

#offcanvas-sidebar .offcanvas-button-wapper {
    margin-top: 25px;
}

#offcanvas-sidebar .offcanvas-button-wapper .theme-button.style-1 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 45px;
    padding: 12px 25px;
    background: #e2b073;
    border: 1px solid #e2b073;
    border-radius: 2px;
    color: #14233d;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s ease;
}

#offcanvas-sidebar .offcanvas-button-wapper .theme-button.style-1:hover {
    background: #1c2d47;
    border-color: #1c2d47;
    color: #fff;
}

#offcanvas-sidebar .social-icon {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

#offcanvas-sidebar .social-icon li {
    margin: 0;
    padding: 0;
}

#offcanvas-sidebar .social-icon a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #1c2d47;
    border: 1px solid #1c2d47;
    border-radius: 50%;
    color: #e2b073;
    text-decoration: none;
    transition: all 0.3s ease;
}

#offcanvas-sidebar .social-icon a:hover {
    background: #e2b073;
    border-color: #e2b073;
    color: #1c2d47;
}

/* ---------- Sidebar menu: icon + label ---------- */

#offcanvas-sidebar .mobile-menu ul,
#offcanvas-sidebar .mean-nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#offcanvas-sidebar .mobile-menu li,
#offcanvas-sidebar .mean-nav li {
    border-bottom: 1px solid #e3e0d8;
}

#offcanvas-sidebar .mobile-menu li > a,
#offcanvas-sidebar .mean-nav li > a {
    display: flex !important;
    align-items: center;
    gap: 18px;
    padding: 15px 8px !important;
    color: #1c2d47 !important;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    font-weight: 500;
    text-transform: none !important;
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
}

#offcanvas-sidebar .mobile-menu li > a::before,
#offcanvas-sidebar .mean-nav li > a::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    flex: 0 0 26px;
    width: 26px;
    text-align: center;
    font-size: 20px;
    color: #a97c3f;
}

#offcanvas-sidebar a[href="index.html"]::before    { content: "\f015"; }
#offcanvas-sidebar a[href="about.html"]::before    { content: "\f05a"; }
#offcanvas-sidebar a[href="room.html"]::before     { content: "\f236"; }
#offcanvas-sidebar a[href="dining.html"]::before   { content: "\f2e7"; }
#offcanvas-sidebar a[href="services.html"]::before { content: "\f562"; }
#offcanvas-sidebar a[href="tourism.html"]::before  { content: "\f5ca"; }
#offcanvas-sidebar a[href="gallery.html"]::before  { content: "\f302"; }
#offcanvas-sidebar a[href="contact.html"]::before  { content: "\f095"; }

#offcanvas-sidebar .mobile-menu li > a:hover,
#offcanvas-sidebar .mean-nav li > a:hover {
    color: #a97c3f !important;
    padding-left: 16px !important;
}

/* "More" in the sidebar */

#offcanvas-sidebar .dropdown-menu {
    position: static;
    float: none;
    min-width: 0;
    margin: 0;
    padding: 0 0 0 22px;
    background: transparent;
    border: 0;
    box-shadow: none;
}

#offcanvas-sidebar :is(.mobile-menu, .mean-nav) a[href="#"]::before { content: "\f141"; }

#offcanvas-sidebar .mobile-menu li > a i { display: none; }

/* ---------- Header responsive ---------- */

@media (max-width: 1399px) {
    .header.header-2 .header-lower > .container-fluid {
        padding-left: 22px;
        padding-right: 22px;
    }

    .header.header-2 .header-content {
        min-height: 82px;
        gap: 14px;
    }

    .header.header-2 .logo-box {
        padding-right: 20px;
    }

    .header.header-2 .logo-box .logo img {
        width: 150px;
    }

    .header.header-2 .main-menu nav > ul > li > a {
        padding: 32px 8px;
        font-size: 14px;
    }

    .header.header-2 .main-menu nav > ul > li > a::after {
        left: 8px;
        right: 8px;
        bottom: 22px;
    }

    .header.header-2 .header-right {
        gap: 14px !important;
    }
}

@media (max-width: 1199px) {
    .header.header-2 .header-top {
        display: none !important;
    }

    .header.header-2 .header-content {
        min-height: 76px;
        gap: 12px;
    }

    .header.header-2 .logo-box {
        padding-right: 0;
        border-right: 0;
    }

    .header.header-2 .logo-box .logo img {
        width: 150px;
    }

    .header.header-2 .header-navigation {
        display: none !important;
    }

    .header.header-2 .header-right {
        margin-left: auto;
    }
}

@media (max-width: 767px) {
    .header.header-2 .header-lower > .container-fluid {
        padding-left: 20px;
        padding-right: 20px;
    }

    .header.header-2 .header-content {
        min-height: 70px;
    }

    .header.header-2 .logo-box .logo img {
        width: 135px;
    }

    .header.header-2 .header-left {
        gap: 14px;
    }

    .header.header-2 .header-right {
        gap: 12px !important;
    }

    .header.header-2 .header-sidebar .sidebar-toggler {
        width: 28px;
    }

    .header.header-2 .header-sidebar .sidebar-toggler span {
        width: 23px;
    }
}

@media (max-width: 380px) {
    .header.header-2 .header-lower > .container-fluid {
        padding-left: 14px;
        padding-right: 14px;
    }

    .header.header-2 .header-content {
        min-height: 64px;
    }

    .header.header-2 .logo-box .logo img {
        width: 112px;
    }

    .header.header-2 .header-right {
        gap: 9px !important;
    }
}

.header.header-2 a:focus-visible,
#offcanvas-sidebar a:focus-visible,
#offcanvas-sidebar button:focus-visible {
    outline: 2px solid #e2b073;
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .header.header-2 *,
    .header.header-2 *::before,
    .header.header-2 *::after,
    #offcanvas-sidebar *,
    #offcanvas-sidebar *::before,
    #offcanvas-sidebar *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}


/* =========================================================
   2. FOOTER
========================================================= */

.svx-footer {
    --svx-navy: #1c2d47;
    --svx-navy-deep: #1b2b44;
    --svx-ink: #14233d;
    --svx-gold: #e2b073;
    --svx-paper: #f6f4ef;
    --svx-line: #cfd2d8;

    font-family: "Poppins", sans-serif;
    color: var(--svx-ink);
    width: 100%;
    overflow: hidden;
}

.svx-footer *,
.svx-footer *::before,
.svx-footer *::after {
    box-sizing: border-box;
}

/* ---------- Light top section ---------- */

.svx-footer .svx-top {
    position: relative;
    background: var(--svx-paper);
    padding: 120px 0 60px;
    overflow: hidden;
}

.svx-footer .svx-swoosh {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 160px;
    pointer-events: none;
}

.svx-footer .svx-leaves {
    position: absolute;
    top: 50%;
    height: 330px;
    width: auto;
    max-width: 45%;
    transform: translateY(-40%);
    pointer-events: none;
}

.svx-footer .svx-leaves.left {
    left: -10px;
}

.svx-footer .svx-leaves.right {
    right: -10px;
    transform: translateY(-30%) scaleX(-1);
}

.svx-footer .svx-head {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 0 20px;
}

.svx-footer .svx-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 34px;
    margin: 0;
    font-size: 19px;
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--svx-ink);
}

.svx-footer .svx-eyebrow::before,
.svx-footer .svx-eyebrow::after {
    content: "";
    display: block;
    flex: 0 0 100px;
    height: 1px;
    background: var(--svx-ink);
}

.svx-footer .svx-title {
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 500;
    font-size: clamp(36px, 5vw, 70px);
    line-height: 1.1;
    letter-spacing: -0.01em;
    color: var(--svx-ink);
    margin: 26px 0 20px;
}

.svx-footer .svx-sub {
    margin: 0;
    font-size: clamp(15px, 1.6vw, 23px);
    line-height: 1.6;
    color: #2f4468;
}

/* ---------- Contact information strip ---------- */

.svx-footer .svx-info {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1560px;
    width: 100%;
    margin: 96px auto 0;
    padding: 0 70px;
}

.svx-footer .svx-item {
    display: flex;
    align-items: center;
    gap: 26px;
    min-width: 0;
    padding: 8px 46px;
    border-left: 1px solid var(--svx-line);
}

.svx-footer .svx-item:first-child {
    border-left: 0;
    padding-left: 0;
}

.svx-footer .svx-icon {
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1.5px solid #c9ccd3;
    background: rgba(255, 255, 255, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    color: var(--svx-navy);
}

.svx-footer .svx-label {
    display: block;
    margin: 0 0 10px;
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--svx-ink);
}

.svx-footer .svx-text,
.svx-footer .svx-text a {
    margin: 0;
    font-size: 16.5px;
    line-height: 1.55;
    color: #1f3354;
    text-decoration: none;
    white-space: nowrap;
}

.svx-footer .svx-text a {
    transition: color 0.25s ease;
}

.svx-footer .svx-text a i {
    margin-left: 10px;
    transition: transform 0.25s ease;
}

.svx-footer .svx-text a:hover {
    color: #a97c3f;
}

.svx-footer .svx-text a:hover i {
    transform: translateX(4px);
}

/* ---------- Bottom navy bar ---------- */

.svx-footer .svx-bar {
    position: relative;
    background: var(--svx-navy-deep);
    color: #fff;
    padding: 22px 0 30px;
    overflow: hidden;
}

.svx-footer .svx-wave {
    position: absolute;
    bottom: 0;
    width: 22%;
    height: 30px;
    pointer-events: none;
}

.svx-footer .svx-wave.left {
    left: 0;
}

.svx-footer .svx-wave.right {
    right: 0;
    transform: scaleX(-1);
}

.svx-footer .svx-bar-inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    max-width: 1560px;
    width: 100%;
    margin: 0 auto;
    padding: 0 100px;
}

.svx-footer .svx-logo {
    flex: 0 0 auto;
    padding-right: 52px;
    border-right: 2px solid var(--svx-gold);
    line-height: 0;
}

.svx-footer .svx-logo img {
    display: block;
    height: 64px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.svx-footer .svx-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 0 0 48px;
    padding: 0;
}

.svx-footer .svx-nav li {
    margin: 0;
    padding: 0;
}

.svx-footer .svx-nav li + li {
    margin-left: 28px;
    padding-left: 28px;
    border-left: 1.5px solid var(--svx-gold);
    line-height: 1.1;
}

.svx-footer .svx-nav a,
.svx-footer .svx-privacy a {
    color: #fff;
    font-size: 15px;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.svx-footer .svx-nav a:hover,
.svx-footer .svx-privacy a:hover {
    color: var(--svx-gold);
}

.svx-footer .svx-copy {
    margin-left: auto;
    padding: 6px 44px 6px 46px;
    border-left: 2px solid var(--svx-gold);
    border-right: 2px solid var(--svx-gold);
    font-size: 14px;
    line-height: 2;
    color: rgba(255, 255, 255, 0.92);
}

.svx-footer .svx-copy p {
    margin: 0;
}

.svx-footer .svx-copy a {
    color: inherit;
    text-decoration: none;
}

.svx-footer .svx-copy a:hover {
    color: var(--svx-gold);
}

.svx-footer .svx-privacy {
    flex: 0 0 auto;
    padding-left: 42px;
}

/* ---------- Footer: desktop bar stays on one line ---------- */

@media (min-width: 1200px) {
    footer.svx-footer .svx-bar .svx-bar-inner {
        flex-wrap: nowrap !important;
    }

    footer.svx-footer .svx-bar .svx-nav {
        flex-wrap: nowrap !important;
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    footer.svx-footer .svx-bar .svx-nav li {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    footer.svx-footer .svx-bar .svx-nav li + li {
        margin-left: 16px !important;
        padding-left: 16px !important;
    }

    footer.svx-footer .svx-bar .svx-copy {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin-left: 24px !important;
        padding: 4px 22px !important;
    }

    footer.svx-footer .svx-bar .svx-privacy {
        padding-left: 22px !important;
    }
}

/* ---------- Footer: laptop ---------- */

@media (max-width: 1499px) {
    .svx-footer .svx-top {
        padding: 90px 0 50px;
    }

    .svx-footer .svx-info {
        justify-content: space-between;
        margin-top: 70px;
        padding: 0 40px;
    }

    .svx-footer .svx-item {
        gap: 16px;
        padding: 8px 24px;
    }

    .svx-footer .svx-icon {
        flex-basis: 58px;
        width: 58px;
        height: 58px;
        font-size: 20px;
    }

    .svx-footer .svx-label {
        font-size: 11.5px;
        letter-spacing: 0.22em;
    }

    .svx-footer .svx-text,
    .svx-footer .svx-text a {
        font-size: 15px;
    }

    .svx-footer .svx-bar {
        padding: 7px 0 8px;
    }

    .svx-footer .svx-bar-inner {
        padding: 0 40px;
    }

    .svx-footer .svx-logo {
        padding-right: 30px;
    }

    .svx-footer .svx-logo img {
        height: 56px;
    }

    .svx-footer .svx-nav {
        margin-left: 28px;
    }

    .svx-footer .svx-nav li + li {
        margin-left: 18px;
        padding-left: 18px;
    }

    .svx-footer .svx-nav a,
    .svx-footer .svx-privacy a {
        font-size: 14px;
    }

    .svx-footer .svx-copy {
        padding: 4px 28px;
        font-size: 13px;
    }

    .svx-footer .svx-privacy {
        padding-left: 28px;
    }
}

/* ---------- Footer: tablet / small laptop ---------- */

@media (max-width: 1279px) {
    .svx-footer .svx-bar-inner {
        flex-wrap: wrap;
        row-gap: 28px;
        padding: 0 40px;
    }

    .svx-footer .svx-copy {
        order: 3;
        flex: 1 1 100%;
        margin-left: 0;
        padding: 0;
        border: 0;
    }

    .svx-footer .svx-privacy {
        margin-left: auto;
        padding-left: 0;
    }

    .svx-footer .svx-info {
        flex-wrap: wrap;
        row-gap: 30px;
        padding: 0 30px;
    }

    .svx-footer .svx-item {
        flex: 1 1 40%;
        padding: 8px 30px;
    }

    .svx-footer .svx-item:nth-child(3) {
        border-left: 0;
        padding-left: 0;
    }
}

/* Footer info: tidy 2 x 2 grid on tablet / small laptop */

@media (min-width: 768px) and (max-width: 1279px) {
    .svx-footer .svx-info {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px 0;
        align-items: start;
    }

    .svx-footer .svx-item {
        align-items: flex-start;
        padding: 8px 24px;
    }

    .svx-footer .svx-item:nth-child(odd) {
        border-left: 0;
        padding-left: 0;
    }

    .svx-footer .svx-item:nth-child(even) {
        border-left: 1px solid #cfd2d8;
    }

    .svx-footer .svx-text,
    .svx-footer .svx-text a {
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

/* Keep Privacy Policy clear of the back-to-top button */

@media (min-width: 1280px) {
    footer.svx-footer .svx-bar .svx-bar-inner {
        padding-right: 90px !important;
    }
}

@media (max-width: 1279px) {
    footer.svx-footer .svx-bar .svx-privacy {
        margin-right: 70px;
    }
}

/* ---------- Footer: mobile ---------- */

@media (max-width: 767px) {
    .svx-footer .svx-top {
        padding: 80px 0 40px;
    }

    .svx-footer .svx-eyebrow {
        gap: 14px;
        font-size: 13px;
        letter-spacing: 0.26em;
    }

    .svx-footer .svx-eyebrow::before,
    .svx-footer .svx-eyebrow::after {
        flex-basis: 30px;
    }

    .svx-footer .svx-leaves {
        height: 200px;
        max-width: 40%;
        opacity: 0.6;
    }

    .svx-footer .svx-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 26px;
        margin-top: 56px;
        padding: 0 26px;
    }

    .svx-footer .svx-item,
    .svx-footer .svx-item:first-child,
    .svx-footer .svx-item:nth-child(3) {
        flex: 1 1 auto;
        width: 100%;
        border-left: 0;
        padding: 0;
    }

    .svx-footer .svx-item {
        gap: 18px;
    }

    .svx-footer .svx-icon {
        flex-basis: 54px;
        width: 54px;
        height: 54px;
        font-size: 19px;
    }

    .svx-footer .svx-label {
        margin-bottom: 6px;
        letter-spacing: 0.15em;
    }

    .svx-footer .svx-text,
    .svx-footer .svx-text a {
        font-size: 14px;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .svx-footer .svx-bar {
        padding: 24px 0 36px;
    }

    .svx-footer .svx-bar-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        padding: 0 26px;
    }

    .svx-footer .svx-logo {
        border-right: 0;
        padding-right: 0;
    }

    .svx-footer .svx-logo img {
        height: 52px;
    }

    .svx-footer .svx-nav {
        flex-wrap: wrap;
        gap: 14px 0;
        margin: 0;
    }

    .svx-footer .svx-nav li + li {
        margin-left: 14px;
        padding-left: 14px;
    }

    .svx-footer .svx-nav a,
    .svx-footer .svx-privacy a {
        font-size: 13px;
    }

    .svx-footer .svx-copy {
        order: initial;
        flex: 1 1 auto;
        font-size: 12px;
        line-height: 1.8;
    }

    .svx-footer .svx-privacy {
        margin-left: 0;
    }
}

@media (max-width: 380px) {
    .svx-footer .svx-eyebrow {
        font-size: 11px;
        letter-spacing: 0.16em;
    }

    .svx-footer .svx-eyebrow::before,
    .svx-footer .svx-eyebrow::after {
        flex-basis: 20px;
    }

    .svx-footer .svx-title {
        font-size: 34px;
    }

    .svx-footer .svx-item {
        gap: 12px;
    }

    .svx-footer .svx-nav li + li {
        margin-left: 10px;
        padding-left: 10px;
    }
}


/* =========================================================
   3. FACILITIES GRID
========================================================= */

.lx-fac {
    --lx-navy: #1b2b44;
    --lx-ink: #14233d;
    --lx-gold: #e2b073;
    --lx-gold-deep: #a97c3f;
    --lx-paper: #f6f4ef;
    --lx-line: #cfd2d8;

    font-family: "Poppins", "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--lx-paper);
    padding: 100px 0;
}

.lx-fac .section-title-area {
    margin-bottom: 50px;
}

.lx-fac .section-title,
.lx-fac .section-title.section-title-white {
    text-align: left;
}

.lx-fac .section-title .sub-title,
.lx-fac .section-title.section-title-white .sub-title,
.lx-fac .lx-fac-tag {
    display: inline-block;
    background: var(--lx-navy) !important;
    color: #fff !important;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 8px 18px;
    border-radius: 4px;
    margin-bottom: 18px;
}

.lx-fac .section-title h2,
.lx-fac .section-title.section-title-white h2,
.lx-fac .lx-fac-title {
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    font-weight: 600;
    font-size: clamp(30px, 3.6vw, 46px);
    line-height: 1.25;
    color: var(--lx-ink) !important;
    -webkit-text-fill-color: var(--lx-ink) !important;
    margin: 0;
}

.lx-fac-head {
    margin-bottom: 50px;
}

.lx-fac-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.lx-fac-card {
    position: relative;
    background: #fff;
    border: 1px solid var(--lx-line);
    border-radius: 14px;
    padding: 34px 26px 30px;
    overflow: hidden;
    transition: background 0.35s, transform 0.35s, box-shadow 0.35s, border-color 0.35s;
}

.lx-fac-card::after {
    content: "";
    position: absolute;
    left: 26px;
    bottom: 0;
    width: 0;
    height: 3px;
    background: var(--lx-gold);
    transition: width 0.4s;
}

.lx-fac-card:hover {
    background: var(--lx-navy);
    border-color: var(--lx-navy);
    transform: translateY(-6px);
    box-shadow: 0 18px 34px rgba(27, 43, 68, 0.22);
}

.lx-fac-card:hover::after {
    width: calc(100% - 52px);
}

.lx-fac-ico {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    border: 1.5px solid #c9ccd3;
    background: rgba(246, 244, 239, 0.8);
    display: grid;
    place-items: center;
    margin-bottom: 22px;
    transition: background 0.35s, border-color 0.35s;
}

.lx-fac-ico i,
.lx-fac-ico svg {
    font-size: 24px;
    color: var(--lx-navy);
    transition: color 0.35s;
}

.lx-fac-ico svg {
    width: 24px;
    height: 24px;
}

.lx-fac-card:hover .lx-fac-ico {
    background: var(--lx-gold);
    border-color: var(--lx-gold);
}

.lx-fac-card:hover .lx-fac-ico i,
.lx-fac-card:hover .lx-fac-ico svg {
    color: var(--lx-navy);
}

.lx-fac-card h3 {
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    color: var(--lx-ink);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.25;
    margin: 0 0 10px;
    transition: color 0.35s;
}

.lx-fac-card p {
    color: #4a5a76;
    font-size: 14.5px;
    line-height: 1.7;
    margin: 0;
    transition: color 0.35s;
}

.lx-fac-card:hover h3 {
    color: #fff;
}

.lx-fac-card:hover p {
    color: rgba(255, 255, 255, 0.78);
}

@media (max-width: 1199px) {
    .lx-fac-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 991px) {
    .lx-fac {
        padding: 70px 0;
    }
}

@media (max-width: 575px) {
    .lx-fac-grid {
        grid-template-columns: 1fr;
    }

    .lx-fac-card {
        padding: 28px 22px 26px;
    }
}


/* =========================================================
   4. DINING & FOOD SECTIONS
========================================================= */

.hotel-dining-section,
.hotel-food-section {
    --svx-navy: #1c2d47;
    --svx-navy-deep: #1b2b44;
    --svx-ink: #14233d;
    --svx-gold: #e2b073;
    --svx-gold-deep: #a97c3f;
    --svx-paper: #f6f4ef;
    --svx-line: #cfd2d8;

    font-family: "Poppins", sans-serif;
    padding: 90px 0;
    overflow: hidden;
}

.hotel-dining-section {
    background: var(--svx-paper) !important;
}

.hotel-food-section {
    background: #ffffff !important;
}

.hotel-dining-section .dining-image-wrap,
.hotel-food-section .food-image-wrap {
    position: relative;
    padding: 14px 15px 18px 0;
}

.hotel-dining-section .dining-image-wrap::before,
.hotel-food-section .food-image-wrap::before {
    content: "";
    position: absolute;
    width: 75%;
    height: 75%;
    border: 1px solid var(--svx-gold);
    z-index: 0;
    pointer-events: none;
}

.hotel-dining-section .dining-image-wrap::before {
    top: 0;
    left: 0;
}

.hotel-food-section .food-image-wrap::before {
    right: 0;
    bottom: 0;
}

.hotel-dining-section .dining-main-image,
.hotel-food-section .food-main-image {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 470px;
    object-fit: cover;
    box-shadow: 0 15px 35px rgba(20, 35, 61, 0.13);
}

.hotel-dining-section .dining-image-label {
    position: absolute;
    left: 25px;
    bottom: 35px;
    z-index: 2;
    padding: 14px 20px;
    background: var(--svx-navy-deep);
    color: #ffffff;
    font-family: "Poppins", sans-serif;
    font-size: 11px;
    letter-spacing: 2px;
}

.hotel-dining-section .dining-image-label span {
    color: var(--svx-gold);
    margin-right: 12px;
}

.hotel-food-section .food-image-caption {
    position: absolute;
    right: 0;
    bottom: 18px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 210px;
    padding: 20px 25px;
    background: var(--svx-navy-deep);
    color: #ffffff;
}

.hotel-food-section .food-image-caption span {
    color: var(--svx-gold);
    font-size: 10px;
    letter-spacing: 2px;
}

.hotel-food-section .food-image-caption strong {
    color: #ffffff;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 20px;
    font-weight: 400;
}

.hotel-dining-section .section-eyebrow,
.hotel-food-section .section-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--svx-gold-deep);
    font-family: "Poppins", sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    line-height: 1.8;
}

.hotel-dining-section .dining-content h2,
.hotel-food-section .food-content h2 {
    margin: 0 0 22px;
    color: var(--svx-ink) !important;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(32px, 3.5vw, 45px);
    font-weight: 500;
    line-height: 1.25;
}

.hotel-dining-section .dining-content h2 em,
.hotel-food-section .food-content h2 em {
    color: var(--svx-gold-deep);
    font-weight: 400;
}

.hotel-dining-section .gold-divider,
.hotel-food-section .gold-divider {
    width: 65px;
    height: 2px;
    margin-bottom: 25px;
    background: var(--svx-gold);
}

.hotel-dining-section .dining-content > p,
.hotel-food-section .food-content > p {
    margin-bottom: 17px;
    color: #4a5a76;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.95;
}

.hotel-dining-section .dining-features {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    margin: 25px 0 30px;
}

.hotel-dining-section .dining-features div {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--svx-ink);
    font-size: 12px;
    font-weight: 600;
}

.hotel-dining-section .feature-number {
    color: var(--svx-gold-deep);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 20px;
}

.hotel-dining-section .dining-btn,
.hotel-food-section .dining-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    min-height: 46px;
    padding: 13px 22px;
    background: var(--svx-navy-deep);
    border: 1px solid var(--svx-navy-deep);
    border-radius: 2px;
    color: #ffffff !important;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-decoration: none;
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.hotel-dining-section .dining-btn span,
.hotel-food-section .dining-btn span {
    color: var(--svx-gold);
    font-size: 19px;
    transition: transform 0.3s ease;
}

.hotel-dining-section .dining-btn:hover,
.hotel-food-section .dining-btn:hover {
    background: var(--svx-gold);
    border-color: var(--svx-gold);
    color: var(--svx-ink) !important;
}

.hotel-dining-section .dining-btn:hover span,
.hotel-food-section .dining-btn:hover span {
    color: var(--svx-ink);
    transform: translateX(5px);
}

.hotel-food-section .food-highlight {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin: 25px 0 28px;
    padding: 18px;
    background: var(--svx-paper);
    border-left: 3px solid var(--svx-gold);
}

.hotel-food-section .food-highlight-icon {
    flex-shrink: 0;
    color: var(--svx-gold-deep);
    font-size: 25px;
}

.hotel-food-section .food-highlight h5 {
    margin: 0 0 6px;
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 17px;
    font-weight: 500;
}

.hotel-food-section .food-highlight p {
    margin: 0;
    color: #4a5a76;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    line-height: 1.7;
}

@media (max-width: 991px) {
    .hotel-dining-section,
    .hotel-food-section {
        padding: 65px 0;
    }

    .hotel-dining-section .dining-main-image,
    .hotel-food-section .food-main-image {
        height: 380px;
    }

    .hotel-dining-section .dining-content,
    .hotel-food-section .food-content {
        padding-top: 10px;
    }
}

@media (max-width: 575px) {
    .hotel-dining-section,
    .hotel-food-section {
        padding: 45px 0;
    }

    .hotel-dining-section .dining-main-image,
    .hotel-food-section .food-main-image {
        height: 300px;
    }

    .hotel-dining-section .dining-content h2,
    .hotel-food-section .food-content h2 {
        font-size: 31px;
    }

    .hotel-dining-section .dining-features {
        flex-direction: column;
        gap: 15px;
    }

    .hotel-food-section .food-image-caption {
        min-width: 180px;
        padding: 15px 18px;
    }
}

@media (max-width: 380px) {
    .hotel-dining-section .dining-main-image,
    .hotel-food-section .food-main-image {
        height: 260px;
    }

    .hotel-dining-section .dining-content h2,
    .hotel-food-section .food-content h2 {
        font-size: 28px;
    }

    .hotel-dining-section .dining-btn,
    .hotel-food-section .dining-btn {
        gap: 14px;
        padding: 12px 16px;
    }
}


/* =========================================================
   5. FOOD CAROUSEL
========================================================= */

.sv-food-carousel {
    --sv-navy: #1c2d47;
    --sv-deep: #1b2b44;
    --sv-ink: #14233d;
    --sv-gold: #e2b073;
    --sv-gold-dark: #a97c3f;
    --sv-paper: #f6f4ef;

    padding: 85px 0;
    background: var(--sv-paper);
    overflow: hidden;
    font-family: "Poppins", sans-serif;
}

.sv-food-heading {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 45px;
}

.sv-food-heading > span {
    display: block;
    color: var(--sv-gold-dark);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 3px;
    margin-bottom: 14px;
}

.sv-food-heading h2 {
    color: var(--sv-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 500;
    margin: 0 0 15px;
}

.sv-food-heading h2 em {
    color: var(--sv-gold-dark);
    font-weight: 400;
}

.sv-food-heading p {
    color: #657087;
    font-size: 13px;
    line-height: 1.8;
    margin: 0;
}

.sv-carousel-wrapper {
    position: relative;
    padding: 0 42px;
}

.sv-food-track {
    display: flex;
    gap: 24px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 8px 2px 20px;
}

.sv-food-track::-webkit-scrollbar {
    display: none;
}

.sv-food-card {
    flex: 0 0 calc((100% - 48px) / 3);
    min-width: 0;
    background: #fff;
    border: 1px solid rgba(169, 124, 63, 0.2);
    scroll-snap-align: start;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.sv-food-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 35px rgba(20, 35, 61, 0.12);
}

.sv-food-image {
    height: 260px;
    position: relative;
    overflow: hidden;
    background: #e9e4da;
}

.sv-food-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.sv-food-card:hover .sv-food-image img {
    transform: scale(1.06);
}

.sv-food-number {
    position: absolute;
    left: 15px;
    top: 15px;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--sv-deep);
    color: var(--sv-gold);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 17px;
    border: 1px solid var(--sv-gold);
}

.sv-food-info {
    padding: 24px 22px 27px;
    border-top: 3px solid var(--sv-gold);
}

.sv-food-category {
    color: var(--sv-gold-dark);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.8px;
}

.sv-food-info h3 {
    color: var(--sv-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 23px;
    font-weight: 500;
    margin: 10px 0;
}

.sv-food-info p {
    color: #657087;
    font-size: 12px;
    line-height: 1.8;
    margin: 0;
}

.sv-food-arrow {
    position: absolute;
    top: 38%;
    z-index: 5;
    width: 42px;
    height: 42px;
    border: 1px solid var(--sv-gold);
    border-radius: 50%;
    background: var(--sv-deep);
    color: var(--sv-gold);
    cursor: pointer;
    transition: all 0.3s ease;
}

.sv-food-prev {
    left: -8px;
}

.sv-food-next {
    right: -8px;
}

.sv-food-arrow:hover {
    background: var(--sv-gold);
    color: var(--sv-deep);
}

.sv-food-pagination {
    display: flex;
    justify-content: center;
    gap: 9px;
    margin-top: 22px;
}

.sv-food-dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #c8cdd4;
    cursor: pointer;
    transition: all 0.3s ease;
}

.sv-food-dot.active {
    width: 28px;
    border-radius: 8px;
    background: var(--sv-gold-dark);
}

@media (max-width: 991px) {
    .sv-food-carousel {
        padding: 65px 0;
    }

    .sv-food-card {
        flex-basis: calc((100% - 24px) / 2);
    }

    .sv-food-image {
        height: 240px;
    }
}

@media (max-width: 575px) {
    .sv-food-carousel {
        padding: 45px 0;
    }

    .sv-food-heading {
        padding: 0 15px;
        margin-bottom: 30px;
    }

    .sv-carousel-wrapper {
        padding: 0 12px;
    }

    .sv-food-track {
        gap: 15px;
    }

    .sv-food-card {
        flex-basis: 85%;
    }

    .sv-food-image {
        height: 245px;
    }

    .sv-food-info {
        padding: 20px 18px 23px;
    }

    .sv-food-arrow {
        top: 33%;
        width: 35px;
        height: 35px;
    }

    .sv-food-prev {
        left: -5px;
    }

    .sv-food-next {
        right: -5px;
    }
}


/* =========================================================
   6. HERO - ivory panel + full photo + oval photo
   (centered heading line + slow entrance animation)
========================================================= */

.svr-hero {
    --svx-ink: #14233d;
    --svx-gold: #e2b073;
    --svx-gold-deep: #a97c3f;
    --svx-paper: #f6f4ef;
    --svr-seam: 46%;
    --svr-oval-w: clamp(250px, 23vw, 350px);

    position: relative;
    background: var(--svx-paper);
    font-family: "Poppins", sans-serif;
    overflow: hidden;
    padding: 0;
}

/* Kill template overlays / backgrounds */

.hero-section-2.svr-hero::before,
.hero-section-2.svr-hero::after,
.hero-section-2.svr-hero .hero-slider::before,
.hero-section-2.svr-hero .hero-slider::after,
.hero-section-2.svr-hero .swiper-slide::before,
.hero-section-2.svr-hero .swiper-slide::after {
    content: none !important;
    display: none !important;
}

.hero-section-2.svr-hero .swiper-slide {
    background: none !important;
    filter: none;
}

.svr-hero .svr-slide {
    position: relative;
    height: auto;
    min-height: 640px;
}

/* Left ivory panel */

.svr-hero .svr-left {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--svr-seam);
    min-height: 640px;
    padding: 80px calc(var(--svr-oval-w) / 2 + 40px) 90px 60px;
    background: var(--svx-paper);
    text-align: center;
}

.svr-hero .svr-copy {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    text-align: center;
}

/* Centered heading line: San Vista Boarding & Lodging */

.svr-hero .svr-kicker {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    margin: 0 0 26px;
    color: var(--svx-ink);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.3em;
    line-height: 1.6;
    text-align: center;
    text-transform: uppercase;
}

.svr-hero .svr-kicker::before,
.svr-hero .svr-kicker::after {
    content: "";
    flex: 0 0 34px;
    height: 1px;
    background: var(--svx-gold);
}

.svr-hero h1 {
    margin: 0 0 22px;
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(30px, 3.3vw, 46px);
    font-weight: 500;
    line-height: 1.18;
}

.svr-hero h1 em {
    color: var(--svx-gold-deep);
    font-style: italic;
    font-weight: 400;
}

.svr-hero .svr-text {
    margin: 0 0 30px;
    color: #4a5a76;
    font-size: 13px;
    line-height: 1.9;
}

.svr-hero .svr-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 22px;
}

.svr-hero .svr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 28px;
    background: var(--svx-ink);
    border: 1px solid var(--svx-ink);
    border-radius: 2px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.svr-hero .svr-btn:hover {
    background: var(--svx-gold);
    border-color: var(--svx-gold);
    color: var(--svx-ink);
}

.svr-hero .svr-link {
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 15px;
    font-style: italic;
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-color: var(--svx-gold);
    transition: color 0.3s ease;
}

.svr-hero .svr-link:hover {
    color: var(--svx-gold-deep);
}

/* Big photo (right) */

.svr-hero .svr-photo {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: calc(100% - var(--svr-seam));
}

.svr-hero .svr-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Oval photo on the seam */

.svr-hero .svr-oval {
    position: absolute;
    z-index: 3;
    top: calc(50% + 60px);   /* increase 40px to push it lower, decrease to raise it */
    left: var(--svr-seam);
    width: var(--svr-oval-w);
    height: calc(var(--svr-oval-w) * 1.3);
    transform: translate(-50%, -50%);
}

.svr-hero .svr-oval::before {
    content: "";
    position: absolute;
    inset: -14px;
    border: 1px solid var(--svx-gold);
    border-radius: 50%;
    pointer-events: none;
}

.svr-hero .svr-oval img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 7px solid var(--svx-paper);
    border-radius: 50%;
    box-shadow: 0 18px 40px rgba(20, 35, 61, 0.22);
}

/* Slow entrance animation */

.svr-hero .svr-copy > *,
.svr-hero .svr-photo img,
.svr-hero .svr-oval img {
    animation: sanVistaFade 1.6s ease both;
}

.svr-hero .svr-copy > *:nth-child(1) { animation-delay: 0.4s; }
.svr-hero .svr-copy > *:nth-child(2) { animation-delay: 0.8s; }
.svr-hero .svr-copy > *:nth-child(3) { animation-delay: 1.2s; }
.svr-hero .svr-copy > *:nth-child(4) { animation-delay: 1.6s; }
.svr-hero .svr-photo img            { animation-delay: 0.6s; }
.svr-hero .svr-oval img             { animation-delay: 1.2s; }

@keyframes sanVistaFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Pagination dots (bottom of ivory panel) */

.hero-section-2.svr-hero .swiper-actions {
    position: absolute !important;
    top: auto !important;
    right: auto !important;
    bottom: 32px !important;
    left: 0 !important;
    transform: none !important;
    width: var(--svr-seam) !important;
    z-index: 5;
}

.hero-section-2.svr-hero .swiper-actions .dot {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center;
    gap: 9px;
    width: 100% !important;
    transform: none !important;
}

.hero-section-2.svr-hero .swiper-actions .swiper-pagination-bullet {
    position: static;
    display: block;
    width: 9px;
    height: 9px;
    margin: 0 !important;
    border: 0;
    border-radius: 50%;
    background: rgba(20, 35, 61, 0.25);
    opacity: 1;
    transition: all 0.5s ease;
}

.hero-section-2.svr-hero .swiper-actions .swiper-pagination-bullet::before,
.hero-section-2.svr-hero .swiper-actions .swiper-pagination-bullet::after {
    display: none !important;
}

.hero-section-2.svr-hero .swiper-actions .swiper-pagination-bullet-active {
    width: 28px;
    border-radius: 8px;
    background: var(--svx-gold-deep);
}

/* Hero responsive */

@media (max-width: 1199px) {
    .svr-hero {
        --svr-seam: 50%;
        --svr-oval-w: 240px;
    }

    .svr-hero .svr-slide,
    .svr-hero .svr-left {
        min-height: 560px;
    }

    .svr-hero .svr-left {
        padding: 60px calc(var(--svr-oval-w) / 2 + 30px) 80px 40px;
    }
}

@media (max-width: 991px) {
    .svr-hero {
        --svr-oval-w: 190px;
    }

    .svr-hero .svr-slide {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .svr-hero .svr-photo {
        position: relative;
        order: 1;
        width: 100%;
        height: 340px;
    }

    .svr-hero .svr-oval {
        position: relative;
        order: 2;
        top: auto;
        left: auto;
        margin: -120px auto 0;
        transform: none;
    }

    .svr-hero .svr-left {
        order: 3;
        width: 100%;
        min-height: 0;
        padding: 50px 24px 90px;
    }

    .hero-section-2.svr-hero .swiper-actions {
        width: 100% !important;
        bottom: 28px !important;
    }
}

@media (max-width: 575px) {
    .svr-hero .svr-photo {
        height: 280px;
    }

    .svr-hero .svr-oval {
        margin-top: -100px;
    }

    .svr-hero h1 {
        font-size: 29px;
    }

    .svr-hero .svr-kicker {
        font-size: 10px;
        letter-spacing: 0.18em;
        gap: 10px;
    }

    .svr-hero .svr-kicker::before,
    .svr-hero .svr-kicker::after {
        flex-basis: 18px;
    }
}

.svr-hero a:focus-visible {
    outline: 2px solid var(--svx-gold);
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .svr-hero *,
    .svr-hero .svr-copy > *,
    .svr-hero .svr-photo img,
    .svr-hero .svr-oval img {
        animation: none !important;
        opacity: 1;
        transition-duration: 0.01ms !important;
    }
}


/* =========================================================
   7. ABOUT v2 (.svab) - overlapping photos + ruled list
========================================================= */

.svab {
    --svx-navy-deep: #1b2b44;
    --svx-ink: #14233d;
    --svx-gold: #e2b073;
    --svx-gold-deep: #a97c3f;
    --svx-paper: #f6f4ef;
    --svx-line: #cfd2d8;

    position: relative;
    background: #fff;
    font-family: "Poppins", sans-serif;
    padding: 110px 0;
    overflow: hidden;
}

.svab .svab-row {
    row-gap: 60px;
}

.svab .svab-media {
    position: relative;
    padding: 0 60px 70px 0;
}

.svab .svab-media figure {
    margin: 0;
}

.svab .svab-img-main img {
    display: block;
    width: 100%;
    height: 560px;
    object-fit: cover;
    border-radius: 200px 0 0 0;
}

.svab .svab-img-small {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 52%;
    padding: 8px;
    background: #fff;
    border-bottom: 3px solid var(--svx-gold);
    box-shadow: 0 18px 40px rgba(20, 35, 61, 0.18);
}

.svab .svab-img-small img {
    display: block;
    width: 100%;
    height: 230px;
    object-fit: cover;
}

.svab .svab-content {
    padding-left: 30px;
}

.svab .svab-kicker {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 18px;
    color: var(--svx-gold-deep);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.04em;
}

.svab .svab-kicker::before {
    content: "";
    width: 40px;
    height: 1px;
    background: var(--svx-gold);
}

.svab h2 {
    max-width: 14em;
    margin: 0 0 20px;
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(30px, 3.4vw, 46px);
    font-weight: 500;
    line-height: 1.2;
}

.svab h2 em {
    color: var(--svx-gold-deep);
    font-style: italic;
    font-weight: 400;
}

.svab .svab-lead {
    max-width: 32em;
    margin: 0 0 34px;
    color: #4a5a76;
    font-size: 15px;
    line-height: 1.85;
}

.svab .svab-list {
    margin: 0 0 36px;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--svx-line);
}

.svab .svab-list li {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 22px 0;
    border-bottom: 1px solid var(--svx-line);
}

.svab .svab-ico {
    display: flex;
    flex: 0 0 58px;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border: 1.5px solid #c9ccd3;
    border-radius: 50%;
    background: var(--svx-paper);
}

.svab .svab-ico img {
    display: block;
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.svab .svab-list h3 {
    margin: 0 0 4px;
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 21px;
    font-weight: 500;
}

.svab .svab-list p {
    margin: 0;
    color: #4a5a76;
    font-size: 14px;
    line-height: 1.7;
}

.svab .svab-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
}

.svab .svab-stats {
    display: flex;
    align-items: center;
}

.svab .svab-stat {
    padding: 0 30px;
}

.svab .svab-stat:first-child {
    padding-left: 0;
    border-right: 2px solid var(--svx-gold);
}

.svab .svab-stat strong {
    display: block;
    color: var(--svx-ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 34px;
    font-weight: 500;
    line-height: 1.1;
}

.svab .svab-stat span {
    color: #4a5a76;
    font-size: 13px;
}

.svab .svab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 13px 30px;
    background: var(--svx-navy-deep);
    border: 1px solid var(--svx-navy-deep);
    border-radius: 2px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.svab .svab-btn:hover {
    background: var(--svx-gold);
    border-color: var(--svx-gold);
    color: var(--svx-ink);
}

@media (max-width: 991px) {
    .svab {
        padding: 70px 0;
    }

    .svab .svab-media {
        max-width: 520px;
        margin: 0 auto;
    }

    .svab .svab-img-main img {
        height: 460px;
    }

    .svab .svab-content {
        padding-left: 0;
    }
}

@media (max-width: 575px) {
    .svab {
        padding: 50px 0;
    }

    .svab .svab-media {
        padding: 0 30px 50px 0;
    }

    .svab .svab-img-main img {
        height: 340px;
        border-top-left-radius: 120px;
    }

    .svab .svab-img-small img {
        height: 150px;
    }

    .svab .svab-list li {
        align-items: flex-start;
        gap: 16px;
    }

    .svab .svab-ico {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

    .svab .svab-foot {
        flex-direction: column;
        align-items: flex-start;
    }
}

.svab a:focus-visible {
    outline: 2px solid var(--svx-gold);
    outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .svab * {
        transition-duration: 0.01ms !important;
    }
}


/* =========================================================
   8. FLOATING CONTACT BUTTONS
========================================================= */

.svx-floating-contact {
    position: fixed;
    right: 20px;
    bottom: 90px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.svx-floating-contact a {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    font-size: 22px;
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
    transition: transform 0.3s ease;
}

.svx-floating-contact .svx-whatsapp {
    background: #079778;
}

.svx-floating-contact .svx-call {
    background: #194d75;
}

.svx-floating-contact a:hover {
    color: #fff;
    transform: scale(1.08);
}

@media (max-width: 576px) {
    .svx-floating-contact {
        right: 12px;
        bottom: 75px;
    }

    .svx-floating-contact a {
        width: 45px;
        height: 45px;
        font-size: 20px;
    }
}


/* =========================================================
   9. ABOUT US PAGE (.sv-ab-*)
========================================================= */

.sv-ab-intro, .sv-ab-services, .sv-ab-stats,
.sv-ab-quote, .sv-ab-visit, .sv-ab-bar {
    --navy: #1b2b44;
    --ink: #14233d;
    --gold: #e2b073;
    --gold-deep: #a97c3f;
    --paper: #f6f4ef;
    --line: #cfd2d8;
    font-family: "Poppins", sans-serif;
}

.sv-ab-eyebrow {
    margin: 0 0 16px;
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .3em;
    text-transform: uppercase;
}
.sv-ab-eyebrow.light { color: var(--gold); }

.sv-ab-intro h2, .sv-ab-services h2, .sv-ab-visit h2, .sv-ab-bar h2 {
    margin: 0 0 20px;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(30px, 3.6vw, 46px);
    font-weight: 500;
    line-height: 1.2;
}
.sv-ab-intro h2 em, .sv-ab-visit h2 em { color: var(--gold-deep); font-style: italic; font-weight: 400; }
.sv-ab-services h2 em, .sv-ab-bar h2 em { color: var(--gold); font-style: italic; font-weight: 400; }

/* 1. Intro + trio */
.sv-ab-intro { padding: 100px 0 110px; background: #fff; }

.sv-ab-intro-head { max-width: 760px; margin: 0 auto 70px; text-align: center; }
.sv-ab-intro h2 { color: var(--ink); }
.sv-ab-rule { display: block; width: 65px; height: 2px; margin: 0 auto 26px; background: var(--gold); }
.sv-ab-intro-text { margin: 0; color: #4a5a76; font-size: 16px; line-height: 1.9; }
.sv-ab-intro-text + .sv-ab-intro-text { margin-top: 18px; }

.sv-ab-trio {
    display: grid;
    grid-template-columns: 1fr 1.15fr 1fr;
    gap: 28px;
    align-items: start;
}
.sv-ab-trio figure { margin: 0; overflow: hidden; }
.sv-ab-trio img { display: block; width: 100%; object-fit: cover; transition: transform .7s ease; }
.sv-ab-trio figure:hover img { transform: scale(1.05); }

.sv-ab-trio-a img { height: 380px; }
.sv-ab-trio-b { margin-top: -40px !important; border-radius: 999px 999px 0 0; border-bottom: 3px solid var(--gold); }
.sv-ab-trio-b img { height: 480px; }
.sv-ab-trio-c { margin-top: 60px !important; }
.sv-ab-trio-c img { height: 360px; }

/* 2. Numbered services */
.sv-ab-services { padding: 100px 0; background: var(--navy); color: #fff; }
.sv-ab-services-row { row-gap: 50px; align-items: flex-start; }
.sv-ab-services h2 { color: #fff; }
.sv-ab-services-head p { margin: 0 0 28px; color: rgba(255,255,255,.75); font-size: 15px; line-height: 1.8; }

.sv-ab-link {
    color: var(--gold);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 16px; font-style: italic;
    text-decoration: underline; text-underline-offset: 5px;
    text-decoration-color: rgba(226,176,115,.6);
    transition: color .3s;
}
.sv-ab-link:hover { color: #fff; }

.sv-ab-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(226,176,115,.35); }
.sv-ab-list li {
    display: flex; align-items: center; gap: 34px;
    padding: 30px 0 30px 10px;
    border-bottom: 1px solid rgba(226,176,115,.35);
    transition: padding-left .35s ease, background .35s ease;
}
.sv-ab-list li:hover { padding-left: 26px; background: rgba(255,255,255,.04); }
.sv-ab-num {
    flex: 0 0 auto; min-width: 70px;
    color: var(--gold);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 46px; font-weight: 400; line-height: 1;
}
.sv-ab-list h3 {
    margin: 0 0 6px; color: #fff;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 23px; font-weight: 500;
}
.sv-ab-list p { margin: 0; color: rgba(255,255,255,.72); font-size: 14.5px; line-height: 1.7; }

/* 3. Stats strip */
.sv-ab-stats { padding: 56px 0; background: var(--paper); border-bottom: 1px solid var(--line); }
.sv-ab-stats-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 20px; margin: 0; padding: 0; list-style: none;
}
.sv-ab-stats-row li:not(.dot) { text-align: center; flex: 1; }
.sv-ab-stats-row strong {
    display: block; color: var(--ink);
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(30px, 3.6vw, 46px); font-weight: 500; line-height: 1.15;
}
.sv-ab-stats-row span { color: var(--gold-deep); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.sv-ab-stats-row .dot { flex: 0 0 9px; width: 9px; height: 9px; background: var(--gold); transform: rotate(45deg); }

/* 4. Guest quote */
.sv-ab-quote { background-size: cover; background-position: center; }
.sv-ab-quote-shade { padding: 120px 0; background: rgba(27, 43, 68, .86); text-align: center; }
.sv-ab-qmark {
    display: block; height: 60px; color: var(--gold);
    font-family: "Playfair Display", Georgia, serif; font-size: 110px; line-height: 1;
}
.sv-ab-quote blockquote {
    max-width: 820px; margin: 0 auto 28px; padding: 0; border: 0;
    color: #fff;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(22px, 2.8vw, 34px); font-style: italic; font-weight: 400; line-height: 1.5;
}
.sv-ab-who { margin: 0; color: rgba(255,255,255,.8); font-size: 14px; letter-spacing: .06em; }
.sv-ab-who strong { color: var(--gold); font-weight: 500; }
.sv-ab-note {
    margin: 22px 0 0;
    color: var(--gold);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 17px;
    font-style: italic;
}

/* 5. Visit card over photo */
.sv-ab-visit { padding: 110px 0; background: #fff; overflow: hidden; }
.sv-ab-visit-wrap { display: grid; grid-template-columns: 1fr 1.25fr; align-items: center; }

.sv-ab-visit-card {
    position: relative; z-index: 2;
    margin-right: -90px; padding: 52px 48px;
    background: var(--paper);
    border-top: 3px solid var(--gold);
    box-shadow: 0 24px 50px rgba(20, 35, 61, .16);
}
.sv-ab-visit h2 { color: var(--ink); }
.sv-ab-visit-text { margin: 0; color: #4a5a76; font-size: 15px; line-height: 1.85; }

.sv-ab-details { margin: 28px 0 0; }
.sv-ab-details div { padding: 18px 0; border-top: 1px solid var(--line); }
.sv-ab-details dt {
    display: flex; align-items: center; gap: 10px; margin-bottom: 6px;
    color: var(--ink); font-size: 11.5px; font-weight: 600;
    letter-spacing: .2em; text-transform: uppercase;
}
.sv-ab-details dt i { color: var(--gold-deep); font-size: 14px; }
.sv-ab-details dd { margin: 0; color: #4a5a76; font-size: 15px; line-height: 1.7; }
.sv-ab-details a { color: #4a5a76; text-decoration: none; transition: color .25s; }
.sv-ab-details a:hover { color: var(--gold-deep); }

.sv-ab-visit-img { margin: 0; }
.sv-ab-visit-img img { display: block; width: 100%; height: 560px; object-fit: cover; }

/* 6. Booking bar */
.sv-ab-bar { padding: 44px 0; background: var(--navy); border-top: 3px solid var(--gold); }
.sv-ab-bar-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.sv-ab-bar h2 { margin: 0; color: #fff; font-size: clamp(24px, 2.8vw, 34px); }
.sv-ab-bar-text { margin: 8px 0 0; color: rgba(255,255,255,.75); font-size: 14.5px; }

.sv-ab-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 50px; padding: 13px 38px;
    background: var(--gold); border: 1px solid var(--gold); border-radius: 2px;
    color: var(--ink); font-size: 13px; font-weight: 600;
    letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
    transition: background .3s, color .3s;
}
.sv-ab-btn:hover { background: transparent; color: var(--gold); }

/* Responsive */
@media (max-width: 991px) {
    .sv-ab-intro { padding: 70px 0; }
    .sv-ab-intro-head { margin-bottom: 50px; }
    .sv-ab-trio { gap: 16px; }
    .sv-ab-trio-a img { height: 280px; }
    .sv-ab-trio-b img { height: 360px; }
    .sv-ab-trio-c img { height: 260px; }

    .sv-ab-services { padding: 70px 0; }
    .sv-ab-quote-shade { padding: 80px 0; }

    .sv-ab-visit { padding: 70px 0; }
    .sv-ab-visit-wrap { grid-template-columns: 1fr; }
    .sv-ab-visit-img { order: -1; }
    .sv-ab-visit-img img { height: 380px; }
    .sv-ab-visit-card { margin: -70px 24px 0; padding: 40px 32px; }
}

@media (max-width: 767px) {
    .sv-ab-stats-row { flex-wrap: wrap; row-gap: 28px; }
    .sv-ab-stats-row .dot { display: none; }
    .sv-ab-stats-row li:not(.dot) { flex: 1 1 45%; }
}

@media (max-width: 575px) {
    .sv-ab-intro, .sv-ab-services, .sv-ab-visit { padding: 50px 0; }

    .sv-ab-trio { grid-template-columns: 1fr 1fr; }
    .sv-ab-trio-b { grid-column: 1 / -1; grid-row: 1; margin-top: 0 !important; }
    .sv-ab-trio-a, .sv-ab-trio-c { margin-top: 0 !important; }
    .sv-ab-trio-a img, .sv-ab-trio-c img { height: 200px; }
    .sv-ab-trio-b img { height: 340px; }

    .sv-ab-list li { gap: 18px; padding: 22px 0 22px 4px; }
    .sv-ab-num { min-width: 46px; font-size: 32px; }
    .sv-ab-list h3 { font-size: 19px; }

    .sv-ab-quote-shade { padding: 60px 0; }
    .sv-ab-visit-img img { height: 290px; }
    .sv-ab-visit-card { margin: -50px 14px 0; padding: 32px 22px; }

    .sv-ab-bar-inner { flex-direction: column; align-items: flex-start; }
    .sv-ab-btn { width: 100%; }
}

.sv-ab-link:focus-visible, .sv-ab-btn:focus-visible, .sv-ab-details a:focus-visible {
    outline: 2px solid var(--gold); outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
    .sv-ab-trio img, .sv-ab-list li, .sv-ab-btn { transition-duration: .01ms !important; }
}


/* =========================================================
   10. GUEST POLICIES
========================================================= */

.guest-policies {
    padding: 70px 0;
    background: #f4f0e6;
}

.guest-policies .policy-card {
    position: relative;
    height: 100%;
    padding: 30px 28px 26px;
    background: #ffffff;
    border: 1px solid #e8e0cf;
    border-top: 4px solid #1c2b4d;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(28, 43, 77, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-top-color 0.3s ease;
}

.guest-policies .policy-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(28, 43, 77, 0.16);
    border-top-color: #e2b074;
}

.guest-policies .policy-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px dashed #e2b074;
}

.guest-policies .policy-icon {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1c2b4d;
    color: #e2b074;
    border-radius: 6px;
    font-size: 18px;
    transition: background 0.3s ease, color 0.3s ease;
}

.guest-policies .policy-card:hover .policy-icon {
    background: #e2b074;
    color: #1c2b4d;
}

.guest-policies .policy-card h4 {
    margin: 0;
    color: #1c2b4d;
    font-size: 21px;
    font-weight: 700;
}

.guest-policies .policy-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.guest-policies .policy-card li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 10px;
    color: #4a5063;
    font-size: 15px;
    line-height: 1.7;
}

.guest-policies .policy-card li::before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 12px;
    color: #e2b074;
}

@media (max-width: 767px) {
    .guest-policies {
        padding: 45px 0;
    }

    .guest-policies .policy-card {
        padding: 24px 20px 20px;
    }

    .guest-policies .policy-card h4 {
        font-size: 19px;
    }
}


/* =========================================================
   11. SCROLL ANIMATION
========================================================= */

.sv-scroll-left,
.sv-scroll-right,
.sv-scroll-footer {
    opacity: 0;
    transition: opacity 1s ease, transform 1s ease;
}

.sv-scroll-left {
    transform: translateX(-60px);
}

.sv-scroll-right {
    transform: translateX(60px);
}

.sv-scroll-footer {
    transform: translateY(40px);
}

.sv-scroll-left.sv-scroll-visible,
.sv-scroll-right.sv-scroll-visible,
.sv-scroll-footer.sv-scroll-visible {
    opacity: 1;
    transform: translate(0, 0);
}

@media (prefers-reduced-motion: reduce) {
    .sv-scroll-left,
    .sv-scroll-right,
    .sv-scroll-footer {
        opacity: 1;
        transform: none;
        transition: none;
    }
}




.svab.svab-strip {
    padding: 90px 0;
}

.svab.svab-strip .svab-img-main img {
    height: 440px;
}

.svab.svab-strip .svab-img-small img {
    height: 190px;
}

.svab.svab-strip .svab-lead {
    margin-bottom: 28px;
}

/* ---------- navy strip ---------- */

.svs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 60px;
    background: #1b2b44;
    border-top: 3px solid #e2b073;
    box-shadow: 0 18px 40px rgba(20, 35, 61, 0.18);
}

.svs-item {
    padding: 30px 26px 28px;
    border-left: 1px solid rgba(226, 176, 115, 0.35);
    transition: background 0.35s ease;
}

.svs-item:first-child {
    border-left: 0;
}

.svs-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

.svs-item i {
    display: block;
    margin-bottom: 14px;
    color: #e2b073;
    font-size: 26px;
}

.svs-item h3 {
    margin: 0 0 8px;
    color: #fff;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.3;
}

.svs-item p {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 13px;
    line-height: 1.7;
}

.svs-rooms {
    display: block;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px dashed rgba(226, 176, 115, 0.5);
    color: #e2b073;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ---------- responsive ---------- */

@media (max-width: 991px) {
    .svab.svab-strip {
        padding: 60px 0;
    }

    .svab.svab-strip .svab-img-main img {
        height: 400px;
    }

    .svs {
        grid-template-columns: 1fr 1fr;
        margin-top: 45px;
    }

    .svs-item:nth-child(3) {
        border-left: 0;
    }

    .svs-item:nth-child(n + 3) {
        border-top: 1px solid rgba(226, 176, 115, 0.35);
    }
}

@media (max-width: 575px) {
    .svab.svab-strip {
        padding: 45px 0;
    }

    .svab.svab-strip .svab-img-main img {
        height: 320px;
    }

    .svab.svab-strip .svab-img-small img {
        height: 140px;
    }

    .svs {
        grid-template-columns: 1fr;
    }

    .svs-item,
    .svs-item:nth-child(3) {
        padding: 24px 22px;
        border-left: 0;
    }

    .svs-item + .svs-item {
        border-top: 1px solid rgba(226, 176, 115, 0.35);
    }

    .svs-item h3 {
        font-size: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .svs-item {
        transition-duration: 0.01ms !important;
    }
}
/* Strip: checklist items */
.svs-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.svs-list li {
    position: relative;
    padding: 0 0 0 22px;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 13.5px;
    line-height: 1.6;
}

.svs-list li:last-child {
    margin-bottom: 0;
}

.svs-list li::before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 2px;
    color: #e2b073;
    font-size: 11px;
}
/* About: on mobile, show the strip first */
@media (max-width: 767px) {
    .svab.svab-strip > .container {
        display: flex;
        flex-direction: column;
    }

    .svab.svab-strip .svs {
        order: -1;
        margin: 0 0 40px;
    }

    .svab.svab-strip .svab-row {
        order: 1;
    }
}
/* Banquet Hall icon in the mobile menu */
#offcanvas-sidebar a[href*="banquet"]::before {
    font-family: "Font Awesome 6 Free";
    content: "\f79f";
    font-weight: 900;
    margin-right: 10px;
}
