/* ============================================================
   site-chrome.css — רכיבי מעטפת שאינם ב-brand.css
   (skip-link · כפתורים צפים · ווידג'ט נגישות · באנר עוגיות · toast)
   כל הערכים נשאבים מטוקני brand.css.
   ============================================================ */

/* גלילה חלקה + כיבוד reduced-motion */
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto } *{ animation-duration:.001ms!important; transition-duration:.001ms!important } }

/* Skip link (נגישות) */
.skip-link{ position:absolute; right:12px; top:-60px; z-index:2000; background:var(--brand); color:#fff;
  padding:10px 18px; border-radius:var(--r-sm); font-family:var(--font-head); font-weight:600; text-decoration:none; transition:top .2s var(--ease) }
.skip-link:focus{ top:12px }

/* ההידר יושב מעל ראש העמוד ונגלל מעלה יחד עם התוכן (absolute) — לא נעוץ, לא מופיע/נעלם ולא מתחלף ללבן בגלילה.
   טקסט/לוגו בהירים מעל הירו כהה; over-light (רקע כהה) רק כשההירו בהיר, לטובת ניגודיות. */
.site-header{ position:absolute; inset-inline:0; top:0; z-index:900;
  background:rgba(255,255,255,.05); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  transition:background .3s var(--ease) }
/* מעל הירו בהיר (דפי משנה) — רקע כהה לטובת ניגודיות הטקסט הבהיר */
.site-header.over-light{ background:var(--surface-dark); -webkit-backdrop-filter:none; backdrop-filter:none }
/* ההירו יצא מהפריים — רק הרקע הופך ללבן עם צל (ללא החלקה/הופעה). ההידר נשאר במקומו תמיד. */
.site-header.revealed{ background:var(--surface); -webkit-backdrop-filter:none; backdrop-filter:none;
  box-shadow:0 4px 18px rgba(14,19,48,.10) }
/* כשההידר נחשף (ההירו יצא מהפריים) — וריאציה לבנה: לוגו צבעוני, טקסט כהה */
.site-header .nav-links a, .site-header .nav-toggle{ transition:color .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease) }
.site-nav .logo img.logo-color{ display:none }
.site-header.revealed .logo img.logo-light{ display:none }
.site-header.revealed .logo img.logo-color{ display:block }
.site-header.revealed .nav-links a{ color:var(--gray-700) }
.site-header.revealed .nav-links a:hover, .site-header.revealed .nav-links a[aria-current="page"]{ color:var(--brand) }
.site-header.revealed .nav-links a[aria-current="page"]{ font-weight:600 }
.site-header.revealed .nav-toggle{ color:var(--ink) }
.site-header.revealed .nav-links.open{ background:var(--surface); border-top-color:var(--line); box-shadow:0 14px 22px rgba(14,19,48,.12) }
.site-header.revealed .nav-links.open li a{ border-bottom-color:var(--line) }
.site-header.revealed .nav-links.open li + li{ border-top-color:var(--line) }
.site-header.revealed .nav-links.open li a:hover{ background:var(--gray-100) }

/* ===== הידר סטיקי שני =====
   ההידר העליון (.site-header הראשי) absolute ונגלל מעלה עם התוכן — לא נעוץ.
   הידר זה fixed, מוסתר מעל הפריים (translateY) ומחליק פנימה רק כשההירו יצא מ-viewport. וריאציה לבנה תמיד. */
.site-header.sticky-header{ position:fixed; top:0; bottom:auto; z-index:950;
  background:var(--surface); -webkit-backdrop-filter:none; backdrop-filter:none;
  box-shadow:0 4px 18px rgba(14,19,48,.10);
  transform:translateY(-100%); transition:transform .38s var(--ease) }
.site-header.sticky-header.show{ transform:translateY(0) }
.site-header.sticky-header .logo img.logo-light{ display:none }
.site-header.sticky-header .logo img.logo-color{ display:block }
.site-header.sticky-header .nav-links a{ color:var(--gray-700) }
.site-header.sticky-header .nav-links a:hover, .site-header.sticky-header .nav-links a[aria-current="page"]{ color:var(--brand) }
.site-header.sticky-header .nav-links a[aria-current="page"]{ font-weight:600 }
.site-header.sticky-header .nav-toggle{ color:var(--ink) }
.site-header.sticky-header .nav-links.open{ background:var(--surface); border-top-color:var(--line); box-shadow:0 14px 22px rgba(14,19,48,.12) }
.site-header.sticky-header .nav-links.open li a{ border-bottom-color:var(--line) }
.site-header.sticky-header .nav-links.open li + li{ border-top-color:var(--line) }
.site-header.sticky-header .nav-links.open li a:hover{ background:var(--gray-100) }
@media (prefers-reduced-motion: reduce){ .site-header.sticky-header{ transition:none } }

/* פינוי מקום לנאב ה-absolute מעל ההירו (גובה: פדינג אנכי*2 + לוגו 30px + אוויר) */
.hero-main,.hero-page,.hero-page.minimal{ padding-top:calc(var(--nav-pad-y)*2 + 30px + clamp(10px,1.8vw,22px)) }
@media(max-width:820px){
  .hero-main,.hero-page,.hero-page.minimal{ padding-top:calc(var(--nav-pad-y)*2 + 30px + var(--s-6)) }}

/* פוקוס נראה גלובלי */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--indigo-300); outline-offset:2px; border-radius:var(--r-sm) }

/* ניתוב עמודים (SPA) */
.page{ display:none }
.page.active{ display:block }
@keyframes page-fade{ from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

/* רצועת תוכן כללית בין סקשנים (עוטפת סקשני אתר) */
.band{ padding-block:clamp(46px,6vw,78px) }
.band.soft{ background:var(--bg) }

/* טופס "השאירו פרטים" + תמונת אדם לצדו (עמוד בית) */
.lead-split{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(24px,4vw,52px);
  align-items:end; max-width:940px; margin-inline:auto }
.lead-split .form-card{ margin:0; max-width:none }
.lead-figure{ justify-self:center; align-self:end; line-height:0 }
.lead-figure img{ width:100%; max-width:340px; height:auto; display:block }
@media(max-width:820px){ .lead-split{ grid-template-columns:1fr } .lead-figure{ display:none } }
/* "נדבר?" — טופס ממורכז ברוחב הסקשן, תמונת אדם בצד צמודה לתחתית הסקשן עם דעיכה רכה (כדי שהקיטום למטה ייראה מכוון), בלי שהטופס יסתיר אותה. הרקע הוא var(--bg-alt) כי זה סקשן זוגי. */
.contact-section{ position:relative; overflow:hidden; padding-bottom:0 }
.contact-section .lead-split{ display:block; max-width:1080px; margin-inline:auto; padding-bottom:clamp(46px,6vw,78px) }
.contact-section .form-card{ width:100%; max-width:500px; margin-inline:auto; position:relative; z-index:2 }
.contact-section .lead-figure{ position:absolute; bottom:0; inset-inline-start:max(16px,calc((100% - 1080px)/2)); width:clamp(220px,22vw,290px); margin:0; z-index:1; pointer-events:none }
.contact-section .lead-figure img{ width:100%; max-width:none }
.contact-section .lead-figure::after{ content:""; position:absolute; inset-inline:0; bottom:0; height:34%; background:linear-gradient(to top, var(--bg-alt), transparent); pointer-events:none }
@media(max-width:1080px){ .contact-section .lead-figure{ display:none } }

/* === כניסת תוכן ההירו (עמוד בית בלבד) ===
   ה-h1 ("הכותרת הראשית") עם אפקט typewriter. כל שאר תוכן ההירו מוסתר עד שה-h1 מסיים להיכתב,
   ואז עולה ב-fade-in-up מדורג. ההסתרה מותנית ב-html.hero-intro (נקבע ע"י סקריפט מוקדם ב-head)
   כדי שללא JS / בלי תנועה התוכן יוצג רגיל. ההפעלה: JS מוסיף .intro-go ל-.hero-main בסיום ההקלדה. */
html.hero-intro .hero-main .hero-pill,
html.hero-intro .hero-main .hook,
html.hero-intro .hero-main .hero-cta,
html.hero-intro .hero-main .hero-trust,
html.hero-intro .hero-main .hero-portrait{ opacity:0 }
/* פורטרט נכנס יחד עם תחילת ה-typewriter (לא מחכה לסיום) */
.hero-main.intro-portrait-go .hero-portrait{ animation:hero-rise .6s var(--ease) both }
.hero-main.intro-go .hero-pill,
.hero-main.intro-go .hook,
.hero-main.intro-go .hero-cta,
.hero-main.intro-go .hero-trust{ animation:hero-rise .6s var(--ease) both }
.hero-main.intro-go .hero-pill{ animation-delay:.02s }
.hero-main.intro-go .hook{ animation-delay:.2s }        /* כותרת המשנה */
.hero-main.intro-go .hero-cta{ animation-delay:.34s }
.hero-main.intro-go .hero-trust{ animation-delay:.48s }  /* שאר התוכן */
/* ההידר כולו (כולל וילון ה-5% והבלאר) מוסתר עד סיום ה-h1 (רק בנחיתה על הבית), ואז פשוט מופיע — ללא אנימציה.
   חשוב: בלי keyframe על ה-intro-in, אחרת הסרת .revealed (גלילה חזרה אל ההירו) מפעילה מחדש את האנימציה. */
html.hero-intro.home-landing .site-header:not(.sticky-header){ opacity:0 }
html.hero-intro.home-landing .site-header:not(.sticky-header).intro-in{ opacity:1 }
@keyframes hero-rise{ from{ opacity:0; transform:translateY(24px) } to{ opacity:1; transform:none } }
/* ללא תנועה — לבטל הסתרה/אנימציה (ה-typewriter ממילא לא רץ, ולא יתווסף intro-go) */
@media (prefers-reduced-motion: reduce){
  html.hero-intro .hero-main .hero-pill,html.hero-intro .hero-main .hook,
  html.hero-intro .hero-main .hero-cta,html.hero-intro .hero-main .hero-trust,
  html.hero-intro .hero-main .hero-portrait,
  html.hero-intro.home-landing .site-header{ opacity:1; animation:none } }

/* מצב ניווט מובייל (מתחת ל-820px ה-nav-links מוסתר ע"י brand.css) */
@media(max-width:820px){
  .site-nav .nav-links.open{ display:flex; position:absolute; inset-inline:calc(-1 * var(--wrap-pad)); top:100%;
    flex-direction:column; gap:0; background:#0a0e1d; padding:6px 12px 12px;
    border-top:1px solid rgba(255,255,255,.1); border-radius:0 0 var(--r-lg) var(--r-lg);
    z-index:50; box-shadow:var(--sh-lg);
    transform-origin:top center; animation:nav-drop var(--dur) var(--ease) both }
  .site-nav .nav-links.open li{ animation:nav-item .34s var(--ease) both }
  .site-nav .nav-links.open li:nth-child(1){ animation-delay:.04s }
  .site-nav .nav-links.open li:nth-child(2){ animation-delay:.08s }
  .site-nav .nav-links.open li:nth-child(3){ animation-delay:.12s }
  .site-nav .nav-links.open li:nth-child(4){ animation-delay:.16s }
  .site-nav .nav-links.open li:nth-child(5){ animation-delay:.20s }
  .site-nav .nav-links.open li:nth-child(6){ animation-delay:.24s }
  /* divider בין האייטמים */
  .site-nav .nav-links.open li + li{ border-top:1px solid rgba(255,255,255,.08) }
  .site-nav .nav-links.open li a{ display:block; padding:13px 12px; border-radius:var(--r-md);
    border-bottom:none }
  .site-nav .nav-links.open li a:hover{ background:rgba(255,255,255,.06) }
  .site-nav .nav-links.open li a[aria-current="page"]{ color:var(--teal-300); font-weight:600;
    background:rgba(28,205,168,.14) }
  .site-nav .nav-links.open li a[aria-current="page"]::after{ display:none }
  .site-header.revealed .site-nav .nav-links.open li a[aria-current="page"],
  .site-header.sticky-header .site-nav .nav-links.open li a[aria-current="page"]{
    color:var(--brand); background:var(--indigo-50) }
  @keyframes nav-drop{ from{ opacity:0; transform:translateY(-12px) scaleY(.94) } to{ opacity:1; transform:none } }
  @keyframes nav-item{ from{ opacity:0; transform:translateY(-8px) } to{ opacity:1; transform:none } }
  /* אנימציית סגירה — הפוכה לפתיחה (החלקה כלפי מעלה + דהייה) */
  .site-nav .nav-links.open.closing{ animation:nav-up var(--dur) var(--ease) both }
  .site-nav .nav-links.open.closing li{ animation:none }
  @keyframes nav-up{ from{ opacity:1; transform:none } to{ opacity:0; transform:translateY(-12px) scaleY(.94) } }
  @media (prefers-reduced-motion: reduce){
    .site-nav .nav-links.open,
    .site-nav .nav-links.open li{ animation:none } }
}
.nav-toggle{ display:none; background:none; border:none; color:#fff;
  width:42px; height:42px; border-radius:var(--r-sm); cursor:pointer; place-items:center; padding:0 }
.nav-toggle .icon{ width:22px; height:22px }
@media(max-width:820px){ .nav-toggle{ display:grid } }
/* מבורגר → איקס */
.nav-toggle .icon path{ transform-box:fill-box; transform-origin:center;
  transition:transform var(--dur) var(--ease), opacity var(--dur) var(--ease) }
.nav-toggle[aria-expanded="true"] .icon path:nth-child(1){ transform:translateY(7px) rotate(45deg) }
.nav-toggle[aria-expanded="true"] .icon path:nth-child(2){ opacity:0; transform:scaleX(.3) }
.nav-toggle[aria-expanded="true"] .icon path:nth-child(3){ transform:translateY(-7px) rotate(-45deg) }
@media (prefers-reduced-motion: reduce){ .nav-toggle .icon path{ transition:none } }

/* כפתורים צפים — וואטסאפ + חזרה למעלה */
.floaters{ position:fixed; inset-inline-start:var(--fab-inset); bottom:var(--fab-inset); z-index:850; display:flex; flex-direction:column; gap:var(--fab-gap) }
.float-btn{ width:var(--fab-size); height:var(--fab-size); border-radius:50%; display:grid; place-items:center; color:#fff;
  box-shadow:var(--sh-lg); text-decoration:none; border:none; cursor:pointer; transition:transform var(--dur) var(--ease) }
.float-btn:hover{ transform:scale(1.08) }
.float-btn:focus-visible{ outline:3px solid var(--indigo-300); outline-offset:3px }
.float-wa{ background:var(--whatsapp-btn) }
.float-wa svg{ width:28px; height:28px }
.float-top{ background:var(--ink); display:none }
.float-top.show{ display:grid; animation:float-rise var(--dur) var(--ease) }
.float-top .icon{ width:24px; height:24px }
@keyframes float-rise{ from{ opacity:0; transform:translateY(10px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion: reduce){ .float-top.show{ animation:none } }

/* ווידג'ט נגישות */
.a11y-toggle{ position:fixed; inset-inline-end:var(--fab-inset); bottom:var(--fab-inset); z-index:860; width:var(--a11y-fab-size); height:var(--a11y-fab-size); border-radius:50%;
  background:var(--brand); color:#fff; border:1.5px solid #fff; cursor:pointer; display:grid; place-items:center; box-shadow:var(--sh-lg) }
.a11y-toggle .icon{ width:19px; height:19px }
.a11y-panel{ position:fixed; inset-inline-end:var(--fab-inset); bottom:calc(var(--fab-inset) + var(--a11y-fab-size) + var(--s-3)); z-index:861; width:290px; max-width:calc(100vw - 36px);
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-lg); padding:20px; display:none }
.a11y-panel.open{ display:block; animation:page-fade .2s var(--ease) }
.a11y-panel h3{ font-size:16px; margin-bottom:6px }
.a11y-panel .sub{ font-size:12.5px; color:var(--muted); margin-bottom:14px }
.a11y-group{ margin-bottom:12px }
.a11y-group > span{ font-size:12px; font-weight:600; color:var(--muted); display:block; margin-bottom:6px }
.a11y-row{ display:flex; gap:8px; flex-wrap:wrap }
.a11y-row button{ flex:1; min-width:74px; font-family:var(--font-body); font-size:13px; font-weight:600; cursor:pointer;
  padding:9px 6px; border-radius:var(--r-sm); border:1.5px solid var(--line); background:var(--gray-100); color:var(--gray-700) }
.a11y-row button[aria-pressed="true"]{ background:var(--brand); border-color:var(--brand); color:#fff }
.a11y-reset{ width:100%; margin-top:6px }

/* התאמות נגישות פעילות */
html[data-fs="lg"] body{ zoom:1.1 }
html[data-fs="xl"] body{ zoom:1.22 }
html[data-contrast="high"]{ --muted:#1b2038; --gray-700:#0e1330; --line:#9aa0c4; --bg:#fff; --surface:#fff }
html[data-contrast="high"] .hero-main,html[data-contrast="high"] .hero-page,html[data-contrast="high"] .cta-band{ filter:contrast(1.15) }
html[data-underline="on"] a{ text-decoration:underline!important }

/* באנר עוגיות */
.cookie{ position:fixed; inset-inline:0; bottom:0; z-index:1200; background:var(--surface); color:var(--ink);
  border-top:3px solid var(--brand); box-shadow:0 -10px 30px rgba(14,19,48,.16); padding:16px 0; display:none }
.cookie.show{ display:block }
.cookie .wrap{ display:flex; gap:18px; align-items:center; flex-wrap:wrap }
.cookie p{ margin:0; font-size:13.5px; max-width:640px; color:var(--gray-700); flex:1; min-width:min(100%,260px) }
.cookie p a{ color:var(--brand); font-weight:600 }
.cookie-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-inline-start:auto }

/* Toast */
.toast{ position:fixed; inset-block-start:84px; inset-inline:0; margin-inline:auto; max-width:340px; z-index:1400;
  background:var(--positive); color:#fff; padding:14px 18px; border-radius:var(--r-md); text-align:center; box-shadow:var(--sh-lg);
  display:none; font-family:var(--font-head); font-weight:600 }
.toast.show{ display:block; animation:page-fade .25s var(--ease) }

.visually-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0 }
.hp-field{ position:absolute; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none }

/* פורטרט ההירו — picture רספונסיבי */
.hero-portrait picture{ display:contents }

/* בלוק IBI (בית) */
.ibi-band{ padding-block:clamp(46px,6vw,78px) }
.ibi-card{ position:relative; overflow:hidden; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(24px,4vw,48px);
  align-items:center; border-radius:var(--r-xl); padding:clamp(28px,4vw,46px); color:var(--ink);
  background:linear-gradient(150deg,#fff,var(--indigo-50)); border:1px solid var(--line); box-shadow:var(--sh-md) }
.ibi-card::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(60% 90% at 90% 10%,rgba(28,205,168,.12),transparent 55%) }
.ibi-card > *{ position:relative; z-index:1 }
.ibi-badge{ display:inline-flex; align-items:center; gap:7px; font-family:var(--font-head); font-weight:600; font-size:12.5px;
  color:var(--teal-700); background:var(--surface); border:1px solid var(--teal-200); padding:6px 13px; border-radius:var(--r-pill); margin-bottom:14px }
.ibi-card h2{ font-family:var(--font-head); font-weight:700; font-size:clamp(22px,3vw,30px); line-height:1.2 }
.ibi-card p{ color:var(--muted); font-size:clamp(15px,1.6vw,17px); margin:12px 0 22px; max-width:46ch }
.ibi-visual{ display:flex; justify-content:center }
.ibi-visual img{ width:100%; max-width:300px; height:auto }
/* לוגו השותף (בית ההשקעות IBI) בתוך כרטיס ה-IBI */
.ibi-partner{ display:flex; align-items:center; gap:13px; margin:2px 0 24px }
.ibi-partner span{ font-size:13px; font-weight:600; color:var(--muted) }
.ibi-partner img{ height:42px; width:auto; display:block }
@media(max-width:760px){ .ibi-card{ grid-template-columns:1fr } .ibi-visual{ display:none } }

/* רקע דקורטיבי עדין לסקשני "כאב" בבית */
.problem-visual img{ width:100%; height:auto; border-radius:var(--r-lg) }

/* === ניסוי עיצובי: סקשן ריק עם מפת-חום מניות (Treemap) הנחשפת סביב העכבר — עמוד "ליווי אישי" ===
   סקשן אפרפר וריק. אריחים חדים (ללא רדיוס) בגווני אדום/ירוק בהירים מהסכמה (--positive/--danger,
   ממוזגים אל לבן). זרקור עוקב אחרי הסמן: חד במרכז ומיטשטש ככל שמתרחקים מהמרכז. */
.treemap-lab{ position:relative; overflow:hidden; min-height:clamp(360px,52vh,560px); background:var(--bg-alt);
  display:flex; align-items:center; padding-block:clamp(46px,6vw,78px) }
.treemap-lab .wrap{ position:relative; z-index:1; width:100% }
.treemap-lab .section-head{ margin-bottom:0 }
.treemap-note{ margin-top:clamp(16px,2.4vw,24px); text-align:center; color:var(--muted); font-size:12.5px; opacity:.85 }
.treemap-lab .treemap-bg{ position:absolute; inset:0; width:100%; height:100%; opacity:0;
  pointer-events:none; transition:opacity .7s var(--ease) }
.treemap-lab.treemap-ready .treemap-bg{ opacity:1 }
@media (prefers-reduced-motion: reduce){ .treemap-lab .treemap-bg{ transition:none } }

/* === ויזואליזציה: "שני תיקים, 15 שנה" — עמוד ליווי אישי ===
   רקע גריד משבצות חשבון בהיר (נראה לכל אורך הסקשן). הקנבס מלא-רוחב; שני גרפים
   מצוירים לאט בזמן אמת משמאל לימין: תיק מלווה (ירוק) שמנצח מול תיק פזיז (אדום).
   נקודות הציון הקטנות הן צ'יפים ב‑DOM; ציר השנים והגריד הראשי מצוירים על הקנבס. */
.growth-race{ position:relative; overflow:hidden; padding-block:clamp(46px,6vw,84px);
  --growth-bg:#f7f9ff;
  /* משבצות חשבון בגוון תכלת — נראות בבירור גם מאחורי הגרף (משבצות דקות + קו-על כל 5) */
  background-color:var(--growth-bg);
  background-image:
    linear-gradient(rgba(67,67,219,.085) 1px, transparent 1px),
    linear-gradient(90deg, rgba(67,67,219,.085) 1px, transparent 1px),
    linear-gradient(rgba(67,67,219,.14) 1.2px, transparent 1.2px),
    linear-gradient(90deg, rgba(67,67,219,.14) 1.2px, transparent 1.2px);
  background-size:23px 23px, 23px 23px, 115px 115px, 115px 115px; background-position:center; }
.growth-race::after{ content:""; position:absolute; inset:0; pointer-events:none;
  /* וינייטה עדינה בקצוות בלבד — לא מסתירה את הגריד במרכז */
  background:radial-gradient(140% 100% at 50% 45%, transparent 68%, rgba(247,249,255,.45) 100%); }
.growth-race .wrap{ position:relative; z-index:1 }
/* פרופילי המשקיעים — מינימליסטי ונקי, זה לצד זה גם במובייל */
.growth-profiles{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(8px,1.2vw,16px);
  max-width:760px; margin:clamp(18px,2.5vw,28px) auto 0 }
.gp-card{ background:color-mix(in srgb,var(--growth-bg) 72%,#fff);
  border:1px solid rgba(67,67,219,.13);
  border-radius:var(--r-md); padding:clamp(12px,1.4vw,20px) }
.gp-head{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:2px 8px;
  margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid rgba(67,67,219,.1) }
.gp-dot{ width:8px; height:8px; border-radius:50%; flex:none; grid-row:span 2; align-self:center }
.gp-card.calm .gp-dot{ background:var(--positive) }
.gp-card.wild .gp-dot{ background:var(--danger) }
.gp-head h3{ font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--ink); margin:0; line-height:1.2 }
.gp-head .gp-sub{ grid-column:2; margin:0; font-size:11px; color:var(--muted); font-weight:500; line-height:1.25 }
.gp-card dl{ display:grid; grid-template-columns:auto 1fr; gap:7px 12px; margin:0 }
.gp-card dt{ font-size:11px; color:var(--muted); font-weight:500; white-space:nowrap }
.gp-card dd{ font-size:12px; color:var(--ink); margin:0; font-weight:500; text-align:start; line-height:1.35 }
.gp-card dd b{ font-weight:700 }
.gp-card.calm dd b{ color:var(--positive) }
.gp-card.wild dd b{ color:var(--danger) }
@media (max-width:640px){
  .growth-profiles{ max-width:none; gap:8px; margin-top:16px }
  .gp-card{ padding:10px; border-radius:var(--r-sm) }
  .gp-head{ margin-bottom:8px; padding-bottom:6px; gap:1px 6px }
  .gp-dot{ width:7px; height:7px }
  .gp-head h3{ font-size:12px }
  .gp-head .gp-sub{ font-size:9.5px }
  .gp-card dl{ grid-template-columns:1fr; gap:4px }
  .gp-card dt{ font-size:9px; line-height:1.2 }
  .gp-card dd{ font-size:10.5px; line-height:1.25 }}
/* קנבס מלא-רוחב */
.growth-chart{ position:relative; width:100%; margin-top:clamp(24px,3.4vw,38px);
  height:clamp(380px,42vw,560px) }
@media (max-width:640px){ .growth-chart{ height:clamp(420px,84vw,520px) } }
.growth-chart canvas{ position:absolute; inset:0; width:100%; height:100%; display:block }
/* מקרא */
.growth-legend{ display:flex; flex-wrap:wrap; gap:10px 22px; justify-content:center;
  margin-top:clamp(20px,2.6vw,30px) }
.growth-legend .lg{ display:inline-flex; align-items:center; gap:9px; font-size:13.5px; font-weight:600; color:var(--ink) }
.growth-legend .swatch{ width:26px; height:0; border-top:3px solid currentColor; border-radius:2px; flex:none }
.growth-legend .lg.calm{ color:var(--positive) }
.growth-legend .lg.wild{ color:var(--danger) }
.growth-legend .lg b{ color:inherit }
.growth-legend .lg span{ color:var(--muted); font-weight:500 }
/* נקודות ציון היסטוריות — תגית אירוע שוק נייטרלית (כהה, טקסט לבן); מופיעה לכמה שניות ונעלמת */
.growth-pin{ position:absolute; transform:translate(-50%,-50%) scale(.92); z-index:3;
  display:flex; align-items:center; gap:6px; max-width:none; white-space:nowrap;
  background:var(--ink); border-radius:var(--r-pill);
  padding:4px 11px; box-shadow:var(--sh-md); font-size:10.5px; font-weight:600; color:#fff;
  opacity:0; transition:opacity .5s var(--ease), transform .5s var(--ease) }
.growth-pin .yr{ font-family:var(--font-head); font-weight:700; opacity:.65; font-size:10px }
.growth-pin::after{ content:""; position:absolute; width:7px; height:7px; border-radius:50%;
  background:var(--ink); border:2px solid #fff; bottom:-11px; left:50%; transform:translateX(-50%); box-shadow:var(--sh-sm) }
.growth-pin.below::after{ bottom:auto; top:-11px }
.growth-pin.show{ opacity:1; transform:translate(-50%,-50%) scale(1) }
/* תגי סיום — ערך התיק בקצה הימני */
.growth-end{ position:absolute; transform:translateY(-50%); z-index:4; right:clamp(8px,1.4vw,20px);
  display:flex; flex-direction:column; gap:1px; align-items:flex-start;
  background:var(--surface); border:1.5px solid var(--line); border-radius:var(--r-md);
  padding:6px 10px; box-shadow:var(--sh-md); opacity:0; transition:opacity .5s var(--ease) .2s;
  font-weight:700; line-height:1.15 }
.growth-end.show{ opacity:1 }
.growth-end .v{ font-family:var(--font-head); font-size:clamp(15px,1.8vw,19px) }
.growth-end .t{ font-size:10.5px; font-weight:600; color:var(--muted) }
.growth-end.calm{ border-color:color-mix(in srgb, var(--positive) 55%, var(--line)) }
.growth-end.calm .v{ color:var(--positive) }
.growth-end.wild{ border-color:color-mix(in srgb, var(--danger) 55%, var(--line)) }
.growth-end.wild .v{ color:var(--danger) }
@media (max-width:640px){
  .growth-pin{ font-size:9.5px; padding:3px 8px } .growth-pin .emo{ font-size:10px }
  .growth-pin[data-sm="hide"]{ display:none } }
@media (prefers-reduced-motion: reduce){
  .growth-pin, .growth-end{ transition:none } }