/*
Theme Name: Suhad Hotel
Theme URI: https://suhadhotel.com
Author: Suhad Hotel
Description: Luxury boutique hotel theme (RTL, Arabic). Navy #071724 and gold #a97904. Built to work with Elementor.
Version: 1.2.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: suhad-hotel
Tags: rtl-language-support, custom-menu, full-width-template
*/
:root {
  --color-navy: #071724;
  --color-navy-deep: #04101a;
  --color-navy-line: #1b3246;
  --color-gold: #a97904;
  --color-gold-light: #d4a93a;
  --color-gold-hover: #c08c0a;
  --color-champagne: #f7f0e0;
  --color-champagne-line: #d9bf7e;
  --color-ivory: #faf7f1;
  --color-cream: #f4eee3;
  --color-white: #ffffff;
  --color-text: #071724;
  --color-muted: #5f6a73;
  --color-subtle: #8a949c;
  --color-line: #e4dccd;
  --color-on-dark: #ffffff;
  --color-on-dark-muted: #aab4bc;
  --color-on-dark-soft: #c9d2d9;
  --color-placeholder: #e6e1d8;

  --font-serif: "Amiri", serif;
  --font-sans: "IBM Plex Sans Arabic", sans-serif;

  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 24px;
  --fs-2xl: 30px;
  --fs-3xl: 40px;
  --fs-4xl: 56px;
  --fs-5xl: 76px;

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 600;

  --lh-tight: 1.1;
  --lh-snug: 1.4;
  --lh-body: 1.9;

  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --container: 1240px;
  --container-narrow: 760px;
  --text-measure: 560px;
  --btn-height: 52px;
  --input-height: 54px;
  --topbar-height: 42px;
  --header-height: 84px;
  --border-width: 1px;
  --marker-size: 7px;
  --line-short: 48px;
  --radius-none: 0;
  --radius-round: 50%;
  --badge-size: 150px;
  --hero-min: 620px;
  --media-min: 360px;
  --ratio-card: 4 / 3;
  --ratio-portrait: 4 / 5;
  --ratio-wide: 16 / 9;
  --ratio-square: 1 / 1;
  --shadow-soft: 0 24px 60px rgba(7, 23, 36, 0.12);
  --ease: 0.35s ease;
  --letter-wide: 0.02em;
}

@media (max-width: 1024px) {
  :root {
    --fs-3xl: 34px;
    --fs-4xl: 46px;
    --fs-5xl: 58px;
    --space-9: 72px;
    --space-10: 96px;
    --hero-min: 480px;
  }
}
@media (max-width: 640px) {
  :root {
    --fs-2xl: 26px;
    --fs-3xl: 30px;
    --fs-4xl: 36px;
    --fs-5xl: 42px;
    --space-7: 36px;
    --space-8: 48px;
    --space-9: 56px;
    --space-10: 64px;
    --header-height: 68px;
    --badge-size: 120px;
    --hero-min: 0px;
    --media-min: 260px;
  }
}

* { box-sizing: border-box; }
body { margin: var(--space-0); background: var(--color-ivory); color: var(--color-text); font-family: var(--font-sans); font-size: var(--fs-md); line-height: var(--lh-body); }
a { color: var(--color-text); text-decoration: none; transition: color var(--ease); }
a:hover { color: var(--color-gold); }
img { max-width: 100%; display: block; }

/* ---------- Layout ---------- */
.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--space-6); display: flex; flex-direction: column; gap: var(--space-7); }
.container-narrow { max-width: var(--container-narrow); margin: 0 auto; padding: 0 var(--space-6); display: flex; flex-direction: column; align-items: center; gap: var(--space-5); text-align: center; }
.section { padding: var(--space-10) 0; background: var(--color-ivory); }
.section-white { padding: var(--space-10) 0; background: var(--color-white); }
.section-cream { padding: var(--space-9) 0; background: var(--color-cream); }
.section-dark { padding: var(--space-10) 0; background: var(--color-navy); color: var(--color-on-dark); }
.row { display: flex; flex-wrap: wrap; gap: var(--space-6); }
.row-center { display: flex; flex-wrap: wrap; gap: var(--space-6); align-items: center; }
.col-2 { flex: 1 1 calc(50% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.col-3 { flex: 1 1 calc(33.333% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; }
.col-4 { flex: 1 1 calc(25% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.stack { display: flex; flex-direction: column; gap: var(--space-4); }
.section-head { display: flex; flex-direction: column; gap: var(--space-3); max-width: var(--container-narrow); }
.section-head-center { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); text-align: center; }

/* ---------- Type ---------- */
.eyebrow { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--color-gold); margin: 0; }
.eyebrow-light { font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--color-gold-light); margin: 0; }
.hero-title { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-5xl); line-height: var(--lh-tight); color: var(--color-on-dark); margin: 0; }
.section-title { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-4xl); line-height: var(--lh-tight); color: var(--color-text); margin: 0; }
.section-title-light { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-4xl); line-height: var(--lh-tight); color: var(--color-on-dark); margin: 0; }
.card-title { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-2xl); line-height: var(--lh-snug); color: var(--color-text); margin: 0; }
.card-title-light { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-2xl); line-height: var(--lh-snug); color: var(--color-on-dark); margin: 0; }
.small-title { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-xl); line-height: var(--lh-snug); color: var(--color-text); margin: 0; }
.lead { font-size: var(--fs-lg); font-weight: var(--fw-light); line-height: var(--lh-body); color: var(--color-muted); margin: 0; max-width: var(--text-measure); }
.lead-light { font-size: var(--fs-lg); font-weight: var(--fw-light); line-height: var(--lh-body); color: var(--color-on-dark-soft); margin: 0; max-width: var(--text-measure); }
.body-text { font-size: var(--fs-md); font-weight: var(--fw-light); line-height: var(--lh-body); color: var(--color-muted); margin: 0; }
.body-text-light { font-size: var(--fs-md); font-weight: var(--fw-light); line-height: var(--lh-body); color: var(--color-on-dark-soft); margin: 0; }
.meta-text { font-size: var(--fs-sm); color: var(--color-subtle); margin: 0; }

/* ---------- Decorative (real elements, no pseudo) ---------- */
.divider-gold { width: var(--line-short); height: var(--border-width); background: var(--color-gold); }
.divider-row { display: flex; align-items: center; justify-content: center; gap: var(--space-3); }
.divider-line { width: var(--line-short); height: var(--border-width); background: var(--color-line); }
.diamond { width: var(--marker-size); height: var(--marker-size); background: var(--color-gold); transform: rotate(45deg); flex: none; }

/* ---------- Buttons ---------- */
.button-row { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.btn-primary { display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-6); background: var(--color-gold); color: var(--color-white); font-family: var(--font-sans); font-size: var(--fs-md); font-weight: var(--fw-bold); border: 0; transition: background var(--ease); }
.btn-primary:hover { background: var(--color-gold-hover); color: var(--color-white); }
.btn-dark { display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-6); background: var(--color-navy); color: var(--color-white); font-family: var(--font-sans); font-size: var(--fs-md); font-weight: var(--fw-bold); border: 0; transition: background var(--ease); }
.btn-dark:hover { background: var(--color-gold); color: var(--color-white); }
.btn-outline { display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-6); background: transparent; color: var(--color-navy); border: var(--border-width) solid var(--color-navy); font-family: var(--font-sans); font-size: var(--fs-md); transition: all var(--ease); }
.btn-outline:hover { background: var(--color-navy); color: var(--color-white); }
.btn-outline-light { display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-6); background: transparent; color: var(--color-white); border: var(--border-width) solid var(--color-gold); font-family: var(--font-sans); font-size: var(--fs-md); transition: all var(--ease); }
.btn-outline-light:hover { background: var(--color-gold); color: var(--color-white); }
.link-arrow { display: inline-flex; gap: var(--space-2); align-items: center; font-size: var(--fs-md); color: var(--color-navy); border-bottom: var(--border-width) solid var(--color-gold); padding-bottom: var(--space-1); align-self: flex-start; }

/* ---------- Media ---------- */
.img-cover { width: 100%; height: 100%; object-fit: cover; }
.media-card { width: 100%; aspect-ratio: var(--ratio-card); background: var(--color-placeholder); overflow: hidden; }
.media-portrait { width: 100%; aspect-ratio: var(--ratio-portrait); background: var(--color-placeholder); overflow: hidden; }
.media-wide { width: 100%; aspect-ratio: var(--ratio-wide); background: var(--color-placeholder); overflow: hidden; }
.media-square { width: 100%; aspect-ratio: var(--ratio-square); background: var(--color-placeholder); overflow: hidden; }

/* ---------- Hero (split, no overlays) ---------- */
.hero-split { display: flex; flex-wrap: wrap; background: var(--color-navy); min-height: var(--hero-min); }
.hero-text { flex: 1 1 calc(45% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: var(--space-5); padding: var(--space-9) var(--space-8); }
.hero-media { flex: 1 1 55%; min-width: 0; min-height: var(--media-min); background: var(--color-placeholder); overflow: hidden; display: flex; }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); padding-top: var(--space-3); }

/* ---------- Booking bar (visual) ---------- */
.booking-bar { display: flex; flex-wrap: wrap; background: var(--color-white); box-shadow: var(--shadow-soft); }
.booking-field { flex: 1 1 calc(20% - var(--space-1)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-5); border-left: var(--border-width) solid var(--color-line); }
.booking-label { font-size: var(--fs-xs); font-weight: var(--fw-bold); color: var(--color-gold); margin: 0; }
.booking-value { font-size: var(--fs-md); color: var(--color-text); margin: 0; }
.booking-submit { flex: 1 1 calc(20% - var(--space-1)); display: flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: var(--space-5); background: var(--color-navy); color: var(--color-white); font-weight: var(--fw-bold); transition: background var(--ease); }
.booking-submit:hover { background: var(--color-gold); color: var(--color-white); }
.booking-note { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); font-size: var(--fs-sm); color: var(--color-muted); padding-top: var(--space-3); }

/* ---------- Room card ---------- */
.card-room { background: var(--color-white); border: var(--border-width) solid var(--color-line); display: flex; flex-direction: column; height: 100%; }
.card-room-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6); flex: 1; }
.spec-row { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--fs-sm); color: var(--color-muted); }
.spec-item { margin: 0; }
.price-block { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-2); padding-top: var(--space-4); border-top: var(--border-width) solid var(--color-line); margin-top: auto; }
.price-from { font-size: var(--fs-xs); color: var(--color-subtle); margin: 0; }
.price-value { font-family: var(--font-serif); font-size: var(--fs-3xl); line-height: var(--lh-tight); color: var(--color-text); margin: 0; }
.price-unit { font-size: var(--fs-sm); color: var(--color-subtle); margin: 0; }
.card-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.tag-soft { align-self: flex-start; font-size: var(--fs-xs); color: var(--color-navy); background: var(--color-champagne); border: var(--border-width) solid var(--color-champagne-line); padding: var(--space-1) var(--space-3); margin: 0; }

/* ---------- Lists ---------- */
.list-check { display: flex; flex-direction: column; gap: var(--space-2); margin: var(--space-0); padding: var(--space-0); list-style: none; }
.check-item { display: flex; gap: var(--space-3); font-size: var(--fs-sm); color: var(--color-muted); }
.check-mark { color: var(--color-gold); flex: none; }
.check-empty { color: var(--color-line); flex: none; }

/* ---------- Tabs / chips ---------- */
.tab-row { display: flex; gap: var(--space-6); border-bottom: var(--border-width) solid var(--color-line); overflow-x: auto; }
.tab { flex: none; padding-bottom: var(--space-3); font-size: var(--fs-md); color: var(--color-subtle); border-bottom: var(--border-width) solid transparent; white-space: nowrap; }
.tab-active { flex: none; padding-bottom: var(--space-3); font-size: var(--fs-md); color: var(--color-text); border-bottom: var(--border-width) solid var(--color-gold); white-space: nowrap; }

/* ---------- Price breakdown ---------- */
.breakdown { display: flex; flex-direction: column; gap: var(--space-2); background: var(--color-champagne); padding: var(--space-4) var(--space-5); font-size: var(--fs-sm); }
.breakdown-row { display: flex; justify-content: space-between; gap: var(--space-3); color: var(--color-muted); }
.breakdown-total { display: flex; justify-content: space-between; gap: var(--space-3); color: var(--color-text); font-weight: var(--fw-medium); padding-top: var(--space-2); border-top: var(--border-width) solid var(--color-line); }

/* ---------- Rate comparison ---------- */
.plan-card { background: var(--color-white); border: var(--border-width) solid var(--color-line); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); height: 100%; }
.plan-card-popular { background: var(--color-champagne); border: var(--border-width) solid var(--color-champagne-line); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); height: 100%; }
.plan-row { display: flex; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) 0; border-top: var(--border-width) solid var(--color-line); font-size: var(--fs-sm); color: var(--color-muted); }
.plan-value { color: var(--color-text); margin: 0; }

/* ---------- Trust / benefits ---------- */
.trust-item { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5) 0; border-top: var(--border-width) solid var(--color-gold); }
.benefit-num { font-family: var(--font-serif); font-size: var(--fs-4xl); line-height: var(--lh-tight); color: var(--color-gold); margin: 0; }
.feature-item { display: flex; align-items: center; gap: var(--space-3); font-size: var(--fs-md); color: var(--color-text); padding: var(--space-4) 0; border-bottom: var(--border-width) solid var(--color-line); }

/* ---------- Reviews ---------- */
.review-card { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-7) var(--space-6); border: var(--border-width) solid var(--color-navy-line); height: 100%; }
.review-stars { color: var(--color-gold-light); font-size: var(--fs-sm); margin: 0; }
.review-quote { font-family: var(--font-serif); font-size: var(--fs-xl); line-height: var(--lh-body); color: var(--color-on-dark); margin: 0; flex: 1; }
.review-name { font-size: var(--fs-sm); color: var(--color-on-dark-muted); margin: 0; }

/* ---------- Stat badge / signature ---------- */
.stat-badge { width: var(--badge-size); height: var(--badge-size); border-radius: var(--radius-round); background: var(--color-navy); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-1); flex: none; }
.stat-number { font-family: var(--font-serif); font-size: var(--fs-3xl); line-height: var(--lh-tight); color: var(--color-on-dark); margin: 0; }
.stat-label { font-size: var(--fs-xs); color: var(--color-gold-light); margin: 0; }
.signature-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); padding-top: var(--space-5); border-top: var(--border-width) solid var(--color-line); }
.avatar { width: var(--space-8); height: var(--space-8); border-radius: var(--radius-round); overflow: hidden; flex: none; background: var(--color-placeholder); }
.signature-script { font-family: var(--font-serif); font-style: italic; font-size: var(--fs-2xl); color: var(--color-navy); margin: 0; }

/* ---------- FAQ ---------- */
.faq-list { max-width: var(--container-narrow); width: 100%; margin: 0 auto; padding: 0 var(--space-6); display: flex; flex-direction: column; box-sizing: border-box; }
.faq-item { border-top: var(--border-width) solid var(--color-line); padding: var(--space-5) 0; }
.faq-q { font-size: var(--fs-lg); color: var(--color-text); cursor: pointer; list-style: none; }
.faq-a { font-size: var(--fs-md); font-weight: var(--fw-light); line-height: var(--lh-body); color: var(--color-muted); margin: var(--space-3) 0 0; }

/* ---------- Contact ---------- */
.form-mockup { display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-6); border: var(--border-width) dashed var(--color-champagne-line); background: var(--color-white); }
.form-note { font-size: var(--fs-xs); color: var(--color-gold); background: var(--color-champagne); padding: var(--space-2) var(--space-3); margin: 0; align-self: flex-start; }
.form-field { display: flex; flex-direction: column; gap: var(--space-2); }
.form-label { font-size: var(--fs-xs); color: var(--color-subtle); margin: 0; }
.form-input { min-height: var(--input-height); border: 0; border-bottom: var(--border-width) solid var(--color-line); background: transparent; font-family: var(--font-sans); font-size: var(--fs-md); color: var(--color-text); padding: 0; }
.form-textarea { min-height: calc(var(--input-height) * 2); border: 0; border-bottom: var(--border-width) solid var(--color-line); background: transparent; font-family: var(--font-sans); font-size: var(--fs-md); color: var(--color-text); padding: 0; resize: none; }
.info-grid { display: flex; flex-wrap: wrap; background: var(--color-white); border: var(--border-width) solid var(--color-line); }
.info-item { flex: 1 1 calc(50% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-5); border-bottom: var(--border-width) solid var(--color-line); }
.info-label { font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--color-gold); margin: 0; }
.info-value { font-size: var(--fs-md); color: var(--color-text); margin: 0; }
.map-embed { width: 100%; aspect-ratio: var(--ratio-card); border: 0; filter: grayscale(1); display: block; }
.phone-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); background: var(--color-navy); padding: var(--space-5) var(--space-6); color: var(--color-on-dark); }
.phone-number { font-family: var(--font-serif); font-size: var(--fs-3xl); line-height: var(--lh-tight); color: var(--color-on-dark); margin: 0; direction: ltr; }

/* ---------- Header ---------- */
.topbar { background: var(--color-white); border-bottom: var(--border-width) solid var(--color-line); }
.topbar-inner { max-width: var(--container); margin: 0 auto; padding: 0 var(--space-6); min-height: var(--topbar-height); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-5); }
.topbar-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); font-size: var(--fs-xs); }
.topbar-link { color: var(--color-muted); }
.site-header { position: sticky; top: 0; z-index: 50; background: var(--color-navy); }
.header-inner { max-width: var(--container); margin: 0 auto; padding: 0 var(--space-6); min-height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); }
.logo { display: flex; flex-direction: column; color: var(--color-on-dark); line-height: var(--lh-tight); }
.logo-mark { font-family: var(--font-serif); font-size: var(--fs-2xl); color: var(--color-on-dark); direction: ltr; }
.logo-sub { font-size: var(--fs-xs); color: var(--color-gold-light); }
.nav-main { display: flex; align-items: center; gap: var(--space-5); }
.nav-link { font-size: var(--fs-sm); color: var(--color-on-dark-muted); white-space: nowrap; }
.nav-link:hover { color: var(--color-on-dark); }
.nav-link-active { font-size: var(--fs-sm); color: var(--color-on-dark); white-space: nowrap; border-bottom: var(--border-width) solid var(--color-gold); padding-bottom: var(--space-1); }
.header-actions { display: flex; align-items: center; gap: var(--space-3); }
.nav-toggle { display: none; position: relative; }
.nav-toggle-button { display: flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-4); border: var(--border-width) solid var(--color-navy-line); color: var(--color-on-dark); font-size: var(--fs-sm); cursor: pointer; list-style: none; }
.nav-mobile-panel { display: flex; flex-direction: column; background: var(--color-navy); padding: var(--space-4) var(--space-6) var(--space-6); border-top: var(--border-width) solid var(--color-navy-line); }
.nav-mobile-panel[hidden] { display: none; }
.nav-mobile-link { font-family: var(--font-serif); font-size: var(--fs-xl); color: var(--color-on-dark); padding: var(--space-3) 0; border-bottom: var(--border-width) solid var(--color-navy-line); }

/* ---------- Footer ---------- */
.site-footer { background: var(--color-navy-deep); color: var(--color-on-dark); }
.footer-inner { max-width: var(--container); margin: 0 auto; padding: var(--space-9) var(--space-6) var(--space-7); display: flex; flex-wrap: wrap; gap: var(--space-7); }
.footer-col { flex: 1 1 calc(33.333% - var(--space-7)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.footer-title { font-family: var(--font-serif); font-weight: var(--fw-regular); font-size: var(--fs-xl); color: var(--color-on-dark); margin: 0; }
.footer-text { font-size: var(--fs-xs); color: var(--color-on-dark-muted); margin: 0; }
.footer-phone { font-size: var(--fs-xl); font-weight: var(--fw-light); color: var(--color-on-dark); direction: ltr; align-self: flex-start; }
.social-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.social-link { display: flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: 0 var(--space-4); border: var(--border-width) solid var(--color-navy-line); font-size: var(--fs-xs); color: var(--color-on-dark-soft); transition: all var(--ease); }
.social-link:hover { background: var(--color-gold); border-color: var(--color-gold); color: var(--color-white); }
.newsletter { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.newsletter-input { flex: 1 1 auto; min-width: 0; min-height: var(--btn-height); border: 0; background: var(--color-navy); color: var(--color-on-dark); font-family: var(--font-sans); font-size: var(--fs-sm); padding: 0 var(--space-4); }
.newsletter-button { min-height: var(--btn-height); padding: 0 var(--space-5); border: 0; background: var(--color-gold); color: var(--color-white); font-family: var(--font-sans); font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.footer-bottom { border-top: var(--border-width) solid var(--color-navy-line); }
.footer-bottom-inner { max-width: var(--container); margin: 0 auto; padding: var(--space-5) var(--space-6); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.footer-link { font-size: var(--fs-xs); color: var(--color-on-dark-muted); }
.partner-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.partner-badge { font-size: var(--fs-xs); color: var(--color-on-dark-muted); border: var(--border-width) solid var(--color-navy-line); padding: var(--space-1) var(--space-3); margin: 0; }
.copyright { font-size: var(--fs-xs); color: var(--color-on-dark-muted); margin: 0; }

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
  .nav-main { display: none; }
  .nav-toggle { display: block; }
  .col-3 { flex-basis: calc(50% - var(--space-6)); }
  .col-4 { flex-basis: calc(50% - var(--space-6)); }
  .hero-text { flex-basis: 100%; padding: var(--space-8) var(--space-6); }
  .hero-media { flex-basis: 100%; }
  .booking-field { flex-basis: calc(50% - var(--space-1)); }
  .booking-submit { flex-basis: 100%; }
  .footer-col { flex-basis: calc(50% - var(--space-7)); }
}
/* ---------- Mobile ---------- */
@media (max-width: 640px) {
  .container, .container-narrow, .faq-list, .header-inner, .topbar-inner, .footer-inner, .footer-bottom-inner { padding-left: var(--space-5); padding-right: var(--space-5); }
  .topbar { display: none; }
  .col-2, .col-3, .col-4, .footer-col, .info-item { flex-basis: 100%; }
  .hero-text { padding: var(--space-7) var(--space-5); }
  .hero-actions .btn-primary, .hero-actions .btn-outline-light { flex: 1 1 100%; }
  .card-actions .btn-dark, .card-actions .btn-outline, .card-actions .btn-primary { flex: 1 1 100%; }
  .header-actions .btn-primary { padding: 0 var(--space-4); }
  .logo-sub { display: none; }
  .phone-cta .btn-outline-light { flex: 1 1 100%; }
}

/* ===== Elementor compatibility (keeps the design when pages are edited in Elementor) ===== */
:root { --widgets-spacing: 0px; --widgets-spacing-row: 0px; --widgets-spacing-column: 0px; --container-default-padding-top: 0px; --container-default-padding-right: 0px; --container-default-padding-bottom: 0px; --container-default-padding-left: 0px; }
.elementor .elementor-widget:not(:last-child) { margin-block-end: 0; margin-bottom: 0; }
.elementor .e-con { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px; }
.elementor .w-img, .elementor .w-img .elementor-widget-container, .elementor .w-img img { width: 100%; height: 100%; }
.elementor .w-img { flex: 1 1 auto; }
.elementor .w-img img { object-fit: cover; display: block; max-width: none; }
.elementor .w-text, .elementor .w-text .elementor-widget-container { color: inherit; font: inherit; }
.elementor .w-text p:last-child { margin-bottom: 0; }
.elementor .w-faq .elementor-accordion-item { border: 0; border-top: var(--border-width) solid var(--color-line); }
.elementor .w-faq .elementor-tab-title { font-family: var(--font-sans); font-size: var(--fs-lg); font-weight: var(--fw-regular); color: var(--color-text); padding: var(--space-5) 0; }
.elementor .w-faq .elementor-tab-title a, .elementor .w-faq .elementor-accordion-icon { color: var(--color-text); }
.elementor .w-faq .elementor-tab-title.elementor-active a, .elementor .w-faq .elementor-tab-title.elementor-active .elementor-accordion-icon { color: var(--color-gold); }
.elementor .w-faq .elementor-tab-content { border: 0; padding: 0 0 var(--space-5); }
.elementor .w-map iframe { filter: grayscale(1); }
.elementor .e-con.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--space-6); display: flex; flex-direction: column; gap: var(--space-7); }
.elementor .e-con.container-narrow { max-width: var(--container-narrow); margin: 0 auto; padding: 0 var(--space-6); display: flex; flex-direction: column; align-items: center; gap: var(--space-5); text-align: center; }
.elementor .e-con.section { padding: var(--space-10) 0; background: var(--color-ivory); }
.elementor .e-con.section-white { padding: var(--space-10) 0; background: var(--color-white); }
.elementor .e-con.section-cream { padding: var(--space-9) 0; background: var(--color-cream); }
.elementor .e-con.section-dark { padding: var(--space-10) 0; background: var(--color-navy); color: var(--color-on-dark); }
.elementor .e-con.row { display: flex; flex-wrap: wrap; gap: var(--space-6); }
.elementor .e-con.row-center { display: flex; flex-wrap: wrap; gap: var(--space-6); align-items: center; }
.elementor .e-con.col-2 { flex: 1 1 calc(50% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.elementor .e-con.col-3 { flex: 1 1 calc(33.333% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; }
.elementor .e-con.col-4 { flex: 1 1 calc(25% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.elementor .e-con.stack { display: flex; flex-direction: column; gap: var(--space-4); }
.elementor .e-con.section-head { display: flex; flex-direction: column; gap: var(--space-3); max-width: var(--container-narrow); }
.elementor .e-con.section-head-center { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); text-align: center; }
.elementor .e-con.button-row { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.elementor .e-con.media-card { width: 100%; aspect-ratio: var(--ratio-card); background: var(--color-placeholder); overflow: hidden; }
.elementor .e-con.media-portrait { width: 100%; aspect-ratio: var(--ratio-portrait); background: var(--color-placeholder); overflow: hidden; }
.elementor .e-con.media-wide { width: 100%; aspect-ratio: var(--ratio-wide); background: var(--color-placeholder); overflow: hidden; }
.elementor .e-con.media-square { width: 100%; aspect-ratio: var(--ratio-square); background: var(--color-placeholder); overflow: hidden; }
.elementor .e-con.hero-split { display: flex; flex-wrap: wrap; background: var(--color-navy); min-height: var(--hero-min); }
.elementor .e-con.hero-text { flex: 1 1 calc(45% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: var(--space-5); padding: var(--space-9) var(--space-8); }
.elementor .e-con.hero-media { flex: 1 1 55%; min-width: 0; min-height: var(--media-min); background: var(--color-placeholder); overflow: hidden; display: flex; }
.elementor .e-con.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); padding-top: var(--space-3); }
.elementor .e-con.booking-bar { display: flex; flex-wrap: wrap; background: var(--color-white); box-shadow: var(--shadow-soft); }
.elementor .e-con.booking-field { flex: 1 1 calc(20% - var(--space-1)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-5); border-left: var(--border-width) solid var(--color-line); }
.elementor .e-con.booking-submit { flex: 1 1 calc(20% - var(--space-1)); display: flex; align-items: center; justify-content: center; min-height: var(--btn-height); padding: var(--space-5); background: var(--color-navy); color: var(--color-white); font-weight: var(--fw-bold); transition: background var(--ease); }
.elementor .e-con.card-room { background: var(--color-white); border: var(--border-width) solid var(--color-line); display: flex; flex-direction: column; height: 100%; }
.elementor .e-con.card-room-body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-6); flex: 1; }
.elementor .e-con.card-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.elementor .e-con.plan-card { background: var(--color-white); border: var(--border-width) solid var(--color-line); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); height: 100%; }
.elementor .e-con.plan-card-popular { background: var(--color-champagne); border: var(--border-width) solid var(--color-champagne-line); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); height: 100%; }
.elementor .e-con.signature-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); padding-top: var(--space-5); border-top: var(--border-width) solid var(--color-line); }
.elementor .e-con.avatar { width: var(--space-8); height: var(--space-8); border-radius: var(--radius-round); overflow: hidden; flex: none; background: var(--color-placeholder); }
.elementor .e-con.info-grid { display: flex; flex-wrap: wrap; background: var(--color-white); border: var(--border-width) solid var(--color-line); }
.elementor .e-con.info-item { flex: 1 1 calc(50% - var(--space-6)); min-width: 0; display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-5); border-bottom: var(--border-width) solid var(--color-line); }
.elementor .e-con.phone-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); background: var(--color-navy); padding: var(--space-5) var(--space-6); color: var(--color-on-dark); }
@media (max-width: 1024px) {
.elementor .e-con.col-3 { flex-basis: calc(50% - var(--space-6)); }
.elementor .e-con.col-4 { flex-basis: calc(50% - var(--space-6)); }
.elementor .e-con.hero-text { flex-basis: 100%; padding: var(--space-8) var(--space-6); }
.elementor .e-con.hero-media { flex-basis: 100%; }
.elementor .e-con.booking-field { flex-basis: calc(50% - var(--space-1)); }
.elementor .e-con.booking-submit { flex-basis: 100%; }
}
@media (max-width: 640px) {
.elementor .e-con.container, .elementor .e-con.container-narrow { padding-left: var(--space-5); padding-right: var(--space-5); }
.elementor .e-con.col-2, .elementor .e-con.col-3, .elementor .e-con.col-4, .elementor .e-con.info-item { flex-basis: 100%; }
.elementor .e-con.hero-text { padding: var(--space-7) var(--space-5); }
}