@media (max-width:1024px){
  .foot__grid{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .hero{grid-template-columns:1fr;gap:1.2rem}
  .hero__orb{width:min(72%,340px)}
  .steps{grid-template-columns:1fr}
  .offer{grid-template-columns:1fr;justify-items:start}
  .grid-3,.grid-2{grid-template-columns:1fr}
}
@media (max-width:768px){
  .top{flex-wrap:wrap}
  .menu-btn{display:inline-flex;align-items:center}
  .top__tools{margin-left:auto}
  #nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;flex-wrap:nowrap;gap:0;background:var(--bg);padding:.4rem var(--gutter) 1rem;border-bottom:1px solid var(--line);box-shadow:0 20px 30px rgba(20,25,74,.15)}
  #nav.open{display:flex}
  #nav a{padding:.85rem 0;font-size:1.1rem;border-bottom:1px solid var(--line);width:100%}
  .cta-nav{display:none}
}
@media (max-width:720px){
  .offer-bar{display:grid;gap:.5rem;padding:.55rem var(--gutter) .7rem;text-align:center}
  .offer-bar .bar-sub{display:none}
  .offer-bar__actions{display:grid;grid-template-columns:1fr;width:100%}
  .seg{grid-template-columns:1fr}
  .clip__row{flex-wrap:wrap} .clip__row .btn{width:100%}
  .hero__cta .btn,.cta-row .btn{flex:1 1 auto}
  .foot__grid{grid-template-columns:1fr}
  .ad--rect{min-height:250px}
}
@media (max-width:430px){
  .hero h1{font-size:2.15rem}
  .brand{font-size:1.15rem}
  .desk{border-radius:22px}
}
@media (max-width:360px){
  body{font-size:1rem}
  .btn--big{font-size:1.05rem}
}
@media (max-width:320px){
  .hero h1{font-size:1.85rem}
  .section{padding-left:12px;padding-right:12px}
  .hero,.page-hero{padding-left:12px;padding-right:12px}
}