
:root {
  --sand-50: #fbf8f2;
  --sand-100: #f4ede1;
  --sand-200: #e6d8c4;
  --ink: #17201d;
  --muted: #68716d;
  --forest: #173f35;
  --forest-2: #235748;
  --gold: #b99052;
  --gold-soft: #e7d3ad;
  --white: #ffffff;
  --line: rgba(23, 32, 29, 0.12);
  --shadow: 0 24px 70px rgba(23, 32, 29, 0.12);
  --shadow-soft: 0 12px 34px rgba(23, 32, 29, 0.08);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --container: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--ink);
  background: radial-gradient(circle at 10% 10%, rgba(185,144,82,.08), transparent 28rem), var(--sand-50);
  font-family: "Tajawal", "Segoe UI", Arial, sans-serif; line-height: 1.65;
  overflow-x: hidden;
}
html[lang="en"] body { font-family: "Inter", "Segoe UI", Arial, sans-serif; }
img { width: 100%; display: block; object-fit: cover; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
.container { width: min(calc(100% - 32px), var(--container)); margin-inline: auto; }
.topbar { padding: 10px 0; color: #f9f5ee; background: var(--forest); font-size: .9rem; }
.topbar__inner { display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.topbar__note { opacity: .86; }
.language-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; }
.site-header { position: sticky; top: 0; z-index: 30; background: rgba(251,248,242,.9); border-bottom: 1px solid rgba(23,32,29,.07); backdrop-filter: blur(18px); }
.nav { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 900; letter-spacing: -.02em; }
.brand__text { font-size: 1.32rem; line-height: 1.1; }
.brand__text small { display: block; color: var(--muted); font-weight: 600; font-size: .7rem; margin-top: 4px; letter-spacing: .02em; }
.nav__links { display: flex; align-items: center; gap: 25px; font-weight: 700; color: #39433f; }
.nav__links a:hover { color: var(--forest); }
.btn { min-height: 48px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: 999px; cursor: pointer; font-weight: 800; transition: .22s ease; }
.btn:hover { transform: translateY(-2px); }
.btn--primary { color: var(--white); background: var(--forest); box-shadow: 0 12px 26px rgba(23,63,53,.22); }
.btn--light { background: var(--white); border-color: var(--line); }
.btn--outline { color: var(--forest); border-color: rgba(23,63,53,.28); background: transparent; }
.hero { position: relative; overflow: hidden; padding: 44px 0 74px; }
.hero::before { content:""; position:absolute; inset-inline-end:-12%; top:-20%; width:560px; height:560px; border-radius:50%; background:rgba(185,144,82,.09); filter:blur(10px); }
.hero__grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; margin-bottom:18px; padding:8px 13px; border:1px solid rgba(185,144,82,.35); border-radius:999px; color:#745a32; background:rgba(255,255,255,.72); font-weight:800; font-size:.9rem; }
.eyebrow::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); }
.hero h1 { margin:0; max-width:720px; font-size:clamp(2.7rem,6vw,5.8rem); line-height:.98; letter-spacing:-.055em; }
.hero h1 span { display:block; color:var(--forest); }
.hero__lead { max-width:650px; margin:24px 0 28px; color:var(--muted); font-size:1.14rem; }
.hero__actions { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:30px; }
.trust-row { display:flex; flex-wrap:wrap; gap:18px; color:#46504c; font-weight:700; font-size:.92rem; }
.trust-row span::before { content:"✓"; margin-inline-end:7px; color:var(--forest); }
.hero-card { position:relative; min-height:590px; border-radius:38px; overflow:hidden; box-shadow:var(--shadow); isolation:isolate; background:var(--sand-200); }
.hero-card > img { position:absolute; inset:0; height:100%; }
.hero-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(10,22,18,.86),rgba(10,22,18,.03) 58%); z-index:1; }
.hero-card__badge { position:absolute; top:22px; inset-inline-start:22px; z-index:2; padding:10px 14px; border-radius:999px; color:var(--forest); background:rgba(255,255,255,.92); backdrop-filter:blur(10px); font-weight:900; }
.hero-card__content { position:absolute; inset-inline:26px; bottom:25px; z-index:2; color:var(--white); }
.hero-card__content h2 { margin:0 0 4px; font-size:1.65rem; }
.hero-card__content p { margin:0 0 15px; opacity:.82; }
.hero-card__meta { display:flex; gap:10px; flex-wrap:wrap; }
.hero-card__meta span { padding:7px 10px; border:1px solid rgba(255,255,255,.18); border-radius:999px; background:rgba(255,255,255,.12); backdrop-filter:blur(8px); font-size:.84rem; font-weight:700; }
section { padding: 88px 0; }
.category-section + .category-section { padding-top: 10px; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }
.section-head h2 { margin:0; font-size:clamp(2rem,4vw,3.3rem); line-height:1.1; letter-spacing:-.035em; }
.section-head p { max-width:610px; margin:10px 0 0; color:var(--muted); }
.section-head__side { color:var(--forest); font-weight:900; white-space:nowrap; }
.chalet-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.chalet-card { overflow:hidden; display:flex; flex-direction:column; background:var(--white); border:1px solid rgba(23,32,29,.08); border-radius:var(--radius-lg); box-shadow:0 10px 34px rgba(23,32,29,.05); transition:.25s ease; }
.chalet-card:hover { transform:translateY(-7px); box-shadow:0 22px 50px rgba(23,32,29,.12); }
.chalet-card__media { position:relative; height:245px; overflow:hidden; background:var(--sand-100); }
.chalet-card__media img { height:100%; transition:.5s ease; }
.chalet-card:hover img { transform:scale(1.035); }
.chalet-card__tag { position:absolute; top:14px; inset-inline-start:14px; padding:7px 11px; border-radius:999px; color:var(--forest); background:rgba(255,255,255,.93); font-weight:900; font-size:.8rem; }
.chalet-card__video { position:absolute; inset-inline-end:14px; bottom:14px; width:45px; height:45px; display:grid; place-items:center; border-radius:50%; color:var(--white); background:rgba(23,63,53,.88); border:1px solid rgba(255,255,255,.45); backdrop-filter:blur(7px); box-shadow:0 8px 20px rgba(0,0,0,.18); }
.chalet-card__video::before { content:""; margin-inline-start:2px; border-top:6px solid transparent; border-bottom:6px solid transparent; border-inline-start:9px solid currentColor; }
.chalet-card__body { padding:20px; display:flex; flex:1; flex-direction:column; }
.chalet-card__title { display:flex; justify-content:space-between; gap:12px; align-items:start; }
.chalet-card h3 { margin:0; font-size:1.25rem; }
.card-code { color:var(--gold); font-weight:900; font-size:.86rem; white-space:nowrap; }
.chalet-card__location { margin:4px 0 12px; color:var(--muted); font-size:.9rem; }
.chalet-card__desc { margin:0 0 15px; min-height:48px; color:#535e59; font-size:.93rem; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.features { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }
.features span { padding:6px 9px; border-radius:10px; color:#4c554f; background:var(--sand-50); border:1px solid rgba(23,32,29,.07); font-size:.78rem; font-weight:700; }
.chalet-card__foot { margin-top:auto; padding-top:16px; display:flex; justify-content:space-between; gap:15px; align-items:center; border-top:1px solid var(--line); }
.price strong { display:block; color:var(--forest); font-size:1.17rem; }
.price small { color:var(--muted); }
.text-link { color:var(--forest); font-weight:900; }
.experience { color:var(--white); background:var(--forest); }
.experience__grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:58px; align-items:center; }
.experience h2 { margin:0 0 18px; font-size:clamp(2.3rem,5vw,4.6rem); line-height:1; letter-spacing:-.05em; }
.experience p { color:rgba(255,255,255,.72); }
.experience__points { display:grid; gap:16px; margin-top:28px; }
.experience__point { display:grid; grid-template-columns:42px 1fr; gap:13px; align-items:start; }
.experience__point b { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; color:var(--forest); background:var(--gold-soft); }
.video-mock { position:relative; min-height:490px; overflow:hidden; border-radius:var(--radius-xl); background:#0f241e; box-shadow:0 24px 80px rgba(0,0,0,.24); }
.video-mock video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.video-mock__label { position:absolute; inset-inline:22px; bottom:20px; z-index:2; display:flex; justify-content:space-between; gap:20px; align-items:center; pointer-events:none; }
.video-mock__label strong { font-size:1.3rem; text-shadow:0 2px 12px rgba(0,0,0,.5); }
.video-mock__label span { padding:8px 11px; border-radius:999px; color:var(--forest); background:rgba(255,255,255,.9); font-size:.8rem; font-weight:900; }
.reasons-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.reason { padding:24px; background:var(--white); border:1px solid rgba(23,32,29,.08); border-radius:var(--radius-md); }
.reason__icon { width:47px; height:47px; display:grid; place-items:center; border-radius:15px; color:var(--forest); background:var(--gold-soft); font-size:1.2rem; font-weight:900; }
.reason h3 { margin:17px 0 7px; }
.reason p { margin:0; color:var(--muted); font-size:.92rem; }
.contact { background:linear-gradient(120deg,rgba(185,144,82,.14),transparent 55%),var(--sand-100); }
.contact__grid { display:grid; grid-template-columns:.86fr 1.14fr; gap:42px; align-items:stretch; }
.contact__info { padding:38px; color:var(--white); background:var(--forest); border-radius:var(--radius-xl); }
.contact__info h2 { margin:0; font-size:clamp(2rem,4vw,3.5rem); line-height:1.04; }
.contact__info p { color:rgba(255,255,255,.72); margin:18px 0 28px; }
.contact-list { display:grid; gap:14px; }
.contact-list a,.contact-list div { padding:14px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid rgba(255,255,255,.12); border-radius:15px; background:rgba(255,255,255,.06); }
.contact-list span,.phone { direction:ltr; unicode-bidi:isolate; }
.contact-form { padding:34px; background:var(--white); border:1px solid rgba(23,32,29,.08); border-radius:var(--radius-xl); box-shadow:var(--shadow-soft); }
.contact-form__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
.field label { display:block; margin:0 0 7px; color:var(--muted); font-size:.82rem; font-weight:800; }
.field input,.field select,.field textarea { width:100%; min-height:48px; padding:0 14px; color:var(--ink); background:var(--sand-50); border:1px solid var(--line); border-radius:14px; outline:none; }
.field textarea { min-height:120px; padding-top:12px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:rgba(23,63,53,.5); box-shadow:0 0 0 4px rgba(23,63,53,.08); }
.field--full { grid-column:1/-1; }
.site-footer { padding:38px 0; color:rgba(255,255,255,.72); background:#10251f; }
.footer__grid { display:flex; justify-content:space-between; gap:28px; align-items:center; }
.footer__links { display:flex; flex-wrap:wrap; gap:18px; }
.whatsapp-float { position:fixed; inset-inline-end:22px; bottom:22px; z-index:40; width:62px; height:62px; display:grid; place-items:center; border-radius:50%; color:var(--white); background:var(--gold-soft); box-shadow:0 18px 40px rgba(23,32,29,.18); font-weight:900; font-size:1.2rem; }
.whatsapp-float:hover { transform:translateY(-3px) scale(1.02); }
/* Detail pages */
.detail-hero { padding:52px 0 28px; }
.breadcrumb { display:flex; flex-wrap:wrap; gap:8px; align-items:center; color:var(--muted); font-size:.9rem; margin-bottom:22px; }
.detail-heading { display:flex; justify-content:space-between; gap:28px; align-items:end; }
.detail-heading h1 { margin:0; font-size:clamp(2.5rem,5vw,4.8rem); line-height:1; letter-spacing:-.045em; }
.detail-heading p { margin:12px 0 0; color:var(--muted); }
.detail-price { text-align:end; white-space:nowrap; }
.detail-price strong { display:block; color:var(--forest); font-size:1.75rem; }
.gallery { display:grid; grid-template-columns:1.45fr .75fr .75fr; grid-template-rows:250px 250px; gap:12px; }
.gallery a { display:block; overflow:hidden; border-radius:18px; background:var(--sand-100); }
.gallery a:first-child { grid-row:1/3; }
.gallery img { height:100%; transition:.35s ease; }
.gallery a:hover img { transform:scale(1.025); }
.gallery-more { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px; }
.gallery-more a { display:block; height:210px; overflow:hidden; border-radius:18px; background:var(--sand-100); }
.gallery-more img { height:100%; transition:.35s ease; }
.gallery-more a:hover img { transform:scale(1.025); }
.detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:38px; align-items:start; }
.detail-main { min-width:0; }
.detail-section { padding:34px 0; border-bottom:1px solid var(--line); }
.detail-section:first-child { padding-top:0; }
.detail-section h2 { margin:0 0 15px; font-size:1.75rem; }
.detail-section > p { margin:0; color:#4f5a55; font-size:1.04rem; }
.spec-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:22px; }
.spec { padding:18px; background:var(--white); border:1px solid var(--line); border-radius:17px; }
.spec strong { display:block; font-size:1.22rem; color:var(--forest); }
.spec span { color:var(--muted); font-size:.86rem; }
.amenities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.amenity { padding:13px 14px; border-radius:14px; background:var(--white); border:1px solid var(--line); font-weight:700; }
.amenity::before { content:"✓"; color:var(--forest); margin-inline-end:9px; }
.detail-video { width:100%; max-height:560px; border-radius:24px; background:#10251f; box-shadow:var(--shadow-soft); }
.booking-card { position:sticky; top:110px; padding:26px; background:var(--white); border:1px solid var(--line); border-radius:25px; box-shadow:var(--shadow-soft); }
.booking-card h2 { margin:0 0 4px; }
.booking-card > p { margin:0 0 20px; color:var(--muted); }
.price-row { display:flex; justify-content:space-between; gap:15px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); }
.price-row strong { color:var(--forest); font-size:1.15rem; }
.booking-note { margin:17px 0; padding:13px; border-radius:14px; background:var(--sand-50); color:var(--muted); font-size:.88rem; }
.booking-card .btn { width:100%; }
details.policy { background:var(--white); border:1px solid var(--line); border-radius:16px; margin-bottom:10px; }
details.policy summary { cursor:pointer; list-style:none; padding:16px 18px; font-weight:800; }
details.policy summary::-webkit-details-marker { display:none; }
details.policy summary::after { content:"+"; float:inline-end; color:var(--forest); font-size:1.25rem; }
details.policy[open] summary::after { content:"−"; }
details.policy p { margin:0; padding:0 18px 18px; color:var(--muted); }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.related-card { overflow:hidden; background:var(--white); border:1px solid var(--line); border-radius:18px; }
.related-card img { height:170px; }
.related-card div { padding:15px; }
.related-card h3 { margin:0 0 4px; }
.related-card p { margin:0; color:var(--muted); }
@media (max-width:1050px) {
  .nav__links { display:none; }
  .hero__grid,.experience__grid,.contact__grid,.detail-layout { grid-template-columns:1fr; }
  .hero-card { min-height:500px; }
  .chalet-grid { grid-template-columns:repeat(2,1fr); }
  .reasons-grid { grid-template-columns:repeat(2,1fr); }
  .booking-card { position:static; }
}
@media (max-width:760px) {
  .topbar__note { display:none; }
  .nav { min-height:70px; }
  .nav>.btn { padding-inline:15px; min-height:43px; }
  .brand__text small { display:none; }
  .hero { padding-top:28px; }
  .hero__grid { gap:28px; }
  .hero-card { min-height:420px; border-radius:28px; }
  .chalet-grid,.reasons-grid,.contact-form__grid,.amenities-grid,.related-grid { grid-template-columns:1fr; }
  .gallery-more { grid-template-columns:1fr; }
  .gallery-more a { height:230px; }
  .field--full { grid-column:auto; }
  section { padding:66px 0; }
  .section-head,.detail-heading { align-items:start; flex-direction:column; }
  .contact__info,.contact-form { padding:25px; border-radius:24px; }
  .video-mock { min-height:390px; }
  .footer__grid { align-items:start; flex-direction:column; }
  .gallery { grid-template-columns:1fr 1fr; grid-template-rows:280px 150px 150px; }
  .gallery a:first-child { grid-column:1/3; grid-row:auto; }
  .spec-grid { grid-template-columns:repeat(2,1fr); }
  .detail-price { text-align:start; }
}
@media (max-width:480px) {
  .chalet-card__media { height:225px; }
  .gallery { grid-template-rows:240px 125px 125px; }
  .detail-hero { padding-top:34px; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{transition:none!important} }

.phone-ltr, bdi[dir="ltr"] { direction:ltr; unicode-bidi:isolate; }
.whatsapp-float { width:58px; height:58px; display:grid; place-items:center; }
.whatsapp-float svg { width:28px; height:28px; }
.reason__icon--whatsapp svg, .contact-list__icon svg { width:24px; height:24px; }
.contact-list__icon { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; background:rgba(255,255,255,.09); }
.map-link-inline { color:inherit; text-decoration:none; }
.map-link-inline:hover { text-decoration:underline; }
.video-preview { position:relative; width:100%; border:0; padding:0; background:#10251f; border-radius:24px; overflow:hidden; box-shadow:var(--shadow-soft); cursor:pointer; display:block; text-align:inherit; }
.video-preview img { width:100%; height:100%; display:block; object-fit:cover; }
.video-preview::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,18,15,.72), rgba(6,18,15,.12) 52%, rgba(6,18,15,.08)); }
.video-preview__play { position:absolute; inset-inline-start:50%; top:50%; transform:translate(-50%, -50%); width:82px; height:82px; border-radius:999px; background:rgba(255,255,255,.95); color:var(--forest); display:grid; place-items:center; z-index:2; box-shadow:0 18px 44px rgba(0,0,0,.28); }
.video-preview__play::before { content:""; margin-inline-start:4px; border-top:11px solid transparent; border-bottom:11px solid transparent; border-inline-start:16px solid currentColor; }
.video-preview__label { position:absolute; inset-inline:18px; bottom:18px; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:16px; color:var(--white); }
.video-preview__label strong { font-size:clamp(1.05rem, 2.4vw, 1.9rem); text-shadow:0 2px 12px rgba(0,0,0,.45); }
.video-preview__label span { padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.92); color:var(--forest); font-weight:900; font-size:.88rem; }
.detail-video-preview { min-height:320px; }
.home-video-preview { min-height:490px; }
.media-modal { position:fixed; inset:0; z-index:100; background:rgba(7,14,12,.88); display:none; align-items:center; justify-content:center; padding:24px; }
.media-modal.is-open { display:flex; }
.media-modal__dialog { position:relative; width:min(1180px, calc(100vw - 32px)); max-height:calc(100vh - 48px); }
.media-modal__close { position:absolute; top:-14px; inset-inline-end:-4px; width:42px; height:42px; border-radius:50%; border:0; background:rgba(255,255,255,.98); color:var(--forest); font-size:1.8rem; line-height:1; cursor:pointer; z-index:2; box-shadow:0 10px 24px rgba(0,0,0,.2); }
.media-modal__content img, .media-modal__content video { width:100%; max-height:calc(100vh - 48px); object-fit:contain; border-radius:22px; background:#09120f; }
.media-modal__caption { margin-top:12px; color:#fff; font-weight:800; text-align:center; }
.gallery-empty { display:grid; place-items:center; min-height:240px; border-radius:18px; background:var(--sand-100); color:var(--muted); font-weight:700; }
.policy-list { margin:0; padding:0; list-style:none; display:grid; gap:16px; }
.policy-list li { padding:18px 20px; border:1px solid var(--line); border-radius:18px; background:var(--white); font-weight:700; color:var(--ink); }
.booking-actions { display:grid; gap:12px; margin-top:14px; }
.amenity { line-height:1.45; }
@media (max-width: 680px) {
  .home-video-preview { min-height:340px; }
  .detail-video-preview { min-height:240px; }
  .video-preview__play { width:70px; height:70px; }
  .video-preview__label { inset-inline:14px; bottom:14px; }
}

.whatsapp-float img { width:28px; height:28px; }
.reason__icon--whatsapp img { width:24px; height:24px; }


/* Final media, social and location polish */
.whatsapp-float {
  right: 22px !important;
  left: auto !important;
  inset-inline-start: auto !important;
  inset-inline-end: auto !important;
  bottom: 22px;
  background: var(--gold-soft);
  color: #ffffff;
}
.whatsapp-float img { filter: brightness(0) invert(1); }
.site-footer .footer__grid { padding-right: 82px; }
.reason__icon--whatsapp { background: var(--gold-soft); }
.reason__icon--whatsapp img { filter: brightness(0) invert(1); }

.video-preview__play {
  left: 50% !important;
  right: auto !important;
  inset-inline-start: auto !important;
  top: 50%;
  transform: translate(-50%, -50%);
}
.video-preview__play::before {
  margin-left: 5px;
  margin-inline-start: 0;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  border-left: 17px solid currentColor;
  border-right: 0;
  border-inline-start: 0;
}

.media-modal { backdrop-filter: blur(8px); }
.media-modal__dialog {
  width: min(1240px, calc(100vw - 28px));
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 56px;
  align-items: center;
  gap: 12px;
}
.media-modal__content { grid-column: 2; min-width: 0; }
.media-modal__caption { grid-column: 2; }
.media-modal__close {
  top: 4px;
  right: 4px;
  left: auto;
  inset-inline-end: auto;
}
.media-modal__nav {
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 50%;
  background: rgba(255,255,255,.94);
  color: var(--forest);
  display: grid;
  place-items: center;
  cursor: pointer;
  font-size: 1.8rem;
  font-weight: 900;
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
  transition: .2s ease;
}
.media-modal__nav:hover { transform: scale(1.05); }
.media-modal__prev { grid-column: 1; grid-row: 1; }
.media-modal__next { grid-column: 3; grid-row: 1; }
.media-modal__counter {
  position: absolute;
  left: 50%;
  bottom: -34px;
  transform: translateX(-50%);
  color: rgba(255,255,255,.8);
  font-weight: 800;
  direction: ltr;
}
.media-modal.is-video .media-modal__nav,
.media-modal.is-video .media-modal__counter { display: none; }

.location-section {
  padding-top: 18px;
  background: var(--sand-50);
}
.location-card {
  overflow: hidden;
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  min-height: 440px;
  background: var(--white);
  border: 1px solid rgba(23,32,29,.08);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-soft);
}
.location-card__content {
  padding: clamp(28px, 5vw, 54px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.location-card__content h2 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.3rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.location-card__content p { margin: 0 0 24px; color: var(--muted); }
.location-card__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.location-card__map { min-height: 440px; background: var(--sand-100); }
.location-card__map iframe { width: 100%; height: 100%; min-height: 440px; border: 0; display: block; }
.social-link { display: inline-flex; align-items: center; gap: 9px; font-weight: 800; }
.social-link svg { width: 20px; height: 20px; flex: 0 0 auto; }
.contact-list .social-link { width: 100%; }
.footer__social { display: inline-flex; align-items: center; gap: 7px; }
.footer__social svg { width: 18px; height: 18px; }

@media (max-width: 850px) {
  .location-card { grid-template-columns: 1fr; }
  .location-card__map, .location-card__map iframe { min-height: 360px; }
  .media-modal__dialog { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 6px; }
  .media-modal__nav { width: 42px; height: 42px; font-size: 1.45rem; }
}
@media (max-width: 680px) {
  .site-footer .footer__grid { padding-right: 0; padding-bottom: 72px; }
  .whatsapp-float { right: 16px !important; bottom: 16px; width: 56px; height: 56px; }
  .media-modal { padding: 10px; }
  .media-modal__dialog { width: 100%; grid-template-columns: 38px minmax(0,1fr) 38px; gap: 2px; }
  .media-modal__nav { width: 36px; height: 36px; font-size: 1.25rem; }
  .media-modal__close { width: 38px; height: 38px; top: 8px; right: 8px; }
  .location-card__content { padding: 26px; }
  .location-card__map, .location-card__map iframe { min-height: 310px; }
}


/* V5 — preserve the template palette and simplify social/media presentation */
.whatsapp-float {
  background: var(--gold-soft) !important;
  color: var(--forest) !important;
  box-shadow: 0 18px 40px rgba(23,32,29,.18) !important;
}
.whatsapp-float img { filter: none !important; }
.reason__icon--whatsapp {
  background: var(--gold-soft) !important;
}
.reason__icon--whatsapp img {
  filter: none !important;
}

/* Instagram belongs only in the contact list, as plain text. */
.contact-list a[href*="instagram.com"] {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.contact-list a[href*="instagram.com"] svg { display:none !important; }

/* Tone the embedded map to the warm neutral palette. Exact Google POI colors
   cannot be individually styled without a Maps API style configuration. */
.location-card__map {
  background: var(--sand-100);
}
.location-card__map iframe {
  filter: grayscale(.92) sepia(.12) saturate(.58) contrast(.93) brightness(1.04);
}

/* Keep each unit gallery to the original two-row composition. */
.gallery-more { display:none !important; }
.gallery a { position:relative; }
.gallery__more-tile::after {
  content:"";
  position:absolute;
  inset:0;
  background:rgba(12,24,20,.48);
  pointer-events:none;
}
.gallery__more-count {
  position:absolute;
  inset:0;
  z-index:2;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:clamp(2rem,5vw,4.4rem);
  font-weight:900;
  direction:ltr;
  text-shadow:0 4px 20px rgba(0,0,0,.35);
  pointer-events:none;
}

/* Gallery viewer: thumbnails on the left, large image on the right. */
.media-modal {
  background:rgba(15,19,17,.9);
  backdrop-filter:blur(10px);
}
.media-modal__dialog {
  width:min(1420px, calc(100vw - 32px));
  height:min(900px, calc(100vh - 32px));
  max-height:none;
  display:grid;
  grid-template-columns:128px minmax(0,1fr);
  grid-template-rows:minmax(0,1fr) auto;
  gap:14px;
  align-items:stretch;
}
.media-modal__thumbs {
  grid-column:1;
  grid-row:1;
  min-height:0;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:4px 4px 4px 0;
  scrollbar-width:thin;
}
.media-modal__thumb {
  flex:0 0 88px;
  width:100%;
  padding:0;
  border:2px solid transparent;
  border-radius:13px;
  overflow:hidden;
  background:#111;
  opacity:.62;
  cursor:pointer;
  transition:.18s ease;
}
.media-modal__thumb:hover { opacity:.88; }
.media-modal__thumb.is-active {
  opacity:1;
  border-color:var(--gold-soft);
  box-shadow:0 0 0 2px rgba(231,211,173,.18);
}
.media-modal__thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.media-modal__stage {
  grid-column:2;
  grid-row:1;
  position:relative;
  min-width:0;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:24px;
  background:#0b100e;
}
.media-modal__content {
  grid-column:auto;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  min-width:0;
  min-height:0;
}
.media-modal__content img,
.media-modal__content video {
  width:100%;
  height:100%;
  max-height:none;
  object-fit:contain;
  border-radius:0;
  background:#0b100e;
}
.media-modal__caption {
  grid-column:2;
  grid-row:2;
  margin:0;
  min-height:24px;
  color:rgba(255,255,255,.78);
  font-weight:700;
  text-align:center;
}
.media-modal__counter {
  position:absolute;
  top:18px;
  left:18px;
  bottom:auto;
  transform:none;
  z-index:4;
  padding:9px 14px;
  border-radius:999px;
  color:#fff;
  background:rgba(0,0,0,.62);
  border:1px solid rgba(255,255,255,.16);
  font-size:1rem;
  font-weight:900;
  direction:ltr;
  backdrop-filter:blur(7px);
}
.media-modal__nav {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:48px;
  height:48px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.9);
  color:var(--forest);
}
.media-modal__nav:hover { transform:translateY(-50%) scale(1.05); }
.media-modal__prev { left:16px; right:auto; grid-column:auto; grid-row:auto; }
.media-modal__next { right:16px; left:auto; grid-column:auto; grid-row:auto; }
.media-modal__close {
  top:10px;
  right:10px;
  left:auto;
  z-index:6;
}
.media-modal.is-video .media-modal__dialog {
  grid-template-columns:minmax(0,1fr);
}
.media-modal.is-video .media-modal__stage,
.media-modal.is-video .media-modal__caption {
  grid-column:1;
}
.media-modal.is-video .media-modal__thumbs,
.media-modal.is-video .media-modal__nav,
.media-modal.is-video .media-modal__counter {
  display:none !important;
}

@media (max-width:850px) {
  .media-modal__dialog {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) 92px auto;
    gap:10px;
  }
  .media-modal__stage { grid-column:1; grid-row:1; }
  .media-modal__thumbs {
    grid-column:1;
    grid-row:2;
    overflow-x:auto;
    overflow-y:hidden;
    flex-direction:row;
    padding:0 2px 4px;
  }
  .media-modal__thumb {
    flex:0 0 82px;
    height:82px;
  }
  .media-modal__caption { grid-column:1; grid-row:3; }
}

@media (max-width:680px) {
  .media-modal { padding:8px; }
  .media-modal__dialog {
    width:100%;
    height:calc(100vh - 16px);
  }
  .media-modal__nav { width:40px; height:40px; }
  .media-modal__prev { left:8px; }
  .media-modal__next { right:8px; }
  .media-modal__counter { top:10px; left:10px; padding:7px 11px; }
}

/* V6 — footer-safe WhatsApp, green map, complete media presentation */
.whatsapp-float {
  left: 22px !important;
  right: auto !important;
  inset-inline-start: auto !important;
  inset-inline-end: auto !important;
  bottom: 22px;
  background: var(--gold-soft) !important;
  color: var(--forest) !important;
  border: 1px solid rgba(23,63,53,.14);
  box-shadow: 0 16px 36px rgba(23,32,29,.18) !important;
  transition: bottom .18s ease, transform .2s ease;
}
.whatsapp-float img {
  width: 30px;
  height: 30px;
  filter: none !important;
}
.site-footer .footer__grid {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

/* A restrained green treatment matching the website forest color. */
.location-card__map {
  background: #e7eee9;
}
.location-card__map iframe {
  filter: grayscale(.56) sepia(.30) hue-rotate(82deg) saturate(.66) contrast(.94) brightness(1.02) !important;
}

/* The location remains one clean contact row; no nested card. */
.contact-list > div > a.map-link-inline {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: inline !important;
  width: auto !important;
}

/* Modal header keeps close/counter away from every image. */
.media-modal__dialog {
  direction: ltr;
  grid-template-columns: 128px minmax(0,1fr) !important;
  grid-template-rows: 48px minmax(0,1fr) auto !important;
  gap: 12px 14px !important;
}
.media-modal__header {
  grid-column: 1 / -1;
  grid-row: 1;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  direction: ltr;
}
.media-modal__thumbs {
  grid-column: 1 !important;
  grid-row: 2 !important;
}
.media-modal__stage {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-height: 0;
}
.media-modal__caption {
  grid-column: 2 !important;
  grid-row: 3 !important;
  direction: rtl;
  unicode-bidi: plaintext;
}
html[lang="en"] .media-modal__caption { direction: ltr; }
.media-modal__counter {
  position: static !important;
  transform: none !important;
  margin: 0 !important;
  flex: 0 0 auto;
}
.media-modal__close {
  position: static !important;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  box-shadow: none;
}
.media-modal__content {
  overflow: hidden;
}
.media-modal__content > img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  display: block;
}

/* Always-visible custom video controls plus native controls as fallback. */
.media-modal.is-video .media-modal__dialog {
  grid-template-columns: minmax(0,1fr) !important;
  grid-template-rows: 48px minmax(0,1fr) auto !important;
}
.media-modal.is-video .media-modal__header,
.media-modal.is-video .media-modal__stage,
.media-modal.is-video .media-modal__caption {
  grid-column: 1 !important;
}
.media-modal.is-video .media-modal__header { grid-row: 1 !important; }
.media-modal.is-video .media-modal__stage { grid-row: 2 !important; }
.media-modal.is-video .media-modal__caption { grid-row: 3 !important; }
.video-player {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0,1fr) auto;
  background: #080d0b;
}
.video-player video {
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  min-height: 0;
  object-fit: contain !important;
  border-radius: 0 !important;
  background: #080d0b;
}
.video-control-bar {
  min-height: 58px;
  display: grid;
  grid-template-columns: 44px auto minmax(100px,1fr) auto 44px 44px;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  color: #fff;
  background: rgba(10,20,16,.96);
  border-top: 1px solid rgba(255,255,255,.12);
  direction: ltr;
}
.video-control {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(255,255,255,.12);
  cursor: pointer;
  font: inherit;
}
.video-control:hover { background: rgba(255,255,255,.2); }
.video-control__progress {
  width: 100%;
  accent-color: var(--gold-soft);
  cursor: pointer;
}
.video-control__time {
  min-width: 42px;
  color: rgba(255,255,255,.82);
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 850px) {
  .media-modal__dialog {
    grid-template-columns: 92px minmax(0,1fr) !important;
  }
}
@media (max-width: 680px) {
  .whatsapp-float {
    left: 16px !important;
    right: auto !important;
    bottom: 16px;
  }
  .media-modal__dialog {
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-rows: 46px minmax(0,1fr) 84px auto !important;
    gap: 8px !important;
  }
  .media-modal__header { grid-column: 1 !important; grid-row: 1 !important; }
  .media-modal__stage { grid-column: 1 !important; grid-row: 2 !important; }
  .media-modal__thumbs {
    grid-column: 1 !important;
    grid-row: 3 !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  .media-modal__caption { grid-column: 1 !important; grid-row: 4 !important; }
  .media-modal__thumb { flex: 0 0 78px !important; height: 72px !important; }
  .video-control-bar {
    grid-template-columns: 38px minmax(80px,1fr) 38px 38px;
    gap: 6px;
    padding: 7px 8px;
  }
  .video-control__time { display: none; }
  .video-control { width: 36px; height: 36px; }
}


/* V7 — final placement, native video controls, and Tolip Garden local tone */
.whatsapp-float {
  position: fixed !important;
  inset: auto auto 24px 24px !important;
  left: 24px !important;
  right: auto !important;
  bottom: 24px;
  width: 64px;
  height: 64px;
  z-index: 999 !important;
  background: #25D366 !important;
  color: #ffffff !important;
  border: 1px solid rgba(0,0,0,.05) !important;
  box-shadow: 0 18px 42px rgba(20,120,64,.30) !important;
}
.whatsapp-float img {
  width: 32px !important;
  height: 32px !important;
  filter: brightness(0) invert(1) !important;
}
.whatsapp-float:hover {
  transform: translateY(-3px) scale(1.025);
  background: #20bd5a !important;
}
.reason__icon--whatsapp {
  background: #25D366 !important;
}
.reason__icon--whatsapp img {
  filter: brightness(0) invert(1) !important;
}
.video-player {
  display: block !important;
  width: 100%;
  height: 100%;
  background: #080d0b;
}
.video-player video {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  background: #080d0b;
  border-radius: 18px !important;
}
.video-control-bar { display: none !important; }

/* More confident local headline rhythm without changing the template system. */
.hero h1,
.experience h2,
.contact__info h2 {
  text-wrap: balance;
}
.hero__lead,
.experience p,
.contact__info p {
  text-wrap: pretty;
}

@media (max-width: 680px) {
  .whatsapp-float {
    inset: auto auto 16px 16px !important;
    left: 16px !important;
    right: auto !important;
    bottom: 16px;
    width: 58px;
    height: 58px;
  }
}


/* V8 — one green element only: the small floating WhatsApp button */
.reason__icon--whatsapp {
  background: var(--gold-soft) !important;
  color: var(--forest) !important;
  border: 0 !important;
  box-shadow: none !important;
}
.reason__icon--whatsapp img {
  width: 23px !important;
  height: 23px !important;
  filter: none !important;
  opacity: .9;
}

.whatsapp-float {
  position: fixed !important;
  top: auto !important;
  left: 18px !important;
  right: auto !important;
  bottom: 18px;
  inset: auto auto 18px 18px !important;
  inset-inline-start: auto !important;
  inset-inline-end: auto !important;
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #25D366 !important;
  border: 1px solid rgba(0,0,0,.06) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(24,135,73,.26) !important;
  z-index: 120 !important;
  transform: none;
  transition: bottom .18s ease, transform .18s ease, opacity .15s ease !important;
}
.whatsapp-float img {
  width: 27px !important;
  height: 27px !important;
  display: block;
  filter: brightness(0) invert(1) !important;
}
.whatsapp-float:hover {
  transform: translateY(-2px) !important;
  background: #20bd5a !important;
}

/* Never show the floating page action over an image or video viewer. */
body.media-viewer-open .whatsapp-float {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.media-modal {
  z-index: 5000 !important;
}

@media (max-width: 680px) {
  .whatsapp-float {
    left: 14px !important;
    right: auto !important;
    bottom: 14px;
    inset: auto auto 14px 14px !important;
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
  }
  .whatsapp-float img {
    width: 25px !important;
    height: 25px !important;
  }
}


/* V9 — language-aware floating WhatsApp placement */
html[lang="ar"] .whatsapp-float {
  left: 18px !important;
  right: auto !important;
  inset: auto auto 18px 18px !important;
}
html[lang="en"] .whatsapp-float {
  right: 18px !important;
  left: auto !important;
  inset: auto 18px 18px auto !important;
}
@media (max-width: 680px) {
  html[lang="ar"] .whatsapp-float {
    left: 14px !important;
    right: auto !important;
    inset: auto auto 14px 14px !important;
  }
  html[lang="en"] .whatsapp-float {
    right: 14px !important;
    left: auto !important;
    inset: auto 14px 14px auto !important;
  }
}


/* V10 — full media visibility and requested WhatsApp sides */
html[lang="ar"] .whatsapp-float {
  right: 18px !important;
  left: auto !important;
  inset: auto 18px 18px auto !important;
}
html[lang="en"] .whatsapp-float {
  left: 18px !important;
  right: auto !important;
  inset: auto auto 18px 18px !important;
}

/* The stage always fits the entire media without cropping. */
.media-modal__stage,
.media-modal__content,
.video-player {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.media-modal__content {
  width: 100% !important;
  height: 100% !important;
  padding: 10px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.media-modal__content > img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: scale-down !important;
  object-position: center center !important;
  flex: 0 1 auto !important;
}
.media-modal.is-video .media-modal__content {
  padding: 0 !important;
}
.media-modal.is-video .video-player {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #080d0b !important;
}
.media-modal.is-video .video-player video {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  aspect-ratio: auto !important;
  flex: 0 1 auto !important;
  border-radius: 0 !important;
}

@media (max-width: 680px) {
  html[lang="ar"] .whatsapp-float {
    right: 14px !important;
    left: auto !important;
    inset: auto 14px 14px auto !important;
  }
  html[lang="en"] .whatsapp-float {
    left: 14px !important;
    right: auto !important;
    inset: auto auto 14px 14px !important;
  }
  .media-modal__content { padding: 4px !important; }
}


/* V11 — final language sides: Arabic left, English right */
html[lang="ar"] .whatsapp-float {
  left: 18px !important;
  right: auto !important;
  inset: auto auto 18px 18px !important;
}
html[lang="en"] .whatsapp-float {
  right: 18px !important;
  left: auto !important;
  inset: auto 18px 18px auto !important;
}
@media (max-width: 680px) {
  html[lang="ar"] .whatsapp-float {
    left: 14px !important;
    right: auto !important;
    inset: auto auto 14px 14px !important;
  }
  html[lang="en"] .whatsapp-float {
    right: 14px !important;
    left: auto !important;
    inset: auto 14px 14px auto !important;
  }
}

/* V12 — prevent the floating action from covering the hero and harden the English experience layout. */
body.hero-in-view .whatsapp-float {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(10px) scale(.94) !important;
}

html[lang="en"] .experience {
  overflow: hidden;
}
html[lang="en"] .experience__grid {
  direction: ltr !important;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
  align-items: center !important;
  width: 100%;
}
html[lang="en"] .experience__grid > * {
  min-width: 0 !important;
  width: 100%;
  margin: 0;
  transform: none !important;
}
html[lang="en"] .experience__grid > div:first-child {
  padding-inline: 0 10px;
}
html[lang="en"] .experience h2 {
  width: 100%;
  max-width: 12ch;
  margin-inline: 0;
  font-size: clamp(2.35rem, 4.15vw, 4.35rem) !important;
  line-height: .98;
  overflow-wrap: normal;
  word-break: normal;
}
html[lang="en"] .experience p {
  max-width: 46rem;
}
html[lang="en"] .experience__point {
  min-width: 0;
}
html[lang="en"] .experience__point > div {
  min-width: 0;
}

@media (max-width: 1050px) {
  html[lang="en"] .experience__grid {
    grid-template-columns: 1fr !important;
  }
  html[lang="en"] .experience__grid > div:first-child {
    padding-inline: 0;
  }
  html[lang="en"] .experience h2 {
    max-width: 15ch;
  }
}


/* V12.1 — stronger hero WhatsApp hiding and safe English experience layout */
body.hero-in-view .whatsapp-float {
  display: none !important;
}
html[lang="en"] .experience,
html[lang="en"] .experience .container,
html[lang="en"] .experience__grid,
html[lang="en"] .experience__grid > * {
  max-width: 100%;
}
html[lang="en"] .experience .container {
  overflow: hidden;
}
html[lang="en"] .experience h2,
html[lang="en"] .experience p,
html[lang="en"] .experience strong {
  overflow-wrap: anywhere;
}
