/*
Theme Name: Swaha Signature
Description: Custom theme for Swaha Signature
*/

/* ==================== HEADER CSS ==================== */
/* SWAHA HEADER STYLES */
    .swaha-hero {
      height: 400px;
      position: relative;
      color: #fff;
      background: url("../../uploads/2026/09/gedung-header.png") center/cover no-repeat;
      z-index: 2;
      box-shadow: 0 11.25px 49.5px rgba(0, 0, 0, 0.12), 0 114.5px 49.5px -65px rgba(0, 0, 0, 0.25);
    }
    .swaha-header-transparent {
      background: transparent !important;
      box-shadow: none !important;
      height: auto !important;
      position: absolute;
      width: 100%;
      top: 0;
      left: 0;
      z-index: 999;
    }
    .swaha-hero-overlay {
      background: rgba(0, 0, 0, 0.3);
      inset: 0;
      position: absolute;
    }
    .swaha-hero-header,
    .swaha-hero-nav-wrap,
    .swaha-hero-copy {
      position: relative;
      z-index: 1;
    }
.swaha-hero-header {
      z-index: 5;
    }
    .swaha-header-top-wrapper {
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }
    .swaha-header-top {
        align-items: center;
        display: grid;
  grid-template-columns: 1fr auto 1fr;
        /* padding: 0 135px; */
      }
    .swaha-social-links {
      display: flex;
      gap: 18px;
      align-items: center;
    }
    .swaha-social-links a {
      display: block;
      line-height: 0;
    }
    .swaha-social-links img {
      display: block;
      height: 32px;
      width: 32px;
      object-fit: contain;
    }
    .swaha-brand {
      display: inline-block;
      line-height: 0;
      padding: 20px 0 15px;
    }
    .swaha-brand img {
      display: block;
      filter: brightness(0) invert(1);
      height: auto;
      width: 187px;
    }
    .swaha-header-actions {
      justify-content: flex-end;
      align-items: center;
      display: flex;
      gap: 30px;
      font-size: 18px;
    }
.swaha-header-actions a {
      color: #fff;
      text-decoration: none;
      font-family: Calibri, Arial, sans-serif;
    }
    .swaha-header-actions a:not(.swaha-book-btn) {
      border-radius: 999px;
      padding: 8px 16px;
      transition: background-color 180ms ease, color 180ms ease;
    }
    .swaha-header-actions a:not(.swaha-book-btn):hover,
    .swaha-header-actions a:not(.swaha-book-btn).is-contact {
      color: #fff;
      background: rgba(128, 128, 128, 0.45);
    }
    .swaha-mobile-actions {
      display: none;
    }
    .swaha-book-btn {
      border-radius: 999px;
      background: #fff;
      color: #121212 !important;
      font-weight: 700;
      padding: 10px 30px;
      text-decoration: none;
      display: inline-block;
      font-family: Calibri, Arial, sans-serif;
    }
    .swaha-hero-nav-wrap {
      padding-top: 10px;
      z-index: 10;
    }
    /* .swaha-hero-nav-wrap .container,
    .swaha-transition-nav .container {
      max-width: none;
      padding-inline: 86px;
    } */
    .swaha-navigation {
      min-height: 38px;
      padding: 0;
    }
    .swaha-hero-nav-wrap .navbar-collapse,
    .swaha-transition-nav .navbar-collapse {
      flex-basis: 100%;
      flex-grow: 1;
    }
    .swaha-nav-list {
      align-items: center;
      display: flex;
      gap: 23.57px;
      justify-content: space-between;
      width: 100%;
      margin: 0;
      padding: 0;
      list-style: none;
    }
    .swaha-nav-item {
      position: relative;
    }
    .swaha-nav-link {
      color: rgba(255, 255, 255, 0.95);
      padding: 10px 14px;
      font-family: Calibri, Arial, sans-serif;
      font-size: 18px;
      font-weight: 400;
      line-height: 1;
      letter-spacing: 0;
      display: flex;
      align-items: center;
      gap: 7px;
      text-decoration: none;
      white-space: nowrap;
      border-radius: 999px;
      transition: background-color 180ms ease, color 180ms ease;
    }
    .swaha-nav-link:hover,
    .swaha-nav-item.active .swaha-nav-link {
      color: #fff;
      background: rgba(128, 128, 128, 0.45);
    }
    .swaha-hero-nav-wrap .swaha-nav-item:hover > .swaha-nav-link,
    .swaha-hero-nav-wrap .swaha-nav-item.show > .swaha-nav-link,
    .swaha-hero-nav-wrap .swaha-nav-link.show,
    .swaha-hero-nav-wrap .swaha-nav-item.is-click-open > .swaha-nav-link,
    .swaha-hero-nav-wrap .swaha-nav-item:has(.swaha-submenu:hover) > .swaha-nav-link {
      background: rgba(128, 128, 128, 0.45);
      color: #fff !important;
    }
    .swaha-hero-nav-wrap .dropdown-toggle,
    .swaha-hero-nav-wrap .dropdown-toggle .iconify,
    .swaha-hero-nav-wrap .dropdown-toggle:hover,
    .swaha-hero-nav-wrap .dropdown-toggle:focus,
    .swaha-hero-nav-wrap .dropdown-toggle.show {
      color: #fff !important;
    }
    .swaha-transition-nav .swaha-nav-item:hover > .swaha-nav-link,
    .swaha-transition-nav .swaha-nav-item.show > .swaha-nav-link,
    .swaha-transition-nav .swaha-nav-link.show,
    .swaha-transition-nav .swaha-nav-item.is-click-open > .swaha-nav-link,
    .swaha-transition-nav .swaha-nav-item:has(.swaha-submenu:hover) > .swaha-nav-link,
    .swaha-transition-nav .dropdown-toggle,
    .swaha-transition-nav .dropdown-toggle .iconify,
    .swaha-transition-nav .dropdown-toggle:hover,
    .swaha-transition-nav .dropdown-toggle:focus,
    .swaha-transition-nav .dropdown-toggle.show {
      color: #fff !important;
    }
    .swaha-nav-link .iconify {
      font-size: 16px;
    }
    .dropdown-toggle::after {
      content: "";
      display: inline-block;
      width: 10px;
      height: 6px;
      margin-left: 8px;
      vertical-align: middle;
      background: url('data:image/svg+xml;utf8,<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L5 5L9 1" stroke="%23FFFFFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center center;
      background-size: contain;
      border: none;
      transition: transform 0.3s ease;
    }
    .swaha-nav-item.is-click-open > .dropdown-toggle::after,
    .swaha-nav-item.show > .dropdown-toggle::after,
    .swaha-nav-item .dropdown-toggle[aria-expanded="true"]::after {
      transform: rotate(180deg);
    }
    .swaha-submenu {
      background: #f1f1f1;
      border: 0;
      border-radius: 9px;
      box-shadow: 0 13px 28px rgba(0, 0, 0, 0.2);
      margin-top: 0;
      min-width: 150px;
      padding: 7px 0;
      pointer-events: auto;
      list-style: none;
    }
    .swaha-submenu .dropdown-item {
      color: #171717 !important;
      font-family: Calibri, Arial, sans-serif;
      font-size: 14px;
      padding: 9px 17px;
      transition: background-color 180ms ease, color 180ms ease;
    }
    .swaha-submenu li + li .dropdown-item {
      border-top: 1px solid #d9d9d9;
    }
    .swaha-submenu .dropdown-item:hover,
    .swaha-submenu .dropdown-item:focus {
      background: #d9d9d9;
      color: #171717 !important;
    }
    @media (min-width: 992px) {
      .swaha-hero-nav-wrap .swaha-nav-item.dropdown,
      .swaha-transition-nav .swaha-nav-item.dropdown {
        padding-bottom: 10px;
        margin-bottom: -10px;
      }
      .swaha-hero-nav-wrap .dropdown > .swaha-submenu,
      .swaha-transition-nav .dropdown > .swaha-submenu {
        margin-top: 10px;
        position: absolute;
      }
      .swaha-transition-nav .swaha-nav-item.dropdown > .swaha-submenu {
        margin-top: 0;
        top: calc(100% + 10px);
      }
      .swaha-hero-nav-wrap .dropdown.is-click-open > .swaha-submenu,
      .swaha-transition-nav .dropdown.is-click-open > .swaha-submenu {
        display: block;
      }
      #heroMenu .swaha-social-links {
        display: none;
      }
    }
    .dropdown.is-click-open > .swaha-submenu {
      display: block;
    }
    .dropdown.is-click-closed > .swaha-submenu {
      display: none !important;
    }
    .swaha-hero-copy {
      align-items: center;
      display: flex;
      inset: 0;
      justify-content: center;
      /* max-width: none; */
      padding: 0 20px;
      position: absolute;
      text-align: center;
    }
    .swaha-hero-copy p,
    .swaha-eyebrow {
      letter-spacing: 3px;
      font-size: 11px;
      font-weight: 700;
    }
    .swaha-hero-copy h1 {
      font-family: "Zain", sans-serif;
      font-size: 70px;
      font-weight: 400;
      letter-spacing: 10px;
      line-height: 1;
      margin: 0 auto;
      text-transform: uppercase;
      padding-top: 150px;
    }
    
    /* HOMEPAGE SPECIFIC HERO */
    .swaha-hero-home {
      height: 800px;
      position: relative;
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url('../../uploads/2026/09/bg-utama-2.png') center/cover no-repeat;
      display: flex;
      flex-direction: column;
    }
    .swaha-hero-home .swaha-hero-overlay {
      display: none; /* using gradient on background instead */
    }
    .swaha-home-hero-content {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      position: relative;
      z-index: 2;
      padding-top: 20px;
      padding-bottom: 40px;
    }
    .swaha-home-text {
      /* Removed negative margin */
    }
    .swaha-home-eyebrow {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 700;
      font-size: 20px;
      line-height: 100%;
      letter-spacing: 0.41em;
      text-align: center;
      color: #EF4C25;
      margin-bottom: 10px;
      text-transform: uppercase;
    }
    .swaha-home-title {
      font-family: "Zain", sans-serif;
      font-weight: 400;
      font-size: 150px;
      line-height: 100%;
      letter-spacing: 10px;
      text-align: center;
      color: #FFFFFF;
      text-transform: uppercase;
      margin-bottom: 15px;
      margin-top: 0;
    }
    .swaha-home-desc {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 20px;
      line-height: 100%;
      letter-spacing: 0.01em;
      text-align: center;
      color: #FFFFFF;
      margin-bottom: 40px;
      margin-left: auto;
      margin-right: auto;
    }
    .swaha-home-price-row {
      display: flex;
      align-items: center;
      gap: 20px;
    }
    .swaha-home-price-text {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      color: #FFFFFF;
    }
    .swaha-home-price-text .price-label {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 20px;
      line-height: 100%;
      letter-spacing: 0.01em;
      text-transform: uppercase;
      margin-bottom: 0;
    }
    .swaha-home-price-text .price-val {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 700;
      font-size: 40px;
      line-height: 100%;
      letter-spacing: 0.01em;
    }
    .swaha-home-book-btn {
      padding: 16px;
      border-radius: 50px;
      background: linear-gradient(88deg, #212F3C -8.53%, #923F2F 26.58%, #EF4C25 94.62%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: Calibri, Arial, sans-serif;
      font-weight: 700;
      font-size: 20px;
      color: #FFFFFF;
      text-decoration: none;
      transition: opacity 0.3s;
      line-height: 1;
    }
    .swaha-home-book-btn:hover {
      opacity: 0.9;
      color: #FFFFFF;
    }
    
    /* FLOATING BOOKING BAR */
    .swaha-booking-bar {
      position: absolute;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      width: 100%;
      max-width: 1028px;
      background: #FFFFFF;
      border-radius: 20px;
      padding: 20px 30px;
      box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.05);
      z-index: 10;
    }
    .swaha-booking-form {
      height: 100%;
      gap: 20px;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
    }
    .booking-field {
      display: flex;
      flex-direction: column;
      flex: 1;
    }
    .booking-field label {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 16px;
      line-height: 100%;
      color: #666666;
      margin-bottom: 5px;
    }
    .booking-input-wrap {
      width: 100%;
      max-width: 180px;
      height: 50px;
      background: #F2F2F2;
      border-radius: 70px;
      padding: 10px 14px 10px 6px;
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
    }
    .booking-icon {
      width: 30px;
      height: 30px;
      background: #FFFFFF;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .booking-input-wrap span {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 16px;
      line-height: 100%;
      color: #000000;
      white-space: nowrap;
    }
    .swaha-booking-input {
      border: none;
      background: transparent;
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 16px;
      line-height: 100%;
      color: #000000;
      width: 100%;
      min-width: 0;
      flex: 1;
      outline: none;
      padding: 0;
    }
    .swaha-booking-input::placeholder {
      color: #000000;
    }
    .swaha-date-input {
      position: relative;
    }
    .swaha-date-input::-webkit-inner-spin-button,
    .swaha-date-input::-webkit-clear-button {
      display: none;
    }
    .swaha-date-input::-webkit-calendar-picker-indicator {
      position: absolute;
      top: 0;
      left: -40px; /* pull left to cover icon as well */
      width: calc(100% + 40px);
      height: 100%;
      opacity: 0;
      cursor: pointer;
    }
    .pointer-events-none {
      pointer-events: none;
    }
    .booking-icon.ms-auto svg {
      transition: transform 0.3s ease;
    }
    .booking-input-wrap[aria-expanded="true"] .booking-icon.ms-auto svg,
    .booking-input-wrap.is-date-open .booking-icon.ms-auto svg,
    .swaha-date-input:focus ~ .booking-icon.ms-auto svg {
      transform: rotate(180deg);
    }
    .promo-field .booking-input-wrap {
      max-width: 168px; /* Slightly smaller as per spec */
    }
    .booking-submit {
      padding-bottom: 0;
    }
    .booking-submit-btn {
      width: 168px;
      height: 50px;
      border-radius: 999px;
      background: #102226;
      border: none;
      color: #FFFFFF;
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 18px;
      line-height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: opacity 0.3s;
    }
    .booking-submit-btn:hover {
      opacity: 0.8;
    }
    .swaha-guest-menu {
      background: #FFFFFF;
      width: 260px;
      min-width: 260px;
      padding: 16px 18px !important;
    }
    .swaha-guest-menu .guest-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding: 8px 0;
      border-bottom: 1px solid #EDEDED;
    }
    .swaha-guest-menu .guest-row:last-of-type {
      border-bottom: none;
    }
    .swaha-guest-menu .guest-label {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 15px;
      color: #102226;
    }
    .swaha-guest-menu .guest-stepper {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .swaha-guest-menu .guest-step-btn {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: #FFFFFF;
      border: 1px solid #102226;
      color: #102226;
      font-size: 16px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.3s, color 0.3s;
      font-family: Calibri, Arial, sans-serif;
    }
    .swaha-guest-menu .guest-step-btn:hover {
      background: #102226;
      color: #FFFFFF;
    }
    .swaha-guest-menu .guest-step-val {
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 16px;
      min-width: 18px;
      text-align: center;
      color: #102226;
    }
    .swaha-guest-menu .guest-done-btn {
      width: 100%;
      height: 42px;
      margin-top: 12px;
      border-radius: 999px;
      background: #102226;
      border: none;
      color: #FFFFFF;
      font-family: Calibri, Arial, sans-serif;
      font-weight: 400;
      font-size: 15px;
      cursor: pointer;
      transition: opacity 0.3s;
    }
    .swaha-guest-menu .guest-done-btn:hover {
      opacity: 0.8;
    }

    .swaha-transition-nav {
      background: rgba(19, 50, 82, 0.95);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
      min-height: 78px;
      left: 0;
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 1050;
      pointer-events: auto;
      
      /* Animasi transisi mulus dari atas (Tanpa opacity agar tidak seperti berkedip/blink) */
      display: block;
      transform: translateY(-100%);
      transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .swaha-transition-nav.is-visible {
      transform: translateY(0);
    }
    .swaha-transition-nav .container {
      align-items: center;
      display: flex;
      min-height: 78px;
    }
    .swaha-transition-nav .swaha-navigation {
      min-height: 38px;
      width: 100%;
    }
    .swaha-transition-nav .swaha-nav-link {
      padding-block: 10px;
    }
    
    .navbar-toggler {
      color: white;
      border-color: rgba(255, 255, 255, 0.5);
      margin: 8px 0;
      background: transparent;
      border: 1px solid rgba(255, 255, 255, 0.5);
      border-radius: 4px;
      padding: 4px 8px;
    }
    .navbar-toggler .iconify {
      font-size: 24px;
    }
.navbar-toggler[aria-expanded="true"] .icon-menu {
      display: none !important;
    }
    .navbar-toggler[aria-expanded="true"] .icon-close {
      display: inline-block !important;
    }

    /* LAPTOP NAV COMPACT: prevent desktop menu overflowing 992-1400px */
    @media (min-width: 992px) and (max-width: 1199.98px) {
      .swaha-nav-list {
        gap: 10px;
      }
      .swaha-nav-link {
        font-size: 14px;
        padding: 8px 9px;
      }
      .dropdown-toggle::after {
        margin-left: 2px;
      }
    }
    @media (min-width: 1200px) {
      .swaha-nav-list {
        gap: 16px;
      }
      .swaha-nav-link {
        font-size: 18px;
        padding: 10px 10px;
      }
      .dropdown-toggle::after {
        margin-left: 4px;
      }
      .swaha-navigation {
        min-height: 38px;
      }
    }

    /* HEADER MOBILE */
    @media (max-width: 991.98px) {
      .swaha-hero {
        height: 400px !important;
      }
      .swaha-hero-header {
        background: transparent;
        box-shadow: none;
        left: 0;
        position: fixed;
        top: 0;
        transition: background-color 240ms ease, box-shadow 240ms ease;
        width: 100%;
        z-index: 1099;
      }
      .swaha-hero-header.mobile-scrolled {
        background: rgba(19, 50, 82, 0.78);
        backdrop-filter: blur(12px);
        box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
      }
.swaha-header-top {
        grid-template-columns: 1fr auto;
        min-height: 76px;
        padding-inline: 12px;
      }
      .swaha-brand {
        order: -1;
        justify-self: start;
        width: max-content;
      }
      .swaha-social-links {
        display: none;
      }
.swaha-header-actions {
        gap: 15px;
      }
      .swaha-header-actions > a:first-child {
        display: none;
      }
      .swaha-header-actions {
        display: none;
      }
      .swaha-hero-nav-wrap {
        padding-top: 0;
        height: 0;
      }
      .swaha-hero-nav-wrap .container {
        padding-inline: 12px;
      }
      .swaha-hero-nav-wrap .swaha-navigation {
        min-height: 0;
        position: relative;
      }
      .swaha-hero-nav-wrap {
        z-index: 1100;
      }
.swaha-hero-nav-wrap .navbar-toggler {
        color: #fff !important;
        position: fixed;
        right: 18px;
        top: 70px;
        margin: 0;
        transform: translateY(-50%);
        z-index: 1101;
      }

      .swaha-hero-nav-wrap .navbar-collapse {
        align-items: stretch;
        background: rgba(19, 50, 82, 0.78);
        backdrop-filter: blur(12px);
        border-radius: 0;
        border-left: 1px solid rgba(255, 255, 255, 0.14);
        bottom: 0;
        box-shadow: -18px 0 42px rgba(0, 0, 0, 0.24);
        display: block !important;
        height: 100dvh !important;
        max-width: 360px;
        overflow-y: auto;
        padding: 82px 22px 28px;
        position: fixed;
        right: 0;
        top: 0;
        transform: translateX(100%);
        transition: transform 320ms ease, visibility 320ms ease;
        visibility: hidden;
        width: min(86vw, 360px);
        z-index: 1100;
      }
.swaha-hero-nav-wrap .navbar-collapse.show,
      .swaha-hero-nav-wrap .navbar-collapse.collapsing {
        transform: translateX(0);
        visibility: visible;
      }
      @media (min-width: 768px) and (max-width: 991.98px) {
        .swaha-hero-nav-wrap .navbar-collapse {
          width: min(70vw, 520px);
        }
      }
      .swaha-nav-list {
        align-items: stretch;
        flex-direction: column;
        gap: 4px;
        padding: 8px 0;
        width: 100%;
      }
      .swaha-mobile-actions {
        align-items: center;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        display: flex;
        gap: 12px;
        margin-top: 14px;
        padding-top: 18px;
      }
      .swaha-mobile-actions a {
        align-items: center;
        border-radius: 999px;
        color: #fff;
        display: flex;
        flex: 1;
        font-size: 15px;
        justify-content: center;
        min-height: 42px;
        padding: 9px 12px;
        text-decoration: none;
        font-family: Calibri, Arial, sans-serif;
      }
      .swaha-mobile-actions .swaha-book-btn {
        background: #fff;
        color: #121212 !important;
        font-weight: 700;
      }
      #heroMenu .swaha-social-links {
        align-items: center;
        display: flex;
        gap: 22px;
        justify-content: center;
        margin-top: 26px;
        padding-bottom: 28px;
      }
      #heroMenu .swaha-social-links img {
        height: 30px;
        width: 30px;
      }
.swaha-mobile-actions a:not(.swaha-book-btn) {
        border: 1px solid rgba(255, 255, 255, 0.55);
        transition: background 180ms ease;
      }
      .swaha-mobile-actions a:not(.swaha-book-btn):hover,
      .swaha-mobile-actions a:not(.swaha-book-btn).is-contact {
        background: rgba(128, 128, 128, 0.45);
      }
      .swaha-nav-link {
        border-radius: 6px;
        font-size: 18px;
        padding: 13px 14px;
        justify-content: space-between;
      }
      .swaha-submenu {
        border-radius: 6px;
        box-shadow: none;
        margin: 0 !important;
        position: static !important;
        transform: none !important;
        width: 100%;
      }
.swaha-transition-nav {
        display: none;
      }
      .swaha-hero-copy {
        padding: 0 20px;
      }
      .swaha-hero-copy h1 {
        font-size: clamp(46px, 11vw, 70px);
        letter-spacing: 7px;
      }
    } /* End of max-width: 991.98px */

    /* TABLET & MOBILE HERO ADJUSTMENTS (Booking Bar & Hero Content) */
    @media (max-width: 991.98px) {
      .swaha-hero-home {
        height: auto;
        min-height: 100vh;
        padding-top: 130px;
        padding-bottom: 30px;
      }
      .swaha-home-title {
        font-size: 100px;
        letter-spacing: 5px;
        margin-bottom: 10px;
      }
      .swaha-home-desc {
        font-size: 18px;
        margin-bottom: 30px;
        padding: 0 15px;
      }
      .swaha-home-price-row {
        flex-direction: row;
        justify-content: center;
        gap: 20px;
      }
      .swaha-home-price-text {
        align-items: center;
      }
      .swaha-booking-bar {
        position: relative;
        bottom: 0;
        transform: none;
        left: 0;
        height: auto;
        width: auto;
        padding: 20px;
        border-radius: 15px;
        margin: 40px 20px 0;
      }
      .swaha-booking-form {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
        align-items: end;
      }
      .swaha-booking-bar {
        margin: 40px 12px 0;
      }
      .booking-field, .booking-submit {
        width: 100%;
        flex: none;
      }
      .booking-input-wrap {
        max-width: 100%;
      }
      .promo-field .booking-input-wrap {
        max-width: 100%;
      }
      .booking-submit-btn {
        width: 100%;
        margin-top: 0;
      }
    }
      @media (max-width: 575.98px) {
        .swaha-hero {
          height: 300px !important;
        }
        .swaha-booking-form {
          grid-template-columns: 1fr;
        }
        .swaha-home-title {
          font-size: 70px;
          letter-spacing: 3px;
        }
        .swaha-home-desc {
          font-size: 16px;
          margin-bottom: 30px;
        }
        .swaha-home-price-row {
          flex-direction: column;
          gap: 15px;
        }
        .swaha-home-price-text .price-val {
          font-size: 32px;
        }
        .swaha-home-book-btn {
          width: 100%;
          text-align: center;
        }
.swaha-hero-copy h1 {
        font-size: clamp(22px, 8.5vw, 43px);
        letter-spacing: 3px;
        padding-top: 0;
      }
      .swaha-hero-copy {
        padding: 58px 24px 24px;
        overflow: hidden;
      }
      .swaha-header-top {
        min-height: 76px;
      }
      .swaha-book-btn {
        padding: 9px 18px;
      }
    }

/* ==================== FOOTER CSS ==================== */
/* FOOTER STYLES */
    .swaha-site-footer {
      background: #faf9f7;
      box-shadow: 0 -16px 50px rgba(0, 0, 0, 0.06);
      overflow: hidden;
      padding: 50px 0;
      position: relative;
    }
    .swaha-footer-container {
      max-width: 1440px;
      padding-inline: 100px;
      position: relative;
      z-index: 1;
    }
    .swaha-footer-watermark {
      filter: blur(10px);
      height: auto;
      left: 50%;
      max-width: 90vw;
      opacity: 0.08;
      pointer-events: none;
      position: absolute;
      top: 75%;
      transform: translate(-50%, -50%);
      width: min(641px, 90vw);
    }
    .swaha-footer-grid {
      display: grid;
      gap: 40px;
      grid-template-columns: 1.35fr 1.35fr 0.65fr 1.2fr;
    }
    .swaha-footer-grid h2 {
      font-family: Zain, sans-serif;
      font-size: 30px;
      font-weight: 400;
      letter-spacing: 0.04em;
      line-height: 48px;
      margin: 0 0 8px;
    }
    .swaha-footer-grid p,
    .swaha-footer-grid a,
    .swaha-footer-grid address,
    .swaha-newsletter-form input {
      color: #656565;
      font-family: Calibri, Arial, sans-serif;
      font-size: 18px;
      font-style: normal;
      font-weight: 400;
      letter-spacing: 0;
      line-height: 1;
    }
    .swaha-footer-brand {
      padding-top: 3px;
    }
    .swaha-footer-logo {
      display: block;
      height: 105px;
      overflow: hidden;
      width: 257px;
    }
    .swaha-footer-logo img {
      display: block;
      height: 85px;
      width: 257px;
      object-fit: contain;
    }
    .swaha-footer-brand p {
      line-height: 1.2;
      font-size: 16px;
      margin: 10px 0 0;
      max-width: 290px;
    }
    .swaha-footer-contact {
      display: flex;
      flex-direction: column;
      /* gap: 16px; */
    }
    .swaha-footer-contact-list{
      padding-left: 0;
      list-style: none;
      margin: 0;
    }
    .swaha-footer-contact-list li {
      margin-bottom: 14px;
    }
    .swaha-footer-contact-list a,
    .swaha-footer-contact-list address {
      display: flex;
      align-items: flex-start;
      font-size: 16px;
    }
    .swaha-footer-contact a {
      text-decoration: none;
    }
    .swaha-footer-contact address {
      line-height: 1.2;
      margin: 0;
    }
    .swaha-footer-follow {
      white-space: nowrap;
    }
    .swaha-footer-socials {
      display: flex;
      gap: 9px;
      margin-top: 9px;
    }
    .swaha-footer-socials a {
      display: block;
      line-height: 0;
    }
    .swaha-footer-socials img {
      display: block;
      height: 34px;
      width: 34px;
      object-fit: contain;
      filter: invert(1);
    }
    .swaha-footer-newsletter p {
      line-height: 1.2;
      font-size: 16px;
      margin: 0;
    }
    .swaha-newsletter-form {
      display: flex;
      height: 40px;
      margin-top: 54px;
    }
    .swaha-newsletter-form input {
      background: rgba(255, 255, 255, 0.6);
      border: 1px solid #ddd;
      border-radius: 9px 0 0 9px;
      min-width: 0;
      padding: 0 10px;
      width: 100%;
    }
    .swaha-newsletter-form button {
      align-items: center;
      background: #ef4a24;
      border: 0;
      border-radius: 0 9px 9px 0;
      color: #fff;
      display: flex;
      justify-content: center;
      width: 40px;
      font-size: 20px;
    }
    .swaha-footer-bottom {
      align-items: center;
      border-top: 1px solid #dededb;
      display: flex;
      justify-content: space-between;
      margin-top: 54px;
      padding-top: 34px;
    }
    .swaha-footer-bottom p {
      color: #111;
      font-family: Calibri, Arial, sans-serif;
      font-size: 18px;
      line-height: 1;
      margin: 0;
    }
    .swaha-footer-credit {
      align-items: center;
      display: flex;
      gap: 12px;
    }
    .swaha-footer-credit img {
      height: 16px;
      object-fit: contain;
      width: 101px;
      height: 23px;
      filter: invert(1);
    }

    /* FOOTER MOBILE */
    @media (max-width: 991.98px) {
      .swaha-footer-container {
        padding-inline: 32px;
      }
      .swaha-footer-grid {
        grid-template-columns: repeat(2, 1fr);
      }
      .swaha-footer-newsletter {
        max-width: 390px;
      }
    }
    @media (min-width: 576px) and (max-width: 991.98px) {
      .swaha-site-footer {
        padding-block: 56px 42px;
      }
      .swaha-footer-container {
        padding-inline: 44px;
      }
      .swaha-footer-grid {
        column-gap: 34px;
        row-gap: 48px;
      }
      .swaha-footer-bottom {
        gap: 20px;
      }
    }
    @media (max-width: 575.98px) {
      .swaha-site-footer {
        padding-block: 40px;
      }
      .swaha-footer-container {
        padding-inline: 22px;
      }
      .swaha-footer-grid {
        grid-template-columns: 1fr;
      }
      .swaha-footer-grid h2 {
        font-size: 27px;
        line-height: 1.2;
      }
      .swaha-footer-grid p,
      .swaha-footer-grid a,
      .swaha-footer-grid address,
      .swaha-newsletter-form input {
        font-size: 16px;
      }
      .swaha-footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
      }
      .swaha-footer-brand {
        align-items: center;
        display: flex;
        flex-direction: column;
        text-align: center;
        width: 100%;
      }
      .swaha-footer-brand p {
        margin-left: auto;
        margin-right: auto;
      }
      .swaha-newsletter-form {
        margin-top: 28px;
      }
      .swaha-footer-watermark {
        max-width: 90vw;
        top: 50%;
        transform: translate(-50%, -50%);
      }
    }

    /* LANGUAGE SWITCHER */
    .swaha-lang-switcher {
      position: fixed;
      bottom: 30px;
      right: 30px;
      z-index: 1050;
    }
    .swaha-lang-btn {
      background: #FFFFFF;
      border: none;
      border-radius: 56px;
      box-shadow: 0px 3.2px 16px 0px rgba(0, 0, 0, 0.16);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 56px;
      width: 56px;
      padding: 0;
      transition: transform 0.2s ease;
    }
    .swaha-lang-btn:hover {
      transform: scale(1.05);
    }
    .swaha-lang-btn img {
      width: 24px;
      height: 24px;
      object-fit: contain;
    }
    .swaha-lang-popup {
      background: #FFFFFF;
      border-radius: 8px;
      bottom: 70px; /* Above the button */
      box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
      display: none;
      opacity: 0;
      position: absolute;
      right: 0;
      transition: opacity 0.2s ease;
      width: 223px;
      z-index: 1051;
    }
    .swaha-lang-popup.show {
      display: block;
    }
    .swaha-lang-popup.fade-in {
      opacity: 1;
    }
    .swaha-lang-popup-header {
      align-items: center;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      display: flex;
      height: 40px;
      justify-content: space-between;
      padding-left: 20px;
      padding-right: 15px;
    }
    .swaha-lang-popup-header span {
      color: #000000;
      font-family: Calibri, Arial, sans-serif;
      font-size: 14px;
      font-weight: 700;
      line-height: 1;
    }
    .swaha-lang-close {
      background: transparent;
      border: none;
      color: #000;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      padding: 0;
      transition: opacity 0.15s;
    }
    .swaha-lang-close:hover {
      opacity: 0.6;
    }
    .swaha-lang-popup-body {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 0 20px 10px 20px;
    }
    .swaha-lang-item {
      align-items: center;
      border-radius: 8px;
      color: #000000;
      display: flex;
      gap: 20px;
      height: 36px;
      padding: 8px 10px;
      text-decoration: none;
      transition: background 0.15s ease;
      width: 100%;
      box-sizing: border-box;
    }
    .swaha-lang-item:hover,
    .swaha-lang-item.active {
      background: #0B8BEE1A;
    }
    .swaha-lang-item img {
      height: 20px;
      object-fit: cover;
      width: 30px;
      border-radius: 2px;
    }
    .swaha-lang-item span {
      font-family: Calibri, Arial, sans-serif;
      font-size: 14px;
      font-weight: 400;
      line-height: 1;
    }

    @media (max-width: 991.98px) {
      .swaha-lang-switcher {
        bottom: 20px;
        right: 20px;
      }
      .swaha-lang-btn {
        height: 48px;
        width: 48px;
      }
      .swaha-lang-btn img {
        height: 20px;
        width: 20px;
      }
      .swaha-lang-popup {
        bottom: 60px;
        width: 200px;
      }
      .swaha-lang-popup-header {
        padding-left: 15px;
      }
      .swaha-lang-popup-body {
        padding: 0 15px 10px 15px;
      }
    }
    @media (max-width: 575.98px) {
      .swaha-lang-switcher {
        bottom: 15px;
        right: 15px;
      }
      .swaha-lang-btn {
        height: 42px;
        width: 42px;
      }
      .swaha-lang-btn img {
        height: 18px;
        width: 18px;
      }
      .swaha-lang-popup {
        bottom: 52px;
        width: 180px;
      }
      .swaha-lang-popup-header span {
        font-size: 13px;
      }
      .swaha-lang-item {
        gap: 15px;
        padding: 6px 8px;
      }
      .swaha-lang-item span {
        font-size: 13px;
      }
    }

/* ==================== FRONT PAGE CSS ==================== */
/* STORY SECTION */
    .swaha-story-section {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 100px 0;
        background: #FADFBD33;
        overflow: hidden;
    }

    .swaha-story-row {
        height: 100%;
        align-items: center; /* Centered vertically to match heights (kiri & kanan selaras) */
    }

    /* LEFT COLUMN */
    .swaha-text-column {
        position: relative;
        /* margin-top removed so it vertically centers correctly */
    }

    /* BADGE */
    .swaha-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        gap: 10px;
        margin: 0 0 16px 0;
        background: rgba(239, 76, 37, 0.1); /* #EF4C251A */
        border-radius: 0;
    }

    .swaha-badge span {
        font-family: Calibri, Arial, Helvetica, sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 100%;
        color: #EF4C25;
        white-space: nowrap;
    }

    /* HEADING */
    .swaha-heading {
        width: 100%;
        margin: 0 0 16px 0;
        font-family: "Zain", sans-serif;
        font-size: 48px;
        font-weight: 700;
        line-height: 58px;
        color: #133252;
    }

    /* DESCRIPTION 1 */
    .swaha-desc-1 {
        width: 100%;
        margin: 0 0 16px 0;
        font-family: Calibri, Arial, Helvetica, sans-serif;
        font-size: 20px;
        font-weight: 400;
        line-height: 30px;
        color: #999999;
        text-align: justify;
    }

    /* DESCRIPTION 2 */
    .swaha-desc-2 {
        width: 100%;
        margin: 0 0 40px 0;
        font-family: Calibri, Arial, Helvetica, sans-serif;
        font-size: 20px;
        font-weight: 400;
        line-height: 30px;
        color: #999999;
        text-align: left;
    }

    /* BUTTON */
    .swaha-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 189px;
        height: 52px;
        border-radius: 50px;
        padding: 16px;
        border: 1px solid #133252;
        background: transparent;
        color: #133252;
        font-family: Calibri, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        text-decoration: none;
        transition: 0.3s ease;
    }

    .swaha-btn:hover {
        background: #133252;
        color: #FFFFFF;
    }

    /* RIGHT COLUMN */
    .swaha-image-column {
        position: relative;
    }

    .swaha-image-wrapper {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 77.76%;
        margin: 0 auto;
    }

    /* GOOD STAYS (first) */
    .swaha-goodstays-img {
        position: absolute;
        top: 0;
        left: 1.623%; /* Approx 10px */
        display: block;
        width: 37.175%;
        height: 50.522%;
        object-fit: contain;
        transform: rotate(7deg);
        transform-origin: center center;
        z-index: 3;
    }

    /* GEDUNG (second) */
    .swaha-gedung-img {
        position: absolute;
        top: 9.395%;
        left: 0.974%;
        display: block;
        width: 99.026%;
        height: 82.046%;
        object-fit: cover;
        object-position: center;
        border-radius: 20px;
        z-index: 1;
    }

    /* SWAHA CARD (third) */
    .swaha-card-img {
        position: absolute;
        top: 68.894%;
        left: 65.747%;
        display: block;
        width: 34.253%;
        height: 31.106%;
        object-fit: cover;
        border-radius: 20px;
        box-shadow: 0 5px 14px rgba(0, 0, 0, 0.08);
        z-index: 4;
    }

    /* =========================================================
       SECTION 3: OUR TYPE OF ROOMS (SLICK)
       ========================================================= */
    .swaha-rooms-section {
        padding: 100px 0;
        background: #FFFFFF;
        overflow: hidden;
    }

    .rooms-header-left .swaha-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        gap: 10px;
        background: #EF4C251A;
        margin-bottom: 10px;
    }
    .rooms-header-left .swaha-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 100%;
        color: #EF4C25;
        white-space: nowrap;
    }

    .rooms-heading {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 48px;
        line-height: 58px;
        color: #133252;
        margin-bottom: 10px;
    }

    .rooms-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 3%;
        color: #999999;
        margin-bottom: 0px;
    }

    /* ARROWS */
    .room-nav-btn {
        width: 50px;
        height: 50px;
        border-radius: 999px;
        border: 1px solid #000000;
        background: transparent;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: 0.3s;
    }
    .room-nav-btn:hover {
        background: #f0f0f0;
    }

    /* SLICK SLIDER */
    .rooms-slick-slider {
        position: relative;
        margin-top: 40px;
    }
    
    .rooms-slick-slider .slick-list {
        overflow: visible; /* Membuat slider fluid dan tembus kanan-kiri */
    }

    .rooms-slick-slider .slick-slide {
        margin: 0 20px; /* Jarak antar card 40px total (20px kiri, 20px kanan) agar centerMode simetris */
    }

    /* ROOM CARD */
    .room-card {
        width: 400px;
        display: flex;
        flex-direction: column;
        border-radius: 20px;
        background: #fff;
        outline: none;
    }

    @media (max-width: 500px) {
        .room-card {
            width: 320px;
        }
    }

    .room-img-wrap {
        width: 100%;
        height: 253px;
        overflow: hidden;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
    }
    
    .room-img-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .swaha-rooms-section .room-content {
        height: 139px;
        padding: 20px;
        border-width: 0px 1px 0px 1px;
        border-style: solid;
        border-color: #DDDDDD;
        box-sizing: border-box;
    }

    .swaha-rooms-section .room-title {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 24px;
        line-height: 100%;
        color: #000000;
        margin-bottom: 10px;
    }

    .swaha-rooms-section .room-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        color: #999999;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .room-actions {
        display: flex;
        height: 56px;
    }

    .swaha-rooms-section .room-btn-detail {
        flex: 0 0 55%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #DDDDDD;
        border-bottom-left-radius: 20px;
        background: #FFFFFF;
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        color: #000000;
        text-decoration: none;
        transition: 0.3s;
        box-sizing: border-box;
    }
    .swaha-rooms-section .room-btn-detail:hover {
        background: #f8f8f8;
        color: #000;
    }

    .swaha-rooms-section .room-btn-book {
        flex: 0 0 45%;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #133252;
        border: none;
        border-bottom-right-radius: 20px;
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 20px;
        color: #FFFFFF;
        text-decoration: none;
        transition: 0.3s;
        box-sizing: border-box;
    }
    .swaha-rooms-section .room-btn-book:hover {
        background: #0d2238;
        color: #FFFFFF;
    }
    
    /* Slick Dots Customization */
    .rooms-slick-slider .slick-dots {
        display: flex;
        justify-content: center;
        list-style: none;
        padding: 0;
        margin: 40px auto 0;
        gap: 8px;
        bottom: auto;
    }
    .rooms-slick-slider .slick-dots li {
        margin: 0;
        padding: 0;
        width: 30px;
        height: 6px;
    }
    .rooms-slick-slider .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 30px;
        height: 6px;
        padding: 0;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: none;
        background: #0000001A; /* Inactive color */
        border-radius: 3px;
        transition: 0.3s;
    }
    .rooms-slick-slider .slick-dots li button:before {
        display: none !important;
    }
    .rooms-slick-slider .slick-dots li.slick-active button {
        background: #133151; /* Active color */
    }
    .rooms-slick-slider .slick-dots li.slick-active button {
        background: #133151; /* #133151 as requested */
    }

    /* =========================================================
       SECTION 4: DINING EXPERIENCES
       ========================================================= */
    .dining-section {
        position: relative;
        padding-top: 50px;
    }

    .dining-bg-blue {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 366px;
        background: #133252;
        z-index: -1;
    }

    .dining-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 156px;
        height: 36px;
        padding: 10px;
        background: #FFFFFF;
        margin-bottom: 10px;
    }

    .dining-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #133252;
        white-space: nowrap;
    }

    .dining-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 48px;
        line-height: 58px;
        color: #FFFFFF;
        margin-bottom: 10px;
    }

    .dining-subtitle {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.03em;
        color: #FFFFFF;
        margin-bottom: 36px;
    }

    .dining-card {
        width: 100%;
        max-width: 610px;
        margin: 0 auto;
    }

    .dining-img {
        width: 100%;
        height: 320px;
        object-fit: cover;
        border-radius: 20px;
        margin-bottom: 20px;
    }

    .dining-card-body {
        padding: 0 20px;
    }

    .dining-card-title {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 24px;
        line-height: 100%;
        color: #133252;
        margin-bottom: 10px;
    }

    .dining-card-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 130%; /* slightly increased from 100% to prevent clipping descenders */
        color: #999999;
        margin-bottom: 20px;
        
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .dining-card-link {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #EF4C25;
        text-decoration: none;
        display: inline-block;
        transition: 0.3s;
    }
    
    .dining-card-link:hover {
        color: #d13d1b;
        text-decoration: underline;
    }

    /* =========================================================
       SECTION 5: WELLNESS & LEISURE
       ========================================================= */
    .wellness-section {
        padding: 100px 0;
        background: #FFFFFF;
    }

    .wellness-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 36px;
        padding: 10px;
        background: rgba(239, 76, 37, 0.1); /* #EF4C251A */
        margin-bottom: 10px;
    }

    .wellness-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #EF4C25;
        text-transform: uppercase;
    }

    .wellness-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 48px;
        line-height: 58px;
        color: #133252;
        margin-bottom: 10px;
    }

    .wellness-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.03em;
        color: #999999;
        margin-bottom: 40px;
    }

    .wellness-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 15px 16px;
        line-height: 100%;
        border-radius: 50px;
        border: 1px solid #133252;
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        letter-spacing: 0.01em;
        color: #000000;
        text-decoration: none;
        transition: 0.3s;
        background: transparent;
    }

    .wellness-btn:hover {
        background: #133252;
        color: #FFFFFF;
    }

    .wellness-cards-wrapper {
        display: flex;
        gap: 20px;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .wellness-card {
        width: 295px;
        height: 318px;
        border-radius: 20px;
        padding: 20px;
        background: #133252;
        box-sizing: border-box;
    }

    .wellness-card-inner {
        width: 100%;
        height: 100%;
        border-radius: 20px;
        border: 1px solid #E1E1E1;
        padding: 30px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        box-sizing: border-box;
    }

    .wellness-icon-wrap {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 10px;
        flex-shrink: 0;
    }

    .wellness-icon-wrap img {
        width: 40px;
        height: 40px;
        object-fit: contain;
    }

    .wellness-card-title {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 24px;
        line-height: 100%;
        color: #FFFFFF;
        margin-bottom: 10px;
    }

    .wellness-card-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 120%; /* Slightly adjusted for readability */
        color: #FFFFFF;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* =========================================================
       SECTION 6: HOTEL SERVICES
       ========================================================= */
    .hotel-services-section {
        background-image: url('../../uploads/2026/09/paper_blue-1.png');
        background-size: cover;
        background-position: center;
        height: 421px;
        overflow: hidden;
    }
    
    .hotel-services-row {
        height: 421px;
    }

    .hotel-services-row > div {
        height: 421px;
    }

    .services-img {
        width: 100%;
        /* height: 421px !important; Paksa persis 421px tanpa toleransi */
        object-fit: cover;
        object-position: center 85%;
        display: block;
    }

    .services-text-col {
        display: flex;
        align-items: center; /* Vertikal di tengah */
        padding-left: 50px;
    }

    .services-text-inner {
        width: 100%;
        max-width: 580px; /* Limits width so it doesn't stretch too wide on huge screens */
    }

    .services-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 36px;
        padding: 10px;
        background: #FFFFFF;
        margin-bottom: 10px;
    }

    .services-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #133252;
        text-transform: uppercase;
    }

    .services-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 48px;
        line-height: 58px;
        color: #FFFFFF;
        margin-bottom: 10px;
    }

    .services-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        color: #FFFFFF;
        margin-bottom: 47px;
    }

    .services-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .services-list li {
        position: relative;
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 150%;
        color: #FFFFFF;
        padding-left: 15px;
        margin-bottom: 0;
    }

    .services-list li::before {
        content: "•";
        position: absolute;
        left: 0;
        color: #FFFFFF;
    }

    /* =========================================================
       SECTION 7: ADDITIONAL SERVICES & FACILITIES
       ========================================================= */
    .additional-section {
        padding: 100px 0;
        background: #FFFFFF;
    }

    .additional-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 40px;
        padding: 10px;
        background: rgba(239, 76, 37, 0.1); /* #EF4C251A */
        margin-bottom: 10px;
    }

    .additional-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #EF4C25;
        text-transform: uppercase;
    }

    .additional-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 48px;
        line-height: 58px;
        color: #133252;
        margin-bottom: 10px;
    }

    .additional-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.03em;
        color: #999999;
        margin-bottom: 43px;
        max-width: 650px;
    }

    .add-card-small {
        width: 100%;
        min-height: 247px;
        height: 100%;
        background: #FFFFFF;
        box-shadow: 0px 4px 14px 0px #E3E8EF;
        border-radius: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 20px;
        text-align: center;
    }

    .add-card-small img {
        width: 90px;
        height: 90px;
        object-fit: contain;
        margin-bottom: 10px;
    }

    .add-card-small h3 {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        color: #1B458A;
        margin: 0;
        margin-top: 10px; /* padding-top 20px relative to icon, minus icon mb */
    }

    .add-card-large {
        width: 100%;
        min-height: 454px;
        height: 100%;
        height: 454px;
        background: #FFFFFF;
        box-shadow: 0px 4px 14px 0px #E3E8EF;
        border-radius: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 20px;
        text-align: center;
    }

    .add-card-large img {
        width: 180px;
        height: 298px;
        object-fit: contain;
    }

    .add-card-large h3 {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 30px;
        line-height: 100%;
        color: #1B458A;
        margin: 0;
    }

    .additional-btn-wrap {
        margin-top: 30px;
        display: flex;
        justify-content: center;
    }

    .additional-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 187px;
        height: 52px;
        border-radius: 50px;
        border: none;
        background: transparent;
        color: #000000;
        font-family: Calibri, Arial, sans-serif;
        font-size: 20px;
        letter-spacing: 0.01em;
        text-decoration: none;
        transition: 0.3s;
    }

    .additional-btn:hover {
        opacity: 0.7;
    }

    /* =========================================================
       SECTION 8: SPECIAL OPENING OFFER
       ========================================================= */
    .offer-section {
        padding: 100px 0;
        min-height: 400px;
        background: linear-gradient(90deg, #133252 20%, rgba(19, 50, 82, 0) 100%), url('../../uploads/2026/09/gallery3.jpg') center/cover no-repeat;
    }

    .offer-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 50px;
        line-height: 52px;
        letter-spacing: 0.02em;
        color: #FFFFFF;
        margin-bottom: 10px;
    }

    .offer-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.03em;
        color: #FFFFFF;
        margin-bottom: 48px;
        max-width: 500px;
    }

    .offer-start-from {
        display: block;
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #FFFFFF;
        margin-bottom: 10px;
    }

    .offer-price-row {
        display: flex;
        align-items: center;
        gap: 20px;
        flex-wrap: wrap;
    }

    .offer-price {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 40px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #FFFFFF;
    }

    .offer-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50px;
        padding: 16px;
        background: linear-gradient(88deg, #212F3C -8.53%, #923F2F 26.58%, #EF4C25 94.62%);
        font-family: Calibri, Arial, sans-serif;
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #FFFFFF;
        text-decoration: none;
        transition: opacity 0.3s;
    }

    .offer-btn:hover {
        opacity: 0.85;
        color: #FFFFFF;
    }

    /* =========================================================
       SECTION 9: AROUND US
       ========================================================= */
    .around-section {
        padding: 100px 0;
        background: #FFFFFF;
    }

    .around-images {
        display: flex;
        gap: 20px;
        justify-content: center; /* Ensure they stay centered if container is larger */
    }

    .around-images img {
        flex: 1 1 0;
        min-width: 0;
        max-width: 295px;
        aspect-ratio: 295 / 385;
        object-fit: cover;
        border-radius: 20px;
    }

    .around-text-wrap {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .around-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 36px;
        padding: 10px;
        background: rgba(239, 76, 37, 0.1); /* #EF4C251A */
        margin-bottom: 10px;
    }

    .around-badge span {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 0.01em;
        color: #EF4C25;
        text-transform: uppercase;
    }

    .around-title {
        font-family: "Zain", sans-serif;
        font-weight: 700;
        font-size: 50px;
        line-height: 57px;
        color: #000000;
        margin-bottom: 10px;
    }

    .around-desc {
        font-family: Calibri, Arial, sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 100%;
        letter-spacing: 0.03em;
        color: #999999;
        margin-bottom: 40px;
    }

    .around-list-wrapper {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: space-between;
    }

    .around-list {
        list-style: none;
        padding: 0;
        margin: 0;
        flex: 1;
    }

    .around-list li {
        font-family: Calibri, Arial, sans-serif;
        font-size: 20px;
        line-height: 120%;
        margin-bottom: 10px;
    }

    .around-list li span {
        font-weight: 400;
        color: #000000;
    }

    .around-list li span.light-text {
        color: rgba(0, 0, 0, 0.6); /* #00000099 */
    }

    /* =========================================================
       SECTION 10: GALLERY SLIDER
       ========================================================= */
    .gallery-section {
        padding: 0 0 100px 0;
        overflow: hidden; /* Hide overflow horizontally */
    }

    .gallery-slick-slider {
        margin: 0;
    }

    .gallery-slick-slider .slick-list {
        overflow: visible; /* Allows images to bleed out off-screen */
    }

    .gallery-img-wrapper {
        width: 295px;
        margin: 0 10px; /* 10px margin on each side creates a 20px gap */
        outline: none;
    }

    .gallery-img-wrapper img {
        width: 295px;
        height: 220px;
        object-fit: cover;
        border-radius: 20px;
        display: block;
    }

    /* Mobile overrides */
    @media (max-width: 991px) {
        .swaha-story-section {
            width: 100%;
            padding: 45px 20px 50px;
        }

        .swaha-story-row {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* TEXT COLUMN */
        .swaha-text-column {
            width: 100%;
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .swaha-badge {
            margin: 0 auto 16px;
        }

        .swaha-heading {
            text-align: center;
            font-size: 32px;
            line-height: 40px;
        }

        .swaha-desc-1 {
            font-size: 16px;
            line-height: 24px;
            text-align: justify;
        }

        .swaha-desc-2 {
            font-size: 16px;
            line-height: 24px;
            text-align: left;
            margin-bottom: 30px;
        }

        /* BUTTON RESPONSIVE */
        .swaha-btn {
            width: 150px;
            height: 44px;
            font-size: 16px;
            padding: 10px;
        }

        /* IMAGE COLUMN */
        .swaha-image-column {
            width: 100%;
            margin-top: 40px;
        }

        /* ROOMS SECTION MOBILE */
        .swaha-rooms-section {
            padding: 50px 0;
        }

        .rooms-header-left {
            text-align: center;
            width: 100%;
        }

        .rooms-header-left .swaha-badge {
            margin: 0 auto 10px auto;
        }

        .rooms-heading {
            font-size: 32px;
            line-height: 40px;
        }

        .rooms-desc {
            font-size: 16px;
            line-height: 24px;
        }

        /* DINING SECTION MOBILE */
        .dining-section {
            padding-top: 50px;
        }

        .dining-bg-blue {
            height: 100%;
            bottom: 0;
            max-height: 420px; /* Adjust to cover title/desc and part of first image */
        }

        .dining-title {
            font-size: 32px;
            line-height: 40px;
        }

        .dining-subtitle {
            font-size: 16px;
            line-height: 24px;
            margin-bottom: 24px;
        }

        .dining-img {
            height: 240px;
        }
        
        .dining-card-body {
            padding: 0 10px;
        }

        /* WELLNESS SECTION MOBILE */
        .wellness-section {
            padding: 50px 0;
        }
        
        .wellness-title {
            font-size: 32px;
            line-height: 40px;
        }

        .wellness-desc {
            font-size: 16px;
            line-height: 24px;
        }

        .wellness-cards-wrapper {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            max-width: 600px;
            margin: 40px auto 0;
            gap: 15px;
        }

        .wellness-card {
            width: 100% !important;
            max-width: none !important;
            padding: 10px !important;
        }

        .wellness-card-inner {
            padding: 15px 10px !important;
            box-sizing: border-box !important;
        }

        .wellness-card-title {
            font-size: 18px !important;
            line-height: 1.2 !important;
        }

        .wellness-card-desc {
            font-size: 13px !important;
            line-height: 1.3 !important;
        }

        /* HOTEL SERVICES SECTION MOBILE */
        .hotel-services-section {
            text-align: center;
            height: auto; /* Reset fixed height on mobile */
        }

        .hotel-services-row {
            height: auto; /* Reset fixed height on mobile */
        }
        
        .hotel-services-row > div {
            height: auto;
        }

        .services-img {
            height: 300px; /* Shorter image on mobile */
            min-height: auto;
        }

        .services-text-col {
            padding: 50px 20px !important;
            justify-content: center;
        }
        
        .services-text-inner {
             padding: 15px 10px !important;
        }

        .services-title {
            font-size: 18px !important;
            line-height: 40px;
        }

        .wellness-card-desc {
            font-size: 13px !important; /* Sesuaikan ukuran teks */
        }

        .services-list li {
            text-align: left; /* Keep bullets aligned left even if section is centered */
        }

        .hotel-services-list-row {
            max-width: none;
            justify-content: center;
        }

        .hotel-services-list-row > .col-md-6 {
            width: auto !important;
            flex: 0 0 auto !important;
            margin: 0 20px;
        }

        /* ADDITIONAL SECTION MOBILE */
        .additional-section {
            padding: 50px 0;
        }

        .additional-badge {
            margin: 0 auto 10px;
        }

        .additional-title {
            font-size: 32px;
            line-height: 40px;
        }

        .additional-desc {
            font-size: 16px;
            line-height: 24px;
            margin-left: auto;
            margin-right: auto;
        }

        .add-card-small {
            max-width: none;
            height: 100%;
            min-height: 200px;
        }

        .add-card-large {
            margin-top: 20px;
            height: 100%;
            min-height: 350px;
            max-width: none;
        }

        .add-card-large img {
            height: 200px;
            width: auto;
        }

        /* OFFER SECTION MOBILE */
        .offer-section {
            padding: 50px 0;
            min-height: auto;
            background: linear-gradient(180deg, rgba(19, 50, 82, 0.9) 0%, rgba(19, 50, 82, 0.7) 100%), url('../../uploads/2026/09/gallery3.jpg') center/cover no-repeat;
            text-align: center;
        }

        .offer-title {
            font-size: 32px;
            line-height: 40px;
        }

        .offer-desc {
            font-size: 16px;
            line-height: 24px;
            margin-left: auto;
            margin-right: auto;
        }

        .offer-price-block {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .offer-price-row {
            justify-content: center;
            gap: 15px; /* smaller gap on mobile */
        }

        .offer-price {
            font-size: 32px; /* scale down price */
        }
        
        .offer-btn {
            font-size: 16px;
            width: 160px;
            height: 48px;
        }

        /* AROUND US MOBILE */
        .around-section {
            padding: 50px 0;
        }

        .around-text-wrap {
            align-items: center;
            text-align: center;
        }

        .around-title {
            font-size: 32px;
            line-height: 40px;
        }

        .around-desc {
            font-size: 16px;
            line-height: 24px;
        }

        .around-list-wrapper {
            justify-content: center;
            gap: 40px;
        }
        
        .around-list {
            flex: 0 1 auto;
            text-align: left;
        }
        
        .around-list li {
            font-size: 16px;
        }
    }

    /* Extra small mobile overrides */
    @media (max-width: 767px) {
        .hotel-services-list-row > .col-md-6 {
            width: 100% !important;
            margin: 0 0 15px 0;
            display: flex;
            justify-content: center;
        }

        .around-list-wrapper {
            flex-direction: column;
            align-items: flex-start;
            margin: 0 auto;
            width: fit-content;
            gap: 15px;
        }
    }

        @media (max-width: 575.98px) {
        .wellness-cards-wrapper {
            grid-template-columns: 1fr;
        }

        .wellness-card {
            width: 100% !important;
            max-width: none !important;
            padding: 20px !important;
        }

        .wellness-card-inner {
            padding: 30px 20px !important;
        }

        .wellness-card-title {
            font-size: 24px !important;
            line-height: 100% !important;
        }

        .wellness-card-desc {
            font-size: 16px !important;
            line-height: 150% !important;
        }
    }

.custom-bullet-list { padding-left: 20px !important; margin-top: 10px; margin-bottom: 10px; list-style-type: disc; }

.swaha-footer-contact-list { padding-left: 0; margin-bottom: 0; list-style: none; }