/* ===========================================================================
 * motion.css — שכבת-התנועה של המשטח הציבורי (נחיתה · מדריכים · מחשבונים).
 * נטען לצד motion.js: ה-JS מתייג [data-reveal] בזמן-ריצה, ולכן בלי JS (או עם
 * prefers-reduced-motion) שום דבר אינו מוסתר — הדף פשוט סטטי. CSP: אפס ספריות.
 * =========================================================================== */

/* ── חשיפת-גלילה ── */
[data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity .7s cubic-bezier(.16, 1, .3, 1),
    transform .7s cubic-bezier(.16, 1, .3, 1);
  will-change: opacity, transform;
}
[data-reveal].is-in { opacity: 1; transform: none; }

/* ── פס-התקדמות-קריאה ── */
.scroll-progress {
  position: fixed; top: 0; inset-inline-start: 0; z-index: 99;
  width: 100%; height: 3px;
  transform: scaleX(0); transform-origin: 100% 50%;
  background: linear-gradient(270deg, #0953ba, #08c4ce);
  pointer-events: none;
}

/* ── כרטיסים חיים ── */
.mini, .hub-card {
  transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s ease, border-color .3s ease;
}
.mini:hover, .hub-card:hover { transform: translateY(-7px); }
.hub-card .hub-icon { transition: transform .38s cubic-bezier(.34, 1.56, .64, 1); }
.hub-card:hover .hub-icon { transform: rotate(-8deg) scale(1.14); }
/* גיוון-גוונים לאריחי-האייקונים — בתוך משפחת-המותג */
.hub-grid .hub-card:nth-child(3n+1) .hub-icon { background: linear-gradient(135deg, #eaf4ff, #d9edff); color: #0953ba; }
.hub-grid .hub-card:nth-child(3n+2) .hub-icon { background: linear-gradient(135deg, #e0fbf8, #c7f3ef); color: #05797f; }
.hub-grid .hub-card:nth-child(3n)   .hub-icon { background: linear-gradient(135deg, #0953ba, #08c4ce); color: #fff; }

/* ── זוהר נודד בפסי-ה-CTA הכהים ובפאנל-התוצאה ── */
.g-cta::before, .result::before { animation: blob-drift 16s ease-in-out infinite alternate; }
.g-cta::after {
  content: ""; position: absolute; width: 190px; height: 190px; border-radius: 50%;
  inset-inline-start: -70px; bottom: -110px; background: rgba(9, 83, 186, .3);
  animation: blob-drift 21s ease-in-out infinite alternate-reverse;
}
@keyframes blob-drift {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-30px, 24px) scale(1.2); }
}

/* ── ברק-ריחוף על כפתורים ראשיים ── */
.g-btn, .cta, .c-form button, .navlinks .pill, .btn { position: relative; overflow: hidden; }
.g-btn::after, .cta::after, .c-form button::after, .navlinks .pill::after, .btn::after {
  content: ""; position: absolute; top: -4px; bottom: -4px; width: 44px;
  inset-inline-start: -70px; transform: skewX(-18deg);
  background: rgba(255, 255, 255, .55); filter: blur(7px);
  transition: inset-inline-start .55s ease; pointer-events: none;
}
.g-btn:hover::after, .cta:hover::after, .c-form button:hover::after, .navlinks .pill:hover::after, .btn:hover::after {
  inset-inline-start: calc(100% + 30px);
}
.g-btn:active, .cta:active, .c-form button:active, .btn:active { transform: scale(.97); }

/* ── מילה-מנצנצת בכותרות ── */
.shimmer {
  background: linear-gradient(270deg, currentColor 0%, #0953ba 32%, #08c4ce 50%, #0953ba 68%, currentColor 100%);
  background-size: 240% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: var(--ink, #081c40);
  animation: shimmer-slide 5.5s linear infinite;
}
@keyframes shimmer-slide {
  from { background-position: 240% 0; }
  to   { background-position: -40% 0; }
}

/* ── סמלים מרחפים ברקע-הפתיח (₪ · % · ◦) ── */
.hero, .g-hero { position: relative; }
.float-syms { position: absolute; inset: -10% 0 0; overflow: visible; pointer-events: none; }
.float-syms i {
  position: absolute; font-style: normal; font-weight: 900;
  font-size: clamp(1.6rem, 4vw, 3rem);
  color: var(--blue, #0953ba); opacity: .07;
  animation: sym-float 11s ease-in-out infinite alternate;
}
.float-syms i:nth-child(2) { animation-delay: -4s; animation-duration: 14s; color: var(--teal, #05797f); }
.float-syms i:nth-child(3) { animation-delay: -8s; animation-duration: 9s; }
@keyframes sym-float {
  from { transform: translateY(0) rotate(-7deg); }
  to   { transform: translateY(-30px) rotate(9deg); }
}

/* ── תוצאת-מחשבון קופצת פנימה ── */
.c-out { animation: pop-in .5s cubic-bezier(.34, 1.56, .64, 1) both; }
@keyframes pop-in {
  from { opacity: 0; transform: translateY(12px) scale(.96); }
}

/* ── קישורי-ניווט: קו-מחליק ── */
.navlinks a:not(.pill) { position: relative; }
.navlinks a:not(.pill)::after {
  content: ""; position: absolute; inset-inline: 0; bottom: -6px; height: 2px;
  background: linear-gradient(270deg, #7fe3ea, #08c4ce);
  transform: scaleX(0); transform-origin: 100% 50%; transition: transform .28s ease;
}
.navlinks a:not(.pill):hover::after { transform: scaleX(1); }

/* ── נגישות: מי שביקש פחות תנועה מקבל דף שקט לחלוטין ── */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
  .scroll-progress, .float-syms { display: none !important; }
  .g-cta::before, .g-cta::after, .result::before, .shimmer, .c-out { animation: none !important; }
  .shimmer { background: none; -webkit-text-fill-color: currentColor; color: inherit; }
}