/* TackleSonar R69 — final hero-relative sonar geometry, full-course media support,
   Brands pagination height fix, and learning-path preview readability. */

/* --------------------------------------------------------------------------
   HOMEPAGE SONAR
   Desktop sonar is positioned against the ENTIRE hero, not the legacy right
   grid column. All layers use one hero-relative center, preserving the R68
   ring sizes while moving the cluster into the requested lower-right zone.
   -------------------------------------------------------------------------- */
@media (min-width:821px){
  .home-hero-r66 .hero-inner{
    position:relative!important;
    min-height:590px!important;
    overflow:visible!important;
  }
  .home-hero-r66 .r24-sonar-stage{
    --r69-sonar-x:76.5%;
    --r69-sonar-y:47.5%;
    position:absolute!important;
    z-index:3!important;
    inset:0!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    height:100%!important;
    margin:0!important;
    justify-self:auto!important;
    align-self:auto!important;
    overflow:visible!important;
    isolation:isolate!important;
    pointer-events:none!important;
    background:transparent!important;
  }
  .home-hero-r66 .r24-sonar-stage::before,
  .home-hero-r66 .home-sonar-dial-r24,
  .home-hero-r66 .home-sonar-rings-r15,
  .home-hero-r66 .home-sonar-pulse-r24,
  .home-hero-r66 .home-sonar-logo-r15,
  .home-hero-r66 .home-sonar-sweep-r15{
    left:var(--r69-sonar-x)!important;
    top:var(--r69-sonar-y)!important;
    right:auto!important;
    bottom:auto!important;
    margin:0!important;
  }
  /* Preserve the currently-good R68 ring proportions. */
  .home-hero-r66 .r24-sonar-stage::before{width:640px!important;height:640px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-dial-r24{width:610px!important;height:610px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-rings-r15{width:586px!important;height:586px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-pulse-r24{width:328px!important;height:328px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-logo-r15{width:310px!important;height:310px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-sweep-r15{
    width:586px!important;
    height:586px!important;
    transform:translate(-50%,-50%) rotate(0deg)!important;
    transform-origin:50% 50%!important;
    animation:r69SonarSweep 3.05s linear infinite!important;
    will-change:transform!important;
  }
  .home-hero-r66 .market-live-card{
    left:69.5%!important;
    right:auto!important;
    bottom:24px!important;
    transform:translateX(-50%)!important;
    z-index:9!important;
  }
}
@keyframes r69SonarSweep{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

/* Medium desktop: stay safely to the right of the copy while preserving center. */
@media (min-width:821px) and (max-width:1120px){
  .home-hero-r66 .r24-sonar-stage{--r69-sonar-x:75%;--r69-sonar-y:49%}
  .home-hero-r66 .r24-sonar-stage::before{width:545px!important;height:545px!important}
  .home-hero-r66 .home-sonar-dial-r24{width:520px!important;height:520px!important}
  .home-hero-r66 .home-sonar-rings-r15,.home-hero-r66 .home-sonar-sweep-r15{width:495px!important;height:495px!important}
  .home-hero-r66 .home-sonar-pulse-r24{width:282px!important;height:282px!important}
  .home-hero-r66 .home-sonar-logo-r15{width:262px!important;height:262px!important}
  .home-hero-r66 .market-live-card{left:70%!important;bottom:18px!important}
}

/* Mobile/tablet uses an in-flow stage below the copy; no desktop absolute offsets. */
@media (max-width:820px){
  .home-hero-r66 .r24-sonar-stage{
    --r69-sonar-x:50%;
    --r69-sonar-y:47%;
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    min-height:390px!important;
    height:390px!important;
    margin:0 auto!important;
    justify-self:stretch!important;
    overflow:hidden!important;
  }
  .home-hero-r66 .r24-sonar-stage::before,
  .home-hero-r66 .home-sonar-dial-r24,
  .home-hero-r66 .home-sonar-rings-r15,
  .home-hero-r66 .home-sonar-pulse-r24,
  .home-hero-r66 .home-sonar-logo-r15,
  .home-hero-r66 .home-sonar-sweep-r15{
    left:var(--r69-sonar-x)!important;
    top:var(--r69-sonar-y)!important;
    right:auto!important;
    bottom:auto!important;
    margin:0!important;
  }
  .home-hero-r66 .r24-sonar-stage::before{width:410px!important;height:410px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-dial-r24{width:390px!important;height:390px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-rings-r15{width:365px!important;height:365px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-pulse-r24{width:210px!important;height:210px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-logo-r15{width:198px!important;height:198px!important;transform:translate(-50%,-50%)!important}
  .home-hero-r66 .home-sonar-sweep-r15{width:365px!important;height:365px!important;transform:translate(-50%,-50%) rotate(0deg)!important;animation:r69SonarSweep 3.05s linear infinite!important}
  .home-hero-r66 .market-live-card{left:50%!important;right:auto!important;bottom:10px!important;transform:translateX(-50%)!important;width:min(310px,92%)!important;white-space:normal!important}
}
@media (max-width:520px){
  .home-hero-r66 .r24-sonar-stage{height:330px!important;min-height:330px!important}
  .home-hero-r66 .r24-sonar-stage::before{width:340px!important;height:340px!important}
  .home-hero-r66 .home-sonar-dial-r24{width:325px!important;height:325px!important}
  .home-hero-r66 .home-sonar-rings-r15,.home-hero-r66 .home-sonar-sweep-r15{width:304px!important;height:304px!important}
  .home-hero-r66 .home-sonar-pulse-r24{width:178px!important;height:178px!important}
  .home-hero-r66 .home-sonar-logo-r15{width:168px!important;height:168px!important}
}

/* Wave layer stays intact for its full media course; only the controller hides it. */
.home-hero-r66 .home-wave-r66{inset:0!important;overflow:hidden!important}
.home-hero-r66 .home-wave-video-r66,.home-hero-r66 .home-wave-safari-r66{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center bottom!important}

/* --------------------------------------------------------------------------
   BRANDS DIRECTORY
   Prevent the shared paginator from preserving a prior/taller page height.
   -------------------------------------------------------------------------- */
.brand-grid[data-brand-results],
.directory-section .brand-grid[data-paginate]{
  min-height:0!important;
  height:auto!important;
  align-content:start!important;
}
.brand-grid[data-brand-results] [data-page-item][hidden]{display:none!important}
.directory-section:has(.brand-grid[data-brand-results]) .list-pagination{min-height:0!important;margin-top:18px!important}

/* --------------------------------------------------------------------------
   LEARNING PATH GUIDE SIDEBAR
   The light next-step preview lives inside a dark panel, so explicitly restore
   dark readable copy instead of inheriting the panel's white text.
   -------------------------------------------------------------------------- */
.guide-path-complete-r64 .guide-next-preview-r64{
  position:relative!important;
  display:grid!important;
  gap:5px!important;
  margin:14px 0!important;
  padding:14px 15px 14px 18px!important;
  border:1px solid #9fdcec!important;
  border-left:4px solid #11bde5!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#f7fdff,#eaf8fd)!important;
  box-shadow:0 8px 18px rgba(0,31,62,.10)!important;
  text-align:left!important;
}
.guide-path-complete-r64 .guide-next-preview-r64 small{
  color:#087fa6!important;
  font-size:10px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
}
.guide-path-complete-r64 .guide-next-preview-r64 strong{
  display:block!important;
  color:#082f56!important;
  font-size:15px!important;
  line-height:1.35!important;
  font-weight:900!important;
  text-shadow:none!important;
  overflow-wrap:anywhere!important;
}