/* =========================================================
   نوآفرین پیشرفت آینده – style.css
   طراحی: بر پایه سایت مرجع aif.ir
   پالت: Neo‑Corporate Lux  (Navy + Gold + Turquoise)
   ========================================================= */

/* فونت فارسی */
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Farsi-Digits/font-face.css');

:root {
  --navy: #041836;
  --navy-light: #0a2444;
  --gold: #d4af37;
  --turq: #28d7d7;
  --green: #31b56a;
  --gray: #f4f5f9;
  --gray-dark: #444;
  --white: #ffffff;
}

/* ریست و فونت عمومی */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  font-family: 'Vazirmatn FD', sans-serif;
  direction: rtl;
  background-color: var(--white);
  color: var(--navy);
  scroll-behavior: smooth;
}

a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

.container {
  width: 90%;
  max-width: 1280px;
  margin: 0 auto;
}

.section-pad { padding: 70px 0; }
.section-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 40px;
}
.section-head h2 {
  font-size: 1.8rem; color: var(--navy);
  border-right: 5px solid var(--gold);
  padding-right: 12px;
}

/* ===================== Header ===================== */
.main-header { background: var(--white); box-shadow: 0 2px 8px rgba(0,0,0,.06); position: sticky; top: 0; z-index: 20; }
.language-bar { background: var(--navy); color: var(--white); font-size: .9rem; }
.language-bar ul {
  display:flex; justify-content:flex-end; gap:16px;
  padding:.5rem 1rem;
}
.language-bar li { opacity:.8; }
.language-bar li.active { opacity:1; font-weight:600; color:var(--gold); }

.nav-row {
  display:flex; justify-content:space-between; align-items:center;
  padding: .8rem 2rem;
}
.logo-area img.main-logo { width:140px; height:auto; }

.main-nav ul {
  display:flex; flex-wrap:wrap; gap:1.2rem;
}
.main-nav a {
  color:var(--navy); font-weight:500; transition:.2s;
}
.main-nav a:hover, .main-nav a.active { color:var(--gold); }

/* ===================== Buttons ===================== */
.btn {
  display:inline-block; padding:.6rem 1.4rem;
  border-radius:6px; transition:background .3s,color .3s;
  font-weight:600; text-align:center;
}
.btn.cta { background:var(--green); color:#fff; }
.btn.cta:hover { background:#249859; }
.btn.ghost { border:2px solid var(--gold); color:var(--gold); }
.btn.ghost.light { border-color:#fff; color:#fff; }
.btn.ghost:hover { background:var(--gold); color:var(--navy); }
.btn.link { color:var(--turq); }

/* ===================== Hero Section ===================== */
.hero {
  background: linear-gradient(120deg, var(--navy) 0%, var(--navy-light) 100%);
  color:#fff; position:relative;
  overflow:hidden; display:flex; align-items:center;
  min-height: 70vh;
}
.hero-inner {
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:2rem;
}
.hero-text { flex:1 1 50%; }
.hero-text .hero-quote {
  font-size:1.5rem; line-height:2.4rem; margin-bottom:1rem;
}
.hero-text .hero-slogan {
  font-size:1.2rem; color:var(--turq); margin-bottom:1.5rem;
}
.hero-media { flex:1 1 38%; text-align:center; }
.hero-media img { width:100%; border-radius:16px; }

.hero-decor {
  position:absolute; bottom:-60px; left:0; width:120%; height:180px;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.1) 0%, transparent 70%);
}

/* ===================== KPI Map ===================== */
.kpi-map { background:var(--gray); text-align:center; }
.kpi-canvas { position:relative; margin-top:2rem; }
.kpi-canvas .iran-map { width:420px; margin:0 auto; opacity:.8; }
.kpi-badge {
  background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.08);
  border-radius:10px; padding:.6rem .9rem; position:absolute;
  width:180px; font-size:.9rem;
}
.kpi-badge strong.num { display:block; font-size:1rem; margin-bottom:.3rem; }
.kpi-badge .green { color:var(--green); }
.kpi-badge .red { color:#e74c3c; }
.kpi-badge .teal { color:var(--turq); }

.k1 { top:10%; left:20%; }
.k2 { top:30%; right:15%; }
.k3 { bottom:25%; left:15%; }
.k4 { bottom:10%; right:25%; }

/* ===================== Pillars ===================== */
.grid { display:grid; }
.g-5 { grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:25px; }
.card { background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 3px 10px rgba(0,0,0,.05); transition:.3s; }
.card:hover { transform:translateY(-5px); box-shadow:0 6px 16px rgba(0,0,0,.08); }
.p-card h3 { color:var(--navy); font-size:1.1rem; margin:12px; }
.p-card p { color:var(--gray-dark); font-size:.9rem; margin:0 12px 15px; }

/* ===================== News & Articles ===================== */
.g-4 { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:25px; }
.news-card img, .article-card img { height:170px; object-fit:cover; width:100%; }
.card-body { padding:1rem; }
.card-body h3 { font-size:1rem; margin-bottom:.4rem; color:var(--navy); }
.card-body .meta { color:var(--gold); font-size:.85rem; }
.tabs-head { flex-direction:column; align-items:flex-start; }
.tabs { display:flex; flex-wrap:wrap; gap:1rem; margin:1rem 0; }
.tabs li { cursor:pointer; padding:.3rem .8rem; border-radius:6px; background:var(--gray); }
.tabs li.active, .tabs li:hover { background:var(--gold); color:#fff; }

/* ===================== Multimedia ===================== */
.multimedia { background:var(--navy); color:#fff; }
.media-col h3 { margin-bottom:1rem; font-size:1.1rem; }
.media-card {
  background:rgba(255,255,255,.08);
  border-radius:10px; height:160px; margin-bottom:1rem;
}
.media-card.iconic::after {
  content:"📊"; font-size:3rem; position:relative; top:45%; left:45%;
}

/* ===================== Promos & Seals ===================== */
.promos { background:var(--gray); text-align:center; }
.grid.g-2 { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; margin-bottom:40px; }
.promo-box {
  display:flex; align-items:center; justify-content:center;
  height:120px; font-size:1.3rem; font-weight:600;
  border-radius:12px; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.2);
}
.gold { background:var(--gold); }
.teal { background:var(--turq); }
.seals-row {
  display:flex; justify-content:center; gap:30px; align-items:center;
}
.seals-row img { width:90px; height:auto; opacity:.85; }

/* ===================== Links & Footer ===================== */
.links-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:30px;
}
.links h3 {
  color:var(--navy); borders:none; margin-bottom:1rem; font-size:1.1rem;
}
.links ul li { margin-bottom:.6rem; }
.links a { color:var(--gray-dark); transition:.2s; }
.links a:hover { color:var(--gold); }

.main-footer {
  background:var(--navy); color:#fff; padding:2rem 0; text-align:center;
}
.main-footer .footer-logo img { width:120px; margin:0 auto 1rem; }
.footer-info p { font-size:.9rem; line-height:1.6; }
.footer-copy { margin-top:1rem; font-size:.8rem; opacity:.7; }

/* ===================== Responsive ===================== */
@media(max-width:768px) {
  .nav-row { flex-direction:column; gap:1rem; }
  .main-nav ul { justify-content:center; }
  .hero { padding:3rem 0; text-align:center; }
  .hero-inner { flex-direction:column; }
  .hero-media img { width:80%; }
  .kpi-badge { position:static; margin:10px auto; }
  .tabs { justify-content:center; }
  .media-card.iconic::after { left:0; top:35%; display:block; text-align:center; width:100%; }
}

