/* === فونت با metric overrides برای جلوگیری از جابه‌جایی هنگام سوییچ === */
@font-face{
  font-family:'IranSans';
  src:url('/assets/fonts/Vazirmatn[wght].woff2') format('woff2-variations');
  font-weight:100 900; font-style:normal;
  font-display:swap;                     /* متن سریع نشان داده شود */
  ascent-override: 92%;                  /* تقریباً با Tahoma/Arial هماهنگ */
  descent-override: 24%;
  line-gap-override: 0%;
  size-adjust: 102.5%;                   /* اختلاف ارتفاع حروف را جبران می‌کند */
}

/* پایه و رنگ‌ها */
:root{
  --bg1:#1a237e; --bg2:#8e24aa;
  --panel:rgba(25,25,30,.35);
  --text:#ffffff; --muted:#e7e7e7; --accent:#ffe54c;
  --link:#bde3ff; --linkHover:#ffffff;
  --btn:#25D366; --btnText:#102a12;
  --cardShadow:0 10px 26px rgba(0,0,0,.30);
  --softShadow:0 6px 18px rgba(0,0,0,.45);
  --maxw:1000px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}

body{
  margin:0; min-height:100vh; display:flex; flex-direction:column; align-items:center;
  background:linear-gradient(135deg,var(--bg1) 0%,var(--bg2) 100%);
  color:var(--text);
  font-family:'IranSans','Segoe UI',Tahoma,Arial,system-ui,-apple-system,sans-serif;
  line-height:1.7;                       /* خط‌پایه ثابت برای کاهش shift */
  font-synthesis-weight:none;            /* از شبیه‌سازی وزن جلوگیری می‌کند */
}

/* لینک‌ها (کنتراست بالا) */
a{ color:var(--link); text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:rgba(189,227,255,.5) }
a:hover{ color:var(--linkHover); text-decoration-color:var(--linkHover) }

header, main, footer{width:100%; max-width:var(--maxw); padding:0 18px}

/* ناوبری */
nav.top{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:18px 0 8px; min-height:42px }
nav.top a{
  color:#102a12; background:#d0ffe2; text-decoration:none;
  padding:.45rem .75rem; border-radius:999px; transition:transform .15s ease, filter .15s ease;
}
nav.top a:hover{ transform:translateY(-1px); filter:brightness(1.05) }

/* هدر و لوگو: ابعاد مشخص برای صفر کردن CLS */
.hero{display:flex; flex-direction:column; align-items:center; text-align:center; padding:36px 0 8px}
.logo{width:160px; height:160px; border-radius:36px; object-fit:contain; box-shadow:var(--softShadow)}
h1{font-size:2.3rem; margin:16px 0 8px; font-weight:850}
.lead{color:var(--accent); max-width:760px; line-height:1.95; margin:0 0 16px; font-weight:560; min-height:1lh } /* رزرو حداقل ارتفاع */

/* CTA واتساپ */
.cta{ margin:12px 0 26px; min-height:48px }
.cta a{
  display:inline-flex; align-items:center; gap:.55rem;
  background:var(--btn); color:var(--btnText); font-weight:800; text-decoration:none;
  padding:.9rem 1.2rem; border-radius:14px; box-shadow:var(--cardShadow);
  transition:transform .15s ease, filter .15s ease;
}
.cta a:hover{ transform:translateY(-2px); filter:brightness(1.06) }
.cta img{ width:20px; height:20px; display:block }

/* شبکه‌های اجتماعی */
.social-card{
  display:flex; gap:22px; justify-content:center; align-items:center;
  background:var(--panel); padding:18px 22px; border-radius:16px; box-shadow:var(--softShadow);
  margin:0 auto 26px; min-height:88px;
}
.social-card a{
  width:64px; height:64px; display:flex; align-items:center; justify-content:center;
  border-radius:16px; background:rgba(255,255,255,.05);
  transition:transform .15s ease, background .15s ease; text-decoration:none; outline-offset:3px;
}
.social-card a:hover{ transform:translateY(-2px); background:rgba(255,255,255,.12) }
.social-card img{ width:42px; height:42px; display:block }

/* محتوا */
section{padding:28px 0}
section h2{font-size:1.4rem; margin:0 0 12px; font-weight:800}
section p{color:var(--muted); line-height:2; margin:0 0 10px}
ul.check{list-style:none; padding:0; margin:8px 0 0; display:grid; gap:8px}
ul.check li::before{content:"•"; color:var(--accent); margin-left:.5rem}

.grid-2{display:grid; grid-template-columns:1.2fr .8fr; gap:24px}
.card{background:rgba(255,255,255,.06); border-radius:16px; padding:16px; box-shadow:var(--softShadow)}

.share{ display:flex; gap:10px; justify-content:center; margin:10px 0 0; min-height:40px }
.share a{ background:rgba(255,255,255,.08); color:#fff; text-decoration:none; padding:.45rem .7rem; border-radius:999px; font-size:.9rem; }

.ltr{ direction:ltr; unicode-bidi:bidi-override }

footer{ text-align:center; margin:20px 0 40px; color:#eaeaea }
footer nav a{ color:#f2f2f2 }
footer small{opacity:.9}

/* مهم: هیچ قانون سراسری روی svg/path/fill نداریم */
svg{display:block}

@media (max-width:860px){ .grid-2{grid-template-columns:1fr} }
@media (max-width:560px){
  h1{font-size:1.9rem}
  .logo{width:132px;height:132px}
  .social-card a{width:56px;height:56px}
  .social-card img{width:36px;height:36px}
}