@media(max-width:600px){
  body{font-size:15px;overflow-x:hidden}
  .announcement{padding:.45rem .6rem;font-size:.7rem;white-space:normal}
  .site-header .top{grid-template-columns:auto 1fr;gap:.55rem .75rem;padding:.65rem .75rem}
  .brand-logo{width:88px;height:50px}
  .top nav{justify-self:end;justify-content:flex-end;gap:.75rem;min-width:0}
  .top nav a{font-size:.76rem!important;gap:.25rem;white-space:nowrap}
  .nav-icon{font-size:.95rem}
  .cart-count{min-width:19px;height:19px;font-size:.67rem}
  .search{grid-column:1/-1;grid-row:2;max-width:none}
  .search input{padding:.68rem .8rem}
  .search button{padding:.68rem .9rem}
  .cats{gap:1.15rem;padding:.65rem .75rem;font-size:.78rem;scrollbar-width:thin}
  .wrap{width:min(100% - 1rem,var(--max));padding-block:1.5rem}
  .catalog-section{padding-block:2rem}
  .section-heading{align-items:flex-start;flex-direction:column;margin-bottom:1rem}
  .grid{grid-template-columns:1fr;gap:1rem}
  .card{display:grid;grid-template-columns:minmax(118px,38%) 1fr;min-height:170px}
  .card-media{height:100%}.card img,.card .placeholder{height:100%;aspect-ratio:auto;object-fit:cover}
  .card-body{min-width:0;padding:.85rem;display:flex;flex-direction:column}
  .card h3{font-size:1.05rem;overflow-wrap:anywhere}.card-footer{margin-top:auto}
  .card-badge{top:.5rem;left:.5rem;padding:.25rem .45rem;font-size:.63rem}
  .benefits div{padding:.8rem}
  .panel,.checkout fieldset{padding:1rem}
  .checkout{gap:1rem}.checkout-summary{padding:1rem;border-radius:12px}
  .choice span{align-items:flex-start;flex-direction:column;gap:.25rem}
  .form-actions,.confirmation-actions{flex-direction:column}.form-actions>*{width:100%}
  .product{gap:1.25rem}.gallery{grid-template-columns:1fr}
  .footer-grid{gap:1.75rem}.footer-grid.wrap{padding-inline:.5rem}
  .welcome-floating{right:10px;bottom:10px;width:min(285px,calc(100vw - 20px));padding:14px 38px 13px 15px;border-radius:13px}
  .welcome-floating strong{font-size:1rem}.welcome-floating span,.welcome-floating a{font-size:.82rem}
}
@media(max-width:360px){
  .site-header .top{grid-template-columns:1fr}.brand-logo{justify-self:center}.top nav{justify-self:center;grid-row:2}.search{grid-row:3}
  .card{grid-template-columns:1fr}.card-media{height:auto}.card img,.card .placeholder{aspect-ratio:1;height:auto}
}