/*
  Just Xplored JUNE V11
  Page-level mobile UX pass only.
  Double guarded: max-width media query + body.jx-has-mobile-shell.
  Desktop remains untouched.
*/

@media (max-width:760px){
  body.jx-has-mobile-shell{
    scroll-padding-bottom:110px;
  }

  body.jx-has-mobile-shell main{
    overflow-x:hidden;
  }

  body.jx-has-mobile-shell .nav{
    background:rgba(5,7,11,.78)!important;
  }

  body.jx-has-mobile-shell .nav-inner{
    min-height:70px!important;
    padding:14px 18px!important;
  }

  body.jx-has-mobile-shell .brand-mark{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
  }

  body.jx-has-mobile-shell .brand span:not(.brand-mark){
    font-size:.78rem!important;
    letter-spacing:.14em!important;
    max-width:190px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  body.jx-has-mobile-shell .hero,
  body.jx-has-mobile-shell .watch-hero,
  body.jx-has-mobile-shell .tool-hero,
  body.jx-has-mobile-shell .arcade-hub,
  body.jx-has-mobile-shell .jx-trip-hero{
    min-height:auto!important;
    padding-top:104px!important;
    padding-bottom:42px!important;
  }

  body.jx-has-mobile-shell .hero::before,
  body.jx-has-mobile-shell .arcade-hub::before{
    transform:scale(1.02)!important;
  }

  body.jx-has-mobile-shell .hero-inner,
  body.jx-has-mobile-shell .watch-hero .wrap,
  body.jx-has-mobile-shell .tool-hero,
  body.jx-has-mobile-shell .arcade-hub .arcade-wrap,
  body.jx-has-mobile-shell .jx-hero-inner{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  body.jx-has-mobile-shell h1,
  body.jx-has-mobile-shell .hero h1,
  body.jx-has-mobile-shell .watch-hero h1,
  body.jx-has-mobile-shell .tool-hero h1,
  body.jx-has-mobile-shell .arcade-title,
  body.jx-has-mobile-shell .jx-trip-title{
    font-size:clamp(2.35rem,13vw,4.15rem)!important;
    line-height:.92!important;
    letter-spacing:-.07em!important;
    max-width:100%!important;
    text-wrap:balance!important;
  }

  body.jx-has-mobile-shell h2,
  body.jx-has-mobile-shell .section-title h2,
  body.jx-has-mobile-shell .section-title .title{
    font-size:clamp(1.8rem,8vw,2.8rem)!important;
    line-height:1.02!important;
    letter-spacing:-.055em!important;
  }

  body.jx-has-mobile-shell .lead,
  body.jx-has-mobile-shell .hero p,
  body.jx-has-mobile-shell .watch-hero p,
  body.jx-has-mobile-shell .tool-hero p,
  body.jx-has-mobile-shell .arcade-copy,
  body.jx-has-mobile-shell .jx-lead{
    font-size:1rem!important;
    line-height:1.55!important;
    max-width:36rem!important;
    margin-top:14px!important;
  }

  body.jx-has-mobile-shell .eyebrow,
  body.jx-has-mobile-shell .arcade-kicker,
  body.jx-has-mobile-shell .kicker,
  body.jx-has-mobile-shell .jx-eyebrow{
    font-size:.68rem!important;
    letter-spacing:.12em!important;
    margin-bottom:14px!important;
  }

  body.jx-has-mobile-shell section:not(.hero):not(.watch-hero):not(.tool-hero):not(.arcade-hub):not(.jx-trip-hero){
    padding-top:42px!important;
    padding-bottom:48px!important;
  }

  body.jx-has-mobile-shell .wrap{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  body.jx-has-mobile-shell .actions,
  body.jx-has-mobile-shell .jx-actions{
    gap:10px!important;
    margin-top:20px!important;
  }

  body.jx-has-mobile-shell .actions .btn,
  body.jx-has-mobile-shell .jx-actions .jx-btn{
    min-height:48px!important;
    justify-content:center!important;
    flex:1 1 160px!important;
    border-radius:18px!important;
  }

  body.jx-has-mobile-shell .grid.cols-2,
  body.jx-has-mobile-shell .grid.cols-3,
  body.jx-has-mobile-shell .video-grid,
  body.jx-has-mobile-shell .tools-card-grid,
  body.jx-has-mobile-shell .arcade-card-grid,
  body.jx-has-mobile-shell .jx-picks-grid,
  body.jx-has-mobile-shell .jx-video-links{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }

  body.jx-has-mobile-shell .card,
  body.jx-has-mobile-shell .video-card,
  body.jx-has-mobile-shell .series-card,
  body.jx-has-mobile-shell .place-card,
  body.jx-has-mobile-shell .tool-card-eq,
  body.jx-has-mobile-shell .game-card,
  body.jx-has-mobile-shell .watch-player-card,
  body.jx-has-mobile-shell .watch-tools,
  body.jx-has-mobile-shell .jx-planner-card,
  body.jx-has-mobile-shell .jx-result-card,
  body.jx-has-mobile-shell .jx-option,
  body.jx-has-mobile-shell .jx-pick-card{
    border-radius:23px!important;
    box-shadow:0 18px 54px rgba(0,0,0,.34)!important;
  }

  body.jx-has-mobile-shell .card.pad,
  body.jx-has-mobile-shell .video-body,
  body.jx-has-mobile-shell .game-info,
  body.jx-has-mobile-shell .place-card{
    padding:18px!important;
  }

  body.jx-has-mobile-shell .image-card{
    min-height:280px!important;
  }

  body.jx-has-mobile-shell .image-card .content{
    left:18px!important;
    right:18px!important;
    bottom:18px!important;
  }

  body.jx-has-mobile-shell .image-card h3,
  body.jx-has-mobile-shell .video-body h3,
  body.jx-has-mobile-shell .game-info h2,
  body.jx-has-mobile-shell .tool-card-eq h3{
    font-size:1.45rem!important;
    line-height:1.05!important;
  }

  body.jx-has-mobile-shell .card p,
  body.jx-has-mobile-shell .video-body p,
  body.jx-has-mobile-shell .game-info p,
  body.jx-has-mobile-shell .tool-card-eq p,
  body.jx-has-mobile-shell .place-card p{
    font-size:.95rem!important;
    line-height:1.5!important;
  }

  body.jx-has-mobile-shell .tag,
  body.jx-has-mobile-shell .status{
    font-size:.68rem!important;
    padding:6px 9px!important;
  }

  /* Watch page */
  body.jx-has-mobile-shell .watch-layout{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }

  body.jx-has-mobile-shell .watch-frame{
    border-radius:20px!important;
    overflow:hidden!important;
  }

  body.jx-has-mobile-shell .watch-info{
    padding:16px!important;
  }

  body.jx-has-mobile-shell .watch-info h2{
    font-size:1.55rem!important;
    line-height:1.05!important;
  }

  body.jx-has-mobile-shell .watch-search{
    min-height:48px!important;
    border-radius:16px!important;
    font-size:16px!important;
    padding:0 14px!important;
  }

  body.jx-has-mobile-shell .watch-filters{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    overflow-x:auto!important;
    padding:3px 2px 8px!important;
    scroll-snap-type:x proximity!important;
  }

  body.jx-has-mobile-shell .watch-chip{
    min-height:42px!important;
    flex:0 0 auto!important;
    border-radius:999px!important;
    scroll-snap-align:start!important;
    padding:0 14px!important;
  }

  body.jx-has-mobile-shell .watch-list{
    display:grid!important;
    gap:10px!important;
  }

  body.jx-has-mobile-shell .watch-item{
    min-height:78px!important;
    border-radius:18px!important;
    padding:10px!important;
    gap:10px!important;
  }

  body.jx-has-mobile-shell .watch-item-thumb{
    width:92px!important;
    min-width:92px!important;
    border-radius:13px!important;
  }

  body.jx-has-mobile-shell .watch-item h3{
    font-size:.94rem!important;
    line-height:1.18!important;
  }

  body.jx-has-mobile-shell .watch-item span{
    font-size:.66rem!important;
  }

  /* Arcade */
  body.jx-has-mobile-shell .arcade-card-grid{
    grid-template-columns:1fr!important;
  }

  body.jx-has-mobile-shell .game-card{
    padding:14px!important;
  }

  body.jx-has-mobile-shell .game-cabinet,
  body.jx-has-mobile-shell .machine-placeholder{
    height:260px!important;
    min-height:260px!important;
  }

  body.jx-has-mobile-shell .game-cabinet img{
    height:246px!important;
    max-height:246px!important;
  }

  body.jx-has-mobile-shell .arcade-button-row{
    justify-content:center!important;
    gap:18px!important;
  }

  body.jx-has-mobile-shell .arcade-launch{
    min-width:104px!important;
    min-height:104px!important;
  }

  body.jx-has-mobile-shell .arcade-button-disc{
    width:70px!important;
    height:70px!important;
  }

  /* Tools overview + app-like forms */
  body.jx-has-mobile-shell .tools-card-grid{
    display:grid!important;
  }

  body.jx-has-mobile-shell input,
  body.jx-has-mobile-shell select,
  body.jx-has-mobile-shell textarea{
    font-size:16px!important;
    min-height:44px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    margin-top:16px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app .panel{
    border-radius:24px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app .panel-head{
    padding:16px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app .panel-body{
    padding:14px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app .controls{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  body.jx-has-mobile-shell .tool-hero + .app .cat-btn,
  body.jx-has-mobile-shell .tool-hero + .app .preset-btn,
  body.jx-has-mobile-shell .tool-hero + .app .btn{
    min-height:48px!important;
    border-radius:16px!important;
    font-size:16px!important;
  }

  /* Greece trip guide app */
  body.jx-has-mobile-shell.jx-trip-page .jx-section{
    padding-top:28px!important;
  }

  body.jx-has-mobile-shell .jx-planner-card{
    padding:14px!important;
  }

  body.jx-has-mobile-shell .jx-planner-head{
    gap:10px!important;
  }

  body.jx-has-mobile-shell .jx-question-title,
  body.jx-has-mobile-shell .jx-result-title{
    font-size:1.65rem!important;
    line-height:1.05!important;
  }

  body.jx-has-mobile-shell .jx-options{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  body.jx-has-mobile-shell .jx-option{
    min-height:76px!important;
    padding:14px!important;
    text-align:left!important;
  }

  body.jx-has-mobile-shell .jx-planner-actions,
  body.jx-has-mobile-shell .jx-result-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }

  body.jx-has-mobile-shell .jx-btn{
    min-height:48px!important;
    border-radius:16px!important;
    justify-content:center!important;
  }

  body.jx-has-mobile-shell .jx-route-grid,
  body.jx-has-mobile-shell .jx-why-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  /* Footer clears bottom navigation cleanly */
  body.jx-has-mobile-shell footer,
  body.jx-has-mobile-shell .footer{
    padding-bottom:120px!important;
  }
}

@media (max-width:420px){
  body.jx-has-mobile-shell h1,
  body.jx-has-mobile-shell .hero h1,
  body.jx-has-mobile-shell .watch-hero h1,
  body.jx-has-mobile-shell .tool-hero h1,
  body.jx-has-mobile-shell .arcade-title,
  body.jx-has-mobile-shell .jx-trip-title{
    font-size:clamp(2.15rem,13.5vw,3.45rem)!important;
  }

  body.jx-has-mobile-shell .wrap,
  body.jx-has-mobile-shell .hero-inner,
  body.jx-has-mobile-shell .watch-layout{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  body.jx-has-mobile-shell .watch-item-thumb{
    width:82px!important;
    min-width:82px!important;
  }

  body.jx-has-mobile-shell .game-cabinet,
  body.jx-has-mobile-shell .machine-placeholder{
    height:238px!important;
    min-height:238px!important;
  }

  body.jx-has-mobile-shell .game-cabinet img{
    height:226px!important;
    max-height:226px!important;
  }
}