/* GUULRAADRAAC v1586 FIX2 — mobile-only spacing + Offline CTA + hero art visibility.
   Desktop and lower Home sections are intentionally unchanged. */
@media (max-width:767px){
  /* Tighten the band immediately below the real hero search. */
  .g1581HeroShell{
    padding-bottom:2px!important;
    margin-bottom:0!important;
  }

  /* Offline CTA sits in the normal flow but consumes almost no extra band. */
  .v2Home>.guulOfflineSlot.guulOfflineBelowHero{
    margin:3px 18px 0!important;
    min-height:34px!important;
    height:34px!important;
    justify-content:flex-end!important;
    align-items:center!important;
  }
  .v2Home>.guulOfflineSlot.guulOfflineBelowHero + .v2Challenge{
    margin-top:7px!important;
  }

  /* Compact, visible, student-friendly CTA. */
  .v2Home>.guulOfflineBelowHero .guulOfflineLauncher{
    position:relative!important;
    min-height:32px!important;
    height:32px!important;
    padding:6px 13px 6px 9px!important;
    gap:7px!important;
    border-radius:999px!important;
    border:1px solid rgba(65,229,184,.38)!important;
    color:#fff!important;
    background:linear-gradient(135deg,#16c98d 0%,#11b69f 58%,#0aa4aa 100%)!important;
    box-shadow:0 7px 17px rgba(5,111,93,.20),inset 0 1px 0 rgba(255,255,255,.20)!important;
    overflow:hidden!important;
    isolation:isolate!important;
    font-size:10.5px!important;
    font-weight:900!important;
    letter-spacing:.01em!important;
    animation:guulOfflineFloat1586 3.8s ease-in-out infinite!important;
  }
  .v2Home>.guulOfflineBelowHero .guulOfflineLauncher::after{
    content:"";
    position:absolute;
    z-index:-1;
    top:-55%;bottom:-55%;left:-40%;width:28%;
    transform:rotate(18deg);
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
    animation:guulOfflineShimmer1586 4.4s ease-in-out infinite;
    pointer-events:none;
  }
  .v2Home>.guulOfflineBelowHero .guulOfflineInstallIcon{
    width:20px!important;
    height:20px!important;
    flex:0 0 20px!important;
    border-radius:7px!important;
    color:transparent!important;
    font-size:0!important;
    background-color:rgba(255,255,255,.17)!important;
    background-image:url('/assets/offline-app-art-v1586.svg')!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    background-size:17px 17px!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)!important;
  }
  .v2Home>.guulOfflineBelowHero .guulOfflineLauncher span:last-child{
    position:relative;
    z-index:1;
    white-space:nowrap;
  }

  /* Keep the mobile illustration large, but reveal the hidden edge/head area. */
  .g1581Art{
    inset:-7px -5px 0 0!important;
    overflow:visible!important;
  }
  .g1581Art>img{
    width:54%!important;
    right:1px!important;
    bottom:-2px!important;
    max-width:none!important;
    transform:translateY(4px)!important;
    transform-origin:right bottom!important;
    object-fit:contain!important;
    object-position:right bottom!important;
  }
}
@media (max-width:359px){
  .v2Home>.guulOfflineSlot.guulOfflineBelowHero{margin-left:14px!important;margin-right:14px!important}
  .g1581Art>img{width:52.5%!important;right:0!important;transform:translateY(4px)!important}
}
@keyframes guulOfflineFloat1586{
  0%,72%,100%{transform:translateY(0)}
  82%{transform:translateY(-2px)}
  91%{transform:translateY(1px)}
}
@keyframes guulOfflineShimmer1586{
  0%,58%{left:-40%;opacity:0}
  64%{opacity:1}
  82%{left:118%;opacity:1}
  88%,100%{left:118%;opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .v2Home>.guulOfflineBelowHero .guulOfflineLauncher,
  .v2Home>.guulOfflineBelowHero .guulOfflineLauncher::after{animation:none!important}
}
