:root{
  --bg: oklch(97.5% .012 92);
  --surface: oklch(99% .008 92);
  --surface2: oklch(94.5% .018 92);
  --ink: oklch(20% .025 73);
  --muted: oklch(51% .025 73);
  --line: oklch(88% .025 82);
  --green: oklch(52% .16 159);
  --green2: oklch(42% .12 159);
  --gold: oklch(76% .14 78);
  --red: oklch(58% .16 24);
  --blue: oklch(55% .12 245);
  --ease: cubic-bezier(.16,1,.3,1);
  --radius: 16px;
  --font: Vazirmatn, system-ui, sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased; font-size: calc(16px * var(--fz-base, 1))}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1280px;margin:0 auto;padding:0 20px;min-width:0}
main{max-width:1200px;margin:0 auto;padding:36px 24px 72px}
h1{font-size: calc(clamp(28px,5vw,40px) * var(--fz-h1, 1));font-weight:900;margin:0 0 8px;letter-spacing:-.03em;text-wrap:balance}
h2{font-size: calc(20px * var(--fz-h2, 1));font-weight:900;margin:0 0 20px;letter-spacing:-.02em}
h3{font-size: calc(15px * var(--fz-h3, 1));font-weight:800;margin:0 0 10px}
.subtitle{font-size: calc(14px * var(--fz-small, 1));color:var(--muted);margin:0 0 40px}
section{margin-bottom:56px}
.muted{color:var(--muted)}
.center{text-align:center}
.tnum{font-variant-numeric:tabular-nums}

.topline{background:var(--ink);color:var(--bg);font-size: calc(11px * var(--fz-nav, 1))}
.topline .wrap{display:flex;align-items:center;gap:16px;height:36px}
.topline a{opacity:.8}
.topline a:hover{opacity:1}
.topline .sep{margin-right:auto}
header.site{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
header.site .wrap{display:flex;align-items:center;gap:18px;height:74px}
.brand{display:flex;align-items:center;gap:11px;font-weight:900;font-size: calc(19px * var(--fz-base, 1));letter-spacing:-.02em}
.brand .mark{width:36px;height:36px;background:var(--green);color:var(--surface);display:grid;place-items:center;border-radius:11px;transform:rotate(-7deg);font-size: calc(18px * var(--fz-base, 1))}
.searchbar{flex:1;max-width:440px;display:flex;align-items:center;gap:8px;background:var(--surface2);border:1px solid transparent;border-radius:12px;padding:0 12px;height:44px}
.searchbar:focus-within{border-color:var(--green)}
.searchbar input{flex:1;border:0;background:none;outline:0;font:inherit;font-size: calc(13px * var(--fz-form, 1));color:var(--ink)}
.searchbar button{border:0;background:none;cursor:pointer;color:var(--muted);font-size: calc(14px * var(--fz-btn, 1))}
.header-actions{display:flex;align-items:center;gap:9px;margin-right:auto}
.iconbtn{position:relative;height:44px;min-width:44px;padding:0 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--muted);display:inline-flex;align-items:center;gap:7px;font:800 12px var(--font);cursor:pointer;transition:.18s; font-size: calc(12px * var(--fz-icon, 1))}
.iconbtn:hover{border-color:var(--green);color:var(--green)}
.iconbtn.solid{background:var(--green);border-color:var(--green);color:#fff}
.iconbtn .count{position:absolute;top:-7px;left:-7px;min-width:20px;height:20px;border-radius:20px;background:var(--red);color:#fff;font-size: calc(10px * var(--fz-base, 1));display:grid;place-items:center;border:2px solid var(--surface)}
nav.cats{background:var(--surface);border-bottom:1px solid var(--line)}
nav.cats .wrap{display:flex;gap:6px;overflow-x:auto;height:50px;align-items:center;scrollbar-width:none}
nav.cats .wrap::-webkit-scrollbar{display:none}
nav.cats a{font-size: calc(12px * var(--fz-nav, 1));font-weight:700;color:var(--muted);padding:7px 12px;border-radius:9px;white-space:nowrap}
nav.cats a:hover,nav.cats a.on{background:var(--surface2);color:var(--green)}

.hero{background:linear-gradient(135deg,var(--ink),color-mix(in oklch,var(--ink),var(--green) 38%));color:var(--surface);border-radius:24px;padding:clamp(28px,5vw,56px);margin-bottom:44px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;left:-90px;bottom:-140px;width:340px;height:340px;border-radius:50%;background:color-mix(in oklch,var(--gold),transparent 78%)}
.hero .badge{display:inline-block;font-size: calc(11px * var(--fz-badge, 1));font-weight:800;background:color-mix(in oklch,var(--gold),transparent 22%);color:var(--ink);padding:6px 12px;border-radius:30px;margin-bottom:16px}
.hero h1{color:#fff;max-width:18ch}
.hero p{font-size: calc(14px * var(--fz-base, 1));opacity:.82;max-width:52ch;margin:0 0 26px}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
.hero-stats{display:flex;gap:32px;margin-top:34px;flex-wrap:wrap;position:relative;z-index:1}
.hero-stats b{display:block;font-size: calc(22px * var(--fz-base, 1));font-weight:900}
.hero-stats span{font-size: calc(11px * var(--fz-base, 1));opacity:.75}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:var(--surface);border:0;border-radius:11px;padding:12px 22px;font:800 12px var(--font);cursor:pointer;transition:background .2s,transform .2s; font-size: calc(12px * var(--fz-btn, 1))}
.btn:hover{background:var(--green2);transform:translateY(-1px)}
.btn.outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.outline:hover{background:var(--surface2);color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.btn.dark{background:var(--ink);color:var(--bg)}
.btn.dark:hover{opacity:.88;background:var(--ink)}
.btn.light{background:#fff;color:var(--ink)}
.btn.danger{background:var(--red)}
.btn.sm{padding:9px 14px;font-size: calc(11px * var(--fz-btn, 1));border-radius:9px}
.btn.full{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

.form-group{display:grid;gap:6px;margin-bottom:16px}
label{font-size: calc(11px * var(--fz-form, 1));font-weight:800;color:var(--muted)}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=date],textarea,select{
  background:var(--surface2);border:1px solid var(--line);border-radius:11px;padding:12px 14px;font:inherit;font-size: calc(14px * var(--fz-form, 1));color:var(--ink);outline:0;transition:border-color .18s,box-shadow .18s;width:100%}
input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in oklch,var(--green),transparent 86%)}
textarea{min-height:120px;resize:vertical}
input[type=checkbox],input[type=radio]{-webkit-appearance:none;appearance:none;width:19px;height:19px;border:1.5px solid var(--line);background:var(--surface);border-radius:6px;cursor:pointer;vertical-align:-4px;margin:0}
input[type=radio]{border-radius:50%}
input[type=checkbox]:checked,input[type=radio]:checked{background:var(--green);border-color:var(--green)}
.checkline{display:flex;gap:9px;align-items:center;font-size: calc(13px * var(--fz-base, 1));font-weight:600;color:var(--ink)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.box{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:28px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.sec-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px;gap:16px}
.sec-head h2{margin:0}
.sec-head span{font-size: calc(12px * var(--fz-h2, 1));color:var(--muted)}

.product{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.product:hover{transform:translateY(-5px);box-shadow:0 18px 48px color-mix(in oklch,var(--ink),transparent 91%)}
.product-visual{height:160px;background:linear-gradient(135deg,var(--blue),var(--green));display:flex;align-items:center;justify-content:center;color:var(--surface);font-size: calc(48px * var(--fz-card, 1));font-weight:900;position:relative;overflow:hidden}
.product-visual img{width:100%;height:100%;object-fit:cover}
.product-visual .off{position:absolute;top:10px;right:10px;background:var(--red);color:#fff;font-size: calc(10px * var(--fz-badge, 1));font-weight:800;padding:4px 9px;border-radius:30px}
.product-info{padding:14px;display:flex;flex-direction:column;flex:1}
.product-cat{font-size: calc(10px * var(--fz-card, 1));color:var(--muted);margin-bottom:4px}
.product-title{font-size: calc(13px * var(--fz-card, 1));font-weight:800;margin:0 0 8px;line-height:1.5}
.product-price{font-size: calc(14px * var(--fz-price, 1));font-weight:900;display:flex;align-items:center;gap:8px;margin-top:auto}
.product-price del{font-size: calc(11px * var(--fz-price, 1));color:var(--muted);font-weight:500}
.rating{font-size: calc(10px * var(--fz-base, 1));color:var(--gold);font-weight:800}
.stockline{font-size: calc(10px * var(--fz-card, 1));color:var(--muted);margin:6px 0 10px}
.stockline.low{color:var(--red);font-weight:800}

.status{display:inline-flex;align-items:center;gap:6px;font-size: calc(10px * var(--fz-base, 1));font-weight:800;border-radius:99px;padding:5px 11px;background:var(--surface2);color:var(--muted)}
.status:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.status.warn{color:var(--gold)}
.status.info{color:var(--blue)}
.status.success{color:var(--green)}
.status.danger{color:var(--red)}

.cart-item{display:grid;grid-template-columns:80px minmax(0,1fr) auto auto;gap:16px;padding:16px;border-bottom:1px solid var(--line);align-items:center}
.cart-item:last-child{border-bottom:none}
.cart-thumb{width:80px;height:80px;background:linear-gradient(135deg,var(--gold),var(--green));border-radius:12px;display:grid;place-items:center;font-size: calc(32px * var(--fz-icon, 1));overflow:hidden}
.cart-thumb img{width:100%;height:100%;object-fit:cover}
.cart-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
.cart-meta h4{font-size: calc(13px * var(--fz-h3, 1));font-weight:800;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-meta p{font-size: calc(11px * var(--fz-base, 1));color:var(--muted);margin:0}
.cart-price{font-size: calc(14px * var(--fz-price, 1));font-weight:900;white-space:nowrap}
.qtybox{display:flex;align-items:center;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.qtybox input{width:48px;text-align:center;border:0;border-radius:0;background:var(--surface);font-weight:800;font-size: calc(13px * var(--fz-form, 1));padding:8px 0}
.qtybox button{width:32px;height:36px;border:0;background:var(--surface2);color:var(--ink);font-size: calc(15px * var(--fz-form, 1));font-weight:800;cursor:pointer}
.summary{position:sticky;top:96px}
.sumrow{display:flex;justify-content:space-between;font-size: calc(12px * var(--fz-table, 1));padding:9px 0;color:var(--muted)}
.sumrow b{color:var(--ink)}
.sumrow.total{border-top:1px dashed var(--line);margin-top:8px;padding-top:14px;font-size: calc(15px * var(--fz-table, 1));font-weight:900;color:var(--ink)}
.sumrow.off b{color:var(--green)}

.wallet-hero{background:linear-gradient(135deg,var(--ink),color-mix(in oklch,var(--ink),var(--green) 32%));color:var(--surface);border-radius:var(--radius);padding:24px;margin-bottom:24px}
.wallet-label{font-size: calc(11px * var(--fz-form, 1));opacity:.75;display:block;margin-bottom:8px}
.wallet-balance{font-size: calc(clamp(24px,5vw,36px) * var(--fz-base, 1));font-weight:900;letter-spacing:-.04em;margin-bottom:8px}
.wallet-note{font-size: calc(11px * var(--fz-base, 1));opacity:.7;line-height:1.6;margin:0}

.stepper{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:24px}
.stepper-track{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;position:relative;margin-top:20px}
.stepper-track:before{content:'';position:absolute;top:18px;right:8%;left:8%;height:3px;background:var(--surface2);z-index:0}
.step{text-align:center;position:relative;z-index:1;flex:1}
.step-num{width:36px;height:36px;border-radius:50%;background:var(--surface2);border:2px solid var(--line);color:var(--muted);display:flex;align-items:center;justify-content:center;margin:0 auto 8px;font-size: calc(12px * var(--fz-badge, 1));font-weight:900;transition:all .3s var(--ease)}
.step.done .step-num{background:var(--green);border-color:var(--green);color:var(--surface)}
.step.current .step-num{border-color:var(--green);color:var(--green);box-shadow:0 0 0 5px color-mix(in oklch,var(--green),transparent 86%)}
.step-label{font-size: calc(11px * var(--fz-form, 1));font-weight:800;color:var(--muted)}

table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size: calc(12px * var(--fz-table, 1))}
th{background:var(--surface2);padding:13px 14px;text-align:right;font-weight:800;color:var(--muted);border:none;white-space:nowrap}
td{padding:14px;border-top:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:none}
.table-scroll{overflow-x:auto;border-radius:var(--radius)}

.alert{background:var(--surface);border:1px solid var(--line);border-right:3px solid var(--green);border-radius:12px;padding:14px 18px;font-size: calc(12px * var(--fz-base, 1));margin-bottom:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.alert.error{border-right-color:var(--red)}
.alert.warning{border-right-color:var(--gold)}
.flashwrap{position:fixed;bottom:20px;left:20px;z-index:60;max-width:340px;display:grid;gap:8px}
.flashwrap .alert{box-shadow:0 14px 40px color-mix(in oklch,var(--ink),transparent 86%);margin:0;animation:pop .3s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.feature{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;gap:12px;align-items:center}
.feature .ic{width:40px;height:40px;border-radius:12px;background:var(--surface2);display:grid;place-items:center;font-size: calc(19px * var(--fz-icon, 1));flex:none}
.feature b{display:block;font-size: calc(12px * var(--fz-base, 1))}
.feature span{font-size: calc(10px * var(--fz-base, 1));color:var(--muted)}
.catchips{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.catchip{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;text-align:center;transition:.2s var(--ease)}
.catchip:hover{border-color:var(--green);transform:translateY(-3px)}
.catchip b{display:block;font-size: calc(13px * var(--fz-base, 1));font-weight:800}
.catchip span{font-size: calc(10px * var(--fz-base, 1));color:var(--muted)}

.pdp{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:start}
.pdp-visual{height:420px;border-radius:20px;background:linear-gradient(135deg,var(--blue),var(--green));display:grid;place-items:center;font-size: calc(120px * var(--fz-icon, 1));overflow:hidden}
.pdp-visual img{width:100%;height:100%;object-fit:cover}
.crumbs{font-size: calc(11px * var(--fz-nav, 1));color:var(--muted);margin-bottom:16px}
.crumbs a:hover{color:var(--green)}
.pricebox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin:20px 0}
.bigprice{font-size: calc(26px * var(--fz-price, 1));font-weight:900;letter-spacing:-.03em}
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:32px 0 20px}
.tabs button{border:0;background:none;padding:11px 16px;font:800 12px var(--font);color:var(--muted);cursor:pointer;border-bottom:2px solid transparent; font-size: calc(12px * var(--fz-btn, 1))}
.tabs button.on{color:var(--green);border-bottom-color:var(--green)}
.tabpane{display:none}
.tabpane.on{display:block}
.prose{font-size: calc(14px * var(--fz-prose, 1));line-height:1.9}
.prose ul{padding-right:20px}
.review{border-bottom:1px solid var(--line);padding:14px 0}
.review:last-child{border:0}
.review b{font-size: calc(12px * var(--fz-base, 1))}
.review p{font-size: calc(13px * var(--fz-base, 1));margin:6px 0 0;color:var(--muted)}

.layout-side{display:grid;grid-template-columns:250px 1fr;gap:26px;align-items:start}
.sidebox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;position:sticky;top:96px}
.sidebox h3{font-size: calc(12px * var(--fz-nav, 1));margin-bottom:12px}
.sidebox a{display:block;font-size: calc(12px * var(--fz-nav, 1));color:var(--muted);padding:7px 9px;border-radius:8px}
.sidebox a:hover,.sidebox a.on{background:var(--surface2);color:var(--green);font-weight:800}
.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.toolbar select{width:auto;padding:9px 12px;font-size: calc(12px * var(--fz-form, 1))}
.pager{display:flex;gap:6px;justify-content:center;margin-top:32px;flex-wrap:wrap}
.pager a,.pager span{min-width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;font-size: calc(12px * var(--fz-nav, 1));font-weight:800;color:var(--muted);background:var(--surface)}
.pager a:hover{border-color:var(--green);color:var(--green)}
.pager .on{background:var(--green);border-color:var(--green);color:#fff}
.empty{text-align:center;padding:60px 20px;color:var(--muted)}
.empty .ic{font-size: calc(44px * var(--fz-icon, 1));margin-bottom:12px}

.acc-layout{display:grid;grid-template-columns:240px 1fr;gap:26px;align-items:start}
.acc-nav{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;position:sticky;top:96px}
.acc-nav a{display:flex;align-items:center;gap:9px;font-size: calc(12px * var(--fz-nav, 1));font-weight:700;color:var(--muted);padding:10px 12px;border-radius:10px}
.acc-nav a:hover{background:var(--surface2);color:var(--green)}
.acc-nav a.on{background:var(--green);color:#fff}
.acc-user{display:flex;align-items:center;gap:10px;padding:10px 12px 16px;border-bottom:1px solid var(--line);margin-bottom:10px}
.acc-user .av{width:40px;height:40px;border-radius:50%;background:var(--surface2);display:grid;place-items:center;font-weight:900;color:var(--green)}
.acc-user b{font-size: calc(13px * var(--fz-base, 1));display:block}
.acc-user span{font-size: calc(10px * var(--fz-base, 1));color:var(--muted)}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:24px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}
.stat span{font-size: calc(11px * var(--fz-base, 1));color:var(--muted)}
.stat b{display:block;font-size: calc(20px * var(--fz-base, 1));font-weight:900;margin-top:8px}
.tier-badge{display:inline-flex;gap:6px;align-items:center;font-size: calc(11px * var(--fz-base, 1));font-weight:800;padding:5px 12px;border-radius:30px;background:var(--surface2)}
.msg{border-radius:14px;padding:13px 16px;font-size: calc(13px * var(--fz-base, 1));margin-bottom:12px;max-width:80%;line-height:1.8}
.msg.me{background:var(--surface2);margin-right:auto}
.msg.staff{background:color-mix(in oklch,var(--green),transparent 88%);margin-left:auto;border:1px solid color-mix(in oklch,var(--green),transparent 70%)}
.msg small{display:block;font-size: calc(10px * var(--fz-small, 1));color:var(--muted);margin-bottom:5px}

footer.site{background:var(--ink);color:var(--bg);padding:48px 0 24px;margin-top:40px}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer.site h4{font-size: calc(13px * var(--fz-foot, 1));font-weight:900;margin:0 0 14px}
footer.site a,footer.site p{font-size: calc(12px * var(--fz-foot, 1));opacity:.72;display:block;margin-bottom:9px;line-height:1.8}
footer.site a:hover{opacity:1;color:var(--gold)}
.copy{border-top:1px solid rgba(255,255,255,.12);margin-top:32px;padding-top:18px;font-size: calc(11px * var(--fz-base, 1));opacity:.6;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

@media (max-width:980px){
  .pdp{grid-template-columns:1fr}
  .pdp-visual{height:280px;font-size: calc(80px * var(--fz-icon, 1))}
  .layout-side,.acc-layout{grid-template-columns:1fr}
  .sidebox,.acc-nav,.summary{position:static}
  .acc-nav{display:flex;flex-wrap:wrap;gap:6px}
  .acc-user{width:100%;border:0;padding-bottom:6px;margin:0}
  footer.site .cols{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  main{padding:24px 16px 60px}
  .wrap{padding:0 16px}
  header.site .wrap{height:64px;gap:10px}
  .searchbar{display:none}
  .brand span:last-child{display:none}
  .grid,.grid2{grid-template-columns:1fr}
  .pgrid{grid-template-columns:1fr 1fr;gap:12px}
  .product-visual{height:120px;font-size: calc(34px * var(--fz-card, 1))}
  .cart-item{grid-template-columns:64px minmax(0,1fr);gap:12px}
  .cart-price,.qtybox{grid-column:1/-1}
  footer.site .cols{grid-template-columns:1fr}
  .hero-stats{gap:18px}
  .topline .wrap{font-size: calc(10px * var(--fz-nav, 1));gap:10px}
}

.wg-full{width:100%}
.wg-hide-m{display:block}
.pgrid{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:16px}
.wg-carousel{display:flex;gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.wg-carousel>*{min-width:230px;scroll-snap-align:start}
.wg-badge{display:inline-block;background:var(--gold);color:var(--ink);font-size: calc(11px * var(--fz-widget, 1));font-weight:800;padding:4px 10px;border-radius:20px;margin-bottom:10px}
.wg-h1{font-size: calc(clamp(24px,4vw,38px) * var(--fz-h1, 1));font-weight:900;letter-spacing:-.03em;margin:0 0 10px}
.wg-sub{color:var(--muted);font-size: calc(14px * var(--fz-widget, 1));margin:0 0 18px}
.wg-btns{display:flex;gap:10px;flex-wrap:wrap}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.wg-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center}
.wg-hero-in.is-center{grid-template-columns:1fr;text-align:center;justify-items:center}
.wg-hero-in.is-left{direction:ltr}
.wg-hero-in.is-left .wg-hero-text{direction:rtl}
.wg-hero-img{border-radius:var(--radius);overflow:hidden;background:var(--surface2)}
.wg-hero-img img{width:100%;height:100%;object-fit:cover}
.wg-slider{position:relative;border-radius:var(--radius);overflow:hidden;background:transparent;height:clamp(170px,44vw,var(--sl-h,320px))}
.wg-slides{height:100%}
.wg-slide{display:none;position:relative;height:100%}
.wg-slide.on{display:block}
.wg-slide img{width:100%;height:100%;object-fit:cover}
.wg-slide-txt{position:absolute;inset:auto 30px 30px 30px;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.5)}
.wg-slide-txt h3{font-size: calc(24px * var(--fz-h3, 1));margin:0 0 6px;font-weight:900}
.wg-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;gap:6px;justify-content:center}
.wg-dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer}
.wg-dots button.on{background:#fff;width:22px;border-radius:9px}
.wg-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.wg-cats a{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-align:center;transition:.2s var(--ease)}
.wg-cats a:hover{transform:translateY(-3px);border-color:var(--green)}
.wg-cats .ic{font-size: calc(26px * var(--fz-icon, 1));display:block;margin-bottom:8px}
.wg-cats img{width:64px;height:64px;object-fit:cover;border-radius:50%;margin:0 auto 8px}
.wg-cats b{display:block;font-size: calc(13px * var(--fz-widget, 1))}
.wg-cats i{font-size: calc(10px * var(--fz-widget, 1));color:var(--muted);font-style:normal}
.wg-cats.is-circles a{border:0;background:none}
.wg-cats.is-list{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.wg-cats.is-list a{text-align:right;display:flex;align-items:center;gap:10px}
.wg-brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.wg-brands a{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;place-items:center;gap:6px;text-align:center;min-height:96px}
.wg-brands a:hover{border-color:var(--green)}
.wg-brands img{max-height:44px;object-fit:contain}
.wg-brands span{font-size: calc(12px * var(--fz-widget, 1));font-weight:700}
.wg-bgrid{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:14px}
.wg-bgrid a{position:relative;border-radius:var(--radius);overflow:hidden;height:var(--h,200px)}
.wg-bgrid img{width:100%;height:100%;object-fit:cover}
.wg-bgrid span{position:absolute;inset:auto 14px 14px 14px;color:#fff;font-weight:800;font-size: calc(15px * var(--fz-widget, 1));text-shadow:0 2px 12px rgba(0,0,0,.6)}
.wg-features{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:14px}
.wg-feature{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;gap:11px;align-items:center}
.wg-feature .ic{font-size: calc(22px * var(--fz-icon, 1))}
.wg-feature b{display:block;font-size: calc(13px * var(--fz-widget, 1))}
.wg-feature span{font-size: calc(11px * var(--fz-widget, 1));color:var(--muted)}
.wg-rich.center{text-align:center}
.wg-video video,.wg-video iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius);background:#000}
.wg-faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px}
.wg-faq summary{font-weight:800;font-size: calc(13px * var(--fz-widget, 1));cursor:pointer}
.wg-faq p{font-size: calc(13px * var(--fz-widget, 1));color:var(--muted);margin:8px 0 0}
.wg-quotes{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:14px}
.wg-quote{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.wg-quote .stars{color:var(--gold);font-size: calc(13px * var(--fz-widget, 1))}
.wg-quote p{font-size: calc(13px * var(--fz-widget, 1));margin:8px 0}
.wg-cta{border-radius:var(--radius);padding:26px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.wg-cta.is-dark{background:var(--ink);color:var(--bg)}
.wg-cta.is-accent{background:var(--green);color:#fff}
.wg-cta.is-soft{background:var(--surface2)}
.wg-cta h2{margin:0 0 6px}
.wg-cta p{margin:0;font-size: calc(13px * var(--fz-widget, 1));opacity:.85}
.wg-deal{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.wg-deal-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.wg-deal-head h2{margin:0}
.wg-timer{display:flex;align-items:center;gap:5px}
.wg-timer b{background:var(--ink);color:var(--bg);border-radius:8px;padding:5px 9px;font-size: calc(14px * var(--fz-badge, 1));font-variant-numeric:tabular-nums}
.wg-timer i{font-size: calc(10px * var(--fz-badge, 1));color:var(--muted);font-style:normal;margin-left:2px}
.wg-spot{display:grid;grid-template-columns:1fr 1fr;gap:22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;align-items:center}
.wg-spot-img{background:var(--surface2);border-radius:var(--radius);min-height:220px;display:grid;place-items:center;font-size: calc(56px * var(--fz-widget, 1));overflow:hidden}
.wg-spot-img img{width:100%;height:100%;object-fit:cover}
.wg-spot-price b{font-size: calc(22px * var(--fz-price, 1));font-weight:900}
.wg-spot .btn{margin-top:14px}
.nav-menu{display:flex;gap:2px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav-menu>li{position:relative}
.nav-menu a{display:flex;align-items:center;gap:5px;padding:11px 12px;font-size: calc(12px * var(--fz-nav, 1));font-weight:700;color:var(--muted)}
.nav-menu a:hover{color:var(--green)}
.nav-menu .mi-badge{background:var(--red);color:#fff;font-size: calc(9px * var(--fz-nav, 1));padding:1px 6px;border-radius:10px}
.nav-menu .mi-caret{font-size: calc(9px * var(--fz-nav, 1));font-style:normal;opacity:.6}
.nav-menu ul{display:none;position:absolute;top:100%;right:0;z-index:40;background:var(--surface);border:1px solid var(--line);border-radius:12px;min-width:200px;padding:8px;list-style:none;box-shadow:0 18px 40px rgba(0,0,0,.12)}
.nav-menu li:hover>ul{display:block}
.nav-menu ul li{position:relative}
.nav-menu ul.mega{display:none;grid-template-columns:repeat(3,minmax(160px,1fr));gap:4px;min-width:520px}
.nav-menu li:hover>ul.mega{display:grid}
.nav-menu ul ul{top:0;right:100%}
.nav-menu.tiny a{padding:0 8px;font-size: calc(11px * var(--fz-nav, 1));color:inherit;opacity:.8}
.filterbox h3{margin:0 0 8px;font-size: calc(13px * var(--fz-form, 1))}
.fchk{display:flex;align-items:center;gap:8px;padding:6px;border-radius:9px;font-size: calc(12px * var(--fz-base, 1));color:var(--muted)}
.fchk span{width:15px;height:15px;border:1px solid var(--line);border-radius:5px;flex:none;background:var(--surface)}
.fchk:hover{background:var(--surface2);color:var(--ink)}
.fchk.on{color:var(--green);font-weight:800}
.fchk.on span{background:var(--green);border-color:var(--green);box-shadow:inset 0 0 0 3px var(--surface)}
.fchk i{margin-right:auto;font-size: calc(10px * var(--fz-base, 1));font-style:normal;opacity:.7}
.fscroll{max-height:230px;overflow-y:auto}
.fcolors{display:flex;flex-wrap:wrap;gap:8px;max-height:none}
.fcolor{width:28px;height:28px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center}
.fcolor span{width:100%;height:100%;border-radius:50%;display:block}
.fcolor.on{border-color:var(--green);box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--green)}
.vpick{margin:16px 0}
.vrow{margin-bottom:12px}
.vrow label{display:block;font-size: calc(12px * var(--fz-form, 1));font-weight:800;margin-bottom:6px}
.vopts{display:flex;flex-wrap:wrap;gap:7px}
.vopt{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:7px 12px;font:700 12px var(--font);cursor:pointer;display:flex;align-items:center;gap:6px; font-size: calc(12px * var(--fz-base, 1))}
.vopt span{width:14px;height:14px;border-radius:50%;display:inline-block}
.vopt.on{border-color:var(--green);color:var(--green);box-shadow:0 0 0 2px oklch(52% .16 159 / .15)}
.vopt.off{opacity:.35;text-decoration:line-through}
.addons{background:var(--surface2);border-radius:var(--radius);padding:14px;margin:14px 0;display:grid;gap:12px}
.addon label{font-size: calc(12px * var(--fz-form, 1));font-weight:800;display:block;margin-bottom:5px}
.addon select,.addon input[type=text]{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font:inherit;font-size: calc(12px * var(--fz-form, 1))}
.addon .checkline{font-weight:500;display:flex;gap:7px;align-items:center;font-size: calc(12px * var(--fz-base, 1));margin-bottom:3px}
.pgallery{display:flex;gap:8px;margin-top:10px;overflow-x:auto}
.pgallery img{width:64px;height:64px;object-fit:cover;border-radius:10px;border:2px solid var(--line);cursor:pointer;transition:border-color .15s,opacity .15s;opacity:.75}
.pgallery img:hover{opacity:1}
.pgallery img.on{border-color:var(--green);opacity:1}
.spec-table{width:100%;border-collapse:collapse;font-size: calc(13px * var(--fz-table, 1))}
.spec-table th{text-align:right;color:var(--muted);font-weight:600;width:180px;padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top}
.spec-table td{padding:9px 0;border-bottom:1px solid var(--line)}
@media(max-width:900px){
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wg-hero-in,.wg-spot{grid-template-columns:1fr}
  .wg-features,.wg-bgrid,.wg-quotes{grid-template-columns:1fr 1fr}
  .wg-hide-m{display:none}
  .nav-menu ul.mega{grid-template-columns:1fr;min-width:220px}
}
