/* ==========================================================================
   RAHIQ — سیستم استایل سایت
   فاز اول: ساختار و ظاهر ثابت (بدون موشن)
   ========================================================================== */

/* ---------- فونت‌ها ----------
   همه از jsDelivr بارگذاری می‌شوند (نه Google Fonts) چون در ایران پایدارتر است.
   برای سرعت بیشتر، بعداً فایل‌های woff2 را در assets/fonts خودِ سایت میزبانی کنید. */
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource-variable/fraunces@5.3.0/index.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource-variable/fraunces@5.3.0/wght-italic.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/inter@5.2.6/400.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/inter@5.2.6/500.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/inter@5.2.6/600.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/anton@5.2.5/index.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/baloo-2@5.3.0/600.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/baloo-2@5.3.0/800.css');

/* استعداد (تیتر فارسی) — مخزن رسمی فایل CSS ندارد، پس اینجا تعریف می‌شود */
@font-face{
  font-family:'Estedad'; font-style:normal; font-weight:800; font-display:swap;
  src:url('https://cdn.jsdelivr.net/gh/aminabedi68/Estedad@8.5/fonts/Statics/webfonts/Estedad-ExtraBold.woff2') format('woff2');
}
@font-face{
  font-family:'Estedad'; font-style:normal; font-weight:900; font-display:swap;
  src:url('https://cdn.jsdelivr.net/gh/aminabedi68/Estedad@8.5/fonts/Statics/webfonts/Estedad-Black.woff2') format('woff2');
}
@font-face{
  font-family:'Estedad'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('https://cdn.jsdelivr.net/gh/aminabedi68/Estedad@8.5/fonts/Statics/webfonts/Estedad-SemiBold.woff2') format('woff2');
}

/* ==========================================================================
   ۱. توکن‌ها
   ========================================================================== */
:root{
  /* پالت برند */
  --ink:        #0A0A0A;   /* مشکی — رنگ اصلی */
  --paper:      #FFFFFF;   /* سفید — رنگ دوم */
  --studio:     #ECECEA;   /* خاکستری گرم استودیو — زمینه ثابت کارت محصول */
  --gray:       #9A9CA1;   /* طوسی G4 */
  --navy:       #2C3A5E;   /* سرمه‌ای N4 — فقط اکسنت */
  --wine:       #87202F;   /* زرشکی Z4 — فقط لیمیتد */

  /* مشتق‌ها */
  --ink-soft:   #48494C;
  --line:       rgba(10,10,10,.12);
  --line-strong:rgba(10,10,10,.28);
  --surface:    #F7F7F5;
  --navy-ink:   #FFFFFF;

  /* تایپوگرافی */
  --fa-body: 'Vazirmatn', system-ui, sans-serif;
  --fa-head: 'Estedad', 'Vazirmatn', system-ui, sans-serif;
  --en-head: 'Fraunces Variable', 'Fraunces', Georgia, serif;
  --en-body: 'Inter', system-ui, sans-serif;
  --display:  'Anton', 'Inter', sans-serif;
  --logo:    'Baloo 2', 'Inter', sans-serif;

  /* مقیاس مدولار ۱٫۲۵ */
  --fs-display: clamp(38px, 8vw, 56px);
  --fs-h1:      clamp(26px, 4.4vw, 31px);
  --fs-h2:      clamp(21px, 3.4vw, 25px);
  --fs-body:    16px;
  --fs-cap:     13px;

  /* ریتم */
  --wrap: 1240px;
  --gut: 24px;
  --sec: clamp(56px, 9vw, 104px);
  --arch: 999px 999px 10px 10px;

  --nav-h: 66px;
}

/* ---------- تم شب ---------- */
[data-theme="night"]{
  --ink:        #F3F3F1;
  --paper:      #0A0A0A;
  --studio:     #191919;
  --gray:       #8A8C91;
  --navy:       #3E4E74;
  --ink-soft:   #B7B8BB;
  --line:       rgba(255,255,255,.14);
  --line-strong:rgba(255,255,255,.32);
  --surface:    #111111;
}

/* ==========================================================================
   ۲. پایه
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--fa-body);
  font-size:var(--fs-body);
  line-height:1.85;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4{ font-family:var(--fa-head); font-weight:800; line-height:1.35; margin:0; }
p{ margin:0 0 1em; }
:focus-visible{ outline:2px solid var(--navy); outline-offset:3px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }
.sec{ padding-block:var(--sec); }
.hide{ display:none !important; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* برچسب‌های ریزِ کشیده */
.eyebrow{
  font-family:var(--en-body);
  font-size:11px; font-weight:500;
  letter-spacing:.28em; text-transform:uppercase;
  color:var(--gray); direction:ltr;
}
.eyebrow--fa{ font-family:var(--fa-body); letter-spacing:.12em; }

.lat{ font-family:var(--en-body); direction:ltr; unicode-bidi:isolate; }
.num{ font-family:var(--en-body); direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums; }

.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:34px; }
.sec-head h2{ font-size:var(--fs-h1); }
.sec-title-en{ font-family:var(--en-head); font-weight:600; font-size:var(--fs-h1); direction:ltr; }
.rule{ height:1px; background:var(--line); border:0; margin:0; }

/* ==========================================================================
   ۳. دکمه‌ها
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius:2px;
  font-family:var(--fa-body); font-weight:600; font-size:15px; line-height:1;
  border:1px solid transparent; cursor:pointer; text-align:center;
}
.btn--solid{ background:var(--ink); color:var(--paper); }
.btn--ghost{ border-color:var(--line-strong); color:var(--ink); }
.btn--navy{ background:var(--navy); color:#fff; }
.btn--onnavy{ background:#fff; color:var(--navy); }
.btn--full{ width:100%; }
.btn--sm{ padding:11px 20px; font-size:13px; }
.btn[disabled]{ opacity:.4; cursor:not-allowed; }

/* ==========================================================================
   ۴. نوار اعلان + نویگیشن
   ========================================================================== */
.announce{
  background:var(--ink); color:var(--paper);
  text-align:center; font-size:12.5px; letter-spacing:.02em;
  padding:9px 16px;
}
[data-theme="night"] .announce{ background:var(--navy); color:#fff; }

.nav{
  position:sticky; top:0; z-index:60;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.nav__in{
  height:var(--nav-h);
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  gap:12px;
}
.nav__links{ display:flex; align-items:center; gap:26px; }
.nav__links a{ font-size:14.5px; padding-block:6px; border-bottom:1px solid transparent; }
.nav__links a.is-active{ border-bottom-color:var(--navy); color:var(--navy); }
.nav__logo{
  font-family:var(--logo); font-weight:800;
  font-size:26px; letter-spacing:.06em; line-height:1;
  direction:ltr; text-align:center; padding-inline:8px;
}
.nav__tools{ display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.icon-btn{
  width:40px; height:40px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  position:relative;
}
.icon-btn:hover{ background:var(--surface); }
.icon-btn svg{ width:19px; height:19px; stroke:currentColor; fill:none; stroke-width:1.5; }
.cart-count{
  position:absolute; inset-block-start:4px; inset-inline-start:4px;
  min-width:17px; height:17px; padding:0 4px; border-radius:999px;
  background:var(--navy); color:#fff;
  font-family:var(--en-body); font-size:10px; font-weight:600;
  display:flex; align-items:center; justify-content:center;
}
.nav__burger{ display:none; }

/* جستجو */
.search{
  display:none; border-top:1px solid var(--line);
  background:var(--paper); padding-block:16px;
}
.search.is-open{ display:block; }
.search__in{ display:flex; gap:10px; align-items:center; }
.search input{
  flex:1; padding:13px 16px; border:1px solid var(--line-strong);
  border-radius:2px; background:transparent;
}
.search__hint{ font-size:12.5px; color:var(--gray); margin-top:8px; }

/* منوی موبایل */
.mmenu{
  position:fixed; inset:0; z-index:80; background:var(--paper);
  transform:translateX(-100%); visibility:hidden;
  display:flex; flex-direction:column;
}
.mmenu.is-open{ transform:none; visibility:visible; }
.mmenu__top{ height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; }
.mmenu__links{ display:flex; flex-direction:column; gap:4px; padding-top:20px; }
.mmenu__links a{
  font-family:var(--fa-head); font-weight:800; font-size:26px;
  padding-block:14px; border-bottom:1px solid var(--line);
}
.mmenu__foot{ margin-top:auto; padding-block:26px; }

/* ==========================================================================
   ۵. هیرو
   ========================================================================== */
.hero{ position:relative; background:var(--paper); padding-top:26px; overflow:hidden; }
.hero__stage{
  position:relative;
  display:flex; align-items:flex-end; justify-content:center;
  min-height:min(76vh, 640px);
}
.hero__word{
  position:absolute; inset-block-start:6%; inset-inline:0;
  text-align:center; direction:ltr;
  font-family:var(--display);
  font-size:clamp(84px, 21vw, 300px);
  line-height:.82; letter-spacing:.01em;
  color:var(--ink); opacity:.94;
  pointer-events:none; user-select:none;
}
.hero__arch{
  position:relative; z-index:2;
  width:min(46%, 420px); aspect-ratio:3/4.1;
  background:var(--studio); border-radius:var(--arch);
  display:flex; align-items:flex-end; justify-content:center;
  overflow:hidden;
}
.hero__arch img,.hero__arch svg{ width:100%; height:100%; object-fit:cover; }
.hero__tag{
  position:absolute; z-index:3; inset-block-end:22px; inset-inline-start:0;
  font-family:var(--en-head); font-style:italic; font-weight:600;
  font-size:clamp(19px, 2.6vw, 27px); line-height:1.5;
  max-width:230px;
}
.hero__cta{
  position:absolute; z-index:3; inset-block-end:22px; inset-inline-end:0;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px;
}
.hero__strap{ margin-top:14px; text-align:center; padding-bottom:26px; }

/* ==========================================================================
   ۶. متن‌نوار (marquee) — فعلاً ثابت، موشن در فاز بعد
   ========================================================================== */
.marquee{
  background:var(--ink); color:var(--paper);
  padding-block:14px; overflow:hidden; white-space:nowrap;
}
.marquee__track{ display:flex; gap:44px; padding-inline:22px; }
.marquee span{
  font-family:var(--en-body); font-size:12px; font-weight:500;
  letter-spacing:.3em; text-transform:uppercase; direction:ltr;
}
.marquee span.fa{ font-family:var(--fa-body); letter-spacing:.1em; direction:rtl; }

/* ==========================================================================
   ۷. کارت محصول (پس‌زمینه‌ی یکدست و ثابت)
   ========================================================================== */
.grid{ display:grid; gap:26px; }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--4{ grid-template-columns:repeat(4,1fr); }

.card{ display:block; }
.card__media{
  position:relative; background:var(--studio);
  border-radius:var(--arch); overflow:hidden;
  aspect-ratio:3/3.7;
  display:flex; align-items:center; justify-content:center;
}
.card__media svg{ width:78%; height:auto; }
.card__badge{
  position:absolute; inset-block-start:16px; inset-inline-start:16px;
  background:var(--paper); color:var(--ink);
  font-size:11px; letter-spacing:.08em; padding:5px 10px; border-radius:2px;
}
.card__body{ padding-top:14px; display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.card__name{ font-family:var(--fa-head); font-weight:800; font-size:16px; }
.card__color{ font-size:13px; color:var(--gray); }
.card__price{ font-size:14.5px; font-weight:500; white-space:nowrap; }

/* ردیف طرح در فروشگاه */
.design-row{ margin-bottom:64px; }
.design-row__head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:16px; padding-bottom:14px; margin-bottom:24px; border-bottom:1px solid var(--line);
}
.design-row__name{ font-family:var(--fa-head); font-weight:800; font-size:var(--fs-h2); }
.design-row__meta{ font-size:14px; color:var(--gray); }
.card.is-soon .card__media{ opacity:.55; }
.card.is-soon{ pointer-events:none; }

/* ==========================================================================
   ۸. بلوک مانیفست (سرمه‌ای)
   ========================================================================== */
.manifest{ background:var(--navy); color:var(--navy-ink); }
.manifest__in{ max-width:820px; margin-inline:auto; text-align:center; }
.manifest__quote{
  font-family:var(--en-head); font-style:italic; font-weight:400;
  font-size:clamp(24px, 3.6vw, 38px); line-height:1.6; margin:22px 0 26px;
}
.manifest__fa{ font-family:var(--fa-body); font-size:16.5px; line-height:2; opacity:.86; }
.manifest .eyebrow{ color:rgba(255,255,255,.6); }

/* ==========================================================================
   ۹. نظرات مشتری
   ========================================================================== */
.review{ border:1px solid var(--line); padding:26px; border-radius:2px; background:var(--paper); }
.stars{ color:var(--ink); letter-spacing:.18em; font-size:13px; direction:ltr; }
.review__text{ margin:14px 0 18px; font-size:15px; line-height:2; }
.review__who{ font-size:13px; color:var(--gray); }

/* ==========================================================================
   ۱۰. نوار اعتماد
   ========================================================================== */
.trust{ border-block:1px solid var(--line); }
.trust__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.trust__item{ padding:30px 18px; text-align:center; border-inline-start:1px solid var(--line); }
.trust__item:first-child{ border-inline-start:0; }
.trust__item b{ display:block; font-family:var(--fa-head); font-size:15px; margin-bottom:4px; }
.trust__item span{ font-size:13px; color:var(--gray); }

/* ==========================================================================
   ۱۱. فوتر
   ========================================================================== */
.footer{ background:var(--ink); color:var(--paper); padding-top:64px; }
[data-theme="night"] .footer{ background:#000; }
.footer a{ color:rgba(255,255,255,.72); }
.footer a:hover{ color:#fff; }
.footer__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; }
.footer__logo{ font-family:var(--logo); font-weight:800; font-size:30px; letter-spacing:.06em; direction:ltr; }
.footer__strap{ margin-top:8px; color:rgba(255,255,255,.5); }
.footer h4{ font-size:14px; color:#fff; margin-bottom:16px; }
.footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; font-size:14px; }
.news{ display:flex; gap:8px; margin-top:18px; max-width:340px; }
.news input{
  flex:1; background:transparent; border:1px solid rgba(255,255,255,.28);
  color:#fff; padding:12px 14px; border-radius:2px;
}
.news input::placeholder{ color:rgba(255,255,255,.42); }
.news button{ background:#fff; color:var(--ink); padding:0 20px; border-radius:2px; font-weight:600; font-size:14px; }
.footer__badges{ display:flex; gap:12px; flex-wrap:wrap; padding-block:26px; border-top:1px solid rgba(255,255,255,.14); }
.badge{
  border:1px solid rgba(255,255,255,.22); border-radius:3px;
  padding:10px 14px; font-size:12px; color:rgba(255,255,255,.72);
  display:flex; align-items:center; gap:8px; min-height:52px;
}
.footer__bottom{
  border-top:1px solid rgba(255,255,255,.14);
  padding-block:20px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:12.5px; color:rgba(255,255,255,.5);
}

/* ==========================================================================
   ۱۲. صفحه فروشگاه — نوار فیلتر
   ========================================================================== */
.page-head{ padding-block:clamp(38px,6vw,64px) 30px; }
.page-head h1{ font-size:var(--fs-display); font-family:var(--fa-head); }
.page-head .lead{ max-width:560px; color:var(--ink-soft); margin-top:10px; }

.filters{
  position:sticky; top:var(--nav-h); z-index:40;
  background:var(--paper); border-block:1px solid var(--line);
  padding-block:12px; margin-bottom:44px;
}
.filters__in{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.chips{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{
  border:1px solid var(--line-strong); border-radius:999px;
  padding:8px 16px; font-size:13.5px;
}
.chip.is-on{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.filters__right{ display:flex; align-items:center; gap:14px; }
.filters__count{ font-size:13px; color:var(--gray); }
.sort{ border:1px solid var(--line-strong); border-radius:2px; padding:9px 12px; background:transparent; font-size:13.5px; }
.filters__toggle{ display:none; }

/* ==========================================================================
   ۱۳. صفحه محصول
   ========================================================================== */
.pdp{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; padding-block:36px; align-items:start; }
.pdp__media{ display:grid; grid-template-columns:82px 1fr; gap:16px; }
.thumbs{ display:flex; flex-direction:column; gap:12px; }
.thumb{
  background:var(--studio); border-radius:999px 999px 6px 6px;
  aspect-ratio:3/3.8; overflow:hidden; border:1px solid transparent;
  display:flex; align-items:center; justify-content:center; padding:8px;
}
.thumb svg{ width:100%; height:auto; }
.thumb.is-on{ border-color:var(--ink); }
.stage{
  background:var(--studio); border-radius:var(--arch); overflow:hidden;
  aspect-ratio:3/3.8; display:flex; align-items:center; justify-content:center;
}
.stage svg{ width:74%; height:auto; }
.pdp__slider{ display:none; }

.pdp__info{ position:sticky; top:calc(var(--nav-h) + 22px); }
.pdp__title{ font-size:var(--fs-h1); margin-bottom:6px; }
.pdp__rating{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--gray); margin-bottom:18px; }
.pdp__price{ font-size:24px; font-weight:600; font-family:var(--fa-head); }
.pdp__note{ font-size:13px; color:var(--gray); margin-top:4px; }

.opt{ margin-top:28px; }
.opt__label{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:12px; }
.opt__label b{ font-family:var(--fa-head); font-size:14.5px; }
.opt__label a,.opt__label span{ font-size:13px; color:var(--gray); }

.swatches{ display:flex; gap:12px; }
.swatch{
  width:74px; border:1px solid var(--line); border-radius:999px 999px 4px 4px;
  background:var(--studio); padding:6px; overflow:hidden;
}
.swatch.is-on{ border-color:var(--ink); box-shadow:0 0 0 1px var(--ink); }
.swatch svg{ width:100%; height:auto; }

.sizes{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; max-width:320px; }
.size{
  border:1px solid var(--line-strong); border-radius:2px; padding:14px 0;
  font-family:var(--en-body); font-size:15px; letter-spacing:.06em; text-align:center;
}
.size.is-on{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.size[disabled]{ opacity:.35; text-decoration:line-through; }

.buy{ display:flex; gap:12px; margin-top:30px; }
.buy .btn{ flex:1; }
.perks{ list-style:none; margin:26px 0 0; padding:22px 0 0; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:12px; font-size:14px; }
.perks li{ display:flex; gap:10px; align-items:flex-start; }
.perks li::before{ content:"—"; color:var(--gray); }

.story-block{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.story-block__text h2{ font-family:var(--en-head); font-weight:600; font-style:italic; font-size:clamp(26px,3.6vw,40px); direction:ltr; margin-bottom:18px; }
.editorial{ background:var(--studio); border-radius:4px; aspect-ratio:4/5; display:flex; align-items:center; justify-content:center; }
.editorial svg{ width:62%; height:auto; }
.editorial--wide{ aspect-ratio:16/10; }

.specs{ width:100%; border-collapse:collapse; font-size:14.5px; }
.specs th,.specs td{ text-align:start; padding:14px 4px; border-bottom:1px solid var(--line); vertical-align:top; }
.specs th{ font-family:var(--fa-head); font-weight:800; width:200px; }

.sticky-buy{
  display:none; position:fixed; inset-inline:0; inset-block-end:0; z-index:70;
  background:var(--paper); border-top:1px solid var(--line);
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  gap:12px; align-items:center;
}
.sticky-buy .btn{ flex:1; }
.sticky-buy__price{ font-size:15px; font-weight:600; white-space:nowrap; }

/* ==========================================================================
   ۱۴. سبد خرید
   ========================================================================== */
.cart{ display:grid; grid-template-columns:1.5fr .9fr; gap:48px; align-items:start; padding-bottom:var(--sec); }
.cart__list{ border-top:1px solid var(--line); }
.line{ display:grid; grid-template-columns:96px 1fr auto; gap:18px; padding-block:22px; border-bottom:1px solid var(--line); align-items:center; }
.line__media{ background:var(--studio); border-radius:999px 999px 4px 4px; aspect-ratio:3/3.7; display:flex; align-items:center; justify-content:center; padding:8px; }
.line__media svg{ width:100%; height:auto; }
.line__name{ font-family:var(--fa-head); font-weight:800; font-size:16px; }
.line__meta{ font-size:13px; color:var(--gray); margin-top:4px; }
.line__tools{ display:flex; align-items:center; gap:16px; margin-top:12px; }
.qty{ display:flex; align-items:center; border:1px solid var(--line-strong); border-radius:2px; }
.qty button{ width:34px; height:34px; font-size:16px; }
.qty span{ width:38px; text-align:center; font-family:var(--en-body); font-size:14px; }
.line__remove{ font-size:13px; color:var(--gray); text-decoration:underline; }
.line__price{ font-weight:600; white-space:nowrap; }

.ship-bar{ background:var(--surface); border:1px solid var(--line); border-radius:2px; padding:18px 20px; margin-bottom:26px; }
.ship-bar__text{ font-size:14px; margin-bottom:12px; }
.ship-bar__track{ height:6px; background:var(--line); border-radius:999px; overflow:hidden; }
.ship-bar__fill{ height:100%; background:var(--navy); width:0; }

.summary{ border:1px solid var(--line); border-radius:2px; padding:26px; position:sticky; top:calc(var(--nav-h) + 22px); }
.summary h3{ font-size:var(--fs-h2); margin-bottom:20px; }
.summary__row{ display:flex; justify-content:space-between; gap:12px; padding-block:10px; font-size:14.5px; }
.summary__row--total{ border-top:1px solid var(--line); margin-top:10px; padding-top:16px; font-size:17px; font-weight:600; font-family:var(--fa-head); }
.coupon{ display:flex; gap:8px; margin:18px 0; }
.coupon input{ flex:1; border:1px solid var(--line-strong); border-radius:2px; padding:12px 14px; background:transparent; }
.pay-badges{ display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.pay-badge{ border:1px solid var(--line); border-radius:3px; padding:10px 12px; font-size:11.5px; color:var(--gray); flex:1; text-align:center; min-width:110px; }
.empty{ text-align:center; padding:70px 20px; }
.empty p{ color:var(--gray); }

/* ==========================================================================
   ۱۵. داستان برند
   ========================================================================== */
.story-hero{ text-align:center; padding-block:clamp(60px,10vw,120px); }
.story-hero__tag{ font-family:var(--en-head); font-style:italic; font-weight:600; font-size:clamp(30px,6vw,62px); }
.chapter{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; padding-block:var(--sec); border-top:1px solid var(--line); }
.chapter__num{ font-family:var(--en-body); font-size:12px; letter-spacing:.3em; color:var(--gray); direction:ltr; }
.chapter h2{ font-size:var(--fs-h1); margin:12px 0 18px; }
.chapter__ar{ font-family:var(--en-head); font-size:26px; line-height:2; direction:rtl; color:var(--ink-soft); margin-bottom:14px; }
.chapter--flip .chapter__media{ order:-1; }
.values{ display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); }
.value{ padding:44px 26px; border-inline-start:1px solid var(--line); }
.value:first-child{ border-inline-start:0; }
.value b{ display:block; font-family:var(--fa-head); font-size:18px; margin-bottom:8px; }
.value span{ color:var(--ink-soft); font-size:14.5px; }
.cta-band{ text-align:center; padding-block:var(--sec); }

/* ==========================================================================
   ۱۶. ریسپانسیو — موبایل‌فرست کامل
   ========================================================================== */
@media (max-width:1024px){
  .footer__top{ grid-template-columns:1fr 1fr; gap:34px; }
  .pdp{ gap:34px; }
  .cart{ grid-template-columns:1fr; }
  .summary{ position:static; }
}

@media (max-width:860px){
  :root{ --gut:18px; --nav-h:58px; }

  .nav__in{ grid-template-columns:auto 1fr auto; }
  .nav__links{ display:none; }
  .nav__burger{ display:inline-flex; }
  .nav__logo{ font-size:22px; }

  /* هیرو فشرده */
  .hero__stage{ min-height:auto; padding-top:76px; }
  .hero__word{ font-size:clamp(64px,26vw,150px); inset-block-start:0; }
  .hero__arch{ width:min(72%, 340px); }
  .hero__tag{ position:static; max-width:none; text-align:center; margin-top:22px; font-size:22px; }
  .hero__cta{ position:static; align-items:center; margin-top:18px; }
  .hero__cta .btn{ width:100%; max-width:340px; }

  /* گرید دوستونه */
  .grid--3,.grid--4{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .design-row{ margin-bottom:44px; }
  .design-row__head{ flex-direction:column; align-items:flex-start; gap:2px; }

  /* فیلترها جمع‌شونده */
  .filters__body{ display:none; width:100%; }
  .filters__body.is-open{ display:block; }
  .filters__toggle{
    display:flex; width:100%; align-items:center; justify-content:space-between;
    font-size:14px; padding-block:4px;
  }
  .filters__in{ flex-direction:column; align-items:stretch; gap:12px; }
  .filters__right{ justify-content:space-between; }
  .sort{ flex:1; }

  /* محصول: گالری اسلایدر افقی + پنل زیر عکس */
  .pdp{ grid-template-columns:1fr; gap:24px; }
  .pdp__media{ display:none; }
  .pdp__slider{
    display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
    margin-inline:calc(var(--gut) * -1); padding-inline:var(--gut);
    scrollbar-width:none;
  }
  .pdp__slider::-webkit-scrollbar{ display:none; }
  .pdp__slide{
    flex:0 0 82%; scroll-snap-align:center;
    background:var(--studio); border-radius:var(--arch);
    aspect-ratio:3/3.7; display:flex; align-items:center; justify-content:center;
  }
  .pdp__slide svg{ width:74%; height:auto; }
  .pdp__info{ position:static; }
  .buy{ display:none; }
  .sticky-buy{ display:flex; }
  body.has-sticky{ padding-bottom:82px; }

  .story-block,.chapter{ grid-template-columns:1fr; gap:26px; }
  .chapter--flip .chapter__media{ order:0; }
  .editorial{ aspect-ratio:4/4.6; }

  /* تراست‌بار و فوتر چیده‌شده */
  .trust__grid{ grid-template-columns:1fr 1fr; }
  .trust__item{ padding:22px 12px; }
  .trust__item:nth-child(odd){ border-inline-start:0; }
  .trust__item:nth-child(n+3){ border-top:1px solid var(--line); }
  .footer__top{ grid-template-columns:1fr; gap:30px; }
  .footer__bottom{ flex-direction:column; gap:8px; }

  .values{ grid-template-columns:1fr; }
  .value{ border-inline-start:0; border-top:1px solid var(--line); }
  .value:first-child{ border-top:0; }

  .line{ grid-template-columns:80px 1fr; }
  .line__price{ grid-column:2; text-align:start; }
  .specs th{ width:130px; }
  .sec-head{ flex-direction:column; align-items:flex-start; gap:8px; }
}

@media (max-width:420px){
  .sizes{ max-width:none; }
  .swatch{ width:64px; }
}

@media print{ .nav,.footer,.sticky-buy,.announce{ display:none; } }

/* ==========================================================================
   ۱۷. تنظیمات نسخه‌ی PHP
   در این نسخه بعضی دکمه‌ها لینک (<a>) شده‌اند تا هر رنگ و فیلتر آدرس
   مستقل داشته باشد (بهتر برای گوگل و برای اشتراک‌گذاری لینک).
   ========================================================================== */
a.chip{ display:inline-block; }
a.swatch{ display:block; }
a.thumb{ display:flex; }
a.card{ color:inherit; }
.card__media img,.stage img,.thumb img,.swatch img,.pdp__slide img,.line__media img{
  width:100%; height:100%; object-fit:cover;
}
.stage img,.card__media img{ object-position:center; }
.filters__right form{ align-items:center; }
.specs td.lat{ direction:ltr; text-align:start; }

/* پیام‌ها */
.alert{
  border:1px solid var(--line); border-radius:2px;
  padding:14px 18px; margin-bottom:24px; font-size:14.5px;
}
.alert--ok{    background:#E9F5EE; border-color:#BFE3D0; color:#186B41; }
.alert--error{ background:#FBEAEC; border-color:#EEC4CA; color:#87202F; }
[data-theme="night"] .alert--ok{    background:#10241A; border-color:#1E4632; color:#7FD1A6; }
[data-theme="night"] .alert--error{ background:#2A1116; border-color:#4E1F27; color:#E39AA5; }

/* فرم تسویه */
.field{ margin-bottom:20px; }
.field label{ display:block; font-family:var(--fa-head); font-size:14px; margin-bottom:8px; }
.field__opt{ font-family:var(--fa-body); font-weight:400; color:var(--gray); font-size:12.5px; }
.field input,.field select,.field textarea{
  width:100%; padding:13px 14px; border:1px solid var(--line-strong);
  border-radius:2px; background:transparent; color:var(--ink);
  font-family:var(--fa-body); font-size:15px;
}
.field textarea{ resize:vertical; line-height:1.9; }
.field select{ appearance:none; background-image:none; }
.field__err{ display:block; margin-top:6px; font-size:12.5px; color:#87202F; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.qty form{ display:flex; align-items:center; }

@media (max-width:860px){
  .field-row{ grid-template-columns:1fr; }
}