/* V3.27 / A deliberately small mobile start: one current blog entry and
   three real film destinations. Desktop keeps the original 360 hotspots. */
body.fxv2 .fxv327-mobile-start{display:none}

@media (max-width:760px), (max-height:500px) and (pointer:coarse){
  /* The mobile selection REPLACES all home-world hotspot windows. The film
     information at bottom-left is a sibling and deliberately stays. */
  body.fxv2 .fxv2-pano[data-v2-scene="home"] .fxv2-pano-hotspots{
    display:none!important;
  }
  body.fxv2 .fxv2-pano[data-v2-scene="home"] .fxv327-mobile-start{
    box-sizing:border-box;
    position:absolute;
    z-index:7;
    top:clamp(10px,2.4dvh,22px);
    left:50%;
    transform:translateX(-50%);
    width:min(450px,calc(100% - 28px));
    max-width:100%;
    min-width:0;
    display:grid;
    gap:8px;
    pointer-events:auto;
  }
  body.fxv2 .fxv327-mobile-platforms{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    min-width:0;
  }
  body.fxv2 .fxv327-mobile-card{
    box-sizing:border-box;
    position:relative;
    isolation:isolate;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    min-width:0;
    min-height:80px;
    overflow:hidden;
    text-align:left;
    text-decoration:none;
    color:#fff!important;
    border:1px solid rgba(235,250,243,.48);
    border-radius:12px!important;
    background:linear-gradient(135deg,#14352bdc,#061511ef);
    box-shadow:0 7px 20px #0006;
    -webkit-tap-highlight-color:transparent;
    transition:background .2s,border-color .2s;
  }
  body.fxv2 .fxv327-mobile-card::after{
    content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
    background:linear-gradient(to top,#06140ff5,#06140fcc 47%,#07191355);
  }
  body.fxv2 .fxv327-mobile-card>img{
    position:absolute;z-index:-2;inset:0;
    width:100%;height:100%;object-fit:cover;
    opacity:.7;pointer-events:none;
  }
  body.fxv2 .fxv327-mobile-copy{
    display:grid;
    gap:4px;
    padding:10px 10px 11px;
    min-width:0;
  }
  body.fxv2 .fxv327-mobile-card small{
    color:#a6eabc;
    font:800 10px/1.2 system-ui,sans-serif;
    letter-spacing:.06em;
  }
  body.fxv2 .fxv327-mobile-card strong{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    overflow-wrap:anywhere;
    color:#fff;
    font:780 12px/1.26 system-ui,sans-serif;
  }
  body.fxv2 .fxv327-mobile-blog{
    min-height:82px;
    background:linear-gradient(110deg,#214337db,#071913f0);
  }
  body.fxv2 .fxv327-mobile-blog .fxv327-mobile-copy{padding:12px 13px}
  body.fxv2 .fxv327-mobile-blog strong{font-size:clamp(14px,3.7vw,19px);-webkit-line-clamp:2}
  body.fxv2 .fxv327-mobile-platforms .fxv327-mobile-card{min-height:84px}
  body.fxv2 .fxv327-mobile-tiktok{background:linear-gradient(138deg,#16443f,#09201a)}
  body.fxv2 .fxv327-mobile-instagram{background:linear-gradient(135deg,#33443e,#161f25)}
  body.fxv2 .fxv327-mobile-youtube{background:linear-gradient(135deg,#2f4036,#1d1919)}
  body.fxv2 .fxv327-mobile-card:is(:hover,:focus-visible){
    border-color:#bcf3ca;
    background:#234c36;
  }
  body.fxv2 .fxv327-mobile-card:focus-visible{outline:2px solid #b8ffcd;outline-offset:3px}
  body.fxv2 .fxv2-pano[data-v2-scene="home"] .fxv321-current-caption{
    z-index:8;
    left:12px!important;
    bottom:12px!important;
    max-width:min(310px,calc(100% - 24px))!important;
    border-radius:12px!important;
  }
}

/* Phone landscape has little height: four clear, short cards in one row,
   keeping the video and its lower-left caption largely unobstructed. */
@media (max-height:500px) and (pointer:coarse){
  body.fxv2 .fxv2-pano[data-v2-scene="home"] .fxv327-mobile-start{
    top:8px;
    width:min(900px,calc(100% - 28px));
    grid-template-columns:minmax(0,1.25fr) minmax(0,3fr);
    align-items:stretch;
    gap:7px;
  }
  body.fxv2 .fxv327-mobile-platforms{gap:7px}
  body.fxv2 .fxv327-mobile-blog,
  body.fxv2 .fxv327-mobile-platforms .fxv327-mobile-card{min-height:64px}
  body.fxv2 .fxv327-mobile-copy{padding:7px 8px 8px}
  body.fxv2 .fxv327-mobile-blog .fxv327-mobile-copy{padding:8px 10px}
  body.fxv2 .fxv327-mobile-blog strong{font-size:12px}
  body.fxv2 .fxv327-mobile-card strong{font-size:11px}
}

@media(max-width:360px){
  body.fxv2 .fxv2-pano[data-v2-scene="home"] .fxv327-mobile-start{width:calc(100% - 20px);gap:6px}
  body.fxv2 .fxv327-mobile-platforms{gap:6px}
  body.fxv2 .fxv327-mobile-copy{padding:8px 7px 9px}
  body.fxv2 .fxv327-mobile-card strong{font-size:11px}
}

@media(prefers-reduced-motion:reduce){
  body.fxv2 .fxv327-mobile-card{transition:none}
}