/* ==========================================================================
   Adventure Rovex Lights - consumer storefront theme
   Loaded after style.css and overrides it. Layout pattern follows the
   reference D2C store: announcement bar, search header, category grid,
   price + add-to-cart cards, trust row, reviews, guides, newsletter, footer.
   ========================================================================== */

:root{
  --s-ink:#1a1a1a;
  --s-muted:#6f6f6f;
  --s-faint:#9a9a9a;
  --s-line:#eaeaea;
  --s-soft:#f6f6f6;
  --s-soft-2:#f2f2f2;
  --s-accent:#e94709;
  --s-accent-dark:#c93a05;
  --s-gold:#ffc43a;
  --s-dark:#101010;
  --s-radius:8px;
  --s-radius-lg:14px;
  --s-container:1280px;
  --s-shadow:0 10px 28px rgba(0,0,0,.08);
  --s-shadow-sm:0 2px 10px rgba(0,0,0,.06);
  --blue-600:var(--s-gold);
  --blue-500:#ffd166;
}

body{color:var(--s-ink)}
.container{width:min(var(--s-container),92%)}

/* ------------------------------------------------------------------ buttons */
.btn{border-radius:999px;font-weight:700}
.btn-primary{background:var(--s-gold);color:#3a2a00;border-color:var(--s-gold)}
.btn-primary:hover{background:#ffd166;color:#3a2a00;box-shadow:0 10px 22px rgba(255,196,58,.4)}
.btn-outline-dark{background:#fff;color:var(--s-ink);border-color:#d8d8d8}
.btn-outline-dark:hover{background:var(--s-dark);color:#fff;border-color:var(--s-dark)}
.btn-dark{background:var(--s-dark);color:#fff;border-color:var(--s-dark)}
.btn-dark:hover{background:#000;color:#fff}

/* ------------------------------------------------------- announcement bar */
.ann-bar{
  display:flex;align-items:center;justify-content:center;gap:14px;
  background:var(--s-dark);color:#fff;
  padding:9px 16px;font-size:.82rem;letter-spacing:.02em;
}
.ann-bar span{opacity:.9}
.ann-bar strong{color:var(--s-gold);font-weight:700;white-space:nowrap}
.ann-bar:hover strong{text-decoration:underline}

/* ------------------------------------------------------------- store header */
.store-header{
  position:sticky;top:0;z-index:60;background:#fff;
  border-bottom:1px solid var(--s-line);
  transition:box-shadow .2s ease;
}
.store-header.scrolled{box-shadow:0 6px 20px rgba(0,0,0,.08)}
.store-header-top{padding:12px 0}
.store-header-inner{display:flex;align-items:center;gap:18px}
.store-header .brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.store-header .header-logo{height:34px;width:auto}
.store-header .brand-caption{
  font-size:.82rem;font-weight:700;letter-spacing:.14em;color:var(--s-ink);
}
.store-header .brand-caption strong{color:var(--s-accent)}

.store-search{
  flex:1 1 auto;display:flex;align-items:center;
  background:var(--s-soft);border:1px solid var(--s-line);
  border-radius:999px;padding:0 6px 0 16px;min-width:0;max-width:520px;
}
.store-search input{
  flex:1 1 auto;border:0;background:transparent;outline:none;
  padding:11px 8px;font-size:.92rem;color:var(--s-ink);min-width:0;
}
.store-search button{
  border:0;background:transparent;font-size:1rem;padding:8px 12px;color:var(--s-muted);
}
.store-search button:hover{color:var(--s-ink)}

.store-header-actions{display:flex;align-items:center;gap:6px;margin-left:auto;flex:0 0 auto}
.store-icon-link{
  display:inline-flex;flex-direction:column;align-items:center;gap:2px;
  font-size:.7rem;color:var(--s-muted);padding:6px 10px;border-radius:10px;
}
.store-icon-link:hover{background:var(--s-soft);color:var(--s-ink)}
.store-icon-link i{font-style:normal;font-size:1.05rem;line-height:1}
.store-cart-btn{
  position:relative;display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--s-line);background:#fff;border-radius:999px;
  padding:9px 16px;font-weight:700;font-size:.86rem;color:var(--s-ink);
}
.store-cart-btn:hover{border-color:var(--s-ink)}
.store-cart-count{
  min-width:20px;height:20px;border-radius:999px;background:var(--s-accent);color:#fff;
  font-size:.72rem;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;
}

.store-nav{border-top:1px solid var(--s-line);background:#fff}
.store-nav ul{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.store-nav li{position:relative}
.store-nav a{
  display:block;padding:13px 14px;font-size:.88rem;font-weight:600;color:var(--s-ink);
  border-bottom:2px solid transparent;
}
.store-nav a:hover{color:var(--s-accent);border-bottom-color:var(--s-accent)}
.store-nav a.nav-cta{color:var(--s-accent)}
.store-nav .drop{
  position:absolute;left:0;top:100%;min-width:230px;background:#fff;
  border:1px solid var(--s-line);border-radius:var(--s-radius);
  box-shadow:var(--s-shadow);padding:8px;display:none;z-index:70;
}
.store-nav li:hover>.drop,.store-nav li:focus-within>.drop{display:block}
.store-nav .drop a{
  border-bottom:0;border-radius:6px;padding:9px 12px;font-weight:500;font-size:.86rem;
}
.store-nav .drop a:hover{background:var(--s-soft);color:var(--s-accent)}

.store-header .menu-toggle{display:none}

/* -------------------------------------------------------------------- hero */
.store-hero{background:linear-gradient(180deg,#fafafa,#fff);padding:44px 0 56px}
.store-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center}
.store-hero .eyebrow{
  background:rgba(233,71,9,.1);color:var(--s-accent);
  padding:6px 14px;border-radius:999px;letter-spacing:.1em;
}
.store-hero h1{
  font-size:clamp(2.1rem,4.2vw,3.3rem);line-height:1.1;letter-spacing:-.03em;
  color:var(--s-ink);margin:18px 0 16px;font-weight:800;
}
.store-hero h1 span{color:var(--s-accent)}
.store-hero-lead{color:var(--s-muted);font-size:1.04rem;max-width:560px;margin-bottom:28px}
.store-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:26px}
.store-hero-points{display:flex;flex-wrap:wrap;gap:8px 22px;color:var(--s-muted);font-size:.86rem}
.store-hero-points li{position:relative;padding-left:20px}
.store-hero-points li::before{
  content:"";position:absolute;left:0;top:.42em;width:9px;height:9px;border-radius:999px;
  background:var(--s-gold);box-shadow:0 0 0 3px rgba(255,196,58,.25);
}
.store-hero-art{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:repeat(2,1fr);gap:14px}
.store-hero-art img{
  width:100%;height:100%;object-fit:cover;border-radius:var(--s-radius-lg);
  background:var(--s-soft);box-shadow:var(--s-shadow-sm);
}
.store-hero-art img:first-child{grid-row:span 2}

/* ------------------------------------------------------------------- strips */
.store-trust{border-top:1px solid var(--s-line);border-bottom:1px solid var(--s-line);background:#fff}
.store-trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.store-trust-item{
  display:flex;align-items:center;gap:14px;padding:22px 20px;
  border-right:1px solid var(--s-line);text-align:left;
}
.store-trust-item:last-child{border-right:0}
.store-trust-item i{
  font-style:normal;width:42px;height:42px;border-radius:999px;flex:0 0 auto;
  background:var(--s-soft);display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;
}
.store-trust-item strong{display:block;font-size:.92rem;color:var(--s-ink)}
.store-trust-item span{font-size:.78rem;color:var(--s-muted)}

/* ---------------------------------------------------------------- sections */
.store-section{padding:64px 0}
.store-section.alt{background:var(--s-soft)}
.store-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px}
.store-head h2{font-size:clamp(1.5rem,2.6vw,2.05rem);letter-spacing:-.02em;color:var(--s-ink);font-weight:800}
.store-head p{color:var(--s-muted);font-size:.95rem;margin-top:6px}
.store-head .store-head-link{font-size:.86rem;font-weight:700;color:var(--s-accent);white-space:nowrap}
.store-head .store-head-link:hover{text-decoration:underline}
.store-head.center{flex-direction:column;align-items:center;text-align:center}

/* ------------------------------------------------------------ category grid */
.shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.shop-tile{
  position:relative;display:block;background:#fff;border:1px solid var(--s-line);
  border-radius:var(--s-radius-lg);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;
}
.shop-tile:hover{transform:translateY(-4px);box-shadow:var(--s-shadow)}
.shop-tile img{aspect-ratio:4/3;width:100%;object-fit:cover;background:var(--s-soft)}
.shop-tile-body{display:block;padding:14px 16px 18px}
.shop-tile-body strong{display:block;font-size:.95rem;color:var(--s-ink)}
.shop-tile-body span{font-size:.78rem;color:var(--s-muted)}

/* ------------------------------------------------------------ product cards */
.home-tabs{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;
}
.home-tab{
  border:1px solid var(--s-line);background:#fff;border-radius:999px;
  padding:10px 18px;font-size:.86rem;font-weight:700;color:var(--s-ink);
}
.home-tab:hover{border-color:var(--s-ink)}
.home-tab.is-active{background:var(--s-dark);color:#fff;border-color:var(--s-dark)}
.home-tab-panel{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
}

.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
#hotHomeGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.catalog-card{
  background:#fff;border:1px solid var(--s-line);border-radius:var(--s-radius);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.catalog-card:hover{transform:translateY(-5px);box-shadow:var(--s-shadow);border-color:#ddd}
.catalog-card .media{position:relative;background:var(--s-soft);overflow:hidden}
.catalog-card .media img{aspect-ratio:1/1;width:100%;object-fit:cover;transition:transform .35s ease}
.catalog-card:hover .media img{transform:scale(1.04)}
.catalog-card .cat-chip,.catalog-card .hot-chip{
  position:absolute;top:10px;font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;
}
.catalog-card .cat-chip{left:10px;background:rgba(255,255,255,.92);color:var(--s-muted)}
.catalog-card .hot-chip{right:10px;background:var(--s-accent);color:#fff}
.catalog-card .body{padding:14px 16px 18px;display:flex;flex-direction:column;flex:1 1 auto;gap:8px}
.catalog-card .model{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--s-faint);font-weight:700}
.catalog-card .body h3{
  font-size:.92rem;line-height:1.4;font-weight:600;color:var(--s-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.catalog-card .body h3 a:hover{color:var(--s-accent)}
.catalog-card .price-row{margin-top:auto;display:flex;flex-direction:column;gap:2px}
.catalog-card .price-from{font-size:.78rem;color:var(--s-muted)}
.catalog-card .price-from b{font-size:1.06rem;color:var(--s-ink);font-weight:800;letter-spacing:-.01em}
.catalog-card .price-ref{font-size:.72rem;color:var(--s-faint)}
.catalog-card .body>p{font-size:.76rem;color:var(--s-muted)}
.catalog-card .acts{display:flex;gap:8px;margin-top:4px}
.catalog-card .acts .btn{flex:1 1 auto;padding:11px 12px;font-size:.84rem}
.catalog-card .acts .btn-outline-dark{flex:0 0 auto}

/* ------------------------------------------------------------- trust badges */
.badge-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.badge-card{
  background:#fff;border:1px solid var(--s-line);border-radius:var(--s-radius);
  padding:22px;text-align:center;
}
.badge-card i{font-style:normal;font-size:1.5rem;display:block;margin-bottom:8px}
.badge-card strong{display:block;font-size:.92rem;color:var(--s-ink)}
.badge-card span{font-size:.8rem;color:var(--s-muted)}

/* ---------------------------------------------------------------- reviews */
.review-summary{
  display:flex;align-items:center;gap:12px;justify-content:center;
  color:var(--s-ink);font-size:.92rem;margin-bottom:26px;
}
.review-summary .stars{color:#ffb020;letter-spacing:2px}
.store-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.store-review{
  background:#fff;border:1px solid var(--s-line);border-radius:var(--s-radius);padding:22px;
  display:flex;flex-direction:column;gap:12px;
}
.store-review .stars{color:#ffb020;letter-spacing:2px}
.store-review blockquote{font-size:.92rem;color:#333;line-height:1.62}
.store-review .person{display:flex;align-items:center;gap:10px;margin-top:auto}
.store-review .person img{width:36px;height:36px;border-radius:999px;object-fit:cover}
.store-review .person strong{display:block;font-size:.86rem;color:var(--s-ink)}
.store-review .person span{font-size:.76rem;color:var(--s-muted)}

/* ------------------------------------------------------------ guide cards */
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.guide-card{
  background:#fff;border:1px solid var(--s-line);border-radius:var(--s-radius);
  padding:22px;display:flex;flex-direction:column;gap:10px;transition:transform .2s ease,box-shadow .2s ease;
}
.guide-card:hover{transform:translateY(-4px);box-shadow:var(--s-shadow)}
.guide-card .tag{font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--s-accent)}
.guide-card h3{font-size:1rem;color:var(--s-ink);font-weight:700;line-height:1.4}
.guide-card p{font-size:.85rem;color:var(--s-muted)}

/* -------------------------------------------------------------- newsletter */
.store-news{background:var(--s-dark);color:#fff;padding:56px 0}
.store-news-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:32px;align-items:center}
.store-news h2{font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:800;margin-bottom:8px}
.store-news p{color:#bdbdbd;font-size:.92rem}
.store-news-form{display:flex;gap:8px;background:#1c1c1c;border:1px solid #2c2c2c;border-radius:999px;padding:6px}
.store-news-form input{
  flex:1 1 auto;border:0;background:transparent;color:#fff;outline:none;padding:11px 18px;font-size:.9rem;
}
.store-news-form input::placeholder{color:#8a8a8a}
.store-news-form button{
  border:0;border-radius:999px;background:var(--s-gold);color:#3a2a00;font-weight:700;
  padding:11px 24px;font-size:.88rem;
}
.store-news-form button:hover{background:#ffd166}

/* ------------------------------------------------------------------ footer */
.site-footer{background:#0d0d0d;color:#c9c9c9;padding:56px 0 0;margin-top:0}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:34px;padding-bottom:34px}
.site-footer .brand-caption{color:#fff}
.site-footer h3{
  color:#fff;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;font-weight:800;
}
.site-footer p{font-size:.86rem;color:#a9a9a9;line-height:1.7}
.site-footer a{color:#c9c9c9;font-size:.86rem}
.site-footer a:hover{color:var(--s-gold)}
.site-footer ul li{margin-bottom:9px}
.footer-about .header-logo{height:34px}
.footer-pay{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  border-top:1px solid #232323;padding:22px 0;
}
.footer-pay i{
  font-style:normal;font-size:.66rem;font-weight:700;letter-spacing:.04em;
  background:#1c1c1c;border:1px solid #2c2c2c;border-radius:5px;color:#ddd;
  padding:5px 9px;
}
.footer-bottom{border-top:1px solid #232323;padding:18px 0;color:#8a8a8a;font-size:.8rem}

/* --------------------------------------------------- legacy page snippets */
.page-hero{background:var(--s-soft);padding:52px 0}
.page-hero h1{font-size:clamp(1.7rem,3vw,2.3rem);letter-spacing:-.02em;color:var(--s-ink);font-weight:800}
.page-hero .lead{color:var(--s-muted)}
.filter-bar{display:flex;flex-wrap:wrap;gap:8px}
.filter-btn{
  border:1px solid var(--s-line);background:#fff;border-radius:999px;padding:8px 16px;
  font-size:.84rem;font-weight:600;color:var(--s-ink);
}
.filter-btn:hover{border-color:var(--s-ink)}
.filter-btn.active{background:var(--s-dark);color:#fff;border-color:var(--s-dark)}
#catalogSearch{
  border:1px solid var(--s-line);border-radius:999px;padding:12px 18px;font-size:.9rem;
  width:100%;max-width:420px;outline:none;background:#fff;
}
#catalogSearch:focus{border-color:var(--s-ink)}
.review-card,.split-media img{border-radius:var(--s-radius)}

/* product detail */
.detail-thumbs{
  display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:10px;
}
.detail-thumb{
  aspect-ratio:1/1;width:100%;object-fit:cover;border-radius:6px;
  border:2px solid var(--s-line);cursor:pointer;background:var(--s-soft);
}
.detail-thumb:hover{border-color:#bbb}
.detail-thumb.is-active{border-color:var(--s-accent)}
.detail-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:start}
.detail-media img{border-radius:var(--s-radius-lg);background:var(--s-soft);width:100%}
.detail-model{gap:8px}
.model-chip{background:var(--s-soft);color:var(--s-muted);border-radius:999px;padding:5px 12px;font-size:.74rem;font-weight:700;letter-spacing:.08em}
.hot-chip{background:var(--s-accent);color:#fff;border-radius:999px;padding:5px 12px;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.detail-info h1{font-size:clamp(1.3rem,2.3vw,1.75rem);letter-spacing:-.02em;font-weight:800;margin:12px 0}
.detail-price-main{font-size:1.7rem;font-weight:800;color:var(--s-ink);letter-spacing:-.02em;display:block}
.detail-price-note{font-size:.82rem;color:var(--s-muted);display:block;margin-top:4px}
.detail-meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.detail-meta span{background:var(--s-soft);border-radius:999px;padding:6px 14px;font-size:.78rem;color:var(--s-muted)}
.detail-ask,.detail-box{background:var(--s-soft);border:1px solid var(--s-line);border-radius:var(--s-radius);padding:20px;margin-top:18px}
.detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.detail-actions .btn{flex:1 1 auto}
.buy-row{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.buy-row .qty-stepper{display:inline-flex;align-items:center;border:1px solid var(--s-line);border-radius:999px;overflow:hidden}
.buy-row .qty-stepper button{border:0;background:#fff;padding:12px 16px;font-size:1rem;color:var(--s-ink)}
.buy-row .qty-stepper button:hover{background:var(--s-soft)}
.buy-row .qty-stepper input{
  width:52px;border:0;text-align:center;font-size:.95rem;font-weight:700;outline:none;background:#fff;
}
.ship-note{font-size:.84rem;color:var(--s-muted);display:flex;gap:8px;align-items:flex-start;margin-top:12px}

/* --------------------------------------------------------------- responsive */

/* ==========================================================================
   De-dark pass. style.css ends with an unconditional dark "brand" palette
   (dark navy/black section backgrounds, dark footer). A consumer store needs
   the light background the reference site uses, so those are neutralised here
   and the remaining pieces are re-coloured to stay readable.
   ========================================================================== */
.video-showcase,
.process-section{background:var(--s-soft);border-top:1px solid var(--s-line)}
.market-strip{background:#fff;border-top:1px solid var(--s-line);border-bottom:1px solid var(--s-line)}
.market-label{color:var(--s-accent)}
.market-list li{border-color:var(--s-line);color:var(--s-muted)}

.light-head,.light-head h2{color:var(--s-ink)}
.light-head .eyebrow{color:var(--s-accent)}
.light-head p{color:var(--s-muted)}
.process-steps li{border-color:var(--s-line)}
.process-steps h3{color:var(--s-ink)}
.process-steps p{color:var(--s-muted)}
.process-steps span{color:var(--s-accent)}

.cta-panel .cta-inner{
  background:var(--s-soft);
  border:1px solid var(--s-line);
  border-radius:var(--s-radius-lg);
  padding:32px;
}
.cta-inner p{color:var(--s-muted)}
.cta-inner .eyebrow{color:var(--s-accent)}
.cta-inner h2{color:var(--s-ink)}
.cta-inner .btn-primary{background:var(--s-gold);color:#3a2a00}

/* footer: light, like the reference store */
.site-footer{background:#fff;color:var(--s-ink);border-top:1px solid var(--s-line)}
.site-footer h3{color:var(--s-ink)}
.site-footer p{color:var(--s-muted)}
.site-footer a{color:var(--s-muted)}
.site-footer a:hover{color:var(--s-accent)}
.site-footer .footer-contact a{color:var(--s-muted)}
.brand-footer .brand-caption{color:var(--s-ink)}
.brand-footer .brand-caption strong{color:var(--s-accent)}
.footer-pay{border-top:1px solid var(--s-line)}
.footer-pay i{background:#fff;border:1px solid var(--s-line);color:var(--s-muted)}
.footer-bottom{border-top:1px solid var(--s-line);color:var(--s-muted)}
.store-news-form{background:#fff;border:1px solid var(--s-line)}
.store-news-form input{color:var(--s-ink)}
.store-news-form input::placeholder{color:var(--s-faint)}
.footer-news-status{color:var(--s-muted)}

/* ------------------------------------------------------- order drawer ---- */
.cart-drawer{background:#fff;box-shadow:-14px 0 44px rgba(0,0,0,.16)}
.cart-head{
  padding:16px 18px;background:#fff;border-bottom:1px solid var(--s-line);
  position:sticky;top:0;z-index:2;
}
.cart-head h3{font-size:1.04rem;font-weight:800;color:var(--s-ink)}
.cart-head h3 span{font-weight:600;color:var(--s-muted);font-size:.86rem}
.cart-close{background:var(--s-soft);color:var(--s-ink)}
.cart-items{padding:14px 16px;gap:10px}
.cart-row{
  grid-template-columns:56px minmax(0,1fr);
  align-items:start;
  background:#fff;border:1px solid var(--s-line);border-radius:12px;
  padding:10px 32px 10px 10px;
}
.cart-thumb{width:56px;height:56px;border-radius:8px;background:var(--s-soft)}
.cart-info strong{font-size:.83rem;line-height:1.4;color:var(--s-ink);-webkit-line-clamp:2}
.cart-meta{font-size:.73rem;color:var(--s-muted)}
.cart-meta b{color:var(--s-ink);font-weight:700}
.cart-qty{border-color:var(--s-line)}
.cart-line-total{color:var(--s-ink);font-size:.92rem;text-align:right}
.cart-remove{color:var(--s-faint)}
.cart-remove:hover{color:var(--s-accent)}
.cart-foot{border-top:1px solid var(--s-line)}
.cart-total-row strong{color:var(--s-ink)}
.cart-empty{color:var(--s-muted)}

@media (max-width:1100px){
  .shop-grid,#hotHomeGrid,.catalog-grid{grid-template-columns:repeat(3,1fr)}
  .store-reviews,.guide-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .store-hero-inner{grid-template-columns:1fr;gap:28px}
  .store-trust-grid{grid-template-columns:repeat(2,1fr)}
  .store-trust-item:nth-child(2){border-right:0}
  .store-header .brand-caption{display:none}
  .store-header .menu-toggle{display:inline-flex}
  .store-nav{display:none}
  .store-nav.open{display:block}
  .store-nav ul{flex-direction:column;align-items:stretch}
  .store-nav .drop{position:static;display:block;box-shadow:none;border:0;padding:0 0 8px 12px}
  .store-search{order:3;max-width:none;flex-basis:100%}
  .store-news-inner{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .badge-row{grid-template-columns:repeat(2,1fr)}
  .detail-wrap{grid-template-columns:1fr;gap:24px}
}
@media (max-width:640px){
  .shop-grid,#hotHomeGrid,.catalog-grid{grid-template-columns:repeat(2,1fr)}
  .store-reviews,.guide-grid{grid-template-columns:1fr}
  .store-trust-grid{grid-template-columns:1fr}
  .store-trust-item{border-right:0;border-bottom:1px solid var(--s-line)}
  .footer-grid{grid-template-columns:1fr}
  .badge-row{grid-template-columns:1fr}
}

/* ---------------------------------------------------------------------------
 * Order cart / checkout drawer.
 *
 * The drawer is built by main.js (ensureShippingUi + renderCart) so every page
 * shares one layout. Order inside the footer is deliberate:
 *
 *   Deliver to  [ country picker ]   <- all 244 destinations
 *               rate + delivery time
 *   Items subtotal / Shipping / Order total
 *   reassurance line
 *   Send order on WhatsApp  ->  Send order by email  ->  Clear cart
 *
 * Desktop: 420px panel sliding in from the right.
 * Mobile:  full-screen sheet, action row pinned at the bottom, 46px+ targets.
 * ------------------------------------------------------------------------- */
.cart-drawer{width:min(420px,100%);background:#fff;display:flex;flex-direction:column}
.cart-head{padding:16px 18px;gap:12px}
.cart-head h3{font-size:1.06rem;letter-spacing:-.01em}
.cart-items{padding:14px 16px;gap:10px}
.cart-empty{padding:30px 14px;line-height:1.6}

.cart-row{
  grid-template-columns:60px minmax(0,1fr);
  gap:12px;
  padding:12px;
  border:1px solid var(--s-line);
  border-radius:12px;
  background:#fff;
}
.cart-thumb{width:60px;height:60px;border-radius:9px;background:var(--s-soft)}
.cart-info{gap:4px}
.cart-info strong{font-size:.82rem;line-height:1.35}
.cart-meta{font-size:.72rem;color:var(--s-muted)}
.cart-meta b{font-weight:800;color:var(--s-ink)}
.cart-qty{margin-top:0;border-color:var(--s-line)}
.cart-qty-btn{width:34px;height:32px;font-size:1.12rem}
.cart-qty-val{min-width:30px;font-size:.88rem}
.cart-line{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.cart-line-total{font-size:.92rem;font-weight:800;color:var(--s-ink);text-align:right;white-space:nowrap}
.cart-remove{top:8px;right:8px;width:28px;height:28px;font-size:.9rem;color:#b3b3b3;line-height:1}
.cart-remove:hover{color:#111}

.cart-foot{padding:14px 16px calc(14px + env(safe-area-inset-bottom));gap:0}

/* destination picker */
.cart-ship-block{
  border:1px solid var(--s-line);
  border-radius:12px;
  background:var(--s-soft);
  padding:12px;
  margin-bottom:12px;
}
.cart-field{display:flex;flex-direction:column;gap:6px}
.cart-field-label{
  font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted);
}
.cart-country{
  width:100%;
  min-width:0;
  min-height:46px;
  font:inherit;
  font-size:.92rem;
  font-weight:600;
  color:var(--s-ink);
  background:#fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%236b6b6b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 13px center;
  background-size:12px 8px;
  border:1px solid var(--s-line);
  border-radius:10px;
  padding:11px 36px 11px 12px;
  appearance:none;-webkit-appearance:none;
}
.cart-country:focus{outline:none;border-color:#ffce00;box-shadow:0 0 0 3px rgba(255,206,0,.22)}
.cart-ship-eta{margin:8px 0 0;font-size:.74rem;color:var(--s-muted);line-height:1.45}

/* ---------------------------------------------------- country picker sheet */
/* The native select stays in the DOM as the single source of truth for the
   shipping maths, but the visible control is a button that opens a searchable
   sheet. 244 destinations are impossible to scan in a phone wheel picker. */
.country-select-native{
  position:absolute!important;width:1px!important;height:1px!important;
  margin:-1px!important;padding:0!important;border:0!important;
  opacity:0!important;pointer-events:none!important;overflow:hidden!important;
}
.country-picker-btn{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;min-height:46px;padding:9px 12px;border:1px solid var(--s-line);
  border-radius:10px;background:#fff;color:var(--s-ink);font:inherit;text-align:left;
}
.country-picker-btn:active{background:#f5f5f7}
.country-picker-copy{display:flex;flex-direction:column;gap:1px;min-width:0}
.country-picker-label{
  font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--s-muted);
}
.country-picker-copy strong{
  display:block;font-size:.92rem;font-weight:650;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.country-picker-side{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.country-code-chip{
  font-size:.64rem;font-weight:800;letter-spacing:.06em;color:#6e6e73;
  background:#f5f5f7;border-radius:6px;padding:3px 6px;
}
.country-code-chip[hidden]{display:none}
.country-picker-chevron{
  width:9px;height:9px;border-right:1.6px solid #86868b;border-bottom:1.6px solid #86868b;
  transform:rotate(45deg) translateY(-2px);
}
.cart-field .country-picker-btn{flex:1 1 auto;width:auto;min-width:0}

.country-sheet{position:fixed;inset:0;z-index:220;display:flex;align-items:flex-end;justify-content:center}
.country-sheet[hidden]{display:none}
.country-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4)}
.country-sheet-panel{
  position:relative;display:flex;flex-direction:column;width:100%;max-width:540px;
  max-height:88vh;max-height:88dvh;background:#fff;border-radius:22px 22px 0 0;
  box-shadow:0 -24px 70px rgba(0,0,0,.24);overflow:hidden;
  animation:countrySheetIn .26s cubic-bezier(.2,.8,.2,1);
}
@keyframes countrySheetIn{from{transform:translateY(28px);opacity:.6}to{transform:translateY(0);opacity:1}}
.country-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 18px 10px}
.country-sheet-kicker{
  display:block;font-size:.62rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:#86868b;margin-bottom:3px;
}
.country-sheet-head h3{margin:0;font-size:1.28rem;line-height:1.15;letter-spacing:-.02em;color:var(--s-ink)}
.country-sheet-close{
  flex:0 0 auto;min-height:36px;border:0;border-radius:999px;background:#f5f5f7;
  color:var(--s-ink);font-size:.74rem;font-weight:700;padding:8px 14px;
}
.country-search{
  display:flex;align-items:center;gap:8px;margin:0 16px 8px;padding:0 12px;
  border-radius:12px;background:#f5f5f7;
}
.country-search-icon{font-size:1rem;color:#6e6e73;line-height:1}
.country-search input{
  flex:1 1 auto;min-width:0;height:46px;border:0;background:transparent;outline:none;
  color:var(--s-ink);font:inherit;font-size:16px;
}
.country-search input::placeholder{color:#86868b}
.country-list{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 10px 10px}
.country-group-title{
  margin:0;padding:12px 8px 5px;font-size:.62rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:#86868b;
}
.country-option{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  min-height:52px;border:0;border-radius:10px;background:#fff;padding:8px 10px;text-align:left;
}
.country-option:active,.country-option:hover{background:#f5f5f7}
.country-option[aria-selected="true"]{background:#f5f5f7}
.country-option-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.country-option-copy strong{
  display:block;font-size:.9rem;font-weight:600;line-height:1.25;color:var(--s-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.country-option-copy small{font-size:.7rem;line-height:1.2;color:#86868b}
.country-option-code{
  flex:0 0 auto;font-size:.64rem;font-weight:800;letter-spacing:.06em;color:#6e6e73;
  background:#f5f5f7;border-radius:6px;padding:3px 6px;
}
.country-empty{padding:30px 18px;text-align:center;font-size:.82rem;line-height:1.55;color:#86868b}
.country-sheet-foot{
  margin:0;padding:10px 18px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid #f2f2f4;text-align:center;font-size:.65rem;line-height:1.45;color:#86868b;
}
html.country-sheet-open,body.country-sheet-open{overflow:hidden!important}
@media (min-width:861px){
  .country-sheet{align-items:center;padding:24px}
  .country-sheet-panel{border-radius:20px;max-height:78vh;max-height:78dvh}
}

/* subtotal / shipping / total */
.cart-totals{padding:0 2px;margin-bottom:10px}
.cart-totals .cart-ship-row{padding:6px 0;font-size:.84rem;color:var(--s-muted)}
.cart-totals .cart-ship-row strong{font-size:.88rem}
.cart-grand-total{margin:8px 0 0;padding-top:11px;border-top:1px solid var(--s-line)}
.cart-grand-total span{font-size:.9rem;font-weight:700;color:var(--s-ink)}
.cart-grand-total strong{font-size:1.34rem;letter-spacing:-.02em;color:var(--s-ink)}
.cart-summary-line{font-size:.72rem;color:var(--s-muted);margin:0 0 10px;line-height:1.5}
.cart-cta-note{font-size:.74rem;color:var(--s-muted);line-height:1.5;margin:0 0 11px}
.cart-note{font-size:.7rem;color:var(--s-faint);line-height:1.5;margin:10px 0 0}
.cart-foot .btn{min-height:48px;font-size:.94rem;display:flex;align-items:center;justify-content:center}
.cart-foot .cart-clear{min-height:34px}

@media (max-width:720px){
  /* full-screen sheet: dvh keeps the action row above the mobile URL bar */
  .cart-drawer{
    top:0;right:0;bottom:auto;
    width:100%;
    height:100vh;
    height:100dvh;
    box-shadow:none;
  }
  /* every pixel the footer saves goes back to the item list */
  .cart-head{padding:12px 14px}
  .cart-head h3{font-size:1rem}
  .cart-items{padding:10px 12px;gap:8px}
  .cart-row{padding:10px}
  .cart-foot{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .cart-ship-block{padding:10px;margin-bottom:9px}
  /* label sits beside the picker on phones so the block stays one line shorter */
  .cart-field{flex-direction:row;align-items:center;gap:8px}
  .cart-field-label{flex:0 0 auto}
  .cart-country{flex:1 1 auto;width:auto}
  .cart-country{min-height:44px;padding:9px 34px 9px 11px;font-size:.9rem}
  .cart-ship-eta{margin:6px 0 0;font-size:.71rem}
  .cart-totals{margin-bottom:7px}
  .cart-totals .cart-ship-row{padding:4px 0}
  .cart-grand-total{margin:5px 0 0;padding-top:8px}
  .cart-grand-total strong{font-size:1.2rem}
  .cart-summary-line{font-size:.7rem;margin:0 0 7px}
  .cart-cta-note{font-size:.7rem;line-height:1.4;margin:0 0 8px}
  .cart-foot .btn{min-height:44px;font-size:.9rem;margin-bottom:8px}
  .cart-foot .cart-clear{min-height:26px;font-size:.78rem;padding:4px;margin-bottom:0}
  .cart-note{display:none}
}

/* Phones that are not tall (iPhone SE/8 class): keep only what is needed to
   order, so the totals and the send buttons always fit without scrolling. */
@media (max-width:720px) and (max-height:720px){
  .cart-cta-note{display:none}
  .cart-summary-line{display:none}
  .cart-ship-eta{margin-top:5px}
}

/* ---------------------------------------------------------------------------
 * Delivery details + the two payment surfaces.
 *
 * The drawer scrolls as a single column (items, then "Deliver to" + address),
 * which keeps the footer - totals and the order buttons - pinned and compact
 * even when the address form is long or the phone screen is short.
 * ------------------------------------------------------------------------- */
.cart-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column}
.cart-items{flex:none;overflow:visible;padding:14px 16px 4px}
.cart-ship-block{margin:0 16px 14px}

.cart-form{display:grid;grid-template-columns:1fr 1fr;gap:9px 10px;margin-top:10px}
.fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.fld-full{grid-column:1/-1}
.fld-label{font-size:.7rem;font-weight:700;color:var(--s-muted)}
.fld input{
  font:inherit;font-size:.86rem;color:var(--s-ink);background:#fff;
  border:1px solid var(--s-line);border-radius:9px;padding:9px 10px;min-height:42px;width:100%;
}
.fld input:focus{outline:none;border-color:#ffce00;box-shadow:0 0 0 3px rgba(255,206,0,.22)}
.fld input.is-invalid{border-color:#d81313;background:#fff7f7}
.cart-form-title{
  margin:12px 0 0;font-size:.7rem;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:var(--s-muted);
}
.cart-form-err{margin:8px 0 0;font-size:.72rem;color:#c62828;line-height:1.45}
.cart-form-err[hidden]{display:none}

/* product page: "Buy now - pay with PayPal" panel */
.buy-now{margin-top:12px}
.buy-now-toggle{width:100%}
.buy-now-panel{margin-top:12px}
.buy-now-panel .cart-ship-block{margin:0 0 12px}
.buy-now-panel .cart-checkout{margin-bottom:0}
.buy-now-panel .cart-paypal-note{margin:8px 0 0}

@media (max-width:720px){
  .cart-items{padding:10px 12px 4px}
  .cart-ship-block{margin:0 12px 12px}
  .cart-form{grid-template-columns:1fr;gap:8px}
  .fld input{min-height:44px;font-size:.9rem}
  .buy-now-panel .cart-ship-block{margin:0 0 10px}
}

/* Catalog count + sort: base layout, refined further on phones below. */
.catalog-tools{display:flex;align-items:center;gap:12px;margin-left:auto}
.catalog-sort{
  appearance:none;-webkit-appearance:none;
  border:1px solid var(--s-line);border-radius:999px;background:#fff;color:var(--s-ink);
  font:inherit;font-size:.82rem;font-weight:600;padding:10px 34px 10px 14px;min-height:40px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%236e6e73' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:10px 7px;
  cursor:pointer;
}
.catalog-sort:focus{outline:none;border-color:var(--s-ink)}

/* ==========================================================================
   MOBILE EXPERIENCE
   A quieter, image-led phone layout modelled on modern product-store sites:
   large type, generous images, one clear action per card and a short search
   path. Desktop rules above are intentionally left untouched.
   ========================================================================== */
@media (max-width:860px){
  html{-webkit-text-size-adjust:100%}
  body{overflow-x:hidden;background:#fff}
  .container{width:calc(100% - 32px)}

  /* announcement: one calm line instead of a second headline */
  .ann-bar{
    justify-content:center;gap:0;padding:7px 14px;
    font-size:10.5px;letter-spacing:.01em;
  }
  .ann-bar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ann-bar strong{display:none}

  /* header: compact brand row + a real, full-width search field */
  .store-header-top{padding:7px 0 9px}
  .store-header-inner{
    display:grid;grid-template-columns:minmax(0,1fr) auto;
    align-items:center;gap:0 10px;
  }
  .store-header .brand{grid-column:1;grid-row:1;min-width:0}
  .store-header .header-logo{height:27px;width:auto;max-width:180px;object-fit:contain}
  .store-header .brand-caption{display:none}
  .store-header-actions{grid-column:2;grid-row:1;gap:6px;margin-left:0}
  .store-icon-link{display:none}
  .store-cart-btn{
    position:relative;min-width:38px;min-height:38px;padding:6px 10px;
    border-color:transparent;background:#f5f5f7;
  }
  .store-cart-btn span:first-child{font-size:17px;line-height:1}
  .store-cart-count{
    position:absolute;top:-3px;right:-2px;min-width:17px;height:17px;
    padding:0 4px;font-size:10px;border:2px solid #fff;
  }
  .menu-toggle{
    display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;
    border:1px solid var(--s-line);border-radius:12px;background:#fff;
  }
  .menu-toggle span{width:17px;height:1.5px;background:var(--s-ink)}
  .store-search{
    grid-column:1/-1;grid-row:2;width:100%;max-width:none;min-height:42px;
    margin-top:7px;padding:0 4px 0 14px;border:0;border-radius:13px;background:#f5f5f7;
  }
  .store-search input{font-size:16px;padding:9px 6px}
  .store-search input::placeholder{font-size:13.5px;color:#86868b}
  .store-search button{width:40px;height:40px;padding:0;font-size:15px}

  /* menu becomes a compact accordion sheet under the header */
  .store-nav{border-top:1px solid var(--s-line);max-height:70vh;overflow:auto}
  .store-nav ul{display:block;padding:4px 0 10px}
  .store-nav li{border-bottom:1px solid var(--s-line)}
  .store-nav li:last-child{border-bottom:0}
  .store-nav a{padding:13px 2px;font-size:15px;font-weight:600;border:0}
  .store-nav .drop{display:none!important}

  /* hero: big statement, one product image, two obvious routes */
  .store-hero{padding:18px 0 32px;background:#fff}
  .store-hero-inner{display:flex;flex-direction:column;gap:18px}
  .store-hero-copy{padding:0 2px}
  .store-hero .eyebrow{font-size:10px;padding:5px 11px;letter-spacing:.12em}
  .store-hero h1{
    font-size:clamp(2.35rem,10.4vw,3.05rem);line-height:1.02;letter-spacing:-.045em;
    margin:12px 0 12px;font-weight:800;
  }
  .store-hero-lead{font-size:14.5px;line-height:1.55;margin-bottom:18px;color:#6e6e73}
  .store-hero-actions{display:flex;flex-direction:column;gap:9px;margin-bottom:16px}
  .store-hero-actions .btn{
    width:100%;min-height:48px;display:flex;align-items:center;justify-content:center;
    font-size:15px;border-radius:13px;
  }
  .store-hero-actions .btn-outline-dark{background:#f5f5f7;border-color:#f5f5f7;color:var(--s-ink)}
  .store-hero-points{
    display:grid;grid-template-columns:1fr 1fr;gap:7px 12px;
    font-size:11.5px;line-height:1.35;color:#6e6e73;
  }
  .store-hero-points li{padding-left:15px}
  .store-hero-points li::before{width:6px;height:6px;top:.45em;box-shadow:0 0 0 2px rgba(255,196,58,.24)}
  .store-hero-art{display:block}
  .store-hero-art img:first-child{
    display:block;width:100%;height:auto;aspect-ratio:4/3.05;
    object-fit:cover;border-radius:22px;box-shadow:none;
  }
  .store-hero-art img:not(:first-child){display:none}

  /* trust: swipeable proof instead of four stacked rows */
  .store-trust{padding:0}
  .store-trust-grid{
    display:flex;gap:10px;overflow-x:auto;padding:14px 0;scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .store-trust-grid::-webkit-scrollbar{display:none}
  .store-trust-item{
    flex:0 0 78%;padding:13px 14px;border:1px solid var(--s-line);border-radius:15px;
    background:#fbfbfd;scroll-snap-align:start;
  }
  .store-trust-item i{width:36px;height:36px;font-size:16px;background:#fff}
  .store-trust-item strong{font-size:13px}
  .store-trust-item span{font-size:11px;line-height:1.35}

  /* section rhythm */
  .store-section{padding:36px 0}
  .store-head{margin-bottom:18px;align-items:flex-end;gap:10px}
  .store-head h2{font-size:clamp(1.6rem,7vw,2rem);line-height:1.08;letter-spacing:-.035em}
  .store-head p{font-size:12.5px;line-height:1.45;margin-top:4px}
  .store-head .store-head-link{font-size:12px;padding-bottom:3px}

  /* categories: one swipeable row, large photography */
  .shop-grid{
    display:grid;grid-auto-flow:column;grid-auto-columns:72%;grid-template-columns:none;
    gap:12px;overflow-x:auto;margin:0 -16px;padding:0 16px 8px;
    scroll-snap-type:x mandatory;scrollbar-width:none;
  }
  .shop-grid::-webkit-scrollbar{display:none}
  .shop-tile{scroll-snap-align:start;border:0;border-radius:18px;background:#f5f5f7}
  .shop-tile img{aspect-ratio:4/3}
  .shop-tile-body{padding:12px 14px 14px}
  .shop-tile-body strong{font-size:14px}
  .shop-tile-body span{font-size:11px}

  /* category tabs: edge-to-edge, no wrapping */
  .home-tabs{
    flex-wrap:nowrap;overflow-x:auto;margin:0 -16px 16px;padding:0 16px 5px;
    gap:7px;scrollbar-width:none;
  }
  .home-tabs::-webkit-scrollbar{display:none}
  .home-tabs,.filter-bar,.shop-grid,.cat-tiles,.store-reviews,.guide-grid{
    width:calc(100% + 32px);max-width:calc(100% + 32px);box-sizing:border-box;
  }
  .home-tab{
    flex:0 0 auto;min-height:38px;padding:8px 15px;border-radius:999px;
    font-size:12.5px;background:#f5f5f7;border-color:#f5f5f7;
  }
  .home-tab.is-active{background:var(--s-ink);border-color:var(--s-ink)}

  /* reviews and guides: horizontal cards keep the page short */
  .store-reviews,.guide-grid{
    display:grid;grid-auto-flow:column;grid-auto-columns:84%;grid-template-columns:none;
    gap:12px;overflow-x:auto;margin:0 -16px;padding:0 16px 8px;
    scroll-snap-type:x mandatory;scrollbar-width:none;
  }
  .store-reviews::-webkit-scrollbar,.guide-grid::-webkit-scrollbar{display:none}
  .store-review,.guide-card{scroll-snap-align:start;border:0;border-radius:18px;background:#f5f5f7}
  .store-review{padding:18px}
  .store-review blockquote{font-size:13px;line-height:1.55}
  .review-summary{font-size:12px;gap:7px;margin-bottom:16px}
  .guide-card{padding:18px}

  /* split story blocks stack with a full-width image */
  .split{display:flex;flex-direction:column;gap:18px}
  .split-media img{width:100%;border-radius:20px;aspect-ratio:4/3;object-fit:cover}
  .split-copy h2{font-size:26px;line-height:1.1;letter-spacing:-.03em}
  .split-copy p{font-size:14px;line-height:1.6}
  .check-list{font-size:13px;line-height:1.5}

  /* newsletter + footer */
  .store-news{padding:36px 0}
  .store-news h2{font-size:26px;line-height:1.1;letter-spacing:-.03em}
  .store-news p{font-size:13px;line-height:1.55}
  .store-news-form{margin-top:14px;border:0;background:#f5f5f7;padding:5px}
  .store-news-form input{font-size:16px;padding:10px 14px;min-width:0}
  .store-news-form button{min-height:42px;padding:10px 18px;font-size:13px}
  .site-footer{padding:36px 0 0}
  .footer-grid{gap:24px;padding-bottom:24px}
  .site-footer p,.site-footer a{font-size:13px;line-height:1.6}
  .footer-pay{padding:16px 0;gap:6px}
  .footer-bottom{font-size:11px;line-height:1.5;padding:14px 0}

  /* products landing */
  .page-hero{padding:24px 0 18px;background:#fff}
  .page-hero h1{font-size:30px;line-height:1.06;letter-spacing:-.04em}
  .page-hero .lead{font-size:13.5px;line-height:1.55;margin-top:8px}
  .page-hero .eyebrow{font-size:9.5px}
  .cat-tiles{
    display:grid;grid-auto-flow:column;grid-auto-columns:66%;grid-template-columns:none;
    gap:10px;overflow-x:auto;margin:0 -16px;padding:0 16px 6px;
    scroll-snap-type:x mandatory;scrollbar-width:none;
  }
  .cat-tiles::-webkit-scrollbar{display:none}
  .cat-tile{scroll-snap-align:start;aspect-ratio:16/10;border-radius:16px}
  .cat-tile-text{left:13px;right:13px;bottom:11px}
  .cat-tile-text strong{font-size:14px}
  .cat-tile-text em{font-size:11px}

  /* catalog controls: the first thing a phone user needs */
  .catalog-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:9px;margin-bottom:12px}
  .catalog-search{min-width:0;width:100%;order:-1}
  #catalogSearch{
    width:100%;height:48px;padding:12px 16px 12px 42px;border:0;border-radius:14px;
    background:#f5f5f7;font-size:16px;
  }
  .catalog-search::before{left:16px;font-size:19px;color:#6e6e73}
  .filter-bar{
    flex-wrap:nowrap;overflow-x:auto;gap:7px;margin:0 -16px;padding:0 16px 4px;
    scrollbar-width:none;
  }
  .filter-bar::-webkit-scrollbar{display:none}
  .filter-btn{
    flex:0 0 auto;min-height:38px;padding:8px 15px;border:0;border-radius:999px;
    background:#f5f5f7;font-size:12.5px;font-weight:600;
  }
  .filter-btn.active{background:var(--s-ink);color:#fff}
  .catalog-tools{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .catalog-count{margin:0;font-size:11.5px;color:#86868b;white-space:nowrap}
  .catalog-sort{
    appearance:none;-webkit-appearance:none;border:0;border-radius:10px;
    background:#f5f5f7;color:var(--s-ink);font:inherit;font-size:11.5px;font-weight:600;
    padding:9px 28px 9px 12px;min-height:36px;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%236e6e73' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 10px center;background-size:10px 7px;
  }
  .catalog-load-more{
    display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;
    position:relative;z-index:2;scroll-margin-top:150px;
    margin:22px auto 6px;border:0;border-radius:14px;background:#f5f5f7;color:var(--s-ink);
    font-size:14px;font-weight:700;
  }
  .catalog-load-more:active{background:#ececf0}

  /* product grid: two calm columns, one action per card */
  .shop-grid,.catalog-grid,#hotHomeGrid,.home-tab-panel{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .catalog-grid,#hotHomeGrid,.home-tab-panel{gap:20px 12px}
  .catalog-card{border:0;border-radius:0;background:transparent;overflow:visible}
  .catalog-card:hover{transform:none;box-shadow:none}
  .catalog-card .media{border-radius:16px;background:#f5f5f7}
  .catalog-card .media img{aspect-ratio:1/1}
  .catalog-card .cat-chip{display:none}
  .catalog-card .hot-chip{
    top:7px;right:7px;padding:4px 8px;font-size:8.5px;letter-spacing:.06em;
    background:rgba(255,255,255,.94);color:var(--s-ink);
  }
  .catalog-card .body{padding:9px 2px 0;gap:3px}
  .catalog-card .model{font-size:9px;letter-spacing:.09em;color:#86868b}
  .catalog-card .body h3{font-size:13px;line-height:1.33;font-weight:600;min-height:35px}
  .catalog-card .body>p{display:none}
  .catalog-card .price-row{gap:0;margin-top:2px}
  .catalog-card .price-from{font-size:10.5px;color:#86868b}
  .catalog-card .price-from b{font-size:15px;letter-spacing:-.02em}
  .catalog-card .price-ref{display:none}
  .catalog-card .acts{margin-top:6px}
  .catalog-card .acts .btn{
    width:100%;min-height:36px;padding:7px 10px;border-radius:11px;font-size:12px;
  }
  .catalog-card .acts .btn-outline-dark{display:none}

  /* country control: one line beside the "Deliver to" label */
  .country-picker-label{display:none}
  .country-picker-btn{min-height:46px;padding:8px 11px}
  .country-picker-copy strong{font-size:.9rem}
  .country-sheet-head h3{font-size:1.18rem}

  /* product detail: gallery first, details second, buy action always in reach */
  .detail-breadcrumb{font-size:11.5px;margin:0 0 10px;color:#86868b}
  .detail-wrap{display:flex;flex-direction:column;gap:18px}
  .detail-media img{border-radius:20px;aspect-ratio:1/1;object-fit:cover}
  .detail-media{position:relative}
  .detail-photo-link{
    display:inline-flex;align-items:center;min-height:38px;margin-top:8px;
    font-size:11.5px;color:#86868b;
  }
  .detail-thumbs{grid-template-columns:repeat(6,1fr);gap:6px;margin-top:8px}
  .detail-thumb{border-radius:8px}
  .detail-info h1{font-size:24px;line-height:1.18;letter-spacing:-.035em;margin:9px 0 10px}
  .detail-model{gap:6px}
  .model-chip,.hot-chip{font-size:9.5px;padding:4px 9px}
  .detail-price-main{font-size:30px;letter-spacing:-.04em}
  .detail-price-note{font-size:11.5px;line-height:1.5}
  .detail-meta span{font-size:11px;padding:5px 11px}
  .detail-qty{margin-top:12px}
  .detail-ask,.detail-box{padding:16px;border-radius:16px;margin-top:14px}
  .detail-ask h3,.detail-box h2{font-size:16px}
  .detail-ask p,.detail-box li{font-size:12.5px;line-height:1.55}

  /* persistent buy bar */
  body.has-mobile-buy .detail-actions{
    position:fixed;left:0;right:0;bottom:0;z-index:85;margin:0;
    padding:9px 14px calc(9px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.92);border-top:1px solid rgba(0,0,0,.08);
    -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
    box-shadow:0 -8px 30px rgba(0,0,0,.06);
  }
  body.has-mobile-buy .detail-actions .btn{
    flex:1 1 0;min-height:48px;font-size:14.5px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;
  }
  body.has-mobile-buy .detail-actions .btn-outline-dark{flex:0 0 42%;background:#f5f5f7;border-color:#f5f5f7}
  body.has-mobile-buy{padding-bottom:82px}

  /* common content pages */
  .content-card,.legal-card,.form-card{border-radius:18px}
  .section{padding:36px 0}
  .btn-lg{min-height:48px;font-size:14.5px;border-radius:13px}
}

/* Narrow phones: keep the same hierarchy, slightly tighter imagery */
@media (max-width:390px){
  .container{width:calc(100% - 26px)}
  .store-hero h1{font-size:2.28rem}
  .store-hero-art img:first-child{border-radius:18px}
  .catalog-card .body h3{font-size:12.5px}
  .home-tabs,.filter-bar,.shop-grid,.cat-tiles,.store-reviews,.guide-grid{margin-left:-13px;margin-right:-13px;padding-left:13px;padding-right:13px}
  .home-tabs,.filter-bar,.shop-grid,.cat-tiles,.store-reviews,.guide-grid{width:calc(100% + 26px);max-width:calc(100% + 26px)}
}

@media (prefers-reduced-motion:reduce){
  .shop-tile,.catalog-card,.guide-card{transition:none!important}
}

/* ==========================================================================
   MOBILE CATALOG — spacious list cards
   The screenshots showed the real problem: product cards were being squeezed
   into two or four narrow columns, so long LED model names collapsed into
   fragments like "Start." or "Barra Led...". On phones and touch tablets the
   catalogue now uses one readable product per row, with the image on the left
   and only the information a buyer needs. Home collections become a large
   horizontal carousel instead of a cramped grid.
   ========================================================================== */
@media (max-width:900px), (pointer:coarse){
  .store-section{padding:46px 0}
  .store-head{margin-bottom:22px}

  /* one product per row, 124px image + readable copy */
  .catalog-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:14px!important;
    width:100%;max-width:none;margin:0;padding:0;
  }
  .catalog-grid .catalog-card{
    display:grid;grid-template-columns:clamp(112px,24vw,168px) minmax(0,1fr);align-items:stretch;
    gap:16px;padding:12px;border:1px solid #e8e8ed;border-radius:22px;
    background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.035);overflow:hidden;
  }
  .catalog-grid .catalog-card:hover{transform:none;box-shadow:0 2px 10px rgba(0,0,0,.035)}
  .catalog-grid .catalog-card .media{
    width:100%;height:auto;aspect-ratio:1/1;min-height:0;border-radius:17px;overflow:hidden;
    background:#f5f5f7;
  }
  .catalog-grid .catalog-card .media img{
    width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;
  }
  .catalog-grid .catalog-card .body{
    padding:2px 2px 1px 0;gap:5px;min-width:0;display:flex;flex-direction:column;
  }
  .catalog-grid .catalog-card .model{font-size:9.5px;line-height:1.2;letter-spacing:.1em}
  .catalog-grid .catalog-card .body h3{
    font-size:14.5px;line-height:1.38;font-weight:600;min-height:0;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  .catalog-grid .catalog-card .price-row{margin-top:auto;padding-top:2px}
  .catalog-grid .catalog-card .price-from{font-size:10.5px;line-height:1.2}
  .catalog-grid .catalog-card .price-from b{font-size:17px;letter-spacing:-.02em}
  .catalog-grid .catalog-card .acts{margin-top:3px;display:flex;justify-content:flex-start}
  .catalog-grid .catalog-card .acts .btn{
    width:auto;flex:0 0 auto;min-width:112px;min-height:38px;padding:8px 18px;border-radius:11px;
    font-size:12px;line-height:1.1;
  }
  .catalog-grid .catalog-card .cat-chip,
  .catalog-grid .catalog-card .price-ref,
  .catalog-grid .catalog-card .body>p,
  .catalog-grid .catalog-card .acts .btn-outline-dark{display:none!important}
  .catalog-grid .catalog-card .hot-chip{
    top:7px;left:7px;right:auto;padding:4px 8px;font-size:8px;
    background:rgba(255,255,255,.94);color:var(--s-ink);box-shadow:0 1px 5px rgba(0,0,0,.08);
  }

  /* home collections: large swipeable cards, not a tight grid */
  #hotHomeGrid,.home-tab-panel{
    display:grid!important;grid-auto-flow:column;grid-auto-columns:84%!important;
    grid-template-columns:none!important;gap:14px!important;
    overflow-x:auto;overflow-y:hidden;margin:0 -16px;padding:0 16px 10px;
    scroll-snap-type:x mandatory;scrollbar-width:none;
  }
  #hotHomeGrid::-webkit-scrollbar,.home-tab-panel::-webkit-scrollbar{display:none}
  #hotHomeGrid .catalog-card,.home-tab-panel .catalog-card{
    display:flex;flex-direction:column;padding:0;border:0;border-radius:0;
    background:transparent;box-shadow:none;scroll-snap-align:start;overflow:visible;
  }
  #hotHomeGrid .catalog-card .media,.home-tab-panel .catalog-card .media{
    width:100%;height:auto;aspect-ratio:1/1;min-height:0;border-radius:22px;
  }
  #hotHomeGrid .catalog-card .body,.home-tab-panel .catalog-card .body{
    padding:12px 2px 0;gap:4px;
  }
  #hotHomeGrid .catalog-card .body h3,.home-tab-panel .catalog-card .body h3{
    font-size:15.5px;line-height:1.35;-webkit-line-clamp:2;min-height:0;
  }
  #hotHomeGrid .catalog-card .price-from b,.home-tab-panel .catalog-card .price-from b{font-size:18px}
  #hotHomeGrid .catalog-card .acts,.home-tab-panel .catalog-card .acts{margin-top:5px}
  #hotHomeGrid .catalog-card .acts .btn,.home-tab-panel .catalog-card .acts .btn{
    min-height:40px;padding:8px 18px;font-size:12.5px;border-radius:11px;
  }

  /* category pages already use .catalog-grid; give the intro room to breathe */
  .page-hero{padding:28px 0 22px}
  .page-hero h1{font-size:32px;line-height:1.05;letter-spacing:-.045em}
  .page-hero .lead{font-size:14px;line-height:1.6;margin-top:10px}
  .cat-tiles{grid-auto-columns:70%}
  .cat-tile{aspect-ratio:16/9}
  .catalog-toolbar{gap:10px;margin-bottom:14px}
  .catalog-count{font-size:11.5px}
}

@media (max-width:390px){
  .catalog-grid .catalog-card{grid-template-columns:112px minmax(0,1fr);gap:12px;padding:10px}
  .catalog-grid .catalog-card .media{width:100%;height:auto;aspect-ratio:1/1}
  .catalog-grid .catalog-card .body h3{font-size:13.5px}
  #hotHomeGrid,.home-tab-panel{grid-auto-columns:88%!important}
}

/* Touch tablets in the 900–1400px range: two readable list columns beat one
   over-wide row (or the old four-column squeeze). */
@media (min-width:901px) and (pointer:coarse){
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .catalog-grid .catalog-card{
    grid-template-columns:clamp(120px,14vw,168px) minmax(0,1fr);
    gap:14px!important;
  }
  .catalog-grid .catalog-card .body h3{font-size:14px}
}

/* Wide mobile webviews sometimes report a fine pointer. The JS marker keeps
   the same two-column list layout instead of falling back to four tiny cards. */
@media (min-width:901px){
  html.arv-mobile .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;
  }
  html.arv-mobile .catalog-grid .catalog-card{
    display:grid;grid-template-columns:clamp(120px,14vw,168px) minmax(0,1fr);
    align-items:stretch;gap:14px;padding:12px;border:1px solid #e8e8ed;
    border-radius:22px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.035);
    overflow:hidden;
  }
  html.arv-mobile .catalog-grid .catalog-card .media{
    width:100%;height:auto;aspect-ratio:1/1;min-height:0;border-radius:17px;
    overflow:hidden;background:#f5f5f7;
  }
  html.arv-mobile .catalog-grid .catalog-card .body{
    padding:2px 2px 1px 0;gap:5px;min-width:0;display:flex;flex-direction:column;
  }
  html.arv-mobile .catalog-grid .catalog-card .model{font-size:9.5px;line-height:1.2;letter-spacing:.1em}
  html.arv-mobile .catalog-grid .catalog-card .body h3{
    font-size:14px;line-height:1.38;font-weight:600;min-height:0;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  html.arv-mobile .catalog-grid .catalog-card .price-row{margin-top:auto;padding-top:2px}
  html.arv-mobile .catalog-grid .catalog-card .price-from{font-size:10.5px;line-height:1.2}
  html.arv-mobile .catalog-grid .catalog-card .price-from b{font-size:17px}
  html.arv-mobile .catalog-grid .catalog-card .acts{
    margin-top:3px;display:flex;justify-content:flex-start;
  }
  html.arv-mobile .catalog-grid .catalog-card .acts .btn{
    width:auto;flex:0 0 auto;min-width:112px;min-height:38px;padding:8px 18px;
    border-radius:11px;font-size:12px;line-height:1.1;
  }
  html.arv-mobile .catalog-grid .catalog-card .cat-chip,
  html.arv-mobile .catalog-grid .catalog-card .price-ref,
  html.arv-mobile .catalog-grid .catalog-card .body>p,
  html.arv-mobile .catalog-grid .catalog-card .acts .btn-outline-dark{display:none!important}
}