/* =========================================================
   THE HOTELS WE LOST — MOBILE ENGINE RESET v1.2.0
   Purpose-built mobile layout. Desktop remains untouched.
========================================================= */
@media (max-width: 900px){
  html,body{max-width:100%;overflow-x:hidden!important}
  body.hwl-standalone{background:#07101f;color:#fff4da}
  .hwl-story{width:100%;max-width:100%;overflow:hidden!important}
  .hwl-story img,.hwl-story video{max-width:100%;height:auto}

  /* Header: compact publisher bar, never steals the story canvas. */
  .vtm-header{
    position:relative!important;height:68px!important;padding:0 18px!important;
    grid-template-columns:1fr auto!important;background:#080d16!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important
  }
  .vtm-header-center{display:none!important}
  .vtm-brand{font-size:12px!important;line-height:.78!important}
  .vtm-jump{font-size:8px!important;white-space:nowrap!important}

  /* Cover stays designed, but its collage is bounded to the phone canvas. */
  #hotels-we-lost-cover.hwl54-hero{min-height:calc(100svh - 68px)!important;height:auto!important;overflow:hidden!important}
  #hotels-we-lost-cover .hwl54-shell{min-height:calc(100svh - 68px)!important;padding:70px 20px 92px!important;overflow:hidden!important}
  #hotels-we-lost-cover .hwl54-copy{position:relative!important;z-index:20!important;width:100%!important;max-width:100%!important}
  #hotels-we-lost-cover .hwl54-title{font-size:clamp(4.4rem,22vw,7.2rem)!important;line-height:.72!important;letter-spacing:-.065em!important}
  #hotels-we-lost-cover .hwl54-deck{max-width:88%!important;font-size:14px!important;line-height:1.45!important}
  #hotels-we-lost-cover .hwl54-collage{inset:auto 0 62px auto!important;width:58vw!important;height:40vh!important;max-height:350px!important;z-index:8!important;pointer-events:none!important}
  #hotels-we-lost-cover .hwl54-postcard{width:48vw!important;right:-8vw!important;top:3vh!important}
  #hotels-we-lost-cover .hwl54-ad{width:42vw!important;right:13vw!important;top:17vh!important}
  #hotels-we-lost-cover .hwl54-key{width:24vw!important;right:2vw!important;top:27vh!important}

  /* Intro: readable editorial stack. */
  #hwl-story-intro{min-height:auto!important;padding:88px 20px 90px!important;overflow:hidden!important}
  #hwl-story-intro .hwl56-intro-inner{width:100%!important;max-width:100%!important;display:block!important}
  #hwl-story-intro .hwl56-motion-copy span{font-size:clamp(4rem,18vw,6.5rem)!important;line-height:.78!important}
  #hwl-story-intro .hwl56-beatline{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:28px!important}
  #hwl-story-intro .hwl56-title-lockup{margin-top:82px!important}
  #hwl-story-intro .hwl56-title-lockup h1{font-size:clamp(4rem,18vw,6.4rem)!important;line-height:.78!important}

  /* Every hotel becomes a self-contained mobile chapter. */
  .hwl-story .hwl-panel,.hwl-story .hwl-hotel,.hwl-story .hwl-interlude,.hwl-story .hwl-epilogue{
    min-height:auto!important;height:auto!important;overflow:hidden!important
  }
  .hwl-story .hwl-hotel{padding:92px 20px 110px!important}
  .hwl-story .hwl-inner{width:100%!important;max-width:100%!important;margin:0 auto!important;padding:0!important}
  .hwl-story .hwl-era{position:relative!important;z-index:30!important;margin:0 0 34px!important;font-size:10px!important;letter-spacing:.16em!important}
  .hwl-story .hwl-massive,.hwl-story .hwl-riviera-word,.hwl-story .hwl-neon-title,.hwl-story .hwl-elegant{
    position:relative!important;top:auto!important;left:auto!important;right:auto!important;z-index:26!important;
    max-width:100%!important;overflow:visible!important;will-change:transform,opacity!important
  }
  .hwl-story .hwl-massive,.hwl-story .hwl-riviera-word{font-size:clamp(4.5rem,22vw,7.8rem)!important;line-height:.72!important;letter-spacing:-.07em!important}
  .hwl-story .hwl-copy,.hwl-story .hwl-lead,.hwl-story .hwl-beats,.hwl-story .hwl-lightsout{position:relative!important;z-index:24!important}
  .hwl-story .hwl-lead{font-size:clamp(1.5rem,7vw,2.15rem)!important;line-height:1.04!important}
  .hwl-story .hwl-beats{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .hwl-story .hwl-beats b{font-size:10px!important}

  /* Real photography owns the width without overflowing. */
  .hwl-story .hwl-primary-photo,.hwl-story .hwl-wide-photo,.hwl-story .hwl-stardust-still,.hwl-story .hwl-riviera-stage img{
    display:block!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;
    width:100%!important;max-width:100%!important;height:auto!important;object-fit:cover!important;
    transform-origin:center!important;will-change:transform,opacity!important
  }

  /* SANDS */
  .hwl-sands .hwl-hotel-hero{position:relative!important;min-height:620px!important;margin:0 0 52px!important;overflow:visible!important}
  .hwl-sands .hwl-massive{margin:0 0 18px!important}
  .hwl-sands .hwl-primary-photo{width:94%!important;margin:0 0 0 auto!important;aspect-ratio:4/3!important}
  .hwl-sands .hwl-portal-sands{
    position:absolute!important;width:min(52vw,250px)!important;aspect-ratio:1!important;
    left:-3vw!important;top:39%!important;z-index:18!important;border-radius:50%!important;
    transform-origin:center!important;will-change:transform!important
  }
  .hwl-sands .hwl-ad{position:absolute!important;width:min(38vw,180px)!important;right:-2vw!important;bottom:0!important;z-index:20!important}

  /* DUNES */
  .hwl-dunes .hwl-key-stage{position:relative!important;min-height:600px!important;margin-bottom:50px!important}
  .hwl-dunes .hwl-key-stage .hwl-primary-photo{width:92%!important;margin-left:auto!important;aspect-ratio:4/3!important}
  .hwl-dunes .hwl-massive{margin-top:-22px!important;text-align:left!important}
  .hwl-dunes .hwl-key{position:absolute!important;width:min(42vw,200px)!important;left:-3vw!important;top:52%!important;z-index:21!important}

  /* DESERT INN */
  .hwl-desert .hwl-elegant{font-size:clamp(4.6rem,21vw,7rem)!important;line-height:.78!important;margin:6px 0 30px!important}
  .hwl-desert .hwl-wide-photo{aspect-ratio:4/3!important;margin:0 0 38px!important}
  .hwl-desert .hwl-quiet-words{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:36px 0!important}
  .hwl-desert .hwl-quiet-words span{position:relative!important;display:block!important;font-size:clamp(1.7rem,8vw,2.7rem)!important;will-change:transform,opacity!important}

  /* STARDUST */
  .hwl-stardust .hwl-stardust-stage{position:relative!important;min-height:590px!important;margin:0 0 50px!important;overflow:visible!important}
  .hwl-stardust .hwl-neon-title{display:flex!important;justify-content:flex-start!important;flex-wrap:nowrap!important;font-size:clamp(4rem,18vw,6.2rem)!important;line-height:.78!important;margin:0 0 18px!important}
  .hwl-stardust .hwl-stardust-still{width:92%!important;margin-left:auto!important;aspect-ratio:4/3!important}
  .hwl-stardust .hwl-portal-stardust{position:absolute!important;width:min(54vw,260px)!important;aspect-ratio:1!important;right:-2vw!important;top:43%!important;z-index:18!important}

  /* MEMORY INTERLUDE */
  .hwl-interlude{padding:100px 20px!important}
  .hwl-interlude h2{font-size:clamp(3.5rem,17vw,5.8rem)!important;line-height:.8!important}
  .hwl-memory-objects{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;margin:54px 0 38px!important;position:relative!important}
  .hwl-memory-objects img{position:relative!important;inset:auto!important;width:100%!important;height:190px!important;object-fit:cover!important;transform-origin:center!important;will-change:transform,opacity!important}
  .hwl-object-labels{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}

  /* RIVIERA */
  .hwl-riviera .hwl-riviera-stage{position:relative!important;min-height:auto!important;margin-bottom:40px!important;overflow:visible!important}
  .hwl-riviera .hwl-riviera-word{margin:0 0 18px!important;white-space:nowrap!important}
  .hwl-riviera .hwl-riviera-stage img{aspect-ratio:4/3!important}

  /* TROPICANA */
  .hwl-trop .hwl-massive{font-size:clamp(3.9rem,18vw,6.1rem)!important;white-space:nowrap!important}
  .hwl-trop .hwl-chapter-head{font-size:clamp(3.6rem,16vw,5.8rem)!important;line-height:.8!important}
  .hwl-trop .hwl-wide-photo{aspect-ratio:4/3!important;margin:34px 0!important}
  .hwl-trop .hwl-trop-implosion{position:relative!important;min-height:460px!important;padding:64px 0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:space-between!important;overflow:hidden!important}
  .hwl-trop .hwl-portal-trop{position:relative!important;top:auto!important;margin:30px auto!important;width:min(56vw,270px)!important;aspect-ratio:1!important;z-index:18!important}

  /* MIRAGE */
  .hwl-mirage .hwl-portal-mirage{position:relative!important;top:auto!important;margin:10px auto 26px!important;width:min(54vw,260px)!important;aspect-ratio:1!important;z-index:18!important}
  .hwl-mirage .hwl-mirage-title{margin:0!important;font-size:clamp(4.8rem,22vw,7rem)!important}
  .hwl-mirage .hwl-mega b{font-size:clamp(2rem,9vw,3.4rem)!important}

  /* House-art remains decorative, bounded and non-destructive. */
  .hwl-story .hwl-house-art{position:relative!important;inset:auto!important;width:100%!important;max-width:100%!important;min-height:330px!important;margin:54px 0!important;overflow:hidden!important}

  /* Lights-out becomes a clean ending card, not a viewport takeover. */
  .hwl-story .hwl-lightsout{position:relative!important;inset:auto!important;min-height:0!important;height:auto!important;margin:70px 0 0!important;padding:32px 0!important;transform:none;opacity:1}

  /* Epilogue */
  .hwl-epilogue{padding:100px 20px 120px!important}
  .hwl-epilogue .hwl-epilogue-words{display:block!important}
  .hwl-epilogue .hwl-epilogue-words h2,.hwl-epilogue .hwl-final h2{font-size:clamp(3.7rem,17vw,6rem)!important;line-height:.8!important}
  .hwl-survivors{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;margin:48px 0!important}
  .hwl-survivors img{position:relative!important;inset:auto!important;width:100%!important;height:190px!important;object-fit:cover!important}
  .hwl-modern-stage{position:relative!important;min-height:auto!important;overflow:hidden!important}
  .hwl-modern-stage>img{display:block!important;width:100%!important;height:auto!important}
  .hwl-ghosts{position:absolute!important;inset:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important;padding:22px!important;background:rgba(2,8,16,.48)!important}
  .hwl-actions{display:flex!important;flex-direction:column!important;gap:12px!important}

  /* Give the new mobile engine the final word over legacy inline transforms. */
  .hwl-story.mobile-v12 .hwl-massive,
  .hwl-story.mobile-v12 .hwl-riviera-word,
  .hwl-story.mobile-v12 .hwl-neon-title,
  .hwl-story.mobile-v12 .hwl-primary-photo,
  .hwl-story.mobile-v12 .hwl-wide-photo,
  .hwl-story.mobile-v12 .hwl-stardust-still,
  .hwl-story.mobile-v12 .hwl-riviera-stage img,
  .hwl-story.mobile-v12 .hwl-portal,
  .hwl-story.mobile-v12 .hwl-key,
  .hwl-story.mobile-v12 .hwl-artifact,
  .hwl-story.mobile-v12 .hwl-quiet-words span,
  .hwl-story.mobile-v12 .hwl-memory-objects img,
  .hwl-story.mobile-v12 .hwl-survivors img{will-change:transform,opacity!important}
}

@media (max-width:520px){
  #hotels-we-lost-cover .hwl54-title{font-size:20vw!important}
  .hwl-sands .hwl-hotel-hero,.hwl-dunes .hwl-key-stage,.hwl-stardust .hwl-stardust-stage{min-height:540px!important}
  .hwl-memory-objects img,.hwl-survivors img{height:160px!important}
}

/* =========================================================
   v1.2.1 — DUNES MOBILE ONLY
   Readable title + keys fly in on scroll. Nothing else changed.
========================================================= */
@media (max-width:900px){
  .hwl-story .hwl-dunes .hwl-massive{
    color:#fff0cf!important;
    text-shadow:4px 4px 0 #db3f42,8px 8px 0 #083a54!important;
    z-index:28!important;
    margin:-10px 0 26px!important;
    font-size:clamp(4.35rem,21vw,7.2rem)!important;
    line-height:.76!important;
    letter-spacing:-.055em!important;
    overflow:visible!important;
  }
  .hwl-story .hwl-dunes .hwl-key-stage{
    min-height:620px!important;
    overflow:visible!important;
  }
  .hwl-story .hwl-dunes .hwl-key{
    width:min(44vw,210px)!important;
    left:-5vw!important;
    top:52%!important;
    z-index:31!important;
    transform-origin:50% 50%!important;
    will-change:transform,opacity!important;
  }
}

/* v1.2.2 — Dunes visible scroll pass */
@media (max-width:900px){
  .hwl-story .hwl-dunes .hwl-key-dunes{
    left:2vw!important;
    top:50%!important;
    width:min(43vw,205px)!important;
    will-change:transform,opacity!important;
  }
}
