/* Let content size to the mobile viewport without changing scrubbed story stages. */
@media(max-width:900px),(pointer:coarse){
  .product-grid,.season-grid,.delivery-grid,.review-grid{min-inline-size:0}
  .product-card,.season-card,.story-card,.card-copy,.section-heading>*,.product-detail-facts>div{min-inline-size:0;max-inline-size:100%}
  .product-card h3,.product-detail-facts dd,.product-detail-description,.product-detail-care li{overflow-wrap:anywhere}
  .product-drawer{max-inline-size:100%;box-sizing:border-box}
  .product-drawer-header,.product-drawer-footer,.product-drawer-scroll{min-inline-size:0;max-inline-size:100%;box-sizing:border-box}
  .product-drawer-actions button{min-inline-size:0;white-space:normal}
  #detail{max-inline-size:calc(100% - 32px);box-sizing:border-box}
}
@media(max-width:380px){
  .header nav{gap:8px!important}.header nav a{font-size:10px}.header .brand{font-size:17px;gap:5px}
  .header.scrolled{padding-inline:8px}.hero-app>div{flex-wrap:wrap}
}