/* =========================================================================
   مهر تایید — سیستم طراحی
   Ink Navy / Parchment / Seal Red / Brass Gold
   ========================================================================= */

:root {
    /* — رنگ‌ها (برگرفته از لوگوی رسمی برند) — */
    --ink-navy: #0B1E42;
    --ink-navy-2: #16294C;
    --parchment: #FBF6EC;
    --parchment-deep: #F1E8D6;
    --paper-white: #FFFDF8;
    --brass-gold: #C7942D;
    --brass-gold-dark: #9C701F;
    --brass-gold-light: #E8BB5C;
    --gold-shine: #F6D27C;
    --gold-tint: #F6ECD7;
    --navy-tint: #E8EAF0;
    --warm-gray: #685F52;
    --warm-gray-light: #9C9485;
    --line: rgba(11,30,66,.12);
    --line-on-dark: rgba(251,246,236,.16);
    /* — تایپوگرافی — */
    --font-display: "Samim", "Vazirmatn", Tahoma, sans-serif;
    --font-body: "Vazirmatn", Tahoma, sans-serif;
    --font-mono: "Samim", "Vazirmatn", Tahoma, sans-serif;
    /* — فاصله‌گذاری — */
    --space-1: .5rem;
    --space-2: .75rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2rem;
    --space-6: 3rem;
    --space-7: 4.5rem;
    --space-8: 6rem;
    --container-w: 1180px;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 26px;
    --radius-pill: 999px;
    --shadow-sm: 0 2px 10px rgba(11,30,66,.07);
    --shadow-md: 0 16px 36px -12px rgba(11,30,66,.20);
    --shadow-lg: 0 28px 64px -16px rgba(11,30,66,.26);
    --ease-press: cubic-bezier(.34,1.56,.64,1);
    --ease-out: cubic-bezier(.16,1,.3,1);
    /* — ارتفاع هدر، به‌صورت متغیر تا JS و CSS هماهنگ بمانند — */
    --header-h: 76px;
}

/* =========================================================================
   ریست و پایه
   ========================================================================= */

*,*::before,*::after{ box-sizing:border-box; }
html{
  font-size:100%;
  scroll-behavior:smooth;
  scroll-padding-top:96px;
}
body{
  margin:0;
  background:var(--parchment);
  color:var(--ink-navy);
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; background:none; border:none; color:inherit; }
h1,h2,h3,h4,p{ margin:0; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.3;
}

:focus-visible{
  outline:2.5px solid var(--brass-gold);
  outline-offset:3px;
  border-radius:4px;
}

::selection{ background:var(--brass-gold-light); color:var(--ink-navy); }

/* بافت کاغذ — نویز بسیار ملایم روی زمینه‌ی پارچمنت */
body{
  background-image:
    radial-gradient(circle at 1px 1px, rgba(11,30,66,.035) 1px, transparent 0);
  background-size:22px 22px;
}

/* =========================================================================
   ابزارهای عمومی
   ========================================================================= */

.container{
  width:100%;
  max-width:var(--container-w);
  margin-inline:auto;
  padding-inline:1.5rem;
}
@media (min-width:768px){ .container{ padding-inline:2.5rem; } }

.visually-hidden{
  position:absolute !important;
  width:1px; height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}

.section{ padding-block: clamp(4rem, 8vw, 7rem); position:relative; }
.section--tight{ padding-block: clamp(3rem, 6vw, 4.5rem); }
.section--dark{ background:var(--ink-navy); color:var(--parchment); }
.section--paper{ background:var(--paper-white); }
.section-divider{
  height:1px;
  background:linear-gradient(to left, transparent, var(--line), transparent);
  border:none;
  margin:0;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.06em;
  font-weight:600;
  color:var(--brass-gold-dark);
  background:var(--gold-tint);
  padding:.4rem .9rem;
  border-radius:var(--radius-pill);
}
.eyebrow::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  background:var(--brass-gold-dark);
  flex:none;
}
.section--dark .eyebrow{
  color:var(--brass-gold-light);
  background:rgba(199,148,45,.14);
}
.section--dark .eyebrow::before{ background:var(--brass-gold-light); }

.section-head{
  max-width:680px;
  margin-inline:auto;
  text-align:center;
  margin-bottom:var(--space-7);
}
.section-head.align-start{ margin-inline:0; text-align:start; }
.section-head h2{
  font-size:clamp(1.75rem, 3.2vw, 2.5rem);
  margin-block:1rem 0;
}
.section-head p{
  color:var(--warm-gray);
  font-size:1.05rem;
  margin-top:.85rem;
}
.section--dark .section-head p{ color:rgba(251,246,236,.72); }

.lede{
  font-size:1.15rem;
  color:var(--warm-gray);
  max-width:640px;
}

/* =========================================================================
   دکمه‌ها
   ========================================================================= */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  padding:.95rem 1.9rem;
  border-radius:var(--radius-pill);
  font-weight:700;
  font-size:1rem;
  white-space:nowrap;
  transition:transform .25s var(--ease-out), box-shadow .25s var(--ease-out), background-color .25s, color .25s, border-color .25s;
  border:1.5px solid transparent;
}
.btn:active{ transform:translateY(1px) scale(.98); }
.btn svg{ width:18px; height:18px; flex:none; }

.btn--primary{
  background:linear-gradient(135deg, var(--gold-shine) 0%, var(--brass-gold) 55%, var(--brass-gold-dark) 100%);
  color:var(--ink-navy);
  box-shadow:0 14px 28px -10px rgba(199,148,45,.55);
}
.btn--primary:hover{
  background:linear-gradient(135deg, var(--brass-gold-light) 0%, var(--brass-gold) 45%, var(--brass-gold-dark) 100%);
  box-shadow:0 18px 34px -10px rgba(199,148,45,.65);
  transform:translateY(-2px);
}

.btn--ghost{
  background:transparent;
  border-color:var(--line);
  color:var(--ink-navy);
}
.btn--ghost:hover{ border-color:var(--ink-navy); background:rgba(11,30,66,.04); }

.section--dark .btn--ghost{ border-color:var(--line-on-dark); color:var(--parchment); }
.section--dark .btn--ghost:hover{ border-color:var(--brass-gold-light); background:rgba(251,246,236,.06); }

.btn--block{ width:100%; }
.btn-row{ display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }

/* =========================================================================
   هدر
   ========================================================================= */

.site-header{
   inset-inline:0;
  top:0;
  z-index:100;
  padding-block:1.1rem;
  transition:background-color .3s var(--ease-out), box-shadow .3s var(--ease-out), padding-block .3s var(--ease-out);
}
.site-header::before{
  content:"";
  position:absolute; inset:0;
  background:var(--parchment);
  opacity:0;
  transition:opacity .3s var(--ease-out);
  z-index:-1;
}
.site-header.is-scrolled{
  padding-block:.75rem;
  box-shadow:var(--shadow-sm);
}
.site-header.is-scrolled::before{ opacity:.92; backdrop-filter:blur(10px); }

.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
}

.brand{
  display:flex;
  align-items:center;
  gap:.65rem;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.2rem;
  color:var(--ink-navy);
  min-width:0;
}
.brand-mark{ flex:none; border-radius: 22%; }
.brand-text{ min-width:0; overflow:hidden; }
.brand-text small{
  display:block;
  font-family:var(--font-mono);
  font-size:.66rem;
  font-weight:500;
  letter-spacing:.04em;
  color:var(--warm-gray);
  margin-top:.1rem;
  white-space:nowrap;
}

.main-nav{ display:none; }
.main-nav ul{ display:flex; align-items:center; gap:2.1rem; flex-wrap:wrap; }
.main-nav a{
  font-size:.95rem;
  font-weight:600;
  color:var(--ink-navy);
  position:relative;
  padding-block:.3rem;
  white-space:nowrap;
}
.main-nav a::after{
  content:"";
  position:absolute;
  inset-inline:0;
  bottom:0;
  height:2px;
  background:var(--brass-gold-dark);
  transform-origin:center;
  transition:transform .25s var(--ease-out);
}
.main-nav a:hover::after{ transform:scaleX(1); }

.header-cta{ display:none; flex:none; }

.nav-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px; height:42px;
  flex:none;
  border-radius:var(--radius-sm);
  border:1.5px solid var(--line);
}
.nav-toggle svg{ width:20px; height:20px; }

@media (min-width:1080px){
  .main-nav{ display:block; min-width:0; }
  .header-cta{ display:inline-flex; }
  .nav-toggle{ display:none; }
}

/* — منوی موبایل — */
.mobile-nav{
  position:fixed;
  inset:0;
  height:100vh;
  height:100dvh;
  background:var(--ink-navy);
  z-index:999;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:6rem 1.5rem 2.5rem;
  transform:translateY(-8px);
  opacity:0;
  visibility:hidden;
  transition:opacity .3s var(--ease-out), transform .3s var(--ease-out), visibility .3s;
}
.mobile-nav.is-open{ opacity:1; transform:translateY(0); visibility:visible; }
.mobile-nav ul{ display:flex; flex-direction:column; gap:1.5rem; width:100%; }
.mobile-nav a{
  display:block;
  font-family:var(--font-display);
  font-size:clamp(1.3rem, 6vw, 1.65rem);
  font-weight:700;
  color:var(--parchment);
  word-break:break-word;
}
.mobile-nav .btn{ margin-top:2rem; align-self:stretch; width:100%; flex:none; }
.mobile-close{
  position:absolute; top:1.25rem; inset-inline-end:1.25rem;
  width:42px; height:42px;
  border-radius:50%;
  border:1.5px solid var(--line-on-dark);
  display:flex; align-items:center; justify-content:center;
  color:var(--parchment);
  flex:none;
  z-index:1;
}
.mobile-close svg{ width:18px; height:18px; }

/* وقتی منوی موبایل باز است، اسکرول پشت صفحه قفل می‌شود (در JS هم اعمال می‌شود) */
body.nav-is-locked{ overflow:hidden; }

/* =========================================================================
   هیرو + صحنه‌ی مهرِ تأیید (المان شاخص صفحه)
   ========================================================================= */

.hero{
  padding-block: 9.5rem 5rem;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  top:-10%; inset-inline-end:-12%;
  width:55%; aspect-ratio:1;
  background:radial-gradient(circle, rgba(199,148,45,.16), transparent 70%);
  pointer-events:none;
}
.hero-grid{
  display:grid;
  gap:3.5rem;
  align-items:center;
}
@media (min-width:980px){
  .hero-grid{ grid-template-columns:1.05fr .95fr; gap:2rem; }
}

.hero-copy h1{
  font-size:clamp(2.1rem, 4.6vw, 3.65rem);
  letter-spacing:-.01em;
}
.hero-copy h1 em{
  font-style:normal;
  color:var(--brass-gold-dark);
  position:relative;
}
.hero-copy h1 em::after{
  content:"";
  position:absolute;
  inset-inline:-2%;
  bottom:-.08em;
  height:.16em;
  background:var(--gold-tint);
  z-index:-1;
  border-radius:2px;
}
.hero-copy .eyebrow{ margin-bottom:1.5rem; }
.hero-copy p.lede{ margin-top:1.4rem; }
.hero-copy .btn-row{ margin-top:2.4rem; }

.hero-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 1.6rem;
  margin-top:2.6rem;
  padding-top:1.6rem;
  border-top:1px dashed var(--line);
  font-family:var(--font-mono);
  font-size:.78rem;
  color:var(--warm-gray);
}
.hero-meta span{ display:flex; align-items:center; gap:.45rem; }
.hero-meta span::before{ content:"›"; color:var(--brass-gold); font-weight:700; }

.hero-visual{ display:flex; justify-content:center; min-width:0; }

/* — صحنه‌ی مهر — */
.stamp-scene{
  position:relative;
  margin-inline:auto;
  max-width:380px;
  width:100%;
  animation:sceneFloat 6s ease-in-out infinite;
}
@keyframes sceneFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-9px); }
}

.ad-card-mock{
  background:var(--paper-white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:1.4rem;
  box-shadow:var(--shadow-lg);
  position:relative;
  transform:rotate(-2.5deg);
}
.ad-card-mock .thumb{
  height:128px;
  border-radius:var(--radius-md);
  background:linear-gradient(135deg, #E7DEC9, #F4EEDF);
  margin-bottom:1.1rem;
  position:relative;
  overflow:hidden;
}
.ad-card-mock .thumb svg{
  position:absolute; inset:0; margin:auto;
  width:46px; height:46px;
  color:var(--warm-gray-light);
}
.ad-card-mock .bar{ height:11px; border-radius:6px; background:var(--line); }
.ad-card-mock .bar.w-80{ width:80%; margin-bottom:.6rem; }
.ad-card-mock .bar.w-50{ width:50%; }
.ad-card-mock .price{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:1.1rem; padding-top:1.1rem;
  border-top:1px solid var(--line);
  gap:.5rem;
}
.ad-card-mock .price .num{
  font-family:var(--font-mono);
  font-weight:600;
  font-size:1.05rem;
  color:var(--ink-navy);
}
.ad-card-mock .price .loc{
  font-size:.78rem;
  color:var(--warm-gray);
  display:flex; align-items:center; gap:.3rem;
  flex:none;
}
.ad-card-mock .price .loc svg{ width:13px; height:13px; }

.seal-badge-mini{
  position:absolute;
  top:-14px; inset-inline-start:-14px;
  width:58px; height:58px;
  border-radius:50%;
  background:var(--paper-white);
  border:3px solid var(--brass-gold);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-md);
  opacity:0;
  transform:scale(.4) rotate(-26deg);
}
.seal-badge-mini svg{ width:26px; height:26px; color:var(--brass-gold-dark); }
.seal-badge-mini--static{ opacity:1; transform:scale(1) rotate(0deg); }

.stamp{
  position:absolute;
  top:-9%; inset-inline-end:0;
  width:148px; height:148px;
  opacity:0;
  transform:translate(38px,-58px) rotate(-26deg) scale(1.32);
}
.stamp svg{ width:100%; height:100%; }

.ink-ripple{
  position:absolute;
  top:-9%; inset-inline-end:0;
  width:148px; height:148px;
  border-radius:50%;
  border:2px solid var(--brass-gold);
  opacity:0;
  transform:scale(.4);
}

@media (prefers-reduced-motion: no-preference){
  .stamp-scene--hero .stamp{ animation:stampDrop .85s var(--ease-press) .5s forwards; }
  .stamp-scene--hero .ink-ripple{ animation:inkRipple .7s var(--ease-out) .95s forwards; }
  .stamp-scene--hero .seal-badge-mini{ animation:badgeIn .5s var(--ease-press) 1.05s forwards; }
  .stamp-scene--hero .ad-card-mock{ animation:cardSettle .4s ease 1s forwards; }
}
@keyframes stampDrop{
  0%{   opacity:0; transform:translate(38px,-58px) rotate(-26deg) scale(1.32); }
  45%{  opacity:1; transform:translate(8px,-6px)  rotate(-15deg) scale(1.08); }
  62%{  opacity:1; transform:translate(0,4px)     rotate(-7deg)  scale(.93); }
  80%{  opacity:1; transform:translate(0,-2px)    rotate(-11deg) scale(1.02); }
  100%{ opacity:1; transform:translate(0,0)       rotate(-9deg)  scale(1); }
}
@keyframes inkRipple{
  0%{   opacity:.55; transform:scale(.5); }
  100%{ opacity:0;   transform:scale(2.1); }
}
@keyframes badgeIn{
  0%{   opacity:0; transform:scale(.4) rotate(-26deg); }
  70%{  opacity:1; transform:scale(1.12) rotate(4deg); }
  100%{ opacity:1; transform:scale(1) rotate(0deg); }
}
@keyframes cardSettle{
  0%{ box-shadow:var(--shadow-lg); border-color:var(--line); }
  40%{ box-shadow:0 0 0 3px var(--brass-gold-light), var(--shadow-lg); }
  100%{ box-shadow:var(--shadow-lg); border-color:var(--line); }
}

/* بازپخش صحنه هنگام ورود به دید (برای بخش نمایش نشان) */
.stamp-scene.is-ready .stamp,
.stamp-scene.is-ready .ink-ripple,
.stamp-scene.is-ready .seal-badge-mini,
.stamp-scene.is-ready .ad-card-mock{ animation:none; }
.stamp-scene.is-ready .stamp{ opacity:1; transform:translate(0,0) rotate(-9deg) scale(1); }
.stamp-scene.is-ready .ink-ripple{ opacity:0; }
.stamp-scene.is-ready .seal-badge-mini{ opacity:1; transform:scale(1) rotate(0deg); }

.stamp-scene.replay .stamp{ opacity:0; animation:stampDrop .85s var(--ease-press) .15s forwards; }
.stamp-scene.replay .ink-ripple{ opacity:0; animation:inkRipple .7s var(--ease-out) .6s forwards; }
.stamp-scene.replay .seal-badge-mini{ opacity:0; animation:badgeIn .5s var(--ease-press) .7s forwards; }

/* =========================================================================
   نوار اعتماد
   ========================================================================= */

.trust-strip{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--paper-white);
}
.trust-strip ul{
  display:grid;
  gap:1.75rem;
  padding-block:1.75rem;
}
@media (min-width:760px){
  .trust-strip ul{ grid-template-columns:repeat(3,1fr); }
}
.trust-strip li{
  display:flex;
  align-items:flex-start;
  gap:.85rem;
  font-size:.92rem;
  color:var(--ink-navy);
}
.trust-strip li svg{
  width:22px; height:22px;
  flex:none;
  color:var(--ink-navy);
  margin-top:.1rem;
}
.trust-strip li b{ display:block; font-weight:700; margin-bottom:.15rem; }
.trust-strip li span{ color:var(--warm-gray); font-size:.85rem; }

/* =========================================================================
   مقایسه‌ی پیش / پس
   ========================================================================= */

.compare-grid{
  display:grid;
  gap:1.75rem;
  max-width:840px;
  margin-inline:auto;
}
@media (min-width:760px){ .compare-grid{ grid-template-columns:1fr 1fr; align-items:start; } }

.compare-card{ text-align:center; }
.compare-card .compare-label{
  display:inline-block;
  font-size:.82rem;
  font-weight:700;
  margin-bottom:1rem;
  padding:.35rem 1rem;
  border-radius:var(--radius-pill);
}
.compare-card.is-before .compare-label{ background:rgba(110,102,87,.12); color:var(--warm-gray); }
.compare-card.is-after .compare-label{ background:var(--gold-tint); color:var(--brass-gold-dark); }

.compare-card.is-before .ad-card-mock{ opacity:.78; filter:saturate(.7); transform:rotate(1.5deg); }
.compare-card .ad-card-mock{ margin-inline:auto; max-width:300px; }

.why-grid{
  display:grid;
  gap:2.5rem;
  margin-top:var(--space-7);
}
@media (min-width:760px){ .why-grid{ grid-template-columns:1fr 1fr; } }
.why-copy h3{ font-size:1.3rem; margin-bottom:.85rem; }
.why-copy p{ color:var(--warm-gray); }
.why-copy + .why-copy{ border-inline-start:1px dashed var(--line); padding-inline-start:2.5rem; }
@media (max-width:759px){ .why-copy + .why-copy{ border:none; padding-inline-start:0; padding-top:1.5rem; border-top:1px dashed var(--line); } }

/* =========================================================================
   شبکه‌ی مدارک
   ========================================================================= */

.doc-grid{
  display:grid;
  gap:1.25rem;
  grid-template-columns:repeat(auto-fit, minmax(230px,1fr));
}
.doc-card{
  background:var(--paper-white);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:1.9rem;
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out), border-color .3s;
}
.doc-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:transparent; }
.doc-card .doc-icon{
  width:48px; height:48px;
  border-radius:var(--radius-sm);
  background:var(--gold-tint);
  color:var(--brass-gold-dark);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.25rem;
}
.doc-card .doc-icon svg{ width:24px; height:24px; }
.doc-card h3{ font-size:1.08rem; margin-bottom:.5rem; }
.doc-card p{ color:var(--warm-gray); font-size:.92rem; }
.doc-card.is-muted{ background:transparent; border-style:dashed; }
.doc-card.is-muted .doc-icon{ background:var(--navy-tint); color:var(--ink-navy); }

/* =========================================================================
   ریل فرآیند
   ========================================================================= */

.process-rail{ position:relative; max-width:780px; margin-inline:auto; }
.process-step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.5rem;
  position:relative;
  padding-bottom:2.75rem;
}
.process-step:last-child{ padding-bottom:0; }
.process-step .num-col{
  display:flex; flex-direction:column; align-items:center;
}
.process-step .num{
  width:54px; height:54px;
  border-radius:50%;
  background:var(--ink-navy);
  color:var(--parchment);
  font-family:var(--font-mono);
  font-weight:600;
  font-size:.95rem;
  display:flex; align-items:center; justify-content:center;
  flex:none;
  position:relative; z-index:2;
  transition:background .3s, transform .3s;
}
.process-step:last-child .num{ background:var(--brass-gold-dark); color:var(--paper-white); }
.process-step .rail-line{
  flex:1;
  width:2px;
  background:repeating-linear-gradient(to bottom, var(--line) 0 6px, transparent 6px 11px);
  margin-top:.4rem;
}
.process-step .step-body{ padding-top:.55rem; min-width:0; }
.process-step h3{
  font-size:1.15rem;
  display:flex; align-items:center; gap:.6rem;
  margin-bottom:.5rem;
  flex-wrap:wrap;
}
.process-step h3 svg{ width:19px; height:19px; color:var(--ink-navy); flex:none; }
.process-step:last-child h3 svg{ color:var(--brass-gold-dark); }
.process-step p{ color:var(--warm-gray); font-size:.96rem; max-width:480px; }

/* =========================================================================
   نمایش نشان (شوکیس)
   ========================================================================= */

.showcase{
  display:grid;
  gap:3rem;
  align-items:center;
}
@media (min-width:980px){ .showcase{ grid-template-columns:.95fr 1.05fr; } }
.showcase-copy h2{ font-size:clamp(1.75rem,3.2vw,2.4rem); margin-bottom:1rem; }
.showcase-copy p{ color:rgba(251,246,236,.74); margin-bottom:1.75rem; }
.showcase-list{ display:flex; flex-direction:column; gap:1rem; }
.showcase-list li{ display:flex; gap:.75rem; align-items:flex-start; font-size:.95rem; }
.showcase-list svg{ width:19px; height:19px; color:var(--brass-gold-light); flex:none; margin-top:.2rem; }

.cert-tag{
  margin-top:2.2rem;
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--font-mono);
  font-size:.78rem;
  color:rgba(251,246,236,.6);
  border:1px dashed var(--line-on-dark);
  border-radius:var(--radius-pill);
  padding:.5rem 1.1rem;
  max-width:100%;
  flex-wrap:wrap;
}

/* =========================================================================
   تعرفه‌ها (پلن‌های قیمت‌گذاری)
   ========================================================================= */

.pricing-grid{
  display:grid;
  gap:1.75rem;
  max-width:900px;
  margin-inline:auto;
}
@media (min-width:760px){
  .pricing-grid{ grid-template-columns:1fr 1fr; align-items:stretch; }
}

.price-card{
  position:relative;
  background:var(--paper-white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:2.25rem 2rem;
  display:flex;
  flex-direction:column;
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out), border-color .3s;
}
.price-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }

.price-card.is-featured{
  border-color:var(--brass-gold);
  box-shadow:var(--shadow-lg);
}
.price-card.is-featured:hover{ transform:translateY(-6px); }

.price-badge{
  position:absolute;
  top:-13px;
  inset-inline-start:50%;
  transform:translateX(50%);
  background:linear-gradient(135deg, var(--gold-shine) 0%, var(--brass-gold) 60%, var(--brass-gold-dark) 100%);
  color:var(--ink-navy);
  font-size:.78rem;
  font-weight:700;
  padding:.4rem 1.1rem;
  border-radius:var(--radius-pill);
  box-shadow:0 8px 18px -6px rgba(199,148,45,.55);
  white-space:nowrap;
}
html[dir="rtl"] .price-badge{ transform:translateX(-50%); }

.price-card-head h3{
  font-size:1.35rem;
  margin-bottom:.55rem;
}
.price-card-head p{
  color:var(--warm-gray);
  font-size:.92rem;
  min-height:2.6em;
}

.price-tag{
  display:flex;
  flex-direction:column;
  gap:.3rem;
  margin-block:1.5rem 1.75rem;
  padding-top:1.5rem;
  border-top:1px dashed var(--line);
}
.price-old{
  font-family:var(--font-mono);
  font-size:.95rem;
  color:var(--warm-gray-light);
  text-decoration:line-through;
  text-decoration-color:var(--brass-gold-dark);
  text-decoration-thickness:1.5px;
}
.price-now{
  font-family:var(--font-mono);
  font-size:1rem;
  color:var(--ink-navy);
  display:flex;
  align-items:baseline;
  gap:.4rem;
}
.price-now b{
  font-size:clamp(1.9rem, 4vw, 2.3rem);
  font-weight:700;
  font-family:var(--font-display);
  color:var(--brass-gold-dark);
  line-height:1;
}
.price-period{
  font-size:.78rem;
  color:var(--warm-gray);
  margin-top:.15rem;
}

.price-features{
  display:flex;
  flex-direction:column;
  gap:.85rem;
  margin-bottom:2rem;
  flex:1;
}
.price-features li{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.92rem;
  color:var(--ink-navy);
}
.price-features svg{
  width:18px; height:18px;
  flex:none;
  margin-top:.15rem;
  color:var(--brass-gold-dark);
}

.pricing-note{
  text-align:center;
  color:var(--warm-gray-light);
  font-size:.82rem;
  margin-top:2.5rem;
}

/* =========================================================================
   سوالات متداول
   ========================================================================= */

.faq-list{ max-width:760px; margin-inline:auto; display:flex; flex-direction:column; gap:.9rem; }
.faq-item{
  background:var(--paper-white);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.3rem 1.6rem;
  text-align:start;
  font-weight:700;
  font-size:1rem;
  color:var(--ink-navy);
}
.faq-q .faq-icon{
  width:30px; height:30px; flex:none;
  border-radius:50%;
  border:1.5px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  transition:transform .3s var(--ease-out), background .3s, border-color .3s;
}
.faq-q .faq-icon svg{ width:13px; height:13px; transition:transform .3s; }
.faq-item.is-open .faq-q .faq-icon{ background:var(--ink-navy); border-color:var(--ink-navy); color:var(--paper-white); transform:rotate(180deg); }

.faq-a-wrap{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .35s var(--ease-out);
}
.faq-item.is-open .faq-a-wrap{ grid-template-rows:1fr; }
.faq-a{ overflow:hidden; min-height:0; }
.faq-a p{ padding:0 1.6rem 1.5rem; color:var(--warm-gray); font-size:.95rem; max-width:600px; }

/* =========================================================================
   نوار فراخوان نهایی
   ========================================================================= */

.cta-band{
  background:linear-gradient(120deg, var(--ink-navy) 0%, var(--ink-navy-2) 100%);
  color:var(--paper-white);
  border-radius:var(--radius-lg);
  padding:clamp(2.5rem, 5vw, 4rem);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.cta-band::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle at 1px 1px, rgba(199,148,45,.14) 1px, transparent 0);
  background-size:20px 20px;
}
.cta-band > *{ position:relative; }
.cta-band h2{ font-size:clamp(1.6rem,3.4vw,2.3rem); margin-bottom:.9rem; }
.cta-band p{ color:rgba(255,253,248,.84); max-width:520px; margin-inline:auto; margin-bottom:2rem; }
.cta-band .btn--ghost{ border-color:rgba(255,253,248,.4); color:var(--paper-white); }
.cta-band .btn--ghost:hover{ background:rgba(255,255,255,.1); border-color:var(--brass-gold-light); }

/* =========================================================================
   فوتر
   ========================================================================= */

.site-footer{ background:var(--ink-navy-2); color:rgba(251,246,236,.7); padding-block:4rem 2rem; }
.footer-grid{
  display:grid;
  gap:2.75rem;
  padding-bottom:3rem;
  border-bottom:1px solid var(--line-on-dark);
}
@media (min-width:760px){ .footer-grid{ grid-template-columns:1.4fr 1fr 1fr; } }
.footer-brand .brand{ color:var(--parchment); margin-bottom:1rem; }
.footer-brand p{ max-width:320px; font-size:.92rem; }
.footer-col h4{ font-family:var(--font-body); font-size:.92rem; color:var(--parchment); margin-bottom:1.1rem; }
.footer-col ul{ display:flex; flex-direction:column; gap:.75rem; font-size:.92rem; }
.footer-col a:hover{ color:var(--brass-gold-light); }
.footer-social{ display:flex; gap:.75rem; margin-top:1.4rem; }
.footer-social a{
  width:38px; height:38px; border-radius:50%;
  border:1px solid var(--line-on-dark);
  display:flex; align-items:center; justify-content:center;
}
.footer-social a svg{ width:16px; height:16px; }
.footer-social a:hover{ border-color:var(--brass-gold-light); color:var(--brass-gold-light); }
.footer-bottom{
  display:flex; flex-wrap:wrap; gap:1rem;
  justify-content:space-between;
  padding-top:1.75rem;
  font-size:.82rem;
  font-family:var(--font-mono);
}

/* =========================================================================
   انیمیشن ظهور هنگام اسکرول
   ========================================================================= */

@media (prefers-reduced-motion: no-preference){
  .reveal{
    opacity:0;
    transform:translateY(22px);
    transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
    transition-delay:var(--d, 0s);
  }
  .reveal.is-visible{ opacity:1; transform:none; }
}

/* =========================================================================
   حرکت کاهش‌یافته
   ========================================================================= */

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .stamp-scene{ animation:none; }
  .stamp{ opacity:1; transform:rotate(-9deg) scale(1); }
  .ink-ripple{ opacity:0; }
  .seal-badge-mini{ opacity:1; transform:scale(1) rotate(0); }
  .ad-card-mock{ transform:rotate(-2.5deg); }
}

/* =========================================================================
   ریسپانسیو — تنظیمات تکمیلی
   ========================================================================= */

@media (max-width:759px){
  .section{ padding-block: clamp(3.25rem, 10vw, 5rem); }
  .why-grid, .compare-grid{ gap:1.75rem; }
  .price-card{ padding:1.85rem 1.5rem; }
  .price-card-head p{ min-height:0; }
}

@media (max-width:599px){
  html{ scroll-padding-top:72px; }
  .hero{ padding-block:7.5rem 3.5rem; }
  .hero-meta{ font-size:.74rem; gap:.5rem 1.1rem; }
  .btn{ padding:.85rem 1.5rem; font-size:.95rem; }
  .btn-row{ gap:.75rem; }
  .container{ padding-inline:1.15rem; }
  .price-badge{ font-size:.72rem; padding:.35rem .9rem; }
  .cert-tag{ font-size:.72rem; padding:.45rem .9rem; }
}

@media (max-width:420px){
  .header-row{ gap:.75rem; }
  .brand{ font-size:1.05rem; gap:.5rem; }
  .brand-mark{ width:38px; height:38px; }
  .brand-text small{ font-size:.62rem; }
}
