/* Final responsive storefront layer — loaded last to normalize legacy styles. */
html,body{max-width:100%;overflow-x:hidden}
body{min-width:320px}
img,svg,video{max-width:100%}
header,main,section,article,div{min-width:0}
button,a,input,select,textarea{max-width:100%}
main{width:100%;padding-inline:0}

/* One consistent content width on desktop. */
.hero,.toolbar,#products,.discovery{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.discovery{display:grid;gap:34px;margin-top:34px}
header{gap:18px;padding:12px clamp(18px,4vw,56px)}
.header-actions{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.header-actions>*{min-height:44px;white-space:nowrap}
.section-head{gap:14px}
.section-head>div{min-width:0}
.section-head h2{margin-block:8px}
#count{flex:0 0 auto;color:#667b75;font-weight:700}

.hero{margin-block:24px;padding:clamp(34px,5vw,54px);border-radius:clamp(22px,3vw,30px)}
.hero-layout{grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);gap:clamp(24px,4vw,44px)}
.hero h2 span{font-size:clamp(2rem,5vw,4.15rem)}
.hero h2 strong{font-size:clamp(1.3rem,2.8vw,2.45rem)}
.hero-showcase{min-width:0}
.toolbar{margin-block:20px;padding:16px}
.search-row{grid-template-columns:minmax(0,1fr) minmax(180px,250px)}
.category-strip,.discovery-grid{max-width:100%}
.filter-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.category-cards{grid-template-columns:repeat(6,minmax(0,1fr))}

/* Catalogue readability */
#products{margin-block:24px 42px}
#products .section-head{gap:16px;align-items:flex-end}
#products .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
#products .card>img{height:180px}
#products .card h3{font-size:15px;line-height:22px}
#products .card p{font-size:12px;line-height:19px}
#products .price{font-size:16px}
#products .actions button{min-height:40px;font-size:12px}

/* Discovery rows stay within the page and remain readable. */
.discovery-section,.category-discovery{min-width:0}
.category-strip,.category-cards,.discovery-grid{-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.category-strip{display:flex!important;gap:8px!important;overflow-x:auto!important;padding:3px 2px 9px!important;scroll-snap-type:x proximity}
.category-strip button{flex:0 0 auto!important;min-height:40px!important;padding:8px 13px!important;font-size:.82rem!important;scroll-snap-align:start}
.category-cards{display:flex!important;gap:9px!important;overflow-x:auto!important;padding:3px 2px 10px!important;scroll-snap-type:x proximity}
.category-card{flex:0 0 145px!important;min-height:76px!important;padding:12px!important;border-radius:15px!important;scroll-snap-align:start;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.category-card strong{font-size:.9rem!important;line-height:1.4}
.category-card span{font-size:.72rem!important}
.category-card:hover{box-shadow:0 10px 24px rgba(16,43,56,.07)}
.discovery-grid{display:flex!important;gap:12px!important;overflow-x:auto!important;padding:4px 2px 14px!important;scroll-snap-type:x proximity;scroll-padding-inline:2px}
.discovery-grid .discovery-card{flex:0 0 230px!important;min-width:230px!important;padding:9px!important;border-radius:16px!important;scroll-snap-align:start}
.discovery-grid .discovery-card img{width:100%!important;height:155px!important;padding:4px!important;border-radius:11px!important;object-fit:contain!important}
.discovery-grid .discovery-card .card-body{padding:2px!important}
.discovery-grid .discovery-card h3{min-height:42px;margin:7px 0 0!important;font-size:13px!important;line-height:1.6!important}
.discovery-grid .discovery-card p{display:none!important}
.discovery-grid .discovery-card .price{margin-top:4px;font-size:13.5px!important}
.discovery-grid .discovery-card .card-meta{font-size:.72rem}
.discovery-grid .discovery-card .view-product{font-size:.76rem}
.discovery-grid .discovery-card .actions{grid-template-columns:1fr 1fr!important;gap:5px!important;padding-top:7px!important}
.discovery-grid .discovery-card .actions button{min-height:36px!important;padding:6px 4px!important;font-size:10.5px!important}

/* Product and policy pages */
.product-page,.info-page{width:min(1180px,calc(100% - 40px));padding-inline:0}
.product-detail{align-items:start}
.product-gallery{min-width:0}
.product-page-actions>*{min-height:46px}
.info-page section,.info-page details{overflow-wrap:anywhere}
.store-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:30px max(20px,calc((100vw - 1180px)/2));color:#fff}
.store-footer nav{display:flex;flex-wrap:wrap;gap:12px 20px}
.store-footer nav a{display:inline-flex;min-height:40px;align-items:center}
.store-footer p{margin-bottom:0;color:#d8e2e6}

@media(max-width:1000px){
  .hero,.toolbar,#products,.discovery,.product-page,.info-page{width:calc(100% - 32px)}
  .hero{padding:40px 32px}
  .hero-layout{gap:28px}
  .filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  #products .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
  #products .card>img{height:158px}
  .product-detail{gap:28px;padding:22px}
}

@media(max-width:760px){
  header{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:1fr;gap:10px;padding:10px 12px;box-shadow:0 5px 18px rgba(16,43,56,.08)}
  .brand{width:100%;gap:9px;justify-content:flex-start}
  .brand img{width:46px;height:46px;border-radius:12px}
  .brand h1{font-size:1.16rem}
  .brand p{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.74rem}
  .header-actions{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:6px;max-width:none}
  .header-actions>*{display:inline-flex!important;align-items:center;justify-content:center;width:100%;min-width:0;min-height:42px;padding:8px 5px!important;border-radius:10px!important;overflow:hidden;text-overflow:ellipsis;font-size:.75rem!important;line-height:1.2!important;text-align:center}
  .header-link{display:inline-flex!important}

  .hero,.toolbar,#products,.discovery,.product-page,.info-page{width:calc(100% - 20px);margin-inline:auto}
  .hero{margin-block:12px 16px;padding:25px 18px;border-radius:22px}
  .hero-layout{grid-template-columns:1fr;gap:22px}
  .hero h2{margin:16px 0 12px}
  .hero h2 span{font-size:clamp(1.75rem,8.8vw,2.35rem);line-height:1.25}
  .hero h2 strong{font-size:clamp(1.15rem,5.6vw,1.45rem);line-height:1.5}
  .hero p{font-size:.92rem;line-height:1.75}
  .hero-actions{margin-top:20px}
  .hero-actions a{width:100%;justify-content:center;min-height:46px}
  .hero-showcase{grid-template-columns:1.15fr .85fr;grid-template-rows:96px 96px;gap:8px;transform:none}
  .hero-trust{grid-template-columns:1fr;gap:8px;margin-top:20px}
  .hero-trust span{min-height:60px}

  .toolbar{position:relative;top:auto;margin-top:0;padding:12px;border-radius:17px}
  .search-row{grid-template-columns:1fr;gap:8px}
  .search-row input,.search-row select,.filter-grid input{min-height:46px}
  .category-strip{margin-inline:-4px!important;padding-inline:4px!important}
  .category-strip button{min-height:42px!important;padding:9px 13px!important;font-size:.8rem!important}
  .filter-grid{grid-template-columns:1fr 1fr;gap:8px}
  .filter-check{min-height:46px!important}
  .filter-grid .secondary-button{grid-column:1/-1;min-height:44px}

  .discovery{gap:26px;margin-top:26px}
  .section-head{align-items:flex-start;flex-wrap:wrap}
  .section-head h2{font-size:1.45rem}
  .category-card{flex-basis:136px!important;min-height:72px!important;padding:11px!important}
  .category-card strong{font-size:.84rem!important}
  .category-card span{font-size:.68rem!important}
  .discovery-grid .discovery-card{flex-basis:205px!important;min-width:205px!important}
  .discovery-grid .discovery-card img{height:138px!important}
  .discovery-grid .discovery-card h3{min-height:40px;font-size:12.5px!important}
  .discovery-grid .discovery-card .price{font-size:13px!important}
  .discovery-grid .discovery-card .actions button{min-height:34px!important;font-size:10px!important}

  #products{margin-block:22px 34px}
  #products .section-head{align-items:flex-start;margin-bottom:10px}
  #products .section-head h2{font-size:1.4rem}
  #products .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  #products .card{padding:8px;border-radius:15px}
  #products .card>img{height:132px;border-radius:11px}
  #products .card-body{padding-top:5px}
  #products .card h3{min-height:42px;font-size:13px;line-height:19px}
  #products .card p{display:none}
  #products .price{margin-top:5px;font-size:14px;line-height:20px}
  #products .card-meta{font-size:10.5px}
  #products .favorite-card{width:34px;height:34px;flex-basis:34px}
  #products .view-product{font-size:10.5px;line-height:18px}
  #products .actions{grid-template-columns:1fr;gap:5px}
  #products .actions button{min-height:36px;font-size:11px;line-height:15px}
  .load-more{width:100%;min-width:0}

  .panel,#cart.drawer .panel{width:100%;max-width:none;padding:18px}
  .checkout-card{padding:18px}
  .product-detail{grid-template-columns:1fr;gap:18px;padding:14px;border-radius:20px}
  .product-gallery img{max-height:390px}
  .product-info h1{font-size:1.75rem;line-height:1.35}
  .product-description{font-size:.95rem;line-height:1.85}
  .product-price{flex-wrap:wrap;font-size:1.4rem}
  .product-page-actions{display:grid;grid-template-columns:1fr}
  .purchase-benefits{padding:16px 28px}
  .breadcrumbs{flex-wrap:wrap;font-size:.86rem}
  .info-page{margin-top:22px}
  .info-page>h1{font-size:2rem}
  .info-page section,.info-page details{padding:17px;border-radius:14px}
  .store-footer{display:grid;gap:18px;padding:24px 14px;text-align:right}
  .store-footer nav{width:100%;display:grid;grid-template-columns:1fr;gap:0}
  .store-footer nav a{width:100%;border-bottom:1px solid rgba(255,255,255,.12)}
}

@media(max-width:390px){
  .brand p{display:none}
  .header-actions>*{font-size:.7rem!important;padding-inline:3px!important}
  .hero{padding-inline:15px}
  .hero-showcase{grid-template-rows:84px 84px}
  .filter-grid{grid-template-columns:1fr}
  .filter-grid .secondary-button{grid-column:auto}
  #products{width:calc(100% - 14px)}
  #products .grid{gap:7px}
  #products .card{padding:6px}
  #products .card>img{height:112px}
  #products .card h3{font-size:12px;line-height:18px}
  #products .card-meta{font-size:9.5px}
  #products .favorite-card{width:31px;height:31px;flex-basis:31px}
  #products .actions button{font-size:10px}
  .discovery-grid .discovery-card{flex-basis:190px!important;min-width:190px!important}
}

@media(min-width:1400px){
  .hero,.toolbar,#products,.discovery,.product-page{max-width:1240px}
  #products .grid{gap:18px}
  #products .card>img{height:195px}
}
