/* ==== v1.6.6 MOBILE RED-TEAM / COLOR / LAYOUT CORRECTION ==== */
:root{
  --v166-ink:#153129;
  --v166-copy:#3e574c;
  --v166-teal:#2f7c72;
  --v166-teal-dark:#16483f;
  --v166-gold:#d8a94c;
  --v166-sun:#f5c96b;
  --v166-cream:#fffaf0;
  --v166-sand:#f5e6c8;
  --v166-mint:#e5f1e8;
  --v166-sky:#e6f3f6;
  --v166-rose:#f8e6df;
  --v166-line:rgba(31,79,63,.18);
  --v166-shadow:0 18px 46px rgba(53,74,59,.11);
}
html,body{background:#fbf6ec!important;color:var(--v166-ink)!important}
body{overflow-x:hidden}

/* Cleaner hierarchy and more breathing room */
.section{padding:54px 0!important}
.section>.container{padding:clamp(42px,5vw,76px)!important;border-radius:38px!important;box-shadow:var(--v166-shadow)!important}
.section-head{grid-template-columns:minmax(0,1.05fr) minmax(280px,.75fr)!important;gap:clamp(28px,5vw,72px)!important;align-items:start!important;margin-bottom:48px!important}
.section-head h2{font-size:clamp(38px,4.6vw,66px)!important;line-height:1.08!important;letter-spacing:-.035em!important;margin:8px 0 18px!important;max-width:15ch}
.section-head p{font-size:clamp(17px,1.25vw,20px)!important;line-height:1.85!important;color:var(--v166-copy)!important;max-width:50ch!important}
p{line-height:1.82}
h1,h2,h3{overflow-wrap:normal;word-break:normal}
.eyebrow{color:var(--v166-teal)!important}
html[lang="ar"] .eyebrow{color:var(--v166-teal)!important}
h1 em,html[lang="ar"] h1 em{color:var(--v166-gold)!important}
.dark-band h1 em,.dark-band h2 em,.dark-band h3 em{color:#f2c96f!important}

/* Cheerful light section palette */
.section.tone-ivory>.container{background:linear-gradient(145deg,#fffdf8,#fff8ea)!important}
.section.tone-sand>.container{background:linear-gradient(145deg,#fff4dc,#f3dfba)!important}
.section.tone-mint>.container{background:linear-gradient(145deg,#f4fbf6,#dfeee4)!important}
.section.tone-sun>.container{background:linear-gradient(145deg,#fff8df,#f7e5a8)!important}
.section.tone-sky>.container{background:linear-gradient(145deg,#f5fbfc,#dfeff2)!important}
.section.tone-rose>.container{background:linear-gradient(145deg,#fff8f3,#f5dfd5)!important}
.section:not(.dark-band) h1,.section:not(.dark-band) h2,.section:not(.dark-band) h3,
.section:not(.dark-band) strong{color:var(--v166-ink)!important}
.section:not(.dark-band) p,.section:not(.dark-band) small{color:var(--v166-copy)!important}

/* Selected dark areas only */
.dark-band>.container,.footer,.viewer-shell{background:#123129!important;color:#fff!important}
.dark-band h1,.dark-band h2,.dark-band h3,.dark-band strong,.footer h4,.viewer-shell h3{color:#fff!important}
.dark-band p,.dark-band small,.footer p,.viewer-shell p{color:#e1ebe5!important}
.dark-band .eyebrow,.footer .eyebrow{color:#f2cb78!important}

/* Homepage editorial cards are light, not near-black */
.section:not(.dark-band) .editorial-feature,
.section:not(.dark-band) .editorial-stack>a,
.section:not(.dark-band) .editorial-stack>div{
  background:linear-gradient(145deg,#fffdf8,#e9f3ec)!important;
  border:1px solid var(--v166-line)!important;
  color:var(--v166-ink)!important;
  box-shadow:0 18px 42px rgba(49,80,62,.10)!important
}
.section:not(.dark-band) .editorial-feature:before,
.section:not(.dark-band) .editorial-stack>a:before{background:linear-gradient(145deg,rgba(255,255,255,.35),rgba(236,246,239,.42))!important}
.section:not(.dark-band) .editorial-feature h3,
.section:not(.dark-band) .editorial-stack h3{color:var(--v166-ink)!important}
.section:not(.dark-band) .editorial-feature p,
.section:not(.dark-band) .editorial-stack p{color:var(--v166-copy)!important}

/* Keep light panels readable */
.partner-panel,.partner-stat,.inventory-shell,.inventory-canvas,.inventory-empty,.choice,.planner-result,
.card,.journey-copy,.journey-flow,.journey-step,.form-panel,.preview-card{
  color:var(--v166-ink)!important
}
.partner-panel p,.partner-stat small,.inventory-shell p,.inventory-empty p,.choice small,.planner-result p,
.card p,.journey-copy p,.journey-step small,.form-panel p,.preview-card p{color:var(--v166-copy)!important}
.card,.partner-stat,.planner-result,.choice{border-color:var(--v166-line)!important;box-shadow:0 12px 32px rgba(44,74,57,.08)!important}
.section-more,.text-link,.destination-more{color:#1f6f66!important}
.section-more{background:#fffef9!important;border-color:rgba(31,111,102,.28)!important}

/* Homepage hero: guaranteed photo fallback + no blank-white mobile gap */
.hero.inventory-hero.redteam-hero{background:#17382f!important}
.hero.inventory-hero.redteam-hero:after{
  background-image:
    url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/7e/Elephant_Rock_2020.jpg/1280px-Elephant_Rock_2020.jpg"),
    url("/media/generated/hero-saudi-resort-en.webp")!important;
  background-size:cover,cover!important;
  background-position:center 52%,center!important;
  filter:saturate(1.08) brightness(1.08) contrast(.97)!important
}
html[lang="ar"] .hero.inventory-hero.redteam-hero:after{
  background-image:
    url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/7e/Elephant_Rock_2020.jpg/1280px-Elephant_Rock_2020.jpg"),
    url("/media/generated/hero-saudi-resort-ar.webp")!important
}
.hero.inventory-hero.redteam-hero:before{
  background:linear-gradient(90deg,rgba(10,43,34,.64),rgba(10,43,34,.30) 46%,rgba(10,43,34,.05) 78%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(7,29,22,.35))!important
}
html[lang="ar"] .hero.inventory-hero.redteam-hero:before{
  background:linear-gradient(270deg,rgba(10,43,34,.64),rgba(10,43,34,.30) 46%,rgba(10,43,34,.05) 78%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(7,29,22,.35))!important
}
.hero-copy{background:rgba(18,49,41,.78)!important;color:#fff!important}
.hero-copy h1,.hero-copy h2,.hero-copy h3{color:#fff!important}
.hero-copy p,.hero-copy .lead{color:#f4faf6!important}
.hero-copy .eyebrow{color:#f3cf82!important}

/* Destination/hub heroes: real photo when reachable + local safe fallback, readable text card */
.daylight-hub-hero{background:#ead9b7!important;min-height:660px!important;align-items:end!important}
.daylight-hub-hero:before{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(13,45,36,.20))!important}
.daylight-hub-hero>.container{
  width:min(760px,calc(100% - 36px))!important;
  margin-inline-start:max(18px,calc((100vw - var(--max))/2 + 18px))!important;
  margin-inline-end:auto!important;
  margin-bottom:44px!important;
  padding:42px!important;
  border-radius:34px!important;
  background:rgba(255,250,240,.92)!important;
  border:1px solid rgba(255,255,255,.92)!important;
  box-shadow:0 22px 58px rgba(35,53,42,.17)!important;
  backdrop-filter:blur(10px)!important
}
.daylight-hub-hero h1,.daylight-hub-hero .lead,.daylight-hub-hero .eyebrow{color:var(--v166-ink)!important;text-shadow:none!important}
.daylight-hub-hero .lead{color:var(--v166-copy)!important}
.daylight-hub-hero .tourism-quicknav a{background:#fff!important;color:var(--v166-ink)!important;border-color:rgba(31,79,63,.16)!important}
.daylight-hub-hero .palette-strip{display:none!important}
.daylight-hub-hero.hub-photo-alula:after{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/7e/Elephant_Rock_2020.jpg/1280px-Elephant_Rock_2020.jpg"),url("/media/generated/hero-saudi-resort-en.webp")!important}
.daylight-hub-hero.hub-photo-madinah:after{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Masjid_An-Nabawi_in_Madinah.jpg/1280px-Masjid_An-Nabawi_in_Madinah.jpg"),url("/media/generated/destination-madinah.webp")!important}
.daylight-hub-hero.hub-photo-riyadh:after{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/75/Edge_of_the_World.jpg/1280px-Edge_of_the_World.jpg"),url("/media/generated/destination-riyadh.webp")!important}
.daylight-hub-hero.hub-photo-jeddah:after{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Jeddah_Corniche_Photo.jpg/1280px-Jeddah_Corniche_Photo.jpg"),url("/media/generated/destination-jeddah.webp")!important}
.daylight-hub-hero.hub-photo-aseer:after{background-image:url("https://upload.wikimedia.org/wikipedia/commons/a/aa/Abha,_Saudi_Arabia.jpg"),url("/media/generated/destination-aseer.webp")!important}

/* Real-place destination tiles: direct Wikimedia image with local fallback */
.destination-card.real-madinah{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Masjid_An-Nabawi_in_Madinah.jpg/1280px-Masjid_An-Nabawi_in_Madinah.jpg"),url("/media/generated/destination-madinah.webp")!important}
.destination-card.real-alula{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/7e/Elephant_Rock_2020.jpg/1280px-Elephant_Rock_2020.jpg"),url("/media/generated/hero-saudi-resort-en.webp")!important}
.destination-card.real-riyadh{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/7/75/Edge_of_the_World.jpg/1280px-Edge_of_the_World.jpg"),url("/media/generated/destination-riyadh.webp")!important}
.destination-card.real-jeddah{background-image:url("https://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Jeddah_Corniche_Photo.jpg/1280px-Jeddah_Corniche_Photo.jpg"),url("/media/generated/destination-jeddah.webp")!important}
.destination-card.real-aseer{background-image:url("https://upload.wikimedia.org/wikipedia/commons/a/aa/Abha,_Saudi_Arabia.jpg"),url("/media/generated/destination-aseer.webp")!important}

/* Image cards remain cheerful: gentler overlay, text gets dedicated lower contrast band */
.destination-card:after{background:linear-gradient(to top,rgba(8,31,24,.70) 0%,rgba(8,31,24,.34) 34%,rgba(8,31,24,.04) 66%,transparent 78%)!important}
.destination-card h3,.destination-card p,.destination-card .coordinates{color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.34)}
.destination-card .destination-more{color:#fff!important}

/* Static media card geometry: fix the severe mobile overlap shown in audit screenshots */
.media-card{display:block;isolation:isolate;background-color:#dfece5!important}
.media-card img,.media-card video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;z-index:0!important}
.media-card.real-madinah{background-image:url("/media/generated/destination-madinah.webp")!important;background-size:cover!important;background-position:center!important}
.media-card.real-alula{background-image:url("/media/generated/hero-saudi-resort-en.webp")!important;background-size:cover!important;background-position:center!important}
.media-card.real-riyadh{background-image:url("/media/generated/destination-riyadh.webp")!important;background-size:cover!important;background-position:center!important}
.media-card.real-jeddah{background-image:url("/media/generated/destination-jeddah.webp")!important;background-size:cover!important;background-position:center!important}
.media-card.real-aseer{background-image:url("/media/generated/destination-aseer.webp")!important;background-size:cover!important;background-position:center!important}
.media-overlay{z-index:2!important;background:linear-gradient(180deg,transparent 0%,rgba(8,31,24,.22) 34%,rgba(8,31,24,.86) 100%)!important}
.media-overlay strong,.media-overlay p,.media-overlay small{color:#fff!important}
.media-overlay p{margin:.45rem 0 0!important;line-height:1.55!important}
.media-overlay .btn{flex:0 0 auto!important;white-space:nowrap!important}

/* Immersive controls/caption separation */
.viewer-brand-stage{min-height:560px!important}
.viewer-brand-stage .scene-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;z-index:0!important}
.viewer-brand-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,23,17,.66),rgba(5,23,17,.05) 52%);z-index:1}
.immersive-capability{z-index:3!important}
.viewer-ui{z-index:4!important}
.immersive-capability span{background:rgba(15,48,39,.88)!important;color:#fff!important;border-color:rgba(255,255,255,.26)!important}
.viewer-ui .btn{background:#fff!important;color:var(--v166-teal-dark)!important;border-color:#fff!important}

/* Header proportions */
.site-header{background:rgba(255,253,247,.98)!important;box-shadow:0 1px 0 rgba(43,72,58,.08)!important}
.vista-brand-logo{object-fit:contain!important}
.lang-icon-switch{border-color:rgba(47,124,114,.22)!important}

/* Mobile corrections */
@media(max-width:720px){
  .container{width:calc(100% - 24px)!important}
  .nav{min-height:72px!important;gap:10px!important}
  .vista-brand-logo{height:46px!important;max-width:182px!important}
  .vista-brand-mark{height:42px!important;width:42px!important}
  .menu{margin-inline-start:auto!important}
  .section{padding:18px 0!important}
  .section>.container{padding:30px 20px!important;border-radius:26px!important}
  .section-head{display:block!important;margin-bottom:30px!important}
  .section-head h2{font-size:clamp(32px,8.8vw,40px)!important;line-height:1.12!important;max-width:none!important;margin:8px 0 16px!important}
  .section-head p,.lead{font-size:17px!important;line-height:1.78!important;max-width:none!important}
  .eyebrow{font-size:24px!important;line-height:1.2!important;margin-bottom:12px!important}
  html[lang="ar"] .eyebrow{font-size:23px!important;line-height:1.55!important}
  .section-more{margin-top:18px!important}

  /* Homepage: guaranteed image area but no empty 250px if remote fails */
  .hero.inventory-hero.redteam-hero{padding:0 0 18px!important;min-height:auto!important}
  .hero-stage{padding-top:210px!important;gap:14px!important}
  .hero-copy{margin-top:0!important;padding:24px 18px!important;border-radius:24px!important}
  .hero-copy h1{font-size:clamp(38px,10vw,48px)!important;line-height:1.08!important}
  .hero-copy .lead{font-size:17px!important;line-height:1.72!important}

  /* Hub hero: photo at top, readable card at bottom */
  .daylight-hub-hero{min-height:600px!important;display:flex!important;align-items:flex-end!important;padding:0 0 20px!important}
  .daylight-hub-hero>.container{
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    padding:28px 20px!important;
    border-radius:26px!important
  }
  .daylight-hub-hero h1{font-size:clamp(38px,10vw,50px)!important;line-height:1.06!important;margin:10px 0 18px!important}
  .daylight-hub-hero .lead{font-size:17px!important;line-height:1.72!important}
  .daylight-hub-hero .tourism-quicknav{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .daylight-hub-hero .tourism-quicknav a{padding:13px 9px!important;border-radius:16px!important;font-size:14px!important}

  /* Severe overlap fix for destinations page / any media wall */
  .media-wall{display:grid!important;grid-template-columns:1fr!important;grid-auto-rows:auto!important;gap:18px!important}
  .media-card,.media-card.wide,.media-card.tall{
    display:block!important;
    width:100%!important;
    min-height:500px!important;
    height:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    margin:0!important;
    border-radius:26px!important;
    overflow:hidden!important
  }
  .media-card img,.media-card video{position:absolute!important;inset:0!important}
  .media-overlay{
    position:absolute!important;
    left:0!important;right:0!important;bottom:0!important;top:auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    gap:14px!important;
    padding:26px 20px!important
  }
  .media-overlay strong{display:block!important;font-size:31px!important;line-height:1.06!important}
  .media-overlay p{font-size:16.5px!important;line-height:1.55!important}
  .media-overlay .btn{min-height:44px!important;padding:0 18px!important}

  /* No dark-on-dark title failures */
  .section:not(.dark-band) .editorial-feature,
  .section:not(.dark-band) .editorial-stack>a{padding:28px 20px!important;border-radius:24px!important}
  .section:not(.dark-band) .editorial-feature h3,
  .section:not(.dark-band) .editorial-stack h3{font-size:clamp(28px,7.6vw,36px)!important;line-height:1.15!important}
  .section:not(.dark-band) .editorial-feature p,
  .section:not(.dark-band) .editorial-stack p{font-size:16.8px!important;line-height:1.72!important}
  .card{padding:26px 20px!important}
  .card h3{font-size:clamp(26px,7.2vw,33px)!important;line-height:1.16!important}
  .card p{font-size:16.8px!important;line-height:1.72!important}

  .destination-card,.destination-card.wide,.destination-card.tall{min-height:480px!important;padding:24px 20px!important}
  .destination-card h3{font-size:clamp(32px,8.8vw,40px)!important}
  .destination-card p{font-size:16.5px!important;line-height:1.55!important}

  /* Immersive mobile: buttons become rows below image, never overlap caption */
  .viewer-shell{min-height:auto!important;padding-bottom:0!important}
  .viewer-brand-stage{min-height:430px!important}
  .immersive-capability{position:absolute!important;top:auto!important;bottom:16px!important;left:14px!important;right:14px!important;display:grid!important;grid-template-columns:1fr 1fr!important;margin:0!important;gap:8px!important}
  .immersive-capability span{font-size:12px!important;min-height:42px!important;padding:8px!important}
  .viewer-ui{position:static!important;display:block!important;margin:0!important;padding:14px!important;background:#123129!important}
  .viewer-ui .btn{width:100%!important}
}

