/* NET2000 home 4.21: hero for small screens. The headline and the "Check your address" button now sit in slide 1
   (NBN) of the services carousel; the speed test and phone buttons are in the top bar only. Loaded after home-4.17.css. */
/* the page's h1 stays in the HTML for search engines and screen readers; slide 1 shows the same words */
.j-h1{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.js-hero{font-size:clamp(1.85rem,4.4vw,3rem);line-height:1.06;letter-spacing:-.02em;margin:2px 0 .35em;color:#fff}
.js-hero .j-big{display:block;background:linear-gradient(90deg,#7fe3ff,#19b3ff 40%,#5b8cff 80%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(25,179,255,.35))}
.js-hero .j-calm{display:block;font-size:.6em;font-weight:700;color:#dbe6ff;margin-top:.25em;letter-spacing:-.01em}
.js-s .js-check{margin-top:8px;border-bottom:0;color:#fff;font-size:1rem}
.js-s .js-check:hover,.js-s .js-check:focus-visible{color:#fff}
.js-s .js-check svg{width:20px;height:20px;flex:none}
/* the tallest slide (now slide 1) sets the side-text height; keep the gap above the window small */
.j-say{margin-bottom:6px}
@media (max-width:899px){
  .j-top{gap:16px;margin-bottom:20px}
  .journey .j-kicker{margin-bottom:12px}
  .js-l{line-height:1.45}
}
@media (max-width:420px){
  .js-hero{font-size:1.72rem}
  .js-s .js-check{width:100%}
}