*{box-sizing:border-box}
body{margin:0;font-family:Helvetica,Arial,sans-serif;background:#f6f8fa}
a{color:#2265d8;text-decoration:none}
a:hover{color:#173154}
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:479px){.cat-grid{grid-template-columns:repeat(2,1fr)}}
.featured-grid{display:flex;overflow-x:auto;gap:16px;padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.featured-grid>*{flex:0 0 220px;scroll-snap-align:start}
.cat-label{position:absolute;left:0;right:0;bottom:7%;padding:10px 16px 10px 20px}
@media(max-width:479px){.cat-label{bottom:21%}}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:479px){.product-grid{grid-template-columns:repeat(2,1fr)}}
.hero-wrap{position:relative;width:100%;aspect-ratio:1440/704;overflow:hidden;background:#0b2d6b}
.hero-content{position:relative;z-index:2;max-width:480px;height:100%;display:flex;flex-direction:column;justify-content:center;padding-left:76px}
.hero-h1{font-size:42px;font-weight:800;color:#fff;margin:0 0 16px;line-height:1.15}
.hero-sub{font-size:17px;color:#cfe0ee;margin:0 0 32px;line-height:1.55}
@media(max-width:640px){
  .hero-wrap{aspect-ratio:unset;min-height:320px}
  .hero-slide-bg{background-position:right center!important;background-size:cover!important}
  .hero-content{max-width:100%;padding:20px 14px}
  .hero-h1{font-size:20px;margin:0 0 6px}
  .hero-sub{font-size:12px;margin:0 0 12px}
  .hero-content button{padding:8px 16px!important;font-size:12px!important}
  .site-nav{padding:10px 14px!important;gap:8px!important}
  .nav-logo>div{font-size:18px!important}
  .nav-links{gap:12px!important}
  .nav-links>div{font-size:12px!important}
  .nav-cta{padding:7px 14px!important;font-size:12px!important}
}