/* Mobile-only refinement; desktop hero retains its existing layout. */
@media (max-width:767px) {
 #home { height:calc(100svh - var(--urnm-nav-height,76px)) !important; min-height:600px !important; }
 #home .hero-mobile-frame { padding:22px 22px max(22px,env(safe-area-inset-bottom)); }
 #home .hero-mobile-heading { padding-top:0; gap:18px; }
 #home .hero-mobile-heading .ui-element { font-size:9px !important; line-height:1.55; letter-spacing:.06em; }
 #home .hero-mobile-heading > div:first-child { max-width:none; }
 #home .hero-mobile-heading > div:last-child { flex-shrink:0; }
 #home #hero-canvas-container { inset:76px 12px 184px !important; width:calc(100% - 24px) !important; height:calc(100% - 260px) !important; touch-action:pan-y !important; cursor:default; }
 #home .hero-mobile-footer { flex-direction:column; align-items:stretch; gap:16px; padding:0; }
 #home .hero-mobile-footer > div { max-width:none; width:100%; }
 #home .hero-mobile-footer p { font-size:14px !important; line-height:1.55 !important; letter-spacing:.035em !important; color:#bcbcc2; text-transform:none; margin:0; }
 #home .hero-mobile-footer > div:last-child a { display:flex; min-height:50px; justify-content:space-between; padding:10px 16px; border:1px solid #ffffff30; background:#151517dd; border-radius:3px; font-size:12px !important; letter-spacing:.06em; box-shadow:none; }
 #home .hero-mobile-footer a > span { padding:0; border:0; }
 #home .hero-mobile-footer a > div { width:28px; height:28px; border:0; background:#d01722; }
 #home .hero-mobile-footer a:focus-visible { outline:2px solid #ff4a57; outline-offset:4px; }
}
@media (max-width:360px) {
 #home .hero-mobile-frame { padding-left:18px; padding-right:18px; }
 #home .hero-mobile-heading .ui-element { font-size:8px !important; }
}

@media(max-width:767px) { #home .bg-text-layer { opacity:.08; } #home .hero-mobile-heading .ui-element { font-size:10px !important; } }

/* Keep the hero action clickable above the interactive 3D canvas. */
#home .hero-mobile-frame { z-index:30; pointer-events:none; }
#home #hero-canvas-container { z-index:20; }
#home .hero-mobile-footer .hero-explore-teams {
 position:relative;
 pointer-events:auto;
 touch-action:manipulation;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:16px;
 min-height:48px;
 padding:10px 14px;
 border:1px solid #383838;
 border-radius:0;
 background:#111111;
 color:#ffffff;
 text-decoration:none;
 cursor:pointer;
 backdrop-filter:none;
 transition:background-color .18s ease,border-color .18s ease,transform .18s ease;
}
#home .hero-explore-teams > span { border:0; padding:0; }
#home .hero-mobile-footer .hero-explore-teams > div {
 display:flex;
 align-items:center;
 justify-content:center;
 width:28px;
 height:28px;
 border:1px solid #555555;
 border-radius:0;
 background:transparent;
 transition:background-color .18s ease,border-color .18s ease;
}
#home .hero-explore-teams svg { transition:transform .18s ease; }
@media (hover:hover) {
 #home .hero-mobile-footer .hero-explore-teams:hover { background:#d01722; border-color:#d01722; }
 #home .hero-mobile-footer .hero-explore-teams:hover > div { border-color:#ffffff; }
 #home .hero-explore-teams:hover svg { transform:translateX(3px); }
}
#home .hero-mobile-footer .hero-explore-teams:focus-visible { background:#d01722; border-color:#d01722; outline:2px solid #ffffff; outline-offset:4px; }
#home .hero-mobile-footer .hero-explore-teams:active { background:#a9121b; border-color:#a9121b; transform:translateY(1px); }
@media (prefers-reduced-motion:reduce) {
 #home .hero-explore-teams, #home .hero-explore-teams * { transition:none !important; transform:none !important; }
}

/* ==========================================================================
   APPLE DEVICES (iPhone Landscape, iPad Mini / Air / Pro) & TABLET HERO
   ========================================================================== */

/* Allow vertical page scrolling when swiping or panning on the 3D hero on all viewports */
#home #hero-canvas-container,
#home #hero-canvas-container canvas {
  touch-action: pan-y !important;
}

/* Tablet Portrait & Landscape (iPad Mini 744px, iPad 10.2" 768px/810px, iPad Air 820px, iPad Pro 11" 834px, iPad Pro 12.9" 1024px, landscape up to 1180px) */
@media (min-width: 768px) and (max-width: 1180px) {
  #home {
    height: calc(100svh - var(--urnm-nav-height, 76px)) !important;
    min-height: 560px !important;
  }
  #home .hero-mobile-frame {
    padding: 28px max(32px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(32px, env(safe-area-inset-left)) !important;
  }
  #home .hero-mobile-heading {
    padding-top: 4px !important;
  }
  #home #hero-canvas-container {
    inset: 64px 20px 110px !important;
    width: calc(100% - 40px) !important;
    height: calc(100% - 174px) !important;
  }
  #home .hero-mobile-footer {
    padding-bottom: 4px !important;
    align-items: flex-end !important;
  }
}

/* iPhone & Mobile Landscape (e.g., iPhone SE / 15 / 16 Pro Max rotated horizontally) */
@media (max-width: 932px) and (max-height: 520px) and (orientation: landscape) {
  #home {
    height: calc(100svh - var(--urnm-nav-height, 64px)) !important;
    min-height: 320px !important;
  }
  #home .hero-mobile-frame {
    padding: 14px max(24px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)) !important;
  }
  #home #hero-canvas-container {
    inset: 40px 15% 56px !important;
    width: 70% !important;
    height: calc(100% - 96px) !important;
  }
  #home .hero-mobile-footer {
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 16px !important;
  }
  #home .hero-mobile-footer > div {
    width: auto !important;
    max-width: 260px !important;
  }
  #home .hero-mobile-footer p {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }
}
