@import url("https://fonts.googleapis.com/css2?family=Alexandria:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");
/* Sama Al-Fursan V32: Arabic typography + stable responsive grids and hero details. */
:root{--sans:'Alexandria','Noto Kufi Arabic',Tahoma,sans-serif}
html[lang="ar"] body,html[lang="ar"] button,html[lang="ar"] input,html[lang="ar"] textarea,html[lang="ar"] select{font-family:var(--sans)}
html[lang="ar"] .nav a,html[lang="ar"] .footer,html[lang="ar"] .sf-cms-card,html[lang="ar"] .image-overlay strong{font-family:var(--sans)!important}
html[lang="en"] body{font-family:'Plus Jakarta Sans',Arial,sans-serif}
/* Banner: location name -> tagline -> progress; separate from carousel arrows. */
.sf-hero .sf-bottom-info{position:absolute!important;z-index:8!important;bottom:clamp(103px,12.2vw,130px)!important;left:clamp(27px,6vw,110px)!important;right:clamp(27px,6vw,110px)!important;display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:flex-end!important;gap:24px!important;direction:rtl!important;pointer-events:none}
html[dir="ltr"] .sf-hero .sf-bottom-info{direction:ltr!important}
.sf-hero .sf-meta-stack{order:0;display:flex;flex-flow:column nowrap;align-items:flex-start;width:max-content;max-width:min(265px,50vw);gap:5px;pointer-events:none;color:#fff}
.sf-hero .sf-place-name{font:700 clamp(13px,1.2vw,17px)/1.6 var(--sans);color:#fff;letter-spacing:0;white-space:nowrap;text-shadow:0 2px 7px #0018}
.sf-hero .sf-bottom-note{display:block!important;margin:0!important;font:500 clamp(10px,1vw,13px)/1.65 var(--sans)!important;opacity:.95;white-space:nowrap;max-width:100%;color:#fff;letter-spacing:0!important;text-shadow:0 2px 7px #0018}
.sf-hero .sf-slide-progress{display:block!important;align-self:stretch;width:100%!important;height:3px!important;min-width:0!important;max-width:100%!important;flex:0 0 3px!important;margin:7px 0 0!important;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.35)}
.sf-hero .sf-slide-progress>i{height:100%;width:100%;display:block;will-change:transform}
.sf-hero .sf-count{order:1;direction:ltr!important;display:flex!important;align-items:baseline!important;justify-content:flex-end!important;flex-flow:row nowrap!important;gap:7px!important;flex:0 0 auto!important;width:auto!important;max-width:none!important;color:#fff;font:700 clamp(10px,.9vw,13px)/1.4 'Plus Jakarta Sans',Arial,sans-serif!important;letter-spacing:.1em!important}
html[dir=rtl] .sf-hero .sf-meta-stack{text-align:right;align-items:flex-end}
html[dir=ltr] .sf-hero .sf-meta-stack{text-align:left;align-items:flex-start}
html[lang=en] .sf-hero .sf-place-name,html[lang=en] .sf-hero .sf-bottom-note{font-family:'Plus Jakarta Sans',Arial,sans-serif!important}
.sf-hero .sf-controls{z-index:9!important}
/* Ensure cards in the LISTING pages behave like grid items, not like carousel cards. */
.inner-cards .image-grid,.image-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:stretch!important;gap:clamp(13px,1.8vw,22px)!important;overflow:visible!important;grid-auto-flow:row!important;min-width:0!important}
.image-grid > .image-card,.inner-cards .image-grid > .image-card{position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:3/4!important;display:block!important;flex:none!important;transform:none!important;opacity:1!important;visibility:visible!important;overflow:hidden!important;box-sizing:border-box!important;margin:0!important;padding:0!important;isolation:isolate;z-index:auto!important;border-radius:20px!important}
.image-grid > .image-card img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;transform:none!important;display:block!important}
.image-grid > .image-card .image-overlay{box-sizing:border-box!important;min-height:0!important;padding:clamp(13px,2vw,22px)!important;max-width:100%!important;inset:auto 0 0!important;overflow:hidden!important}
.image-grid > .image-card .image-overlay strong{font-size:clamp(17px,2.1vw,27px)!important;line-height:1.55!important;max-width:100%!important;overflow-wrap:anywhere}
/* Keep offer-card grids consistent with the destinations listing. */
.sf-offers-grid,.sf-cms-grid{min-width:0!important;grid-auto-flow:row!important;gap:clamp(13px,2vw,20px)!important}
.sf-offers-grid > .sf-cms-card,.sf-cms-grid > .sf-cms-card{position:relative!important;inset:auto!important;width:100%!important;max-width:100%!important;min-width:0!important;aspect-ratio:3/4!important;height:auto!important;min-height:0!important;margin:0!important;transform:none!important;flex:none!important;overflow:hidden!important}
@media(max-width:950px){.image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){
 .sf-hero{min-height:710px!important}
 .sf-hero .sf-bottom-info{bottom:145px!important;left:25px!important;right:25px!important;gap:9px!important;align-items:flex-end!important}
 .sf-hero .sf-meta-stack{max-width:min(215px,62vw)!important;gap:3px!important}
 .sf-hero .sf-place-name{font-size:clamp(12px,3.25vw,15px)!important;line-height:1.5!important}
 .sf-hero .sf-bottom-note{font-size:clamp(9px,2.65vw,12px)!important;line-height:1.6!important;letter-spacing:0!important}
 .sf-hero .sf-count{font-size:10px!important;padding-bottom:4px!important;gap:5px!important}
 .sf-hero .sf-slide-progress{margin-top:7px!important;height:3px!important;flex-basis:3px!important}
 .sf-hero .sf-controls{bottom:66px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;gap:12px!important}
 .sf-hero .sf-controls button{width:45px!important;height:45px!important}
 .inner-cards .image-grid,.image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;padding:0!important}
 .inner-cards .image-grid > .image-card,.image-grid > .image-card{min-height:0!important;aspect-ratio:3/4.2!important;border-radius:18px!important}
 .image-grid > .image-card .image-overlay{padding:13px 11px!important}
 .image-grid > .image-card .image-overlay strong{font-size:clamp(15px,4.1vw,20px)!important;line-height:1.5!important}
 .image-grid > .image-card .image-overlay .eyebrow{font-size:9px!important;letter-spacing:0!important}
 .sf-offers-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
 .sf-offers-grid > .sf-cms-card{aspect-ratio:3/4.15!important}
 .sf-offers-grid .sf-card-caption{padding:36px 12px 12px!important}
 .sf-offers-grid .sf-card-caption strong{font-size:clamp(14px,3.9vw,19px)!important}
}
@media(max-width:350px){.inner-cards .image-grid,.image-grid,.sf-offers-grid{grid-template-columns:1fr!important;justify-items:center!important}.image-grid > .image-card,.sf-offers-grid > .sf-cms-card{width:min(100%,290px)!important}}
@media(prefers-reduced-motion:reduce){.sf-hero .sf-slide-progress>i{transition:none!important}}

/* Exact Arabic headings/labels inherit the new display family rather than the Latin heading token. */
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] h4,html[lang=ar] [data-ar]{font-family:var(--sans)!important}
html[lang=ar] .sf-eyebrow,html[lang=ar] .overline:not([data-ar]){font-family:'Plus Jakarta Sans',Arial,sans-serif!important}

/* V34 final cascade correction: desktop hero metadata below the image counter. */
@media(min-width:781px){
 .sf-hero .sf-bottom-info{position:absolute!important;bottom:87px!important;left:clamp(38px,6vw,110px)!important;right:auto!important;width:min(250px,24vw)!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:8px!important;direction:rtl!important;pointer-events:none!important}
 .sf-hero .sf-bottom-info .sf-count{order:0!important;max-width:100%!important;width:100%!important;justify-content:flex-start!important;text-align:start!important}
 .sf-hero .sf-bottom-info .sf-meta-stack{order:1!important;width:100%!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;text-align:start!important}
 .sf-hero .sf-bottom-info .sf-slide-progress{width:100%!important;max-width:100%!important}
 html[dir=ltr] .sf-hero .sf-bottom-info{left:auto!important;right:clamp(38px,6vw,110px)!important;direction:ltr!important;align-items:flex-end!important}
 html[dir=ltr] .sf-hero .sf-bottom-info .sf-count{justify-content:flex-end!important;text-align:end!important}
 html[dir=ltr] .sf-hero .sf-bottom-info .sf-meta-stack{align-items:flex-end!important;text-align:end!important}
}
