/* ════════════════════════════════════════════════════════════════════
   CogMap — لایه‌ی سه‌بعدی، عمق و موشن
   orbs، tilt-3d، scroll-reveal، رادارِ حوزه‌ها، marquee، شبکه‌ی هیرو.
   احترام به prefers-reduced-motion در انتهای فایل.
   ════════════════════════════════════════════════════════════════════ */

/* ─── orbهای محوِ پس‌زمینه ─── */
.cm-orb {
  position: absolute; border-radius: 50%;
  filter: blur(110px); pointer-events: none; z-index: 0; opacity: .55;
}
.cm-orb-teal   { width: 460px; height: 460px; background: rgba(45, 212, 191, .26);  animation: cm-float 11s ease-in-out infinite; }
.cm-orb-indigo { width: 520px; height: 520px; background: rgba(99, 102, 241, .24);  animation: cm-float 14s ease-in-out infinite reverse; }
.cm-orb-gold   { width: 380px; height: 380px; background: rgba(245, 179, 1, .16);   animation: cm-float 9s  ease-in-out infinite; }

@keyframes cm-float {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50%      { transform: translate3d(0, -34px, 0) scale(1.06); }
}

/* مشِ گرادیانی پشتِ کلِ صفحه */
.cm-mesh {
  position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(60% 50% at 78% 8%,  rgba(99,102,241,.20), transparent 60%),
    radial-gradient(50% 45% at 12% 18%, rgba(45,212,191,.16), transparent 60%),
    radial-gradient(60% 60% at 50% 110%, rgba(245,179,1,.10), transparent 60%),
    var(--cm-bg);
}
/* شبکه‌ی نقطه‌چینِ ظریف */
.cm-grid {
  position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(70% 60% at 50% 30%, #000, transparent 80%);
  mask-image: radial-gradient(70% 60% at 50% 30%, #000, transparent 80%);
}

/* ─── canvas شبکه‌ی عصبیِ هیرو ─── */
.cm-neural {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none;
}

/* ─── tilt 3D برای کارت‌ها ─── */
.cm-tilt {
  transform-style: preserve-3d;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
  will-change: transform;
}
.cm-tilt:hover { box-shadow: var(--cm-shadow); }
.cm-tilt .cm-tilt-pop { transform: translateZ(40px); }

.perspective { perspective: 1200px; }

/* لایه‌ی براقِ روی کارت هنگامِ tilt */
.cm-tilt .cm-sheen {
  position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(220px circle at var(--mx,50%) var(--my,0%), rgba(255,255,255,.12), transparent 60%);
  opacity: 0; transition: opacity .3s ease;
}
.cm-tilt:hover .cm-sheen { opacity: 1; }

/* ─── float آرام ─── */
.cm-anim-float { animation: cm-floaty 6s ease-in-out infinite; }
@keyframes cm-floaty {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-12px); }
}

/* ─── چرخشِ حلقه‌ی هاله‌ای هیرو ─── */
.cm-spin-slow { animation: cm-spin 26s linear infinite; }
@keyframes cm-spin { to { transform: rotate(360deg); } }

/* ─── گرادیانِ متنیِ متحرک ─── */
.cm-anim-grad {
  background-size: 220% 220%;
  animation: cm-grad-move 7s ease infinite;
}
@keyframes cm-grad-move {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ─── scroll reveal ─── */
.cm-reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
.cm-reveal.is-in { opacity: 1; transform: none; }
.cm-reveal.d1 { transition-delay: .08s; }
.cm-reveal.d2 { transition-delay: .16s; }
.cm-reveal.d3 { transition-delay: .24s; }
.cm-reveal.d4 { transition-delay: .32s; }

/* ─── marqueeِ بزرگانِ علم ─── */
.cm-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.cm-marquee-track { display: flex; gap: 14px; width: max-content; animation: cm-marquee 38s linear infinite; }
.cm-marquee:hover .cm-marquee-track { animation-play-state: paused; }
@keyframes cm-marquee { to { transform: translateX(50%); } }  /* RTL: حرکت به راست */
.cm-mind-chip {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 9px 16px; border-radius: var(--cm-r-pill);
  background: var(--cm-surface); border: 1px solid var(--cm-border);
  font-size: 14px; color: var(--cm-text-soft); white-space: nowrap;
}
.cm-mind-chip b { color: var(--cm-teal); font-weight: 700; }

/* ─── رادارِ حوزه‌های شناختی ─── */
.cm-radar { position: relative; width: min(420px, 84vw); aspect-ratio: 1; margin: 0 auto; }
.cm-radar-ring {
  position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.08);
}
.cm-radar-ring.r2 { inset: 14%; }
.cm-radar-ring.r3 { inset: 28%; }
.cm-radar-ring.r4 { inset: 42%; }
.cm-radar-sweep {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0deg, rgba(45,212,191,.22) 40deg, transparent 80deg);
  animation: cm-spin 6s linear infinite;
}
.cm-radar-core {
  position: absolute; inset: 0; margin: auto; width: 76px; height: 76px; border-radius: 50%;
  background: var(--cm-grad-brand); filter: blur(2px);
  box-shadow: 0 0 60px 8px var(--cm-glow-teal);
  animation: cm-pulse 3.4s ease-in-out infinite;
}
@keyframes cm-pulse { 0%,100% { transform: scale(1); opacity: .92; } 50% { transform: scale(1.12); opacity: 1; } }
.cm-radar-node {
  position: absolute; transform: translate(50%, -50%);
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.cm-radar-dot { width: 13px; height: 13px; border-radius: 50%; background: var(--cm-teal); box-shadow: 0 0 16px 2px var(--cm-glow-teal); }
.cm-radar-label { font-size: 12px; color: var(--cm-text-soft); white-space: nowrap; }

/* ─── شمارنده‌های آماری ─── */
.cm-stat-num {
  font-family: var(--cm-font-display);
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1; color: #fff;
}
.cm-stat-num .cm-grad-text { display: inline; }

/* ─── ribbon «به‌زودی» ─── */
.cm-soon {
  position: absolute; top: 14px; inset-inline-start: 14px;
  padding: 5px 13px; border-radius: var(--cm-r-pill);
  font-size: 11px; font-weight: 700; color: #04140f;
  background: var(--cm-grad-gold);
  box-shadow: 0 8px 24px -8px var(--cm-glow-gold);
}

/* ─── خطِ جداکننده‌ی نوری ─── */
.cm-divider { height: 1px; border: 0; background: linear-gradient(90deg, transparent, var(--cm-border-2), transparent); }

/* ─── کاهشِ موشن ─── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .cm-reveal { opacity: 1; transform: none; }
}
