/* ============================================================
   سری / SERI — سیستم طراحی تولیدی هرمس (پوشاک زنانه عمده، اصفهان)
   v1.1 — ۱۴۰۵/۰۶/۲۹
   لایه‌ها: ۱) طیف خام  ۲) توکن معنایی  ۳) جزء
   ============================================================ */

/* ---------- فونت‌ها (محلی) ---------- */
@font-face{font-family:"Estedad";src:url("../fonts/Estedad-Variable.woff2") format("woff2-variations"),url("../fonts/Estedad-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-ExtraBold.woff2") format("woff2");font-weight:800;font-display:swap}

/* ---------- ۱) طیف خام ---------- */
:root{
  /* کتان — خنثی گرم (پارچه، نه خاکستری سرد) */
  --l-0:#FFFFFF; --l-50:#FAF7F2; --l-100:#F3EEE6; --l-200:#E8E1D6; --l-300:#D9D0C2; --l-400:#B9AE9E;
  --l-500:#8E8474; --l-600:#6B6256; --l-700:#4E463D; --l-800:#332E28; --l-900:#1F1C18;
  /* زرشکی — برند (از لوگوی موجود، کمی پخته‌تر) */
  --r-50:#FCEBEC; --r-100:#F7CFD2; --r-200:#EE9EA3; --r-300:#E06B73; --r-400:#CE3D48; --r-500:#B8232F;
  --r-600:#9C1C27; --r-700:#7E1620; --r-800:#5E1018; --r-900:#3F0A10;
  /* نیلی جین — اطلاعات عمده/B2B و اعتماد */
  --d-50:#EDF1F7; --d-100:#D3DCE8; --d-200:#A9B9CF; --d-300:#7F95B4; --d-400:#557198; --d-500:#2F4A6D;
  --d-600:#263D5A; --d-700:#1E3048; --d-800:#152236; --d-900:#0D1522;
  /* کرافت — اتیکت و برچسب */
  --k-100:#F1E3C8; --k-300:#DEC393; --k-500:#C9A46B; --k-700:#8C6B36;
  /* وضعیت */
  --ok-500:#2B7330; --ok-50:#E8F3E9; --warn-500:#8C5B0F; --warn-50:#FBF1DE; --err-500:#B8232F;
}

/* ---------- ۲) توکن معنایی ---------- */
:root{
  --page:var(--l-50); --surface:var(--l-0); --surface-2:var(--l-100); --surface-3:var(--l-200);
  --fg:var(--l-900); --fg-2:var(--l-700); --fg-3:var(--l-600); --fg-on-dark:#FFFFFF; --fg-on-dark-2:#D9D0C2;
  --line:var(--l-200); --line-2:var(--l-300); --line-strong:var(--l-900);
  --brand:var(--r-500); --brand-hover:var(--r-600); --brand-active:var(--r-700); --brand-soft:var(--r-50); --brand-fg:#FFFFFF;
  --b2b:var(--d-500); --b2b-hover:var(--d-600); --b2b-soft:var(--d-50); --b2b-fg:#FFFFFF;
  --kraft:var(--k-500); --kraft-soft:var(--k-100); --kraft-fg:var(--l-900);
  --ok:var(--ok-500); --ok-soft:var(--ok-50); --warn:var(--warn-500); --warn-soft:var(--warn-50); --err:var(--err-500);

  --font-display:"Estedad","Vazirmatn",Tahoma,sans-serif;
  --font-body:"Estedad","Vazirmatn",Tahoma,Arial,sans-serif;

  /* مقیاس تایپ (پایه ۱۶، ضریب ۱٫۲۰ + کلمپ برای تیتر) */
  --t-xs:.8125rem; --t-sm:.9375rem; --t-md:1rem; --t-lg:1.125rem; --t-xl:1.375rem;
  --t-2xl:clamp(1.5rem,1.2rem + 1.2vw,1.875rem);
  --t-3xl:clamp(1.875rem,1.4rem + 2vw,2.5rem);
  --t-4xl:clamp(2.25rem,1.6rem + 3vw,3.25rem);
  --lh-tight:1.3; --lh-body:1.9; --lh-ui:1.5;

  /* فاصله (پایه ۴) */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px; --s-20:80px;
  --container:1240px; --gutter:16px;

  /* شعاع — کم‌تر از رقبا؛ اتیکت و کارت زاویه‌دارتر */
  --rad-xs:4px; --rad-sm:6px; --rad-md:10px; --rad-lg:14px; --rad-xl:20px; --rad-pill:999px;

  /* سایه — رنگ‌گرفته از کتان */
  --sh-1:0 1px 2px rgba(51,46,40,.06),0 1px 1px rgba(51,46,40,.04);
  --sh-2:0 4px 12px rgba(51,46,40,.08),0 1px 2px rgba(51,46,40,.05);
  --sh-3:0 12px 32px rgba(51,46,40,.12),0 2px 6px rgba(51,46,40,.06);

  /* حرکت */
  --ease-out:cubic-bezier(.2,.7,.2,1); --ease-fold:cubic-bezier(.6,0,.2,1);
  --dur-1:120ms; --dur-2:200ms; --dur-3:320ms;

  /* خط‌دوخت */
  --stitch:repeating-linear-gradient(90deg,var(--l-400) 0 6px,transparent 6px 11px);
}

/* ---------- پایه ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--fg);font-family:var(--font-body);font-size:var(--t-md);line-height:var(--lh-body);direction:rtl;text-align:start}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);line-height:var(--lh-tight);margin:0;font-weight:800;letter-spacing:0}
h1{font-size:var(--t-4xl)} h2{font-size:var(--t-3xl)} h3{font-size:var(--t-2xl)} h4{font-size:var(--t-xl)}
p{margin:0 0 var(--s-3)}
.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.lat{font-family:var(--font-body);direction:ltr;unicode-bidi:isolate;letter-spacing:.02em}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--fg-3)}
.small{font-size:var(--t-sm)}
.xs{font-size:var(--t-xs)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--b2b);outline-offset:2px;border-radius:var(--rad-xs)}

/* ---------- خط‌دوخت (امضا) ---------- */
.stitch{height:2px;background:var(--stitch);border:0;margin:var(--s-6) 0}
.stitch-b{border-bottom:2px dashed var(--l-300)}
.stitch-box{border:2px dashed var(--l-300);border-radius:var(--rad-md);padding:var(--s-4)}

/* ---------- اتیکت (hang tag) — امضا ---------- */
.tag{--tag-bg:var(--kraft);--tag-fg:var(--kraft-fg);position:relative;display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 14px;background:var(--tag-bg);color:var(--tag-fg);font-size:var(--t-xs);font-weight:700;line-height:1.4;border-radius:var(--rad-xs) 0 0 var(--rad-xs);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,0 100%)}
.tag::before{content:"";position:absolute;inset-inline-end:5px;top:50%;width:4px;height:4px;transform:translateY(-50%);border-radius:50%;background:var(--page)}
.tag.red{--tag-bg:var(--brand);--tag-fg:#fff}
.tag.ink{--tag-bg:var(--l-900);--tag-fg:#fff}
.tag.denim{--tag-bg:var(--b2b);--tag-fg:#fff}
.tag.ok{--tag-bg:var(--ok);--tag-fg:#fff}
.tag.warn{--tag-bg:var(--warn-soft);--tag-fg:var(--warn)}
.tag.lg{font-size:var(--t-sm);padding:6px 14px 6px 18px}
.tag.lg::before{width:6px;height:6px;inset-inline-end:7px}

/* ---------- نوار پک (امضا) — هر نقطه = یک عدد از پک ---------- */
.pack{display:inline-flex;align-items:center;gap:3px;vertical-align:middle}
.pack i{width:10px;height:10px;border-radius:3px;background:var(--dot,var(--l-400));box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);display:block}
.pack.lg i{width:14px;height:14px;border-radius:4px}
.pack .n{font-size:var(--t-xs);font-weight:700;margin-inline-start:6px;color:var(--fg-2)}

/* ---------- چیپ جنس با بافت (امضا) ---------- */
.fab{display:inline-flex;align-items:center;gap:8px;padding:4px 10px 4px 6px;border:1px solid var(--line-2);border-radius:var(--rad-pill);background:var(--surface);font-size:var(--t-xs);font-weight:600;color:var(--fg-2)}
.fab::before{content:"";width:18px;height:18px;border-radius:50%;border:1px solid var(--line-2);background:var(--fab-tex,var(--l-200))}
.fab.rib{--fab-tex:repeating-linear-gradient(90deg,#d9d0c2 0 2px,#f3eee6 2px 4px)}
.fab.cotton{--fab-tex:radial-gradient(circle at 30% 30%,#fff 0 1px,transparent 1.5px) 0 0/4px 4px,#e8e1d6}
.fab.viscose{--fab-tex:linear-gradient(135deg,#f3eee6,#d9d0c2 60%,#f3eee6)}
.fab.linen{--fab-tex:repeating-linear-gradient(0deg,#e8e1d6 0 1px,#f3eee6 1px 3px),repeating-linear-gradient(90deg,#e8e1d6 0 1px,transparent 1px 3px)}
.fab.denim{--fab-tex:repeating-linear-gradient(45deg,#2F4A6D 0 1px,#557198 1px 3px)}
.fab.knit{--fab-tex:repeating-linear-gradient(60deg,#d9d0c2 0 2px,#f3eee6 2px 5px),repeating-linear-gradient(-60deg,#d9d0c2 0 2px,transparent 2px 5px)}
.fab.fleece{--fab-tex:radial-gradient(circle,#d9d0c2 0 1px,transparent 1.2px) 0 0/3px 3px,#f3eee6}

/* ---------- سواچ رنگ ---------- */
.sw{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.sw i{width:16px;height:16px;border-radius:50%;background:var(--c,#ccc);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);cursor:pointer;position:relative}
.sw i.on::after{content:"";position:absolute;inset:-4px;pointer-events:none;border:2px solid var(--fg);border-radius:50%}
.sw i.off{opacity:.35}
.sw i.off::before{content:"";position:absolute;inset:50% -2px auto;height:2px;background:var(--fg);transform:rotate(-45deg)}
.sw .more{font-size:var(--t-xs);color:var(--fg-3);font-weight:600}
.sw.lg i{width:26px;height:26px}

/* ---------- دکمه‌ها ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--rad-md);border:1px solid transparent;font-weight:700;font-size:var(--t-sm);line-height:1;cursor:pointer;transition:background var(--dur-2) var(--ease-out),color var(--dur-2),border-color var(--dur-2),transform var(--dur-1);white-space:nowrap;user-select:none}
.btn:active{transform:translateY(1px)}
.btn svg{width:18px;height:18px;flex:none}
.btn-primary{background:var(--brand);color:var(--brand-fg)}
.btn-primary:hover{background:var(--brand-hover)}
.btn-b2b{background:var(--b2b);color:var(--b2b-fg)}
.btn-b2b:hover{background:var(--b2b-hover)}
.btn-ink{background:var(--l-900);color:#fff}
.btn-ink:hover{background:var(--l-800)}
.btn-outline{background:transparent;border-color:var(--l-900);color:var(--fg)}
.btn-outline:hover{background:var(--l-900);color:#fff}
.btn-soft{background:var(--surface-2);color:var(--fg)}
.btn-soft:hover{background:var(--surface-3)}
.btn-ghost{background:transparent;color:var(--fg-2)}
.btn-ghost:hover{background:var(--surface-2);color:var(--fg)}
.btn-wa{background:#1F8F4E;color:#fff}
.btn-wa:hover{background:#19773F}
.btn-lg{min-height:52px;padding:0 24px;font-size:var(--t-md);border-radius:var(--rad-lg)}
.btn-sm{min-height:36px;padding:0 12px;font-size:var(--t-xs);border-radius:var(--rad-sm)}
.btn-block{width:100%}
.btn[disabled],.btn.is-disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.btn-icon{width:44px;padding:0;border-radius:var(--rad-md)}

/* ---------- فرم ---------- */
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:var(--t-sm);font-weight:600;color:var(--fg-2)}
.field .hint{font-size:var(--t-xs);color:var(--fg-3)}
.field .err{font-size:var(--t-xs);color:var(--err);font-weight:600}
.input,select.input,textarea.input{width:100%;min-height:46px;padding:10px 14px;border:1px solid var(--line-2);border-radius:var(--rad-md);background:var(--surface);transition:border-color var(--dur-2),box-shadow var(--dur-2)}
.input:hover{border-color:var(--l-400)}
.input:focus{outline:0;border-color:var(--b2b);box-shadow:0 0 0 3px var(--b2b-soft)}
.input.is-error{border-color:var(--err);box-shadow:0 0 0 3px var(--brand-soft)}
.input.lat{text-align:left}
textarea.input{min-height:120px;line-height:var(--lh-body)}
select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234E463D' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center;padding-inline-start:36px}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:var(--t-sm)}
.check input{appearance:none;width:20px;height:20px;border:1.5px solid var(--l-400);border-radius:5px;background:var(--surface);display:grid;place-content:center;margin:0}
.check input::before{content:"";width:10px;height:10px;transform:scale(0);background:#fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);transition:transform var(--dur-1)}
.check input:checked{background:var(--l-900);border-color:var(--l-900)}
.check input:checked::before{transform:scale(1)}
.check input[type=radio]{border-radius:50%}
.check input[type=radio]::before{clip-path:none;border-radius:50%;width:8px;height:8px}
/* استپر پک — واحد = پک */
.stepper{display:inline-grid;grid-template-columns:44px 1fr 44px;align-items:center;border:1px solid var(--line-2);border-radius:var(--rad-md);background:var(--surface);overflow:hidden;min-width:170px}
.stepper button{height:44px;border:0;background:var(--surface-2);cursor:pointer;font-size:20px;font-weight:700;color:var(--fg-2)}
.stepper button:hover{background:var(--surface-3);color:var(--fg)}
.stepper .val{text-align:center;font-weight:700;line-height:1.2}
.stepper .val small{display:block;font-size:11px;font-weight:600;color:var(--fg-3)}

/* ---------- نشان‌ها و چیپ ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:var(--rad-pill);font-size:var(--t-xs);font-weight:700;line-height:1.6;background:var(--surface-2);color:var(--fg-2)}
.badge.ok{background:var(--ok-soft);color:var(--ok)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.badge.err{background:var(--brand-soft);color:var(--r-700)}
.badge.b2b{background:var(--b2b-soft);color:var(--b2b)}
.badge.ink{background:var(--l-900);color:#fff}
.badge.new{background:var(--l-900);color:#fff}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.9}
.badge.nodot::before{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line-2);border-radius:var(--rad-pill);background:var(--surface);font-size:var(--t-sm);font-weight:600;color:var(--fg-2);cursor:pointer;transition:all var(--dur-2)}
.chip:hover{border-color:var(--l-900);color:var(--fg)}
.chip.on{background:var(--l-900);border-color:var(--l-900);color:#fff}
.chip .x{opacity:.6}

/* ---------- کارت محصول ---------- */
.pcard{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow var(--dur-3) var(--ease-out),transform var(--dur-3) var(--ease-out)}
.pcard:hover{box-shadow:var(--sh-3);transform:translateY(-2px)}
.pcard .ph{position:relative;aspect-ratio:3/4;background:var(--surface-2);overflow:hidden}
.pcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur-3) var(--ease-out)}
.pcard:hover .ph img{transform:scale(1.03)}
.pcard .ph .tags{position:absolute;top:10px;inset-inline-start:0;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.pcard .ph .tags .tag{border-radius:0 var(--rad-xs) var(--rad-xs) 0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,9px 50%)}
.pcard .ph .tags .tag::before{inset-inline-end:auto;inset-inline-start:5px}
.pcard .ph .quick{position:absolute;inset-inline:10px;bottom:10px;transform:translateY(120%);opacity:0;transition:all var(--dur-3) var(--ease-out)}
.pcard:hover .ph .quick,.pcard:focus-within .ph .quick{transform:none;opacity:1}
.pcard .quick .btn{white-space:normal;line-height:1.35;min-height:36px;padding:6px 10px}
.pcard .body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.pcard .cat{font-size:var(--t-xs);color:var(--fg-3);font-weight:600}
.pcard .name{font-family:var(--font-body);font-size:var(--t-sm);font-weight:700;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em}
.pcard .meta{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.pcard .price{margin-top:auto;display:grid;gap:2px}
.pcard .price .unit{font-size:var(--t-xs);color:var(--fg-3)}
.pcard .price .p{font-weight:800;font-size:var(--t-lg);line-height:1.2}
.pcard .price .p small{font-size:var(--t-xs);font-weight:600;color:var(--fg-3);margin-inline-start:3px}
.pcard .price .pack-p{font-size:var(--t-xs);color:var(--b2b);font-weight:700}
.pcard.is-out .ph img{filter:grayscale(.6);opacity:.7}
.pcard.is-out .price .p{color:var(--fg-3);text-decoration:line-through;text-decoration-thickness:1px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--s-4)}
@media (max-width:480px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pcard .body{padding:10px}.pcard .name{font-size:var(--t-xs);line-height:1.45}}

/* ---------- جدول قیمت پله‌ای ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tier{border:1px solid var(--line-2);border-radius:var(--rad-md);padding:10px 12px;text-align:center;background:var(--surface);cursor:pointer;position:relative;transition:all var(--dur-2)}
.tier:hover{border-color:var(--b2b)}
.tier.on{border-color:var(--b2b);background:var(--b2b-soft);box-shadow:inset 0 0 0 1px var(--b2b)}
.tier .q{font-size:var(--t-xs);color:var(--fg-3);font-weight:600}
.tier .p{font-weight:800;font-size:var(--t-md);line-height:1.3}
.tier .p small{font-size:11px;font-weight:600;color:var(--fg-3)}
.tier .save{position:absolute;top:-9px;inset-inline-end:8px}

/* ---------- ترکیب پک ---------- */
.packmix{display:grid;grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:8px}
.packmix .pc{border:1px solid var(--line);border-radius:var(--rad-sm);padding:6px 4px;text-align:center;background:var(--surface);font-size:var(--t-xs);line-height:1.5}
.packmix .pc i{display:block;width:100%;height:28px;border-radius:4px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);margin-bottom:4px}
.packmix .pc b{display:block;font-size:var(--t-sm)}

/* ---------- جدول مشخصات ---------- */
.spec{width:100%;border-collapse:collapse;font-size:var(--t-sm)}
.spec th,.spec td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
.spec th{width:32%;color:var(--fg-3);font-weight:600;background:var(--surface-2)}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}

/* ---------- کارت عمومی ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-lg);padding:var(--s-5)}
.card.kraft{background:var(--kraft-soft);border-color:var(--k-300)}
.card.denim{background:var(--b2b);color:#fff;border-color:var(--b2b)}
.card.ink{background:var(--l-900);color:#fff;border-color:var(--l-900)}

/* ---------- نوار اعتماد B2B ---------- */
.b2bbar{background:var(--b2b);color:#fff;font-size:var(--t-sm)}
.b2bbar .in{display:flex;gap:24px;align-items:center;min-height:40px;overflow-x:auto;contain:inline-size;scrollbar-width:none}
.b2bbar .in::-webkit-scrollbar{display:none}
.b2bbar .it{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-weight:600}
.b2bbar .it svg{width:16px;height:16px;opacity:.9}
.b2bbar .it b{color:var(--k-300)}

/* ---------- هدر ---------- */
.hdr{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.hdr .row{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;min-height:72px}
.hdr .logo{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:19px;line-height:1.15;white-space:nowrap}
.hdr .logo .mark{width:48px;height:48px;border-radius:50%;flex:none;object-fit:contain}
.hdr .logo small{display:block;font-family:var(--font-body);font-size:11px;font-weight:600;color:var(--fg-3);letter-spacing:0}
.hdr .search{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:var(--rad-md);padding:0 12px;min-height:44px;max-width:520px;background:var(--surface-2)}
.hdr .search input{border:0;background:transparent;flex:1;min-width:0;outline:0}
.hdr .search svg{width:18px;height:18px;color:var(--fg-3);flex:none}
.hdr .acts{display:flex;gap:6px;align-items:center}
.hdr .act{position:relative;width:44px;height:44px;display:grid;place-content:center;border-radius:var(--rad-md);color:var(--fg-2)}
.hdr .act:hover{background:var(--surface-2);color:var(--fg)}
.hdr .act svg{width:22px;height:22px}
.hdr .act .cnt{position:absolute;top:4px;inset-inline-start:4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;display:grid;place-content:center}
.nav{display:flex;gap:2px;align-items:center;overflow-x:auto;contain:inline-size;scrollbar-width:none;border-top:1px solid var(--line)}
.nav::-webkit-scrollbar{display:none}
.nav a{padding:12px 14px;font-size:var(--t-sm);font-weight:600;color:var(--fg-2);white-space:nowrap;border-bottom:2px solid transparent;transition:all var(--dur-2)}
.nav a:hover,.nav a.on{color:var(--fg);border-bottom-color:var(--brand)}
.nav a.b2b{color:var(--b2b);margin-inline-start:auto}
.nav a .cnt{font-size:11px;color:var(--fg-3);margin-inline-start:4px;font-weight:600}
/* مگامنو */
.mega{background:var(--surface);border:1px solid var(--line);border-radius:0 0 var(--rad-lg) var(--rad-lg);box-shadow:var(--sh-3);padding:var(--s-6);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-6)}
.mega h5{margin:0 0 10px;font-size:var(--t-sm);font-weight:800;color:var(--fg);padding-bottom:8px;border-bottom:2px dashed var(--l-300)}
.mega ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mega li a{display:flex;justify-content:space-between;font-size:var(--t-sm);color:var(--fg-2);padding:4px 0}
.mega li a:hover{color:var(--brand)}
.mega li a .cnt{color:var(--fg-3);font-size:var(--t-xs)}
@media (max-width:640px){.mega{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4);padding:var(--s-4)}}
.mega .promo{background:var(--kraft-soft);border-radius:var(--rad-md);padding:14px;display:grid;gap:8px;align-content:start}

/* ---------- فیلتر / آرشیو ---------- */
div.archive{display:grid;grid-template-columns:260px minmax(0,1fr);gap:var(--s-6)}
@media (max-width:900px){div.archive{grid-template-columns:minmax(0,1fr)}.filters{display:none}}
.filters{display:grid;gap:var(--s-4);align-content:start}
.fgroup{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-md);padding:14px}
.fgroup h6{margin:0 0 10px;font-size:var(--t-sm);font-weight:800;display:flex;justify-content:space-between}
.fgroup .opts{display:grid;gap:8px}
.fgroup .opts.wrap{display:flex;flex-wrap:wrap;gap:6px}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:var(--s-4)}
.toolbar .cnt{font-size:var(--t-sm);color:var(--fg-3)}
.activef{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s-4)}

/* ---------- فوتر ---------- */
.ftr{background:var(--l-900);color:var(--fg-on-dark-2);margin-top:var(--s-20)}
.ftr .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:var(--s-8);padding:var(--s-12) 0 var(--s-8)}
@media (max-width:900px){.ftr .top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr .top{grid-template-columns:minmax(0,1fr)}}
.ftr h6{margin:0 0 12px;color:#fff;font-size:var(--t-md);font-weight:800}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:var(--t-sm)}
.ftr a:hover{color:#fff}
.ftr .bot{border-top:1px solid rgba(255,255,255,.12);padding:var(--s-5) 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:var(--t-xs);color:var(--l-400)}
.ftr .seal{display:flex;gap:10px}
.ftr .seal span{width:64px;height:64px;border-radius:var(--rad-sm);background:rgba(255,255,255,.08);display:grid;place-content:center;font-size:11px;color:var(--l-300);text-align:center}

/* ---------- پیام‌ها ---------- */
.alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--rad-md);border:1px solid var(--line-2);background:var(--surface);font-size:var(--t-sm)}
.alert svg{width:20px;height:20px;flex:none;margin-top:2px}
.alert.ok{background:var(--ok-soft);border-color:#BFE0C2;color:#1B5E20}
.alert.warn{background:var(--warn-soft);border-color:#EDD5A3;color:#6E4708}
.alert.err{background:var(--brand-soft);border-color:var(--r-100);color:var(--r-700)}
.alert.info{background:var(--b2b-soft);border-color:var(--d-100);color:var(--d-700)}
.empty{text-align:center;padding:var(--s-12) var(--s-4);border:2px dashed var(--l-300);border-radius:var(--rad-lg);background:var(--surface)}
.empty svg{width:56px;height:56px;margin:0 auto 12px;color:var(--l-400)}
.empty h4{margin-bottom:6px}

/* ---------- بخش / تیتر بخش ---------- */
.sec{padding:var(--s-12) 0}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:var(--s-6);flex-wrap:wrap}
.sec-h .eyebrow{font-size:var(--t-xs);font-weight:700;color:var(--brand);letter-spacing:0;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.sec-h .eyebrow::before{content:"";width:24px;height:2px;background:var(--stitch)}
.sec-h p{color:var(--fg-3);margin:4px 0 0;max-width:60ch}

/* ---------- کاشی دسته ---------- */
.ctile{position:relative;border-radius:var(--rad-lg);overflow:hidden;aspect-ratio:4/5;background:var(--surface-2);display:flex;align-items:flex-end;isolation:isolate}
.ctile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:transform var(--dur-3) var(--ease-out)}
.ctile:hover img{transform:scale(1.04)}
.ctile .in{width:100%;padding:14px;background:linear-gradient(to top,rgba(31,28,24,.85),transparent);color:#fff;display:flex;justify-content:space-between;align-items:flex-end}
.ctile .in b{font-family:var(--font-display);font-size:var(--t-xl)}
.ctile .in small{font-size:var(--t-xs);color:var(--l-300)}

/* ---------- تب ---------- */
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--line);overflow-x:auto;contain:inline-size}
.tabs button{border:0;background:none;padding:12px 16px;font-weight:700;font-size:var(--t-sm);color:var(--fg-3);border-bottom:2px solid transparent;margin-bottom:-2px;cursor:pointer;white-space:nowrap}
.tabs button.on{color:var(--fg);border-bottom-color:var(--l-900)}

/* ---------- بردکرامب ---------- */
.crumbs{display:flex;gap:6px;align-items:center;font-size:var(--t-xs);color:var(--fg-3);flex-wrap:wrap}
.crumbs a:hover{color:var(--fg)}
.crumbs span::before{content:"‹";margin-inline:2px;opacity:.5}

/* ---------- کمکی ---------- */
.grid{display:grid;gap:var(--s-4)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}}
.row{display:flex;gap:var(--s-3);align-items:center;flex-wrap:wrap}
.between{justify-content:space-between}
.mt-2{margin-top:var(--s-2)}.mt-4{margin-top:var(--s-4)}.mt-6{margin-top:var(--s-6)}.mb-4{margin-bottom:var(--s-4)}
.hide-m{display:initial}@media (max-width:640px){.hide-m{display:none!important}}
.only-m{display:none}@media (max-width:640px){.only-m{display:initial}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}


/* ============================================================
   v1.1 — اجزای تکمیلی
   ============================================================ */

/* ---------- لوگو ---------- */
.logo-lock{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800;line-height:1.05;color:var(--fg)}
.logo-lock .mark{width:var(--lm,56px);height:var(--lm,56px);border-radius:50%;flex:none;object-fit:contain}
.logo-lock .word{display:grid;gap:2px}
.logo-lock .word b{font-size:calc(var(--lm,56px)*.4);white-space:nowrap}
.logo-lock .word small{font-family:var(--font-body);font-weight:600;font-size:calc(var(--lm,56px)*.2);color:var(--fg-3);letter-spacing:0}
.logo-lock.on-dark{color:#fff}.logo-lock.on-dark .word small{color:var(--l-300)}
.logo-lock.mono .mark{filter:grayscale(1) contrast(1.1)}
.logo-lock.mono-w .mark{filter:grayscale(1) brightness(1.6)}
.logo-lock.stack{flex-direction:column;text-align:center}

/* ---------- سوئیچ ---------- */
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:var(--t-sm);font-weight:600}
.switch input{appearance:none;width:44px;height:26px;border-radius:13px;background:var(--l-300);position:relative;margin:0;transition:background var(--dur-2);cursor:pointer}
.switch input::before{content:"";position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:var(--sh-1);transition:transform var(--dur-2) var(--ease-out)}
.switch input:checked{background:var(--b2b)}
.switch input:checked::before{transform:translateX(-18px)}
[dir="ltr"] .switch input:checked::before{transform:translateX(18px)}

/* ---------- آکاردئون / سؤالات ---------- */
.acc{border:1px solid var(--line);border-radius:var(--rad-lg);background:var(--surface);overflow:hidden}
.acc details{border-bottom:1px solid var(--line)}
.acc details:last-child{border-bottom:0}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;font-weight:700;font-size:var(--t-md)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";width:10px;height:10px;border-inline-end:2px solid var(--fg-3);border-bottom:2px solid var(--fg-3);transform:rotate(45deg);transition:transform var(--dur-2) var(--ease-fold);flex:none;margin-inline-end:4px}
.acc details[open] summary::after{transform:rotate(-135deg)}
.acc details[open] summary{color:var(--b2b)}
.acc .body{padding:0 18px 16px;font-size:var(--t-sm);color:var(--fg-2);max-width:75ch}

/* ---------- مودال ---------- */
.modal-bg{position:fixed;inset:0;background:rgba(31,28,24,.55);z-index:80;display:grid;place-items:center;padding:16px}
.modal{background:var(--surface);border-radius:var(--rad-xl);width:min(520px,100%);box-shadow:var(--sh-3);overflow:hidden}
.modal .mh{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:2px dashed var(--l-300)}
.modal .mh h4{margin:0}
.modal .mb{padding:20px;display:grid;gap:14px}
.modal .mf{padding:14px 20px;background:var(--surface-2);display:flex;gap:8px;justify-content:flex-start;flex-wrap:wrap}
.modal.static{position:static;box-shadow:var(--sh-2);border:1px solid var(--line)}

/* ---------- کشو ---------- */
.drawer{position:fixed;top:0;bottom:0;inset-inline-start:0;width:min(360px,92vw);background:var(--surface);z-index:70;box-shadow:var(--sh-3);display:grid;grid-template-rows:auto minmax(0,1fr) auto;transform:translateX(100%);transition:transform var(--dur-3) var(--ease-fold)}
[dir="ltr"] .drawer{transform:translateX(-100%)}
.drawer.open{transform:none}
.drawer .dh{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.drawer .dh h4{margin:0}
.drawer .db{overflow-y:auto;padding:16px 18px;display:grid;gap:14px;align-content:start}
.drawer .df{padding:12px 18px;border-top:1px solid var(--line);background:var(--surface);display:grid;gap:8px}
.drawer.static{position:relative;transform:none;height:520px;width:100%;max-width:360px;box-shadow:var(--sh-2);border:1px solid var(--line);border-radius:var(--rad-lg);overflow:hidden}

/* ---------- توست ---------- */
.toast{display:flex;align-items:center;gap:10px;background:var(--l-900);color:#fff;padding:12px 16px;border-radius:var(--rad-md);box-shadow:var(--sh-3);font-size:var(--t-sm);font-weight:600;max-width:420px}
.toast svg{width:20px;height:20px;flex:none;color:var(--k-300)}
.toast .act{margin-inline-start:auto;color:var(--k-300);font-weight:700;white-space:nowrap}
.toast.ok svg{color:#8FD694}.toast.err svg{color:#F49AA1}
.toasts{position:fixed;bottom:16px;inset-inline-end:16px;z-index:90;display:grid;gap:8px}

/* ---------- راهنمای کوچک (tooltip) ---------- */
.tip{position:relative;display:inline-flex;align-items:center;gap:4px;border-bottom:1px dashed var(--l-400);cursor:help}
.tip::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);inset-inline-start:50%;transform:translateX(50%);background:var(--l-900);color:#fff;font-size:var(--t-xs);font-weight:600;line-height:1.5;padding:6px 10px;border-radius:var(--rad-sm);width:max-content;max-width:240px;white-space:normal;opacity:0;pointer-events:none;transition:opacity var(--dur-2);z-index:5}
.tip:hover::after,.tip:focus-visible::after{opacity:1}

/* ---------- صفحه‌بندی ---------- */
.pager{display:flex;gap:6px;align-items:center;justify-content:center;flex-wrap:wrap}
.pager a,.pager span{min-width:40px;height:40px;padding:0 10px;display:inline-grid;place-content:center;border-radius:var(--rad-md);border:1px solid var(--line-2);background:var(--surface);font-weight:700;font-size:var(--t-sm);color:var(--fg-2)}
.pager a:hover{border-color:var(--l-900);color:var(--fg)}
.pager .on{background:var(--l-900);border-color:var(--l-900);color:#fff}
.pager .dots{border:0;background:none}
.pager .more{min-width:auto;padding:0 16px}

/* ---------- اسکلت بارگذاری ---------- */
.skel{background:linear-gradient(90deg,var(--l-100) 25%,var(--l-200) 37%,var(--l-100) 63%);background-size:400% 100%;animation:skel 1.4s ease infinite;border-radius:var(--rad-sm)}
@keyframes skel{0%{background-position:100% 0}100%{background-position:0 0}}
.pcard.is-skel .ph{background:none}
.pcard.is-skel .ph .skel{width:100%;height:100%;border-radius:0}

/* ---------- گام‌ها (تسویه) ---------- */
.steps{display:flex;gap:0;align-items:center;counter-reset:st}
.steps .st{flex:1;display:flex;align-items:center;gap:8px;font-size:var(--t-sm);font-weight:600;color:var(--fg-3);position:relative}
.steps .st::before{counter-increment:st;content:counter(st,persian);width:30px;height:30px;border-radius:50%;border:2px solid var(--l-300);display:grid;place-content:center;font-weight:800;font-size:13px;background:var(--surface);flex:none}
.steps .st::after{content:"";flex:1;height:2px;background:var(--stitch);margin-inline:8px}
.steps .st:last-child::after{display:none}
.steps .st.done{color:var(--fg)}.steps .st.done::before{background:var(--l-900);border-color:var(--l-900);color:#fff}
.steps .st.on{color:var(--b2b)}.steps .st.on::before{border-color:var(--b2b);color:var(--b2b)}
@media (max-width:640px){.steps{overflow-x:auto;contain:inline-size;scrollbar-width:none;padding-bottom:4px}.steps .st{flex:none;white-space:nowrap}.steps .st::after{width:22px;flex:none}}

/* ---------- ردیف سبد (عمده) ---------- */
.cartrow{display:grid;grid-template-columns:72px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cartrow .im{width:72px;aspect-ratio:3/4;border-radius:var(--rad-sm);overflow:hidden;background:var(--surface-2)}
.cartrow .nm{font-weight:700;font-size:var(--t-sm);line-height:1.5}
.cartrow .sub{font-size:var(--t-xs);color:var(--fg-3);display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px}
.cartrow .tot{text-align:start;min-width:120px}
.cartrow .tot b{display:block;font-size:var(--t-md);font-weight:800}
.cartrow .tot small{font-size:var(--t-xs);color:var(--b2b);font-weight:700}
.cartrow .rm{color:var(--fg-3)}
@media (max-width:640px){.cartrow{grid-template-columns:60px minmax(0,1fr)}.cartrow .stepper,.cartrow .tot{grid-column:2}.cartrow .rm{grid-column:1;justify-self:center}}
.summary{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-lg);padding:18px;display:grid;gap:10px;font-size:var(--t-sm)}
.summary .ln{display:flex;justify-content:space-between;gap:12px}
.summary .ln.total{border-top:2px dashed var(--l-300);padding-top:10px;font-size:var(--t-md);font-weight:800}
.summary .ln .save{color:var(--ok);font-weight:700}

/* ---------- وضعیت سفارش ---------- */
.order{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:var(--rad-md);background:var(--surface)}
.order .no{font-weight:800}
.order .meta{font-size:var(--t-xs);color:var(--fg-3);display:flex;gap:10px;flex-wrap:wrap}
.order .st{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);font-weight:700;padding:3px 10px;border-radius:var(--rad-pill)}
.order .st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.order .st.pay{background:var(--warn-soft);color:var(--warn)}
.order .st.prep{background:var(--b2b-soft);color:var(--b2b)}
.order .st.ship{background:var(--kraft-soft);color:var(--k-700)}
.order .st.done{background:var(--ok-soft);color:var(--ok)}
.order .st.cancel{background:var(--brand-soft);color:var(--r-700)}
@media (max-width:640px){.order{grid-template-columns:minmax(0,1fr) auto}.order .st{grid-column:1/-1;justify-self:start}}

/* ---------- جدول داده ---------- */
.dt{width:100%;border-collapse:collapse;font-size:var(--t-sm);background:var(--surface)}
.dt th{background:var(--surface-2);font-weight:700;color:var(--fg-2);text-align:start;padding:10px 12px;border-bottom:1px solid var(--line)}
.dt td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.dt tr:last-child td{border-bottom:0}
.dt tbody tr:hover td{background:var(--l-50)}
.dt td.num,.dt th.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.dt-wrap{overflow-x:auto;contain:inline-size;border:1px solid var(--line);border-radius:var(--rad-md)}

/* ---------- جستجوی زنده ---------- */
.ac{background:var(--surface);border:1px solid var(--line);border-radius:var(--rad-lg);box-shadow:var(--sh-3);overflow:hidden;max-width:520px}
.ac .grp{padding:8px 14px 4px;font-size:var(--t-xs);font-weight:700;color:var(--fg-3);background:var(--surface-2)}
.ac a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 14px;font-size:var(--t-sm)}
.ac a:hover{background:var(--l-50)}
.ac a .im{width:44px;aspect-ratio:3/4;border-radius:4px;overflow:hidden;background:var(--surface-2)}
.ac a .p{font-weight:800;white-space:nowrap}
.ac a .p small{font-size:11px;font-weight:600;color:var(--fg-3)}
.ac a mark{background:var(--kraft-soft);color:inherit;padding:0 2px;border-radius:2px}
.ac .all{padding:10px 14px;text-align:center;font-weight:700;color:var(--b2b);border-top:1px solid var(--line);display:block}

/* ---------- سرتیتر دسته ---------- */
.cat-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-6);align-items:end;padding:var(--s-6) 0}
.cat-head p{color:var(--fg-2);max-width:70ch;margin:6px 0 0}
.subcats{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.subcats a{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--line-2);border-radius:var(--rad-pill);background:var(--surface);font-size:var(--t-sm);font-weight:600}
.subcats a:hover,.subcats a.on{background:var(--l-900);color:#fff;border-color:var(--l-900)}
.subcats a .cnt{font-size:var(--t-xs);opacity:.7}
@media (max-width:640px){.cat-head{grid-template-columns:minmax(0,1fr)}}

/* ---------- مینی‌کارت ---------- */
.minicart .cartrow{grid-template-columns:52px minmax(0,1fr) auto;padding:10px 0}
.minicart .cartrow .im{width:52px}

/* ---------- ۴۰۴ ---------- */
.p404{text-align:center;padding:var(--s-16) var(--s-4);display:grid;gap:12px;justify-items:center}
.p404 .code{font-family:var(--font-display);font-size:clamp(4rem,10vw,7rem);font-weight:800;line-height:1;color:var(--l-300);letter-spacing:0}
.p404 .code span{color:var(--brand)}

/* ---------- عکس محصول: قاب راهنما ---------- */
.shotlist{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
@media (max-width:900px){.shotlist{grid-template-columns:repeat(3,minmax(0,1fr))}}
.shotlist div{aspect-ratio:3/4;border:2px dashed var(--l-300);border-radius:var(--rad-md);display:grid;place-content:center;text-align:center;font-size:var(--t-xs);font-weight:700;color:var(--fg-3);padding:8px;background:var(--surface)}
.shotlist div b{display:block;font-size:var(--t-xl);font-family:var(--font-display);color:var(--fg)}

/* ---------- نوار متری (اصلاح) ---------- */
.tape{height:24px;border:1px solid var(--k-300);border-radius:3px;background-color:var(--k-100);background-image:repeating-linear-gradient(90deg,var(--k-700) 0 1px,transparent 1px 10px),repeating-linear-gradient(90deg,var(--k-700) 0 1px,transparent 1px 50px);background-size:100% 8px,100% 16px;background-repeat:no-repeat;background-position:0 0,0 0}

/* ---------- سه خط اعتماد ---------- */
.trust3{display:grid;gap:8px;font-size:var(--t-sm)}
.trust3 div{display:flex;gap:10px;align-items:center;color:var(--fg-2)}
.trust3 svg{width:18px;height:18px;color:var(--b2b);flex:none}

.co-grid{grid-template-columns:minmax(0,1fr) 340px}
@media (max-width:900px){.co-grid{grid-template-columns:minmax(0,1fr)}}


/* ============================================================
   v2.0 «روشن / ROSHAN» — لایهٔ مدرن: سفید، گرادیان ملایم قرمز→نارنجی،
   گوشه‌های خیلی گرد، فضای خالی زیاد. این فایل بعد از base و v11 لود
   می‌شود و فقط توکن‌ها + شکل اجزا را بازنویسی می‌کند.
   ============================================================ */
:root{
  /* خنثی سرد و روشن */
  --l-0:#FFFFFF; --l-50:#FFFFFF; --l-100:#F5F6F8; --l-200:#ECEEF2; --l-300:#DDE0E6; --l-400:#B7BCC7;
  --l-500:#8A90A0; --l-600:#626878; --l-700:#454A57; --l-800:#262A33; --l-900:#111318;
  /* قرمز لوگو + نارنجی گرادیان */
  --r-50:#FFF1F2; --r-100:#FFE0E3; --r-200:#FFB9BF; --r-300:#FF8A93; --r-400:#F04B58; --r-500:#E11D2E;
  --r-600:#C4142A; --r-700:#9F1024; --r-800:#7A0C1C; --r-900:#4F0812;
  --o-500:#D63A0A; --o-400:#F97316;
  /* اطلاعات / اعتماد: آبی سرد ملایم به‌جای نیلی جین */
  --d-50:#EEF4FF; --d-100:#D9E5FF; --d-200:#B3CBFF; --d-300:#7FA6F5; --d-400:#4F7FE0; --d-500:#2F5FC4;
  --d-600:#254CA0; --d-700:#1C3A7A; --d-800:#132754; --d-900:#0B1730;
  /* «کرافت» دیگر رنگ برند نیست — فقط برای سازگاری کلاس‌های قدیمی: خاکستری خیلی روشن */
  --k-100:#F5F6F8; --k-300:#DDE0E6; --k-500:#ECEEF2; --k-700:#454A57;
  --ok-500:#15803D; --ok-50:#ECFDF3; --warn-500:#B45309; --warn-50:#FFF7ED; --err-500:#E11D2E;

  --page:#FFFFFF; --surface:#FFFFFF; --surface-2:#F5F6F8; --surface-3:#ECEEF2;
  --fg:#111318; --fg-2:#454A57; --fg-3:#626878; --fg-on-dark-2:#C9CDD6;
  --line:#ECEEF2; --line-2:#DDE0E6;
  --brand:#E11D2E; --brand-hover:#C4142A; --brand-active:#9F1024; --brand-soft:#FFF1F2;
  --grad:linear-gradient(135deg,#E11D2E 0%,#D63A0A 100%);
  --grad-soft:linear-gradient(135deg,rgba(225,29,46,.10),rgba(249,115,22,.10));
  --b2b:#2F5FC4; --b2b-hover:#254CA0; --b2b-soft:#EEF4FF;
  --kraft:#ECEEF2; --kraft-soft:#F5F6F8; --kraft-fg:#111318;

  --rad-xs:8px; --rad-sm:12px; --rad-md:16px; --rad-lg:22px; --rad-xl:28px;
  --sh-1:0 1px 2px rgba(17,19,24,.04),0 1px 1px rgba(17,19,24,.03);
  --sh-2:0 8px 24px rgba(17,19,24,.06),0 1px 2px rgba(17,19,24,.04);
  --sh-3:0 24px 60px rgba(17,19,24,.12),0 4px 12px rgba(17,19,24,.05);
  --stitch:linear-gradient(90deg,var(--l-300),var(--l-300));
  --t-4xl:clamp(2.5rem,1.8rem + 3.4vw,3.75rem);
  --t-3xl:clamp(2rem,1.5rem + 2.2vw,2.75rem);
  --lh-tight:1.2;
}
body{background:var(--page);overflow-x:clip}
h1,h2{letter-spacing:-.01em}

/* ---------- امضاها به شکل مدرن ---------- */
.stitch{height:1px;background:var(--line);margin:var(--s-8) 0}
.stitch-b{border-bottom:1px solid var(--line)}
.stitch-box{border:1px solid var(--line);border-radius:var(--rad-lg);background:var(--surface-2)}
.tag{clip-path:none;border-radius:999px;padding:5px 12px;background:rgba(255,255,255,.85);color:var(--fg);backdrop-filter:blur(8px);box-shadow:var(--sh-1);border:1px solid rgba(17,19,24,.06)}
.tag::before{display:none}
.tag.red{background:var(--grad);color:#fff;border:0}
.tag.ink{background:var(--l-900);color:#fff;border:0}
.tag.denim{background:var(--b2b-soft);color:var(--b2b);border:0}
.tag.ok{background:var(--ok-soft);color:var(--ok);border:0}
.tag.warn{background:var(--warn-soft);color:var(--warn);border:0}
.tag.lg{padding:8px 16px}
.pcard .ph .tags .tag{clip-path:none;border-radius:999px}
.pcard .ph .tags{inset-inline-start:12px}
.pack i{border-radius:50%;box-shadow:inset 0 0 0 1px rgba(17,19,24,.08)}
.fab{border-color:var(--line);background:var(--surface-2)}
.fab::before{border:0}
.tape{display:none}

/* ---------- دکمه‌ها: پیل + گرادیان ---------- */
.btn{border-radius:999px;min-height:46px;padding:0 20px}
.btn-lg{border-radius:999px;min-height:54px;padding:0 28px}
.btn-sm{border-radius:999px;min-height:36px}
.btn-icon{border-radius:50%}
.btn-primary{background:var(--grad);border:0;box-shadow:0 8px 20px rgba(225,29,46,.22)}
.btn-primary:hover{background:linear-gradient(135deg,#C4142A,#B83208);box-shadow:0 10px 24px rgba(225,29,46,.28)}
.btn-ink{background:var(--l-900)}
.btn-outline{border-color:var(--line-2)}
.btn-outline:hover{background:var(--surface-2);color:var(--fg)}
.btn-soft{background:var(--surface-2)}
.stepper{border-radius:999px}
.stepper button{background:transparent}
.stepper button:hover{background:var(--surface-2)}
.input,select.input,textarea.input{border-radius:var(--rad-md);border-color:var(--line-2);background:var(--surface-2)}
.input:focus{background:var(--surface);border-color:var(--l-900);box-shadow:0 0 0 4px rgba(17,19,24,.06)}
.check input{border-radius:6px}
.chip{border-radius:999px;border-color:var(--line);background:var(--surface-2)}
.chip.on{background:var(--l-900);border-color:var(--l-900)}
.badge{padding:3px 10px}
.badge.new{background:var(--grad)}

/* ---------- کارت ---------- */
.pcard{border:0;border-radius:var(--rad-lg);box-shadow:var(--sh-1);background:var(--surface)}
.pcard:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.pcard .ph{border-radius:var(--rad-lg) var(--rad-lg) 0 0;background:var(--surface-2)}
.pcard .body{padding:14px 16px 16px}
.pcard .price .p{font-size:var(--t-xl)}
.pcard .price .pack-p{color:var(--fg-3)}
.pcard .quick .btn{border-radius:999px}
.card{border:0;box-shadow:var(--sh-1);border-radius:var(--rad-lg)}
.card.kraft{background:var(--surface-2);box-shadow:none}
.card.denim{background:var(--l-900);color:#fff}

/* ---------- پله ---------- */
.tier{border-radius:var(--rad-md);border-color:var(--line)}
.tier:hover{border-color:var(--l-400)}
.tier.on{border-color:transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--grad) border-box;box-shadow:none;border:2px solid transparent}
.tier .save{background:var(--grad);color:#fff}
.packmix .pc{border-color:var(--line);border-radius:var(--rad-sm)}
.packmix .pc i{border-radius:8px}

/* ---------- نوار B2B: روشن و بی‌سروصدا ---------- */
.b2bbar{background:var(--surface-2);color:var(--fg-2);border-bottom:1px solid var(--line)}
.b2bbar .it b{color:var(--fg)}
.b2bbar .it svg{color:var(--brand)}

/* ---------- هدر شیشه‌ای ---------- */
.hdr{background:rgba(255,255,255,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(17,19,24,.06)}
.hdr .search{border-radius:999px;background:var(--surface-2);border-color:transparent}
.hdr .search:focus-within{background:var(--surface);border-color:var(--line-2);box-shadow:0 0 0 4px rgba(17,19,24,.05)}
.hdr .act{border-radius:50%}
.hdr .act .cnt{background:var(--grad)}
.nav{border-top:0}
.nav a{border-bottom:0;border-radius:999px;padding:8px 14px;margin:6px 0}
.nav a:hover{background:var(--surface-2)}
.nav a.on{background:var(--l-900);color:#fff}
.nav a.b2b{color:var(--brand)}
.mega{border:0;border-radius:var(--rad-xl);box-shadow:var(--sh-3)}
.mega h5{border-bottom:1px solid var(--line)}
.mega .promo{background:var(--grad-soft);border-radius:var(--rad-lg)}

/* ---------- فیلتر / آرشیو ---------- */
.fgroup{border:0;background:var(--surface-2);border-radius:var(--rad-lg)}
.subcats a{border-color:var(--line);background:var(--surface-2)}
.toolbar select.input{border-radius:999px}

/* ---------- بخش / تیتر ---------- */
.sec{padding:var(--s-16) 0}
.sec-h .eyebrow{color:var(--brand)}
.sec-h .eyebrow::before{background:var(--grad);height:3px;border-radius:2px}
.ctile{border-radius:var(--rad-xl)}
.tabs{border-bottom:1px solid var(--line)}
.tabs button.on{border-bottom-color:var(--brand);color:var(--fg)}
.spec th{background:var(--surface-2)}

/* ---------- فوتر روشن ---------- */
.ftr{background:var(--surface-2);color:var(--fg-2);border-top:1px solid var(--line)}
.ftr h6{color:var(--fg)}
.ftr a:hover{color:var(--fg)}
.ftr .bot{border-top-color:var(--line);color:var(--fg-3)}
.ftr .seal span{background:var(--surface);color:var(--fg-3);box-shadow:var(--sh-1);border-radius:var(--rad-sm)}

/* ---------- پیام‌ها ---------- */
.alert{border:0;border-radius:var(--rad-md)}
.alert.ok{background:var(--ok-soft)}.alert.warn{background:var(--warn-soft)}.alert.err{background:var(--brand-soft)}.alert.info{background:var(--b2b-soft)}
.empty{border:1px dashed var(--line-2);border-radius:var(--rad-xl);background:var(--surface-2)}
.toast{border-radius:999px;padding:12px 20px}
.modal{border-radius:var(--rad-xl)}
.modal .mh{border-bottom:1px solid var(--line)}
.drawer.static{border:0;box-shadow:var(--sh-2)}
.acc{border:0;background:var(--surface-2)}
.acc details{border-bottom:1px solid var(--surface)}
.pager a,.pager span{border-radius:50%}
.pager .more{border-radius:999px}
.steps .st::before{border-color:var(--line-2)}
.steps .st.on::before{border-color:var(--brand);color:var(--brand)}
.steps .st.on{color:var(--fg)}
.summary{border:0;box-shadow:var(--sh-2);border-radius:var(--rad-xl)}
.summary .ln.total{border-top:1px solid var(--line)}
.order{border:0;background:var(--surface-2)}
.logo-lock .mark{border-radius:50%}
.p404 .code{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.p404 .code span{color:transparent}

/* ---------- گرادیان‌های تزئینی ---------- */
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.grad-bg{background:var(--grad);color:#fff}
.glow{position:relative;isolation:isolate}
.glow::before{content:"";position:absolute;inset:-10% -5%;z-index:-1;background:radial-gradient(60% 60% at 80% 20%,rgba(225,29,46,.10),transparent 60%),radial-gradient(50% 50% at 15% 80%,rgba(249,115,22,.10),transparent 60%);pointer-events:none}

/* ---------- تایپوگرافی: سلسله‌مراتب یکدست در همهٔ صفحه‌ها ---------- */
.btn{font-size:var(--t-sm)}
.btn-sm{font-size:var(--t-xs)}
.widget-title,.widgettitle,.filters h2,.filters h3,.filters h6{font-size:var(--t-sm)!important;font-weight:800;margin:0 0 10px;line-height:1.4}
.prose .entry h2,.woocommerce-tabs .panel h2,.entry-content h2{font-size:var(--t-xl)}
.prose .entry h3,.woocommerce-tabs .panel h3,.entry-content h3{font-size:var(--t-lg)}
.prose .entry h4,.woocommerce-tabs .panel h4,.entry-content h4{font-size:var(--t-md)}
.prose .entry,.woocommerce-tabs .panel,.entry-content{font-size:var(--t-md);line-height:1.9}
.prose .entry p,.woocommerce-tabs .panel p,.entry-content p{margin:0 0 1em}
.prose .entry li,.woocommerce-tabs .panel li{line-height:1.9}
.prose .entry table,.woocommerce-tabs .panel table{font-size:var(--t-sm)}
.elementor-widget-text-editor{font-size:var(--t-md);line-height:1.9}
small,.small{font-size:var(--t-xs)}
@media (max-width:640px){
  h1{font-size:clamp(1.75rem,1.4rem + 2vw,2.25rem)}
  h2{font-size:clamp(1.5rem,1.2rem + 1.6vw,1.9rem)}
  .btn-lg{font-size:var(--t-sm)}
}
