/* ARVELI Site UI System
   Order: tokens, base, layout, components, pages, responsive.
*/

:root{
  --site-font:"Manrope","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --bg:#f4f7fb;
  --surface:#ffffff;
  --surface-soft:#f8fafc;
  --surface-muted:#eef2f7;
  --text:#171512;
  --text-soft:#344054;
  --muted:#667085;
  --line:#d9e2ef;
  --primary:#171512;
  --primary-hover:#000000;
  --action-blue:#2f66d8;
  --action-blue-hover:#2458c2;
  --action-blue-bg:rgba(47,102,216,.07);
  --action-blue-bg-hover:rgba(47,102,216,.14);
  --action-blue-border:rgba(47,102,216,.42);
  --action-gold:#986900;
  --action-gold-hover:#745000;
  --action-gold-bg:rgba(240,174,0,.1);
  --action-gold-bg-hover:rgba(240,174,0,.18);
  --action-gold-border:rgba(207,145,0,.48);
  --action-green:#247a45;
  --action-green-hover:#1c6137;
  --action-green-bg:rgba(36,122,69,.07);
  --action-green-bg-hover:rgba(36,122,69,.14);
  --action-green-border:rgba(36,122,69,.38);
  --action-neutral-bg:rgba(23,21,18,.035);
  --action-neutral-bg-hover:rgba(23,21,18,.085);
  --action-neutral-border:rgba(23,21,18,.28);
  --action-danger-bg:rgba(162,59,50,.07);
  --action-danger-bg-hover:rgba(162,59,50,.14);
  --action-danger-border:rgba(162,59,50,.34);
  --accent:#b18a45;
  --accent-soft:#eef4ff;
  --focus:#4f7dbf;
  --success:#247a45;
  --success-bg:#edf8f1;
  --warning:#80600f;
  --warning-bg:#f8fafc;
  --danger:#a23b32;
  --danger-bg:#fff0ee;
  --container:1180px;
  --radius:8px;
  --radius-sm:6px;
  --control-h:44px;
  --header-h:68px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --section-gap:28px;
  --block-gap:16px;
  --field-gap:8px;
  --control-gap:8px;
  --card-pad:16px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --speed:240ms;
  --site-arrow-shape:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h13M13 6.5 18.5 12 13 17.5' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --site-select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23344054' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='rotate(90 12 12)'%3E%3Cpath d='M5 12h13M13 6.5 18.5 12 13 17.5'/%3E%3C/g%3E%3C/svg%3E");
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  background:linear-gradient(180deg,#fbfcfe 0%,var(--bg) 100%);
  color:var(--text);
  font-family:var(--site-font);
  font-size:16px;
  font-weight:400;
  line-height:1.55;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button,input,textarea,select{font:inherit}
button{color:inherit}

::selection{background:var(--accent-soft);color:var(--text)}
:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:2px;
}

h1,h2,h3,h4,p{margin-top:0}
h1,h2,h3,h4{
  color:var(--text);
  font-weight:700;
  line-height:1.08;
  letter-spacing:0;
}
h1{font-size:clamp(32px,4vw,50px)}
h2{font-size:clamp(26px,3vw,38px)}
h3{font-size:21px}
p{color:var(--muted)}

@keyframes ui-enter{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

.container{
  width:min(var(--container),calc(100% - 32px));
  margin-inline:auto;
}

.top-strip{
  min-height:34px;
  display:grid;
  place-items:center;
  padding:var(--field-gap) var(--block-gap);
  background:var(--primary);
  color:#ffffff;
  font-size:13px;
  font-weight:500;
  text-align:center;
}

.site-header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(251,252,254,.92);
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(160%) blur(14px);
}
.header-inner{
  min-height:var(--header-h);
  display:flex;
  align-items:center;
  gap:var(--block-gap);
}
.logo{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  line-height:1;
}
.logo-image{
  width:clamp(128px,12vw,176px);
  height:auto;
  max-height:42px;
  object-fit:contain;
}
.nav{
  display:flex;
  align-items:center;
  gap:var(--space-1);
  margin-left:auto;
}
.nav a,
.nav-catalog-btn{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--control-gap);
  padding:var(--field-gap) var(--block-gap);
  border:1px solid transparent;
  border-radius:var(--radius);
  background:transparent;
  color:var(--text-soft);
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease),color var(--speed) var(--ease);
}
.nav a:hover,
.nav a.active,
.nav-catalog.open .nav-catalog-btn,
.nav-catalog-btn:hover{
  background:#fff;
  border-color:var(--line);
  color:var(--text);
}
.nav-catalog{position:relative;display:inline-flex}
.nav-catalog-menu{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  width:240px;
  max-height:360px;
  overflow:auto;
  display:grid;
  gap:var(--space-1);
  padding:var(--control-gap);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-4px);
  transition:opacity var(--speed) var(--ease),transform var(--speed) var(--ease),visibility var(--speed) var(--ease);
}
.nav-catalog.open .nav-catalog-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.nav-catalog-menu a{
  justify-content:flex-start;
  width:100%;
}
.actions{display:flex;align-items:center;gap:var(--control-gap)}
.icon-btn,
.nav-toggle{
  width:42px;
  height:42px;
  min-width:42px;
  position:relative;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.icon-btn:hover,
.nav-toggle:hover{background:var(--surface-muted);border-color:var(--line)}
.icon-btn:active,
.nav-toggle:active{transform:translateY(1px) scale(.99)}
.icon-btn svg{width:20px;height:20px;flex:0 0 auto}
.cart-count{
  min-width:19px;
  height:19px;
  position:absolute;
  top:-6px;
  right:-6px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border:2px solid #fff;
  border-radius:999px;
  background:var(--primary);
  color:#fff;
  font-size:10px;
  font-weight:700;
  line-height:1;
  text-align:center;
}
.nav-toggle{display:none}
.nav-toggle span,
.nav-toggle span:before,
.nav-toggle span:after{
  width:18px;
  height:2px;
  display:block;
  background:var(--text);
  border-radius:999px;
}
.nav-toggle span{position:relative}
.nav-toggle span:before,
.nav-toggle span:after{
  content:"";
  position:absolute;
  left:0;
}
.nav-toggle span:before{top:-6px}
.nav-toggle span:after{top:6px}

.btn{
  min-height:var(--control-h);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--control-gap);
  padding:var(--field-gap) var(--block-gap);
  border:1px solid var(--action-neutral-border);
  border-radius:var(--radius);
  background:var(--action-neutral-bg);
  color:var(--text);
  font-size:15px;
  font-weight:650;
  line-height:1.2;
  cursor:pointer;
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease),color var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.btn:hover{
  background:var(--action-neutral-bg-hover);
  border-color:var(--primary);
  color:var(--text);
}
.btn:active{transform:translateY(1px) scale(.99)}
.btn.action-cart{
  background:var(--action-gold-bg);
  border-color:var(--action-gold-border);
  color:var(--action-gold);
}
.btn.action-cart:hover{
  background:var(--action-gold-bg-hover);
  border-color:var(--action-gold);
  color:var(--action-gold-hover);
}
.btn.action-buy,
.btn.action-checkout,
.btn.action-confirm,
.btn.action-details{
  background:var(--action-blue-bg);
  border-color:var(--action-blue-border);
  color:var(--action-blue);
}
.btn.action-buy:hover,
.btn.action-checkout:hover,
.btn.action-confirm:hover,
.btn.action-details:hover{
  background:var(--action-blue-bg-hover);
  border-color:var(--action-blue);
  color:var(--action-blue-hover);
}
.btn.action-submit{
  background:var(--action-green-bg);
  border-color:var(--action-green-border);
  color:var(--action-green);
}
.btn.action-submit:hover{
  background:var(--action-green-bg-hover);
  border-color:var(--action-green);
  color:var(--action-green-hover);
}
.btn.danger{
  background:var(--action-danger-bg);
  border-color:var(--action-danger-border);
  color:var(--danger);
}
.btn.danger:hover{
  background:var(--action-danger-bg-hover);
  border-color:var(--danger);
  color:#872d27;
}
.btn.block{width:100%}
.btn.small{min-height:36px;padding:var(--field-gap) var(--control-gap);font-size:14px}
.btn[disabled],
.btn.disabled-link,
.disabled-link{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
}

.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:var(--control-gap);
  margin-block:var(--section-gap);
  color:var(--muted);
  font-size:14px;
}
.breadcrumbs a{color:var(--text-soft)}
.breadcrumbs span:before{content:"/";margin-right:var(--control-gap);color:#a69b8d}

.eyebrow{
  margin:0 0 var(--field-gap);
  color:var(--accent);
  font-size:12px;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.home-hero{
  min-height:calc(100svh - var(--header-h) - 34px);
  position:relative;
  display:grid;
  isolation:isolate;
  overflow:hidden;
  animation:ui-enter .44s var(--ease) both;
}
.home-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(12,11,10,.7) 0%,rgba(12,11,10,.48) 38%,rgba(12,11,10,.12) 68%,rgba(12,11,10,.02) 100%);
}
.home-hero-media{
  position:absolute;
  inset:0;
  z-index:-2;
  display:block;
}
.home-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.home-hero-inner{
  min-height:inherit;
  display:flex;
  align-items:center;
  padding-top:clamp(32px,6vw,72px);
  padding-bottom:clamp(32px,6vw,72px);
}
.home-hero-copy{
  width:min(500px,50%);
}
.home-hero h1{
  margin:0;
  color:#fff;
  font-size:clamp(38px,4.6vw,60px);
  font-weight:700;
  line-height:1;
  letter-spacing:-.045em;
}
.home-hero-copy p{
  max-width:420px;
  margin:var(--block-gap) 0 0;
  color:rgba(255,255,255,.78);
  font-size:16px;
  line-height:1.45;
}
.modern-catalog-link{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-6);
  font-size:14px;
  font-weight:700;
}
.modern-cta-icon{
  width:38px;
  height:38px;
  position:relative;
  flex:0 0 auto;
  display:block;
  border:1px solid currentColor;
  border-radius:10px;
  background:transparent;
  color:var(--text);
}
.home-catalog-section{padding:clamp(42px,7vw,84px) 0}
.home-catalog-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--block-gap);
  margin-bottom:var(--space-8);
}
.home-catalog-head h2{margin:0}
.modern-catalog-link .modern-cta-icon{
  width:38px;
  height:38px;
  border-color:var(--action-neutral-border);
  background:var(--action-neutral-bg);
  color:var(--text);
}
.modern-catalog-link:hover .modern-cta-icon{
  border-color:var(--primary);
  background:var(--action-neutral-bg-hover);
}
.home-category-grid{align-items:start}

.hero-actions,
.panel-actions,
.form-actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--control-gap);
}
.form-actions{margin-top:var(--block-gap)}
.mini-feature,
.apple-benefit{
  min-height:118px;
  padding:var(--card-pad);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}
.mini-feature strong,
.apple-benefit h3{
  display:block;
  margin:0 0 var(--field-gap);
  color:var(--text);
  font-size:18px;
  font-weight:700;
}
.mini-feature span,
.apple-benefit p{margin:0;color:var(--muted);font-size:15px}

.section,
.apple-section{padding:var(--section-gap) 0}
.compact-section{padding-top:var(--block-gap)}
.section-head,
.apple-section-head,
.products-carousel-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--block-gap);
  margin-bottom:var(--block-gap);
}
.section-head h2,
.apple-section-head h2,
.products-carousel-head h2{margin:0}
.section-head p,
.products-carousel-head p{margin:var(--field-gap) 0 0}
.view-all,
.apple-section-head a{color:#7b5c24;font-weight:650}

.category-grid,
.apple-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--block-gap);
}
.category-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  transition:transform var(--speed) var(--ease),border-color var(--speed) var(--ease);
}
.category-card:hover{
  transform:translateY(-2px);
  border-color:var(--line);
}
.category-image{
  aspect-ratio:1/1;
  display:grid;
  place-items:center;
  padding:var(--card-pad);
  background:var(--surface-soft);
  overflow:hidden;
}
.category-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform 320ms var(--ease);
}
.category-card:hover .category-image img{transform:scale(1.025)}
.category-content{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:var(--control-gap);
  padding:var(--card-pad);
}
.category-card h3{
  margin:0;
  color:var(--text);
  font-size:17px;
  line-height:1.25;
}
.category-card-action{
  margin-top:auto;
  display:grid;
  grid-template-columns:1fr 38px;
  gap:var(--control-gap);
}
.category-card-button,
.category-card-arrow{
  min-height:38px;
  display:grid;
  place-items:center;
  border-radius:var(--radius);
}
.category-card-button{
  border:1px solid var(--action-neutral-border);
  background:var(--action-neutral-bg);
  color:var(--text);
  font-size:14px;
  font-weight:700;
  transition:background var(--speed) var(--ease);
}
.category-card-arrow{
  position:relative;
  border:1px solid var(--action-neutral-border);
  background:var(--action-neutral-bg);
  color:var(--text);
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease);
}
.modern-cta-icon:before,
.category-card-arrow:before,
.slider-arrow-icon:before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:18px;
  background:currentColor;
  -webkit-mask:var(--site-arrow-shape) center/contain no-repeat;
  mask:var(--site-arrow-shape) center/contain no-repeat;
  transform:translate(-50%,-50%);
}
.modern-cta-icon:after,
.category-card-arrow:after,
.slider-arrow-icon:after{
  content:none;
}
.home-catalog-section .modern-cta-icon{
  border-radius:50%;
}
.category-card:hover .category-card-button{
  border-color:var(--primary);
  background:var(--action-neutral-bg-hover);
  color:var(--text);
}
.category-card:hover .category-card-arrow{
  border-color:var(--primary);
  background:var(--action-neutral-bg-hover);
}

.page-title,
.category-title-simple{padding:var(--section-gap) 0 var(--block-gap)}
.page-title h1,
.category-title-simple h1{margin:0 0 var(--field-gap)}
.page-title p,
.category-title-simple p{
  max-width:760px;
  margin:0;
  font-size:17px;
}

.store-layout,
.apple-store-layout{
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  gap:var(--section-gap);
  align-items:start;
}
.sidebar,
.apple-sidebar{
  position:sticky;
  top:calc(var(--header-h) + var(--block-gap));
  display:grid;
  gap:var(--space-1);
  padding:var(--card-pad);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.sidebar h3{
  margin:0 0 var(--field-gap);
  color:var(--muted);
  font-size:12px;
  font-weight:750;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sidebar a{
  padding:var(--field-gap) var(--block-gap);
  border-radius:var(--radius-sm);
  color:var(--text-soft);
  font-size:14px;
  font-weight:550;
}
.sidebar a:hover,
.sidebar a.active{background:var(--surface-soft);color:var(--text)}

.toolbar,
.apple-toolbar{
  display:flex;
  align-items:center;
  gap:var(--control-gap);
  margin-bottom:var(--block-gap);
  padding:var(--control-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.searchbox{flex:1;min-width:220px}
.searchbox input,
.toolbar select,
.field input,
.field textarea,
.field select,
.review-form input,
.review-form select,
.review-form textarea{
  width:100%;
  min-height:var(--control-h);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text);
  padding:var(--field-gap) var(--block-gap);
  outline:none;
  transition:border-color var(--speed) var(--ease),background var(--speed) var(--ease);
}
.toolbar select,
.field select,
.review-form select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:38px;
  background-image:var(--site-select-arrow);
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:14px 14px;
}
.toolbar select::-ms-expand,
.field select::-ms-expand,
.review-form select::-ms-expand{display:none}
.site-custom-select{
  position:relative;
  width:100%;
  min-width:0;
}
.toolbar .site-custom-select{flex:0 0 220px}
.site-custom-select-native{
  display:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  pointer-events:none!important;
  background-image:none!important;
}
.site-custom-select-trigger{
  width:100%;
  min-height:var(--control-h);
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--control-gap);
  padding:var(--field-gap) 38px var(--field-gap) var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text);
  font-size:15px;
  font-weight:600;
  line-height:1.2;
  text-align:left;
  cursor:pointer;
  transition:border-color var(--speed) var(--ease),background var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.site-custom-select-trigger:after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  width:16px;
  height:16px;
  background:var(--text-soft);
  -webkit-mask:var(--site-arrow-shape) center/contain no-repeat;
  mask:var(--site-arrow-shape) center/contain no-repeat;
  transform:translateY(-50%) rotate(90deg);
  transition:transform var(--speed) var(--ease);
}
.site-custom-select.is-open .site-custom-select-trigger{border-color:var(--focus)}
.site-custom-select.is-open .site-custom-select-trigger:after{transform:translateY(-50%) rotate(-90deg)}
.site-custom-select-menu{
  position:absolute;
  z-index:150;
  top:calc(100% + 4px);
  left:0;
  right:0;
  max-height:min(280px,52vh);
  overflow:auto;
  display:grid;
  gap:var(--space-1);
  padding:var(--space-1);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-3px);
  transition:opacity var(--speed) var(--ease),transform var(--speed) var(--ease),visibility var(--speed) var(--ease);
}
.site-custom-select.is-open .site-custom-select-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.site-custom-select-option{
  min-height:38px;
  width:100%;
  display:flex;
  align-items:center;
  gap:var(--control-gap);
  padding:var(--field-gap) var(--control-gap);
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text);
  font-size:14px;
  font-weight:600;
  text-align:left;
  cursor:pointer;
}
.site-custom-select-option:hover,
.site-custom-select-option:focus,
.site-custom-select-option.is-selected{
  background:var(--surface-soft);
  outline:none;
}
.site-custom-select-option.is-selected:before{
  content:"";
  width:5px;
  height:9px;
  flex:0 0 auto;
  border-right:2px solid var(--accent);
  border-bottom:2px solid var(--accent);
  transform:rotate(45deg) translateY(-1px);
}
.np-field{
  position:relative;
  min-width:0;
}
.np-suggestions{
  position:absolute;
  z-index:180;
  top:calc(100% + 4px);
  left:0;
  right:0;
  max-height:min(300px,52vh);
  overflow:auto;
  display:grid;
  gap:var(--space-1);
  padding:var(--space-1);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}
.np-suggestions[hidden]{display:none!important}
.np-option{
  width:100%;
  min-height:42px;
  display:grid;
  gap:2px;
  padding:var(--field-gap) var(--control-gap);
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.np-option:hover,
.np-option:focus{
  background:var(--surface-soft);
  outline:none;
}
.np-option strong{
  font-size:14px;
  font-weight:700;
  line-height:1.25;
}
.np-option span,
.np-empty{
  color:var(--text-soft);
  font-size:13px;
  font-weight:600;
  line-height:1.25;
}
.np-empty{padding:var(--field-gap) var(--control-gap)}
.field textarea,
.review-form textarea{min-height:96px;resize:vertical}
.searchbox input:focus,
.toolbar select:focus,
.field input:focus,
.field textarea:focus,
.field select:focus,
.review-form input:focus,
.review-form select:focus,
.review-form textarea:focus{
  border-color:var(--focus);
}
.chips{display:flex;flex-wrap:wrap;gap:var(--control-gap);margin-bottom:var(--block-gap)}
.chip{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  padding:var(--field-gap) var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text-soft);
  font-size:14px;
  font-weight:600;
}
.chip:hover,
.chip.active{
  background:var(--action-neutral-bg-hover);
  border-color:var(--action-neutral-border);
  color:var(--text);
}

.product-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--block-gap);
}
.product-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  transition:transform var(--speed) var(--ease),border-color var(--speed) var(--ease);
}
.product-card:hover{
  transform:translateY(-2px);
  border-color:var(--line);
}
.product-card.is-out{opacity:.68}
.product-media{
  position:relative;
  aspect-ratio:1/1;
  display:grid;
  place-items:center;
  padding:var(--card-pad);
  background:var(--surface-soft);
  overflow:hidden;
}
.product-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform 320ms var(--ease);
}
.product-card:hover .product-media img{transform:scale(1.02)}
.badge{
  position:absolute;
  left:var(--block-gap);
  top:var(--block-gap);
  max-width:calc(100% - (var(--block-gap) * 2));
  padding:var(--space-1) var(--control-gap);
  border:1px solid rgba(177,138,69,.28);
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:var(--text);
  font-size:12px;
  font-weight:650;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.product-info{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:var(--control-gap);
  padding:var(--card-pad);
}
.product-type{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.product-title{
  color:var(--text);
  font-size:17px;
  font-weight:700;
  line-height:1.25;
}
.product-title:hover{color:var(--text)}
.product-short{
  min-height:44px;
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}
.price-row,
.detail-price{
  display:flex;
  align-items:baseline;
  gap:var(--control-gap);
}
.price{color:var(--text);font-size:20px;font-weight:750}
.old-price{color:var(--muted);font-size:14px;text-decoration:line-through}
.old-price:empty{display:none}
.product-card-bottom{
  margin-top:auto;
  display:grid;
  gap:var(--control-gap);
  align-content:end;
}
.card-actions{
  display:grid;
  grid-template-columns:1fr 42px;
  gap:var(--control-gap);
}
.quick-add{
  width:42px;
  height:42px;
  border:1px solid var(--action-gold-border);
  border-radius:var(--radius);
  background:var(--action-gold-bg);
  color:var(--action-gold);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  transition:background var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.quick-add:hover{
  border-color:var(--action-gold);
  background:var(--action-gold-bg-hover);
  color:var(--action-gold-hover);
}
.quick-add:active{transform:translateY(1px) scale(.99)}
.quick-add[disabled]{opacity:.45;cursor:not-allowed}

.stock,
.stock-mini,
.cart-stock{
  width:max-content;
  display:inline-flex;
  align-items:center;
  padding:var(--space-1) var(--control-gap);
  border:1px solid #cce6d3;
  border-radius:999px;
  background:var(--success-bg);
  color:var(--success);
  font-size:12px;
  font-weight:700;
}
.stock.low,
.stock-mini.low,
.cart-stock.low{border-color:#ead79a;background:var(--warning-bg);color:var(--warning)}
.stock.out,
.stock.hidden,
.stock-mini.out,
.stock-mini.hidden,
.cart-stock.out,
.cart-stock.hidden{border-color:#edc8c3;background:var(--danger-bg);color:var(--danger)}

.empty{
  padding:var(--section-gap);
  border:1px dashed var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.72);
  color:var(--muted);
  text-align:center;
}
.empty h2{margin-bottom:var(--field-gap)}

.product-page{padding:var(--control-gap) 0 36px}
.product-detail{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--block-gap);
  align-items:start;
}
.gallery,
.product-panel,
.product-tabs,
.cart-side,
.checkout-box,
.content-card,
.contact-box,
.tab-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.gallery{
  position:relative;
  display:grid;
  grid-template-rows:auto auto auto;
  gap:var(--control-gap);
  padding:var(--card-pad);
}
.main-image{
  min-height:0;
  aspect-ratio:1/1;
  height:auto;
  display:grid;
  place-items:center;
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
  overflow:hidden;
}
.main-image img,
.main-image .product-video{
  width:100%;
  height:100%;
  max-height:100%;
}
.main-image img{object-fit:contain}
.main-image .product-video{object-fit:cover}
.product-video{background:#000}
.thumbs{
  display:grid;
  grid-template-columns:repeat(5,minmax(72px,92px));
  justify-content:start;
  gap:var(--control-gap);
  margin-top:0;
}
.thumb{
  aspect-ratio:1/1;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:#fff;
  padding:var(--field-gap);
  cursor:pointer;
}
.thumb.active{border-color:var(--line)}
.thumb img,
.video-thumb video{width:100%;height:100%;object-fit:contain}
.video-thumb{position:relative;display:grid;place-items:center;height:100%}
.play-mark{
  position:absolute;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#fff;
  color:var(--text);
  font-size:12px;
}
.gallery-arrow,
.carousel-arrow{
  width:38px;
  min-width:38px;
  height:38px;
  padding:0;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.76);
  color:var(--text);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.gallery-arrow{
  position:absolute;
  top:50%;
  z-index:4;
  border-color:var(--action-neutral-border);
  backdrop-filter:blur(10px);
  transform:translateY(-50%);
}
.slider-arrow-icon{
  width:18px;
  height:14px;
  position:relative;
  display:block;
  transition:transform var(--speed) var(--ease);
}
.slider-prev .slider-arrow-icon{transform:scaleX(-1)}
.gallery-arrow:hover,
.carousel-arrow:hover{
  border-color:var(--primary);
  background:rgba(255,255,255,.92);
}
.slider-prev:hover .slider-arrow-icon{transform:translateX(-2px) scaleX(-1)}
.slider-next:hover .slider-arrow-icon{transform:translateX(2px)}
.gallery-arrow:active{transform:translateY(calc(-50% + 1px)) scale(.99)}
.carousel-arrow{
  border-color:var(--action-neutral-border);
  background:var(--action-neutral-bg);
}
.carousel-arrow:active{transform:translateY(1px) scale(.99)}
.gallery-prev{left:20px}
.gallery-next{right:20px}
.gallery-dots{
  display:flex;
  justify-content:center;
  gap:var(--field-gap);
  margin:var(--block-gap) 0 0;
}
.gallery-dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#cbd5e1;
  cursor:pointer;
  transition:width var(--speed) var(--ease),background var(--speed) var(--ease);
}
.gallery-dot.active{width:24px;background:var(--primary)}

.product-panel{
  display:flex;
  flex-direction:column;
  gap:var(--control-gap);
  padding:var(--space-6);
}
.product-panel h1{margin:0;font-size:clamp(30px,3vw,42px)}
.product-meta-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:var(--control-gap) var(--block-gap);
}
.sku{color:var(--muted);font-size:14px}
.review-link{
  display:inline-flex;
  margin:0;
  color:var(--text);
  font-size:14px;
  font-weight:650;
}
.product-purchase{
  margin-top:var(--block-gap);
  display:grid;
  gap:var(--control-gap);
  padding:var(--card-pad);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface-soft);
}
.purchase-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--block-gap);
}
.product-purchase .detail-price{margin:0}
.detail-price .price{font-size:30px;white-space:nowrap}
.product-description{margin:var(--field-gap) 0 0;font-size:16px;color:var(--muted)}
.product-variants{margin:var(--block-gap) 0}
.product-variants > label{
  display:block;
  margin-bottom:var(--field-gap);
  color:var(--text-soft);
  font-weight:650;
}
.variant-options{display:flex;flex-wrap:wrap;gap:var(--control-gap)}
.variant-option{
  min-width:112px;
  padding:var(--field-gap) var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  text-align:left;
  cursor:pointer;
  transition:border-color var(--speed) var(--ease),background var(--speed) var(--ease);
}
.variant-option strong{display:block;color:var(--text);font-weight:700}
.variant-option span{display:block;margin-top:var(--space-1);color:var(--muted);font-size:13px}
.variant-option:hover,
.variant-option.active{
  border-color:var(--line);
  background:var(--surface-soft);
}
.qty-box{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--control-gap);
  margin:var(--field-gap) 0;
}
.product-purchase .qty-box{
  display:flex;
  justify-content:space-between;
  margin:0;
}
.product-purchase .qty-control{
  min-width:180px;
  justify-content:space-between;
}
.qty-control,
.qty-mini{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  overflow:hidden;
}
.qty-control button,
.qty-mini button{
  width:42px;
  height:42px;
  border:0;
  background:#fff;
  cursor:pointer;
}
.qty-mini button{width:34px;height:34px}
.qty-control input{
  width:54px;
  height:42px;
  border:0;
  text-align:center;
  outline:0;
}
.qty-mini span{min-width:34px;text-align:center}
.buy-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--control-gap);
  margin:0;
}
.trust-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--control-gap);
  margin-top:0;
}
.trust-item{
  padding:var(--control-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text-soft);
  font-size:13px;
  font-weight:600;
}

.product-tabs{
  min-height:0;
  margin-top:var(--block-gap);
  overflow:hidden;
}
.tab-buttons{
  display:flex;
  overflow:auto;
  border-bottom:1px solid var(--line);
}
.tab-button{
  min-height:46px;
  padding:var(--block-gap);
  border:0;
  border-bottom:2px solid transparent;
  background:transparent;
  color:var(--muted);
  font-weight:650;
  white-space:nowrap;
  cursor:pointer;
}
.tab-button.active{color:var(--text);border-bottom-color:var(--primary)}
.tab-panel{display:none;padding:var(--card-pad)}
.tab-panel.active{display:block}
.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--control-gap)}
.spec,
.included li{
  display:flex;
  justify-content:space-between;
  gap:var(--block-gap);
  padding:var(--field-gap) var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  list-style:none;
}
.spec span:first-child{color:var(--muted)}
.spec span:last-child{text-align:right;font-weight:650}
.included{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--control-gap);
  margin:0;
  padding:0;
}

.product-recommendations{margin:var(--section-gap) auto 36px}
.product-recommendations.container{width:100%}
.carousel-controls{display:flex;gap:var(--control-gap)}
.products-carousel-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(240px,280px);
  gap:var(--block-gap);
  overflow-x:auto;
  padding:var(--space-1) var(--space-1) var(--block-gap);
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
}
.products-carousel-track .product-card{scroll-snap-align:start}

.reviews-section{margin-top:var(--block-gap);padding:0}
.product-tabs .reviews-section{margin:0}
.reviews-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--block-gap);
  margin-bottom:var(--control-gap);
}
.reviews-head h2{margin:0 0 var(--field-gap)}
.reviews-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,420px);
  gap:var(--block-gap);
  align-items:start;
}
.reviews-left,
.reviews-list{display:grid;gap:var(--block-gap)}
.review-card,
.review-empty,
.review-form{
  padding:var(--card-pad);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}
.review-empty{
  display:grid;
  align-items:center;
}
.review-main-row{display:grid;grid-template-columns:42px minmax(0,1fr);gap:var(--block-gap)}
.review-avatar{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:999px;
  overflow:hidden;
}
.customer-avatar{background:var(--accent-soft);color:var(--primary);font-weight:700}
.store-avatar{background:#fff;border:1px solid var(--line)}
.store-avatar img{width:76%;height:76%;object-fit:contain}
.review-top{
  display:flex;
  justify-content:space-between;
  gap:var(--control-gap);
  margin-bottom:var(--field-gap);
}
.review-top strong{font-weight:700}
.review-top span{color:#b18a45}
.review-card p{margin:0;color:var(--text-soft)}
.review-photos,
.review-replies{display:flex;flex-wrap:wrap;gap:var(--control-gap);margin-top:var(--block-gap)}
.review-photo{
  width:72px;
  height:72px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--surface-soft);
}
.review-photo img{width:100%;height:100%;object-fit:cover}
.store-reply{
  width:100%;
  display:grid;
  grid-template-columns:38px 1fr;
  gap:var(--control-gap);
  padding:var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface-soft);
}
.store-reply .review-avatar{width:38px;height:38px}
.store-reply-top{display:flex;gap:var(--control-gap);flex-wrap:wrap;margin-bottom:var(--space-1)}
.store-reply-top span{color:var(--text-soft);font-size:12px;font-weight:650}
.review-form{display:grid;gap:var(--block-gap)}
.review-form h3{margin-bottom:0}
.review-form label{display:grid;gap:var(--field-gap);color:var(--text-soft);font-size:14px;font-weight:650}
.form-hint{color:var(--muted);font-size:12px;font-weight:400}
.site-file-picker{
  position:relative;
  min-height:var(--control-h);
  display:grid!important;
  grid-template-columns:max-content minmax(0,1fr);
  align-items:center;
  gap:var(--control-gap)!important;
  padding:var(--field-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface-soft);
  cursor:pointer;
}
.site-file-text{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:var(--field-gap) var(--block-gap);
  border:1px solid var(--action-neutral-border);
  border-radius:var(--radius-sm);
  background:var(--action-neutral-bg);
  color:var(--text);
  font-weight:700;
  line-height:1.2;
  transition:background var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.site-file-picker:hover .site-file-text{
  border-color:var(--primary);
  background:var(--action-neutral-bg-hover);
}
.site-file-picker:active .site-file-text{transform:translateY(1px) scale(.99)}
.site-file-meta{
  min-width:0;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.site-file-input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.review-photo-preview{display:flex;flex-wrap:wrap;gap:var(--control-gap)}
.review-photo-preview span{
  padding:var(--space-1) var(--control-gap);
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--muted);
  font-size:12px;
}
.review-message{min-height:18px;color:var(--muted);font-size:14px}

.cart-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,370px);
  gap:var(--space-6);
  align-items:start;
  padding-bottom:calc(var(--section-gap) + var(--block-gap));
}
.checkout-layout{
  grid-template-columns:minmax(420px,.86fr) minmax(420px,1.14fr);
  align-items:start;
}
.cart-list{display:grid;gap:var(--control-gap)}
.cart-section{padding-top:0}
[data-postal-field][hidden]{display:none!important}
.cart-products-card{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.cart-products-head{
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--block-gap);
  padding:var(--space-5) var(--space-6);
  border-bottom:1px solid var(--line);
}
.cart-products-head span,
.cart-summary-card > header span{
  display:block;
  margin-bottom:var(--space-1);
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.cart-products-head h2{
  display:flex;
  align-items:center;
  gap:var(--control-gap);
  margin:0;
  font-size:24px;
}
.cart-products-head h2 b{
  min-width:28px;
  height:28px;
  display:inline-grid;
  place-items:center;
  padding:0 var(--field-gap);
  border-radius:999px;
  background:var(--surface-muted);
  color:var(--text-soft);
  font-size:13px;
}
.cart-products-card .cart-list{gap:0}
.cart-item{
  display:grid;
  grid-template-columns:88px minmax(0,1fr) minmax(110px,auto);
  gap:var(--block-gap);
  align-items:center;
  padding:var(--block-gap);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.cart-products-card .cart-item{
  grid-template-columns:108px minmax(0,1fr) minmax(128px,auto);
  padding:var(--space-5) var(--space-6);
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
}
.cart-products-card .cart-item:last-child{border-bottom:0}
.cart-item-media{
  display:block;
  width:88px;
  height:88px;
}
.cart-item img{
  width:88px;
  height:88px;
  object-fit:contain;
  border-radius:var(--radius-sm);
  background:var(--surface-soft);
}
.cart-products-card .cart-item-media,
.cart-products-card .cart-item img{
  width:108px;
  height:108px;
}
.cart-item-body{
  min-width:0;
  display:grid;
  align-content:center;
  gap:var(--space-1);
}
.cart-item h3{
  margin:0;
  font-size:16px;
  line-height:1.22;
}
.cart-item h3 a{
  display:-webkit-box;
  overflow:hidden;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.cart-item p,
.cart-item-meta{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}
.cart-variant{display:block;color:var(--muted);font-size:13px;line-height:1.35}
.cart-item-foot{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:var(--control-gap);
  margin-top:var(--field-gap);
}
.cart-item-qty{color:var(--text-soft);font-size:13px;font-weight:650}
.cart-line-total{
  display:grid;
  align-content:center;
  justify-items:end;
  gap:var(--field-gap);
  text-align:right;
}
.cart-line-total strong{
  font-size:17px;
  line-height:1.15;
}
.cart-line-total small{color:var(--muted);font-size:12px}
.cart-side{
  padding:var(--card-pad);
  height:max-content;
  position:sticky;
  top:calc(var(--header-h) + var(--block-gap));
}
.cart-summary-card{padding:var(--space-6)}
.cart-summary-card > header{
  margin-bottom:var(--space-5);
  padding-bottom:var(--space-5);
  border-bottom:1px solid var(--line);
}
.cart-summary-card > header strong{
  display:block;
  font-size:30px;
  line-height:1.15;
}
.cart-summary-card .summary-row b{
  color:var(--text-soft);
  font-size:14px;
  font-weight:650;
  text-align:right;
}
.cart-summary-card .btn{margin-top:var(--space-5)}
.cart-summary-note{
  margin:var(--control-gap) 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  text-align:center;
}
.checkout-summary{
  padding:var(--block-gap);
}
.checkout-summary h2{
  margin-bottom:var(--block-gap);
  font-size:clamp(26px,2.6vw,38px);
  line-height:1.08;
}
.checkout-summary .cart-list{gap:var(--control-gap)}
.checkout-summary .cart-item{
  grid-template-columns:88px minmax(0,1fr) minmax(94px,auto);
  padding:var(--control-gap);
}
.checkout-summary .cart-item-media,
.checkout-summary .cart-item img{
  width:88px;
  height:88px;
}
.summary-row{
  display:flex;
  justify-content:space-between;
  gap:var(--block-gap);
  margin:var(--block-gap) 0;
  color:var(--muted);
}
.summary-row.total{
  margin-top:var(--block-gap);
  padding-top:var(--block-gap);
  border-top:1px solid var(--line);
  color:var(--text);
  font-size:18px;
  font-weight:750;
}
.cart-clear-btn{
  border:0;
  background:transparent;
  color:var(--muted);
  padding:var(--field-gap);
  font-size:13px;
  font-weight:650;
  cursor:pointer;
}
.cart-clear-btn:hover{color:var(--danger)}
.remove-btn{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--field-gap);
  border:1px solid var(--action-danger-border);
  border-radius:var(--radius-sm);
  background:var(--action-danger-bg);
  color:var(--danger);
  padding:6px 10px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  transition:background var(--speed) var(--ease),border-color var(--speed) var(--ease),color var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.remove-btn:before{
  content:"";
  width:14px;
  height:14px;
  flex:0 0 auto;
  background:currentColor;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v5M14 11v5'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v5M14 11v5'/%3E%3C/svg%3E") center/contain no-repeat;
}
.remove-btn:hover{
  border-color:var(--danger);
  background:var(--action-danger-bg-hover);
  color:#8f2f27;
}
.remove-btn:active{transform:translateY(1px)}
.cart-empty{padding:clamp(48px,8vw,96px) var(--block-gap)}
.cart-empty .btn{margin-top:var(--block-gap)}
.stock-error-message{
  margin-bottom:var(--block-gap);
  padding:var(--block-gap);
  border:1px solid #edc8c3;
  border-radius:var(--radius);
  background:var(--danger-bg);
  color:var(--danger);
  font-weight:650;
}

.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--block-gap)}
.field{display:grid;gap:var(--field-gap)}
.field.full{grid-column:1/-1}
.field label{font-weight:650;color:var(--text-soft);font-size:14px}
.checkout-box{padding:var(--card-pad)}
.checkout-form{
  padding:var(--block-gap);
}
.checkout-form h2{
  margin-bottom:var(--block-gap);
  font-size:clamp(28px,3vw,42px);
  line-height:1.08;
}
.checkout-form .form-grid{
  gap:var(--control-gap);
}
.checkout-form .field textarea{
  min-height:84px;
}

.content-page{padding:var(--section-gap) 0 48px}
.content-card{
  max-width:920px;
  padding:var(--card-pad);
}
.content-card h1{margin-bottom:var(--block-gap)}
.content-card h2{margin:var(--section-gap) 0 var(--field-gap)}
.content-card p,
.content-card li{color:var(--muted)}
.contact-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--block-gap);
}
.contact-box{padding:var(--card-pad)}
.contact-box strong{display:block;margin-bottom:var(--field-gap)}
.instagram-link{display:inline-flex;align-items:center;gap:var(--control-gap);color:var(--text);font-weight:650}
.instagram-link svg{width:22px;height:22px;color:var(--accent)}

.thank-card,
.thank-info,
.thank-items,
.thank-empty,
.thank-items-text{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.thank-card{
  max-width:980px;
  margin:0 auto;
  padding:var(--card-pad);
}
.thank-info{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--field-gap) var(--section-gap);
  margin:var(--block-gap) 0;
  padding:var(--card-pad);
}
.thank-info p{margin:0}
.thank-items{
  overflow:hidden;
  margin:var(--block-gap) 0;
}
.thank-empty,
.thank-items-text{
  display:block;
  margin:var(--block-gap) 0;
  padding:var(--card-pad);
  white-space:pre-wrap;
  color:var(--text-soft);
}
.thank-item{
  display:grid;
  grid-template-columns:1fr 90px 130px;
  gap:var(--block-gap);
  align-items:center;
  padding:var(--block-gap) var(--card-pad);
  border-bottom:1px solid var(--line);
}
.thank-item:last-child{border-bottom:0}
.thank-item strong{display:block;color:var(--text)}
.thank-item span{display:block;margin-top:var(--space-1);color:var(--muted);font-size:14px}
.thank-item > div:nth-child(2),
.thank-item > div:nth-child(3){text-align:right;color:var(--text-soft);font-weight:600}

.footer{
  margin-top:var(--section-gap);
  padding:var(--section-gap) 0 var(--block-gap);
  background:var(--primary);
  color:#fff;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.15fr repeat(3,minmax(0,1fr));
  gap:var(--section-gap);
}
.footer .logo-image{width:150px;filter:brightness(0) invert(1)}
.footer p,
.footer a{color:#d9e2ef}
.footer a:hover{color:#fff}
.footer h4{margin:0 0 var(--field-gap);color:#fff;font-size:15px}
.footer-links{display:grid;gap:var(--control-gap)}
.copyright{
  display:flex;
  justify-content:space-between;
  gap:var(--block-gap);
  flex-wrap:wrap;
  margin-top:var(--section-gap);
  padding-top:var(--block-gap);
  border-top:1px solid rgba(255,255,255,.12);
  color:#cbd5e1;
  font-size:13px;
}

.toast{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:120;
  max-width:min(360px,calc(100vw - 36px));
  padding:var(--block-gap);
  border-radius:var(--radius);
  background:var(--primary);
  color:#fff;
  opacity:0;
  transform:translateY(10px);
  pointer-events:none;
  transition:opacity var(--speed) var(--ease),transform var(--speed) var(--ease);
}
.toast.show{opacity:1;transform:translateY(0)}

@media (max-width:1020px){
  .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .product-detail,
  .cart-layout,
  .reviews-layout,
  .store-layout,
  .apple-store-layout{grid-template-columns:1fr}
  .sidebar,
  .cart-side{position:static}
  .checkout-summary{order:1}
  .checkout-form{order:2}
  .trust-list{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:760px){
  :root{
    --header-h:64px;
    --control-h:42px;
    --section-gap:20px;
    --block-gap:12px;
    --field-gap:7px;
    --control-gap:8px;
    --card-pad:12px;
  }
  body{font-size:15px}
  .container{width:min(var(--container),calc(100% - 24px))}
  .top-strip{font-size:12px;padding:var(--field-gap) var(--block-gap)}
  .header-inner{
    min-height:var(--header-h);
    gap:var(--control-gap);
  }
  .site-header .logo-image{width:128px;max-height:34px}
  .nav-toggle{display:inline-flex;order:3}
  .actions{margin-left:auto;order:2}
  .nav{
    position:absolute;
    left:12px;
    right:12px;
    top:calc(100% + 8px);
    display:grid;
    gap:var(--field-gap);
    margin:0;
    padding:var(--control-gap);
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-6px);
    transition:opacity var(--speed) var(--ease),transform var(--speed) var(--ease),visibility var(--speed) var(--ease);
  }
  .nav.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  .nav a,
  .nav-catalog,
  .nav-catalog-btn{width:100%;justify-content:flex-start}
  .nav-catalog{display:grid}
  .nav-catalog-menu{
    position:static;
    width:100%;
    max-height:none;
    display:none;
    margin-top:var(--space-1);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .nav-catalog.open .nav-catalog-menu{display:grid}
  .home-hero{min-height:calc(100svh - var(--header-h) - 32px)}
  .home-hero:after{
    background:linear-gradient(0deg,rgba(12,11,10,.76) 0%,rgba(12,11,10,.42) 42%,rgba(12,11,10,.08) 76%);
  }
  .home-hero-media img{object-position:center top}
  .home-hero-inner{
    align-items:flex-end;
    padding-top:var(--space-8);
    padding-bottom:var(--space-8);
  }
  .home-hero-copy{width:100%}
  .home-hero h1{max-width:360px;font-size:clamp(38px,11vw,52px)}
  .home-hero-copy p{max-width:320px;font-size:15px}
  .home-catalog-section{padding:36px 0}
  .home-catalog-head{
    align-items:flex-start;
    margin-bottom:var(--space-6);
  }
  .form-grid,
  .contact-grid,
  .specs,
  .included{grid-template-columns:1fr}
  .category-grid,
  .apple-category-grid,
  .product-grid,
  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--control-gap);
  }
  .section,
  .apple-section{padding:var(--section-gap) 0}
  .section-head,
  .apple-section-head,
  .products-carousel-head,
  .reviews-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .toolbar,
  .apple-toolbar{align-items:stretch;flex-direction:column}
  .toolbar .site-custom-select{flex:1 1 auto;width:100%}
  .searchbox{min-width:0}
  .page-title,
  .category-title-simple{padding:var(--section-gap) 0 var(--block-gap)}
  .category-image{padding:var(--card-pad)}
  .category-content{gap:var(--control-gap);padding:var(--card-pad)}
  .category-card h3{font-size:16px;line-height:1.2}
  .category-card-action{grid-template-columns:1fr 38px}
  .category-card-button,
  .category-card-arrow{min-height:38px}
  .category-card-button{font-size:12px}
  .product-media{padding:var(--card-pad)}
  .product-info{gap:var(--field-gap);padding:var(--card-pad)}
  .product-type{font-size:10px}
  .product-title{font-size:15px;line-height:1.22}
  .product-short{
    min-height:38px;
    font-size:12px;
    line-height:1.35;
  }
  .price{font-size:17px}
  .old-price{font-size:12px}
  .stock,
  .stock-mini,
  .cart-stock{font-size:11px;padding:var(--space-1) var(--field-gap)}
  .card-actions{grid-template-columns:1fr 38px;gap:var(--field-gap)}
  .product-card .btn.small{min-height:38px;padding:var(--field-gap);font-size:12px}
  .quick-add{width:38px;height:38px;font-size:20px}
  .gallery{grid-template-rows:auto auto auto}
  .main-image{min-height:0;height:auto}
  .thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .gallery-prev{left:16px}
  .gallery-next{right:16px}
  .product-panel{padding:var(--card-pad)}
  .purchase-head{align-items:flex-start;flex-direction:column}
  .product-purchase .qty-box{align-items:flex-start;flex-direction:column}
  .product-purchase .qty-control{width:100%;min-width:0}
  .detail-price .price{font-size:26px}
  .buy-actions{grid-template-columns:1fr}
  .cart-item{
    grid-template-columns:64px minmax(0,1fr) auto;
    align-items:center;
    gap:var(--field-gap);
    padding:var(--field-gap);
  }
  .cart-item-media,
  .cart-item img{
    width:64px;
    height:64px;
  }
  .cart-item h3{font-size:14px}
  .cart-item p,
  .cart-item-meta,
  .cart-variant{font-size:12px}
  .cart-item-foot{
    margin-top:0;
  }
  .cart-line-total{justify-items:end}
  .cart-line-total strong{font-size:14px}
  .remove-btn{padding:7px 10px;font-size:12px}
  .cart-products-head{
    min-height:76px;
    padding:var(--block-gap);
  }
  .cart-products-head h2{font-size:20px}
  .cart-products-card .cart-item{
    grid-template-columns:76px minmax(0,1fr);
    gap:var(--control-gap) var(--block-gap);
    align-items:start;
    padding:var(--block-gap);
  }
  .cart-products-card .cart-item-media,
  .cart-products-card .cart-item img{
    width:76px;
    height:76px;
  }
  .cart-products-card .cart-item-media{grid-row:1/3}
  .cart-products-card .cart-line-total{
    width:100%;
    grid-column:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--control-gap);
    text-align:left;
  }
  .cart-products-card .cart-line-total small{display:none}
  .cart-products-card .remove-btn{min-height:32px;padding:5px 9px}
  .cart-summary-card{padding:var(--block-gap)}
  .cart-summary-card > header strong{font-size:26px}
  .checkout-summary,
  .checkout-form{padding:var(--card-pad)}
  .checkout-summary .cart-item{
    grid-template-columns:64px minmax(0,1fr) auto;
  }
  .checkout-summary .cart-item-media,
  .checkout-summary .cart-item img{
    width:64px;
    height:64px;
  }
  .thank-info{grid-template-columns:1fr}
  .thank-item{grid-template-columns:1fr;gap:var(--field-gap)}
  .thank-item > div:nth-child(2),
  .thank-item > div:nth-child(3){text-align:left}
  .footer{margin-top:var(--section-gap)}
  .footer-grid{gap:var(--block-gap)}
  .footer .logo-image{width:128px}
  .footer p,
  .footer a{font-size:13px;line-height:1.45}
  .footer h4{font-size:14px}
  .copyright{display:grid}
  .site-file-picker{grid-template-columns:1fr}
  .site-file-text{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}