/* =========================================================================
   LK FINANCE — TECH LAYER 2026
   שכבת ערכה כהה לכל האתר מלבד דף הבית (שיש לו מערכת משלו ב-home26.css).
   נטענת אחרי styles.css / polish.css / mobile.css ודורסת רק את הצבעים.

   למה שכבה ולא כתיבה מחדש: styles.css בנוי על :root עם 113 שימושי var(),
   ו-polish.css על עוד 37. הפיכת הערכים במקום אחד מטפלת ברובו של האתר בלי
   לגעת במאות כללי פריסה שעובדים. מה שנשאר קשיח מטופל בהמשך הקובץ אחד-אחד.
   ========================================================================= */

:root {
  /* Brand */
  --navy:#0A1628;
  --navy-2:#1A2340;
  --teal:#0E9E8C;
  --teal-2:#1B7BB8;
  --sky:#60A5FA;
  --sky-soft:#BFE3F2;
  --gold:#B8860B;

  /* Surfaces */
  --bg:#FFFFFF;
  --bg-tint:#F7F9FA;
  --bg-tint-2:#EFF3F5;
  --surface:#FFFFFF;
  --surface-2:#F7F9FA;

  /* Ink */
  --ink:#0A0B0D;
  --ink-2:#3A414D;
  --muted:#646C7A;
  --hairline:rgba(10,11,13,.10);
  --hairline-2:rgba(10,11,13,.18);

  /* Effects — קווים דקים במקום צללים רכים. זה מה שמונע מהאתר להיראות פסטלי. */
  --glow:0 24px 60px -26px rgba(14,158,140,.34);
  --shadow-1:0 1px 2px rgba(10,11,13,.04);
  --shadow-2:0 1px 2px rgba(10,11,13,.05), 0 18px 40px -24px rgba(10,11,13,.2);
  --shadow-cta:0 12px 32px -12px rgba(14,158,140,.45);

  /* Typography — זה מה ששרד מהמעבר הכהה, וזה מה שעושה את ההבדל:
     Rubik במקום Heebo, ומספרים במונוספייס. */
  --font-display:'Rubik', system-ui, sans-serif;
  --font-body:'Assistant', system-ui, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

html, body { background: var(--bg); color: var(--ink); color-scheme: light; }

/* ---------- 1. משטחים ---------- */
.nav { background: rgba(255,255,255,.86); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
       border-bottom: 1px solid var(--hairline); }
.nav-links a { color: var(--ink-2); }
.nav-links a:hover, .nav-links a.active { color: var(--teal); }
.nav-logo-text small { color: var(--muted); }

/* ---------- 2. טיפוגרפיה ---------- */
body { font-family: var(--font-body); }
h1, h2, h3, h4, h5, .h-1, .h-2, .h-3, .h-sec {
  font-family: var(--font-display); letter-spacing: -.015em;
}

/* מספרים במונוספייס: מונים, סטטיסטיקות, מחירים, תוצאות מחשבונים.
   זה הסיגנל הכי חזק של "זה כלי ולא עוד בלוג", והוא עובד גם על לבן. */
.num, .stat-num, .counter, .price, .calc-out, .calc-result,
.guide-card .num, .hk-stat b, .tp-price, [data-count] {
  font-family: var(--font-mono);
  font-weight: 600;
  letter-spacing: -.02em;
  font-variant-numeric: lining-nums tabular-nums;
}

/* ---------- 3. גבולות במקום צללים רכים ---------- */
.card, .panel, .guide-card, .post-card, .calc-card, .hk-card, .tp-card, .card-glass {
  border: 1px solid var(--hairline);
  box-shadow: var(--shadow-1);
}
.card-glass { background: #fff; backdrop-filter: none; }

/* ---------- 4. כפתורים ---------- */
.btn-primary, .nav-cta, .btn-submit {
  background: linear-gradient(180deg, #2FC7B2, var(--teal));
  color: #fff; border-color: transparent; box-shadow: var(--shadow-cta);
}

/* ---------- 5. טפסים ---------- */
input:focus, select:focus, textarea:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(14,158,140,.14);
  outline: none;
}

/* ---------- 6. גרדיאנט על טקסט ----------
   .spark-glow צובע טקסט בגרדיאנט. בעברית כל אות מקבלת גוון אחר והמילה מאבדת
   אחידות, וזה גם הסימן הכי מזוהה של אתר שנבנה מהר. צבע מלא במקום. */
.spark-glow {
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  color: var(--teal) !important;
  text-shadow: none !important;
}

/* ---------- 7. נגישות ---------- */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
}
