/* ============================================================
   בית הספר לעיצוב האנושי · מערכת העיצוב
   זהב #E0C070 מהלוגו · טורקיז #4FD8CE · לבן · חלל עמוק
   מונחים: השתלמויות (עצמאי) מול הכשרות (מסלול מדורג)
   ============================================================ */
:root{
  /* ===== החלל, גרסת "ערפילית טורקיז" (29.07.2026) =====
     הבסיס הועלה מכחול כמעט שחור לכחול טורקיז פתוח. שלושת גווני הגרדיאנט
     הם הרקע של כל האתר. --deep הוא הגוון הכהה שנשאר לשימוש בלוטים,
     בשדות ובתפריט, כדי שטקסט לעולם לא יישב ישירות על אזור בהיר. */
  /* ⭐ הרמה שנייה, 30.07 ערב. עידו: "הכל מאוד כהה, האתר צריך להיות הרבה
     יותר מואר, כמו הצבעים בהירו, וגם משחק בין זה ליותר בהיר ולא רק כהה".
     הבסיס עלה שוב, הזוהר התחזק, הוינייטה נחלשה, ונוספה שכבה בהירה
     אמיתית (.paper) שמתחלפת עם הכהה לאורך כל האתר ולא רק בעמוד הבית. */
  --space:#15425F;
  --space-2:#1C5578;
  --space-3:#133B57;
  --deep:10,32,52;
  --slab:#184A6A;
  --gold:#E0C070;
  --gold-soft:rgba(224,192,112,.55);
  --gold-dim:rgba(224,192,112,.24);
  --turq:#4FD8CE;
  --turq-dim:rgba(79,216,206,.26);
  --white:#FFFFFF;
  /* הטקסט הובהר, כי הרקע עלה. בלי זה הגוף והמשנה נבלעים */
  --text:#F3F7FC;
  --muted:#C2CEDF;
  --line:rgba(224,192,112,.22);
  /* נייר: הצבע של הסקציות הבהירות. ivory לעמוד הבית, mist לעמודים הפנימיים */
  --mist:#DEEAF1;
  /* ‎--teal‎ הוכהה מ-#1E8A82 ב-10.08.2026. הוא משמש רק בסקציות הבהירות
     (קישורי ‎.go‎ בכרטיסי עמוד הבית ובכרטיס ההרשמה), ושם הוא רץ ביחס
     4.01 בלבד. עכשיו 5.70 מול השנהב ו-5.25 מול התכלת. הטורקיז הבהיר
     של הסקציות הכהות הוא ‎--turq‎ ואינו מושפע מכאן */
  --ivory:#F4F1EA;--ink:#0E1726;--ink-soft:#55647A;--bronze:#A8813A;--teal:#146A61;
  --sans:'Heebo',system-ui,sans-serif;
  --serif:'Frank Ruhl Libre',Georgia,serif;
  --max:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
/* ⚠️ overflow-x חייב לשבת גם על html, לא רק על body. כשהוא רק על body הוא
   מתפשט לחלון, ו-body עצמו נשאר visible ולא חותך כלום. באתר RTL זה גרם לדף
   לנחות על קצה הגלישה, והמשתמש היה צריך לגרור את המסך ימינה כדי לראות אותו.
   הגולש היה האאורה של .const בעמוד הבית (126% ועוד scale 1.07 = 431px).
   clip עדיף על hidden כי הוא לא הופך את body לקונטיינר גלילה ולא שובר sticky.
   hidden נשאר לפניו כנפילה לאחור לדפדפנים ישנים. (03.08.2026) */
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip}
body{background:linear-gradient(180deg,var(--space) 0%,var(--space-2) 48%,var(--space-3) 100%);
  background-attachment:fixed;color:var(--text);font-family:var(--sans);font-weight:200;
  line-height:1.85;font-size:17px;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;overflow-x:clip}

/* ===== cosmos =====
   הערפילית הטורקיז יושבת בצד של האיור, ולא בצד של הטקסט. כשהיא הייתה
   מעל עמודת הקופי היא הבליעה את הכותרת. הזהב עבר לצד הנגדי, חלש יותר. */
#sky{position:fixed;inset:0;z-index:0;pointer-events:none}
.neb{position:fixed;border-radius:50%;filter:blur(110px);pointer-events:none;z-index:0}
.neb-a{width:96vw;height:96vw;inset-block-start:-28vw;inset-inline-end:-30vw;
  background:radial-gradient(circle,rgba(110,236,228,.34),rgba(88,180,214,.19) 40%,transparent 74%)}
.neb-b{width:78vw;height:78vw;inset-block-end:-26vw;inset-inline-start:-22vw;
  background:radial-gradient(circle,rgba(236,208,132,.20),rgba(110,190,220,.15) 44%,transparent 72%)}
/* הוינייטה נחלשה מאוד. היא זו שגרמה לתחושת החושך בשוליים. */
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse at 50% 44%,transparent 68%,rgba(9,30,50,.34) 100%)}
main,header,footer{position:relative;z-index:2}

.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
.narrow{max-width:820px}
h1,h2,h3{font-weight:200;line-height:1.14;letter-spacing:-.015em}
h2{font-size:clamp(1.9rem,4vw,3rem);color:var(--white);text-shadow:0 0 60px rgba(224,192,112,.16)}
h3{font-size:1.22rem;font-weight:400;line-height:1.45}
p{max-width:66ch}
a{color:inherit;text-decoration:none}
.num{font-variant-numeric:tabular-nums}
.lat{direction:ltr;unicode-bidi:isolate;display:inline-block}

.eyebrow{font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;color:var(--turq);
  font-weight:400;display:block;margin-bottom:26px;text-shadow:0 0 22px rgba(79,216,206,.5)}
/* האנגלית יושבת באותה שורה של הכותרת הקטנה, מופרדת בקו, ולא נזרקת לשמאל */
.eyebrow em{display:inline-block;font-style:normal;direction:ltr;unicode-bidi:isolate;
  color:var(--gold);letter-spacing:.3em;font-size:.6rem;opacity:.62;font-weight:400;
  margin-inline-start:15px;padding-inline-start:15px;border-inline-start:1px solid rgba(224,192,112,.3);
  text-shadow:0 0 16px rgba(224,192,112,.3)}
/* שורת המונח הלועזי, צמודה לכותרת שמעליה, מיושרת איתה */
.en{direction:ltr;unicode-bidi:isolate;text-align:right;font-size:.63rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:9px;opacity:.6;font-weight:400}
.sub-en{direction:ltr;unicode-bidi:isolate;text-align:right;font-size:.64rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);display:block;opacity:.55;font-weight:400;margin:-4px 0 14px}
.paper .sub-en{color:var(--bronze);opacity:.75}
.lead{font-size:clamp(1.04rem,1.5vw,1.24rem);color:var(--muted);font-weight:200}

/* ===== section rhythm ===== */
.sec{padding:130px 0;position:relative}
.sec-sm{padding:90px 0}
.cosmic::before{content:'';position:absolute;z-index:-1;pointer-events:none;
  inset-block-start:var(--ay,30%);inset-inline-start:var(--ax,20%);
  width:var(--aw,48vw);height:var(--aw,48vw);transform:translate(50%,-50%);
  background:radial-gradient(circle,rgba(var(--ac,79,216,206),var(--ao,.14)),transparent 66%);
  filter:blur(80px);border-radius:50%}
/* מדרג טונלי: t1 הכהה ביותר, t3 דמדומים, ואז dawn הבהיר.
   הועלה 29.07 יחד עם החלל. המרווח בין הדרגות נשמר, רק הבסיס עלה. */
.slab{--sb:24,74,106;
  background:linear-gradient(180deg,rgba(var(--sb),0) 0%,rgba(var(--sb),.92) 6%,rgb(var(--sb)) 22%,
  rgb(var(--sb)) 78%,rgba(var(--sb),.92) 94%,rgba(var(--sb),0) 100%)}
.t1{--sb:18,58,86}
.t2{--sb:24,74,106}
.t3{--sb:31,92,128}
.slab::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse var(--gw,58%) var(--gh,52%) at var(--gx,50%) var(--gy,0%),
  rgba(var(--gc,224,192,112),var(--gi,.10)),transparent 72%)}
.slab > *{position:relative;z-index:1}
.hair{position:relative}
.hair::before{content:'';position:absolute;inset-block-start:0;inset-inline:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-dim) 24%,rgba(79,216,206,.24) 50%,var(--gold-dim) 76%,transparent)}

/* ===== הסקציה הבהירה =====
   הרקע עצמו אטום לגמרי, כדי שטקסט לעולם לא יישב על שכבה שקופה.
   המעבר מהחלל נעשה בשתי רצועות נפרדות, מעל ומתחת, שעוברות דרך גוון חם
   ולא דרך אפור. האפור נוצר משנהב שקוף מעל כחול כהה, וזה מה שהיה בוצי. */
/* --from ו---to הם הגוונים של הסקציות שנוגעות בבהירה, מלמעלה ומלמטה.
   כרגע: מעל "בית הספר" (t3), מתחת "דביר" (t2).
   ⚠️ אם מזיזים סקציות, לעדכן את שתי השורות האלה. */
/* ⭐ הכל עבר ל-.paper, מחלקה משותפת לכל סקציה בהירה. --paper הוא הצבע.
   .dawn = שנהב חם (עמוד הבית), .mist = תכלת קריר (עמודים פנימיים).
   המעבר מחושב ב-color-mix במרחב oklab, ולכן הוא נכון לכל צבע נייר
   בלי לחשב ידנית עצירות ביניים, ובלי ליפול לאפור בוצי. */
.paper{--from:24,74,106;--to:24,74,106;--paper:var(--ivory);
  color:var(--ink);background:var(--paper);position:relative;padding:150px 0}
.dawn{--paper:var(--ivory)}
.mist{--paper:var(--mist)}
.paper::before,.paper::after{content:'';position:absolute;inset-inline:0;height:190px;z-index:0;pointer-events:none}
.paper::before{inset-block-start:-189px;background:linear-gradient(180deg,
  rgb(var(--from)) 0%,
  color-mix(in oklab, rgb(var(--from)) 76%, var(--paper)) 26%,
  color-mix(in oklab, rgb(var(--from)) 46%, var(--paper)) 52%,
  color-mix(in oklab, rgb(var(--from)) 18%, var(--paper)) 76%,
  var(--paper) 100%)}
.paper::after{inset-block-end:-189px;background:linear-gradient(180deg,
  var(--paper) 0%,
  color-mix(in oklab, rgb(var(--to)) 18%, var(--paper)) 24%,
  color-mix(in oklab, rgb(var(--to)) 46%, var(--paper)) 48%,
  color-mix(in oklab, rgb(var(--to)) 76%, var(--paper)) 74%,
  rgb(var(--to)) 100%)}
.paper > *{position:relative;z-index:1}
.paper h2,.paper h3{color:var(--ink);text-shadow:none}
.paper p,.paper .lead{color:var(--ink-soft)}
.paper .en,.paper .eyebrow,.paper .eyebrow em{color:var(--bronze);text-shadow:none;opacity:.9}
.paper .crumbs{color:#5C6E85}
.paper .entry{color:var(--bronze);border-color:rgba(168,129,58,.4);background:rgba(168,129,58,.05)}
.paper .entry:hover{border-color:var(--bronze);background:rgba(168,129,58,.11);box-shadow:none}
.paper .go{color:var(--teal)}
/* .mist קריר, ולכן הטקסט בו כחלחל ולא חום */
.mist{--ink:#12293D;--ink-soft:#42586E}
.mist .en,.mist .eyebrow{color:#1E6E86}
.mist .entry{color:#14607A;border-color:rgba(20,96,122,.38);background:rgba(20,96,122,.05)}
.mist .entry:hover{border-color:#14607A;background:rgba(20,96,122,.1)}
.mist .go{color:#14607A}
/* ===== למה הרצועות אטומות ולמה השכנות אטומות עד הגבול =====
   הוינייטה היא שכבה קבועה שמכהה את שולי החלון. כשסקציה דוהה לשקיפות
   ליד המעבר, הוינייטה נחשפת מתחתיה, וזאת הרצועה הכהה שנראתה בדיוק לפני
   הסקציה הבהירה. לכן הסקציה שמעל נשארת אטומה עד הקצה, הרצועות עברו
   מ-z-index -1 ל-0 כך שהן מציירות מעל השכנות, והסקציה שמתחת שקופה
   בדיוק ב-190 הפיקסלים שהרצועה מכסה, ואטומה מיד אחריהם. */
.slab:has(+ .paper){padding-block-end:212px;
  background:linear-gradient(180deg,rgba(var(--sb),0) 0%,rgba(var(--sb),.92) 6%,
  rgb(var(--sb)) 22%,rgb(var(--sb)) 100%)}
/* ⚠️⚠️ הכלל למעלה מכסה רק ‎.slab‎. ב-‎contact.html‎ ההירו עצמו צמוד לסקציה
   הבהירה, ‎.phero‎ אינו ‎.slab‎, ולכן הוא לא קיבל את הריפוד **והרצועה
   ציירה מעל פסקת הפתיחה וחתכה אותה באמצע.** עידו: "עמוד הצור קשר שבור".
   ⚠️ כל סקציה שתוצב אי פעם ישירות מעל ‎.paper‎ חייבת ריפוד תחתון כזה. */
.phero:has(+ .paper){padding-block-end:232px}
/* ===== החיבור בין הסקציה הבהירה לסקציה כהה שבאה מיד אחריה =====
   רצועת המעבר של dawn היא 190px ויושבת מתחת לסקציה ב-z-index -1. slab רגיל
   מתחיל להתמלא כבר ב-6 אחוז מגובהו, כלומר בתוך תחום הרצועה, ואז הוא מכסה
   אותה והמעבר מהבהיר לחלל נראה חתוך ודולף לסקציה הבאה.
   כאן הפייד נמדד בפיקסלים ולא באחוזים, ומתחיל רק אחרי שהרצועה נגמרה. */
.paper + .slab{padding-block-start:212px;
  background:linear-gradient(180deg,rgba(var(--sb),0) 0,rgba(var(--sb),0) 189px,
  rgb(var(--sb)) 190px,
  rgb(var(--sb)) 78%,rgba(var(--sb),.92) 94%,rgba(var(--sb),0) 100%)}
/* קו השיער היה נופל באמצע רצועת המעבר */
.paper + .slab.hair::before{display:none}

/* ===== surfaces ===== */
.pane{background:linear-gradient(160deg,rgba(56,110,150,.50),rgba(20,58,88,.48));backdrop-filter:blur(14px);
  border:1px solid rgba(224,192,112,.15);border-radius:5px;position:relative;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 -50px 90px -60px rgba(79,216,206,.30),0 24px 70px rgba(0,0,0,.42);
  transition:border-color .55s,box-shadow .55s,transform .55s}
.pane::before{content:'';position:absolute;inset-block-start:-40%;inset-inline-start:-20%;width:70%;height:120%;
  pointer-events:none;background:radial-gradient(ellipse,rgba(224,192,112,.10),transparent 62%);filter:blur(34px);opacity:.6;transition:opacity .55s}
.pane:hover{border-color:rgba(224,192,112,.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -50px 100px -55px rgba(79,216,206,.48),0 30px 80px rgba(0,0,0,.5);transform:translateY(-5px)}
.pane:hover::before{opacity:1}
.pane-flat:hover{transform:none}

/* ===== nav ===== */
header{position:fixed;inset-block-start:0;inset-inline:0;z-index:60;transition:background .6s,border-color .6s;border-block-end:1px solid transparent}
header.solid{background:rgba(var(--deep),.88);backdrop-filter:blur(20px);border-block-end-color:var(--line)}
.nav{display:flex;align-items:center;gap:30px;height:80px}
.brand{display:flex;align-items:center;gap:13px;font-size:.9rem;color:var(--white)}
.brand svg{width:32px;height:32px;flex:none;filter:drop-shadow(0 0 8px rgba(224,192,112,.4))}
.nav ul{display:flex;gap:28px;list-style:none;margin-inline-start:auto;font-size:.92rem;color:var(--muted)}
.nav ul a{transition:color .35s,text-shadow .35s}
.nav ul a:hover,.nav ul a.on{color:var(--gold);text-shadow:0 0 18px rgba(224,192,112,.6)}
.burger{display:none;margin-inline-start:auto;background:none;border:0;color:var(--gold);font-size:1.7rem;cursor:pointer;line-height:1}
.mmenu{display:none;position:fixed;inset:80px 0 0;z-index:59;background:rgba(var(--deep),.97);backdrop-filter:blur(20px);padding:34px 28px;overflow-y:auto}
.mmenu.open{display:block}
.mmenu a{display:block;padding:16px 0;border-block-end:1px solid var(--line);font-size:1.08rem;color:var(--text)}
.mmenu a:last-of-type{border:0}

/* ===== entries ===== */
.entry{display:inline-flex;align-items:center;gap:12px;padding:15px 32px;border-radius:100px;font-size:.95rem;
  font-weight:300;font-family:var(--sans);cursor:pointer;border:1px solid var(--gold-dim);color:var(--gold);
  background:rgba(224,192,112,.03);transition:.5s;box-shadow:inset 0 0 24px rgba(224,192,112,.05)}
.entry:hover{border-color:var(--gold-soft);background:rgba(224,192,112,.08);box-shadow:inset 0 0 34px rgba(224,192,112,.12),0 0 34px rgba(224,192,112,.16)}
.entry-t{border-color:var(--turq-dim);color:var(--turq);box-shadow:inset 0 0 24px rgba(79,216,206,.05)}
.entry-t:hover{border-color:rgba(79,216,206,.6);background:rgba(79,216,206,.07);box-shadow:inset 0 0 34px rgba(79,216,206,.12),0 0 34px rgba(79,216,206,.16)}
.entry-sm{padding:11px 22px;font-size:.85rem}
.entry-solid{background:var(--bronze);border-color:var(--bronze);color:#fff;box-shadow:none}
.entry-solid:hover{background:#8E6C2C;border-color:#8E6C2C;color:#fff;box-shadow:0 10px 30px rgba(168,129,58,.28)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}

/* ===== page hero ===== */
.phero{padding:190px 0 90px;position:relative}
.crumbs{font-size:.8rem;color:#93A2BA;margin-bottom:28px}
.crumbs a:hover{color:var(--gold)}
.phero h1{font-size:clamp(2.1rem,4.8vw,3.9rem);font-weight:100;letter-spacing:-.03em;color:var(--white);
  margin-bottom:24px;text-shadow:0 0 70px rgba(224,192,112,.26)}
.phero h1 b{font-weight:300;color:var(--gold);display:block;text-shadow:0 0 50px rgba(224,192,112,.4)}
.phero .lead{max-width:56ch;margin-bottom:38px}
.facts-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:38px}
.facts-row span{font-size:.8rem;color:var(--muted);background:rgba(255,255,255,.035);
  border:1px solid rgba(224,192,112,.12);padding:7px 15px;border-radius:100px;font-variant-numeric:tabular-nums}

/* ===== prose ===== */
.prose h2{margin-bottom:26px}
.prose h3{color:var(--gold);font-weight:300;font-size:1.35rem;margin:44px 0 14px}
.prose p{color:var(--muted);margin-bottom:20px}
.prose p.big{font-family:var(--serif);color:var(--text);font-size:clamp(1.1rem,1.9vw,1.4rem);line-height:1.65;font-weight:300;margin:34px 0}
.prose ul{list-style:none;margin:22px 0}
.prose ul li{position:relative;padding-inline-start:24px;margin-bottom:13px;color:var(--muted)}
.prose ul li::before{content:'';position:absolute;inset-inline-start:0;inset-block-start:.85em;width:6px;height:6px;
  border-radius:50%;background:var(--turq);box-shadow:0 0 10px rgba(79,216,206,.7)}
.dawn .prose p,.dawn .prose ul li{color:var(--ink-soft)}
.dawn .prose h3{color:var(--bronze)}
.paper .prose ul li::before{background:var(--bronze);box-shadow:none}
.pull{border-inline-start:2px solid var(--gold-dim);padding-inline-start:24px;margin:38px 0;
  font-family:var(--serif);font-size:1.22rem;line-height:1.6;color:var(--text);font-weight:300}
.pull cite{display:block;margin-top:12px;font-style:normal;font-size:.78rem;letter-spacing:.24em;color:var(--gold);text-transform:uppercase}

/* two column */
.two{display:grid;grid-template-columns:1fr 1fr;gap:52px}
.two-a{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}
.two-b{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:start}

/* ===== cards ===== */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tile{padding:40px 34px}
.tile .n{font-size:.7rem;letter-spacing:.28em;color:var(--turq);margin-bottom:18px;display:block}
.tile h3{margin-bottom:13px;color:var(--gold);font-weight:300}
.tile p{color:var(--muted);font-size:.96rem}
.tile .go{color:var(--turq);font-size:.9rem;display:inline-block;margin-top:18px}

/* ===== who it's for ===== */
.forwho{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:46px}
.forwho .col{padding:36px 32px}
.forwho h3{font-size:1.15rem;margin-bottom:20px;font-weight:400}
.forwho .yes h3{color:var(--turq)}
.forwho .no h3{color:#B9A47C}
.forwho ul{list-style:none}
.forwho li{position:relative;padding-inline-start:26px;margin-bottom:14px;color:var(--muted);font-size:.96rem;line-height:1.7}
.forwho li::before{position:absolute;inset-inline-start:0;inset-block-start:0;font-size:.95rem}
.forwho .yes li::before{content:'✓';color:var(--turq)}
.forwho .no li::before{content:'—';color:#9A8760}

/* ===== curriculum ===== */
.curric{list-style:none;margin-top:40px;counter-reset:c}
.curric li{position:relative;padding:26px 0 26px 0;padding-inline-start:66px;border-block-end:1px solid var(--line);counter-increment:c}
.curric li::before{content:counter(c,decimal-leading-zero);position:absolute;inset-inline-start:0;inset-block-start:26px;
  font-size:.82rem;color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:.1em;opacity:.8}
.curric h4{font-size:1.06rem;font-weight:400;color:var(--text);margin-bottom:7px}
.curric p{color:var(--muted);font-size:.95rem;margin:0}
.dawn .curric li::before{color:var(--bronze)}
.dawn .curric h4{color:var(--ink)}
.dawn .curric li{border-block-end-color:rgba(14,23,38,.09)}

/* ===== included ===== */
.incl{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:42px}
.incl div{background:rgba(var(--deep),.55);padding:30px 28px}
.incl b{display:block;color:var(--gold);font-weight:400;font-size:1rem;margin-bottom:7px}
.incl span{color:var(--muted);font-size:.93rem;line-height:1.7}

/* ===== FAQ ===== */
.faq{margin-top:44px;border-block-start:1px solid var(--line)}
.faq details{border-block-end:1px solid var(--line)}
.faq summary{padding:24px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;
  gap:20px;align-items:baseline;color:var(--text);font-size:1.03rem;font-weight:300;transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--gold);font-size:1.3rem;flex:none;transition:transform .35s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--gold)}
.faq .a{padding:0 0 26px;color:var(--muted);font-size:.97rem}
.dawn .faq summary{color:var(--ink)}
.dawn .faq .a{color:var(--ink-soft)}
.dawn .faq details,.dawn .faq{border-color:rgba(14,23,38,.1)}
.dawn .faq summary::after{color:var(--bronze)}

/* ===== price + registration (light, always last) ===== */
.enroll{background:#fff;border:1px solid rgba(168,129,58,.26);border-radius:5px;padding:46px 42px;
  box-shadow:0 2px 4px rgba(14,23,38,.03),0 20px 50px rgba(14,23,38,.08);margin-top:52px}
.enroll .en{color:var(--bronze);opacity:.9}
.enroll h3{font-size:1.6rem;font-weight:400;color:var(--ink);margin-bottom:10px}
.enroll > p{color:var(--ink-soft);font-size:.97rem;margin-bottom:30px}
.prices{list-style:none;border-block-start:1px solid rgba(14,23,38,.09)}
.prices li{display:flex;justify-content:space-between;gap:18px;align-items:baseline;padding:16px 0;
  border-block-end:1px solid rgba(14,23,38,.07)}
.prices .what{color:var(--ink);font-size:1rem}
.prices .what small{display:block;color:var(--ink-soft);font-size:.85rem;margin-top:3px}
.prices .amt{color:var(--bronze);font-size:1.14rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.prices .amt s{color:#9AA6B6;font-size:.85rem;margin-inline-end:8px}
.enroll .terms{margin-top:22px;font-size:.86rem;color:#6B7A90;line-height:1.75}
.enroll .cta-row{margin-top:30px}
/* תיבת המועדים שלפני ההרשמה. ⚠️ היא מופיעה גם על סקציה כהה וגם על
   .paper הבהיר, ולכן ברירת המחדל היא זהב, ועל נייר היא עוברת לברונזה.
   קודם היא הייתה ברונזה תמיד, ועל הכהה הכיתוב כמעט לא נקרא. */
.dateslot{margin-top:26px;padding:18px 20px;background:rgba(224,192,112,.07);
  border:1px dashed var(--gold-dim);border-radius:4px;color:var(--gold);
  font-size:.92rem;line-height:1.8}
.dateslot b{color:var(--white);font-weight:500}
.paper .dateslot{background:rgba(168,129,58,.07);border-color:rgba(168,129,58,.35);color:var(--bronze)}
.paper .dateslot b{color:var(--ink)}

/* ===== רצועת המועדים מתחת להירו =====
   התאריכים הם השאלה הראשונה של כל מתעניין, ולכן הם יושבים גם כאן
   בראש העמוד וגם בתיבה שלפני ההרשמה. */
.datebar{border-block:1px solid var(--gold-dim);background:rgba(224,192,112,.05)}
/* padding-block בלבד, כדי לא לדרוס את הריפוד הצדדי של .wrap */
.datebar .wrap{display:flex;align-items:center;gap:10px 20px;flex-wrap:wrap;padding-block:15px}
.datebar .dl{color:var(--gold);font-size:.78rem;letter-spacing:.13em;white-space:nowrap}
.datebar .dv{color:var(--text);font-size:.95rem;font-variant-numeric:tabular-nums}
.datebar .dv:not(:last-of-type)::after{content:'·';color:var(--gold-soft);margin-inline-start:20px}
.datebar .dgo{color:var(--turq);font-size:.9rem;margin-inline-start:auto;white-space:nowrap}
.datebar .dgo:hover{color:var(--white)}

/* במובייל הרצועה נשברת לרשימה אנכית. בשורה אחת היא יוצאת מרופטת,
   עם המפריד '·' תלוי בסופי שורות והקישור נדחף לצד השני */
@media (max-width:760px){
  .datebar .wrap{display:block;padding-block:14px}
  .datebar .dl{display:block;margin-bottom:9px}
  .datebar .dv{display:block;font-size:.9rem;margin-bottom:5px}
  .datebar .dv:not(:last-of-type)::after{content:none}
  .datebar .dgo{display:inline-block;margin:9px 0 0}
}

/* שורת התאריך בכרטיסי השלבים בעמוד הבית */
.cdate{display:block;color:var(--gold);font-size:.85rem;margin-bottom:10px;
  font-variant-numeric:tabular-nums}

/* ===== next steps ===== */
.next{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.next a{padding:32px 28px;display:block}
.next .en{margin-bottom:9px}
.next h4{font-size:1.1rem;font-weight:300;color:var(--white);margin-bottom:9px}
.next p{color:var(--muted);font-size:.9rem;margin:0}

/* ===== quote section ===== */
.quote{text-align:center}
.quote blockquote{font-family:var(--serif);font-size:clamp(1.4rem,3.2vw,2.3rem);font-weight:300;line-height:1.5;
  max-width:21ch;margin:0 auto;color:var(--white);text-shadow:0 0 70px rgba(224,192,112,.3)}
.quote cite{display:block;margin-top:32px;font-style:normal;font-size:.78rem;letter-spacing:.28em;color:var(--gold);text-transform:uppercase}

/* ===== portrait placeholder ===== */
.portrait{aspect-ratio:4/5;display:flex;align-items:center;justify-content:center}
.portrait span{color:#6E80A0;font-size:.76rem;letter-spacing:.18em;text-align:center;padding:0 26px;line-height:2.1}

/* ===== footer ===== */
footer{border-block-start:1px solid var(--line);padding:78px 0 46px;font-size:.92rem;color:var(--muted);background:#123A57}
/* ⚠️ חמש עמודות מ-04.08.2026, אחרי שנוספה עמודת "המסלול" עם ארבעת השלבים.
   הפער הוקטן מ-46 ל-30, אחרת שמות השלבים נשברים לשלוש שורות. */
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1.15fr 1fr 1fr;gap:30px}
footer h4{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:22px;font-weight:400}
footer ul{list-style:none;display:flex;flex-direction:column;gap:10px}
footer a:hover{color:var(--gold)}
.fbase{margin-top:58px;padding-top:30px;border-block-start:1px solid var(--line);display:flex;gap:22px;flex-wrap:wrap;font-size:.83rem;color:#8494AC}

/* ===== reveal ===== */
.rv{opacity:0;transform:translateY(28px);transition:opacity 1.15s cubic-bezier(.2,.7,.3,1),transform 1.15s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}

@media(max-width:960px){
  .sec{padding:96px 0}.sec-sm{padding:70px 0}
  .phero{padding:130px 0 70px}
  .two,.two-a,.two-b,.grid-2,.grid-3,.forwho,.incl,.next,.fgrid{grid-template-columns:1fr}
  .two,.two-a,.two-b{gap:38px}
  .nav ul{display:none}.burger{display:block}
  .portrait{max-width:320px;margin:0 auto}
  .enroll{padding:30px 24px}
  .prices li{flex-direction:column;gap:6px}
  .prices .amt{align-self:flex-start}
  .neb{filter:blur(60px)}
  .cosmic::before{--aw:92vw}
  .curric li{padding-inline-start:48px}
  .tile{padding:30px 24px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  /* ⚠️ ביטול האנימציה לבדו מסתיר את האיורים לגמרי. מצב הסיום שלהם מוצהר
     בסוף הקובץ, אחרי הגדרות ‎.art-*‎, כי שם הוא גובר. חפשו "מצב סיום". */
}

/* ===== לוגו ותמונות ===== */
.brand img{width:38px;height:38px;flex:none;filter:drop-shadow(0 0 10px rgba(224,192,112,.35))}
.portrait{overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.72) contrast(1.04) brightness(.94)}

/* ============================================================
   קריאוּת בעמודים הפנימיים
   בעמוד הבית הכוכבים הם האירוע. בעמודי תוכן הם מפריעים לקריאה,
   אז הם מעומעמים, ומתחת לכותרת העמוד יש שכבת רקע אטומה.
   ============================================================ */
body.inner #sky{opacity:.34}
body.inner .neb{opacity:.72}
body.inner .vignette{background:radial-gradient(ellipse at 50% 38%,transparent 60%,rgba(9,30,50,.40) 100%)}
.phero{background:linear-gradient(180deg,rgba(var(--deep),.92) 0%,rgba(var(--deep),.88) 46%,rgba(var(--deep),.68) 78%,rgba(var(--deep),0) 100%)}
/* בסקציות חלל בעמודים פנימיים, לוט רך מתחת לתוכן */
body.inner .cosmic > .wrap{position:relative}
body.inner .cosmic > .wrap::before{content:'';position:absolute;inset:-56px -34px;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 76% 68% at 50% 50%,rgba(var(--deep),.84),rgba(var(--deep),.5) 62%,transparent 82%)}

/* ============================================================
   מובייל
   ============================================================ */
@media(max-width:640px){
  body{font-size:16px;line-height:1.8}
  .wrap{padding:0 18px}
  .sec{padding:76px 0}
  .sec-sm{padding:56px 0}
  .phero{padding:108px 0 56px}
  .quote{padding:84px 0}

  h2{font-size:clamp(1.6rem,7vw,2rem)}
  h3{font-size:1.1rem}
  .lead{font-size:1rem}
  .prose p,.prose ul li,.card p,.tile p,.track > p{font-size:.97rem}

  /* התוויות הלועזיות מתקצרות ולא שוברות את הפריסה */
  .eyebrow{letter-spacing:.2em;font-size:.64rem;margin-bottom:20px}
  .eyebrow em{display:block;margin:9px 0 0;padding:0;border:0;letter-spacing:.16em;font-size:.58rem}
  .en,.sub-en{letter-spacing:.13em;font-size:.6rem;overflow-wrap:anywhere}

  /* משטחים צרים יותר, נשימה במקום דחיסה */
  .tile,.layer,.offer,.track,.chart-panel,.forwho .col{padding:26px 20px}
  .enroll{padding:26px 18px}
  .track-c{padding:24px 16px 20px}
  .card{padding:20px 18px}
  .grid-2,.grid-3,.tracks,.layer-grid,.offer-grid,.next,.forwho{gap:14px}

  /* המסלול: הציר יורד, המספר נכנס לשורה. רוחב מלא לכרטיס */
  .step{padding-inline-start:0;padding-block:9px}
  .path::before{display:none}
  .dotn{position:static;width:38px;height:38px;margin-bottom:11px;box-shadow:0 4px 14px rgba(14,23,38,.1)}

  /* הסילבוס: המספר מעל הכותרת ולא בצד */
  .curric li{padding-inline-start:0;padding-block:22px}
  .curric li::before{position:static;display:block;margin-bottom:9px}

  /* תגיות ומטא */
  .facts-row{gap:8px}
  .facts-row span,.meta span,.meta2 span{font-size:.74rem;padding:5px 11px}
  .card-h{gap:9px}
  .gate,.tag{font-size:.72rem;padding:4px 10px}

  /* טפסים */
  .fields{grid-template-columns:1fr;gap:12px}
  .entry{padding:14px 24px;font-size:.9rem}
  .cta-row{gap:10px}
  .cta-row .entry{width:100%;justify-content:center}

  /* מחירים */
  .prices li{flex-direction:column;align-items:flex-start;gap:5px;padding:14px 0}
  .prices .amt{font-size:1.05rem}

  /* פוטר */
  .fgrid{gap:34px}
  .fbase{gap:14px}

  /* טיפוגרפיה של ציטוטים */
  .quote blockquote{max-width:none;font-size:1.35rem}
  .prose p.big,.gap .punch,.duo-close{font-size:1.06rem}
}

@media(max-width:400px){
  .wrap{padding:0 15px}
  h2{font-size:1.5rem}
  .eyebrow em{letter-spacing:.1em}
}

/* רצועות המעבר של הסקציה הבהירה, מותאמות למסך קטן */
@media(max-width:640px){
  .dawn{padding:104px 0}
  .dawn::before,.dawn::after{height:126px}
  .dawn::before{inset-block-start:-125px}
  .dawn::after{inset-block-end:-125px}
}

/* ===== כפתור רכישה בשורת מחיר ===== */
.prices .amt{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.prices .buy{font-size:.82rem;color:#fff;background:var(--bronze);border:1px solid var(--bronze);
  padding:7px 16px;border-radius:100px;white-space:nowrap;transition:.35s;letter-spacing:.02em}
.prices .buy:hover{background:#8E6C2C;border-color:#8E6C2C;box-shadow:0 8px 22px rgba(168,129,58,.28)}
.prices .soon{font-size:.8rem;color:#A3B1C6;white-space:nowrap}
@media(max-width:640px){
  .prices .amt{justify-content:flex-start;width:100%;gap:12px}
  .prices .buy{padding:8px 18px}
}

/* ============================================================
   הירו של עמוד פנימי: טקסט מימין, אלמנט גרפי משמאל
   ============================================================ */
.phero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:54px;align-items:center}
.phero-art{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.phero-art svg{width:100%;height:100%;overflow:visible}
.phero-art .halo{position:absolute;width:78%;height:78%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(79,216,206,.14),rgba(224,192,112,.08) 44%,transparent 68%);filter:blur(38px)}

/* ⚠️⚠️ ה-keyframes האלה חייבים לשבת כאן, ב-style.css.
   הם היו מוגדרים ב-home.css בלבד, שרק עמוד הבית טוען. התוצאה: בכל 14
   העמודים הפנימיים כל האיור בהירו היה **בלתי נראה**. `.art-shape`
   ו-`.art-arc` נשארו עם `stroke-dashoffset` מלא, ו-`.art-node`,
   `.art-halo` ו-`.art-num` נשארו ב-`opacity:0`. מה שנראה על המסך היה
   רק טבעת הסימונים החיוורת. CSS לא מתלונן על `animation` שמפנה
   ל-keyframes שלא קיים, הוא פשוט לא מריץ אותו. (03.08.2026) */
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes pop{to{opacity:1}}
@keyframes halo{to{opacity:.34}}
@keyframes spin{to{transform:rotate(-360deg)}}

.art-ring{animation:spin 320s linear infinite;transform-origin:center}
.art-ring-r{animation:spin-r 260s linear infinite;transform-origin:center}
@keyframes spin-r{to{transform:rotate(360deg)}}
.art-arc{fill:none;stroke:var(--gold-soft);stroke-linecap:round;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:draw 2.6s cubic-bezier(.2,.7,.3,1) forwards}
.art-line{stroke:rgba(79,216,206,.45);stroke-width:1;opacity:0;animation:fade 1.4s ease forwards}
.art-node{fill:#fff;opacity:0;animation:pop 1.2s ease forwards}
.art-halo{fill:var(--gold);opacity:0;animation:halo 1.6s ease forwards}
.art-shape{fill:none;stroke:var(--gold-soft);stroke-width:1.2;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:draw 2.4s cubic-bezier(.2,.7,.3,1) forwards}
.art-faint{fill:none;stroke:rgba(224,192,112,.16);stroke-width:1}
.art-num{fill:var(--gold);font-family:'Heebo',sans-serif;font-size:11px;font-weight:400;
  letter-spacing:.14em;opacity:0;animation:pop 1.2s ease forwards}
.art-drift{animation:drift 14s ease-in-out infinite;transform-origin:center}
@keyframes drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.art-pulse{fill:none;stroke:var(--turq);stroke-width:1;opacity:0;
  animation:ripple 4.2s ease-out infinite;transform-origin:center}
@keyframes ripple{0%{opacity:.55;transform:scale(.35)}100%{opacity:0;transform:scale(1.5)}}
.art-scan{stroke:rgba(79,216,206,.6);stroke-width:1;animation:scan 7s ease-in-out infinite}


/* ============================================================
   קבוצת הכוכבים · טבעת 64 השערים ומפת הגוף
   נבנית ב-site.js לפי המזהים #ring64 ,#shapes ,#chans ,#stars.
   ⚠️ ישבה ב-home.css והייתה זמינה רק לעמוד הבית. הועברה לכאן
   ב-03.08.2026 כדי לשמש גם את ההירו של lyd.html.
   ============================================================ */
/* isolation מבטיח סדר שכבות מקומי וקבוע: אאורה, עדשה כהה, ואז המפה מעליהן.
   בלי זה ::after היה נצבע מעל הבודיגרף ומכסה אותו. */
.const{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;isolation:isolate}
.const .ring{position:absolute;inset:0;width:100%;height:100%;z-index:3;animation:spin 320s linear infinite}
/* spin, draw, fade, pop, halo עברו ל-style.css ב-03.08.2026.
   הם שימשו גם את איורי art.js בעמודים הפנימיים, שלא טוענים את הקובץ הזה. */
.const .bg{width:47%;height:auto;position:relative;z-index:3}
/* ===== הזוהר מאחורי המפה =====
   ⚠️ הייתה כאן עדשה כהה מתחת לצורות, כדי שהקווים לא ייבלעו באור. על הרקע
   הבהיר היא הפכה לטבעת כהה סביב המפה. הוסרה.
   עכשיו הכל אור: אאורה רחבה שנושמת, וליבה בוהקת מתחת לצורות עצמן.
   קריאוּת הקווים מוחזקת ב-drop-shadow שיושב על הקווים, לא ברקע. */
.const::before{content:'';position:absolute;inset:0;margin:auto;width:126%;height:126%;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,
    rgba(206,248,250,.30) 0%,rgba(110,236,228,.22) 26%,
    rgba(120,200,226,.11) 50%,transparent 72%);
  filter:blur(58px);animation:breathe 12s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.07);opacity:1}}
.const::after{content:'';position:absolute;inset:0;margin:auto;width:64%;height:64%;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(236,253,255,.26),rgba(110,236,228,.14) 46%,transparent 74%);
  filter:blur(30px)}
.const .core{position:absolute;width:46%;height:46%;border-radius:50%;pointer-events:none;z-index:2;
  background:radial-gradient(circle,rgba(255,250,232,.20),rgba(224,192,112,.11) 44%,transparent 72%);filter:blur(24px)}
.scroll-cue{position:absolute;inset-block-end:42px;inset-inline:0;margin:auto;width:1px;height:58px;background:linear-gradient(180deg,transparent,var(--gold-dim));z-index:3}
.scroll-cue::after{content:'';position:absolute;inset-block-start:0;inset-inline-start:-2px;width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold);animation:drop 3s ease-in-out infinite}
@keyframes drop{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(54px);opacity:0}}
/* הקווים חוזקו מול הרקע הבהיר. הצל הכהה מתחת לכל קו הוא מה שמחזיק אותם
   קריאים גם כשהם חוצים את האאורה. */
.bg .shape{fill:none;stroke:rgba(238,212,150,.88);stroke-width:1.35;stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:draw 2.8s cubic-bezier(.2,.7,.3,1) forwards}
.bg .chan{stroke:rgba(126,240,232,.62);stroke-width:1.25;opacity:0;animation:fade 1.6s ease forwards}
.bg .star{fill:#fff;opacity:0;animation:pop 1.4s ease forwards}
.bg .halo{fill:var(--gold);opacity:0;animation:halo 1.8s ease forwards}
/* ל-#shapes כבר יש filter="url(#glow)" ב-HTML. חובה לשרשר, לא לדרוס,
   אחרת הזוהר של הצורות נעלם. */
#shapes{filter:url(#glow) drop-shadow(0 1px 3px rgba(4,14,28,.85))}
#chans{filter:drop-shadow(0 1px 3px rgba(4,14,28,.85))}
.tick{stroke:rgba(224,192,112,.34)}
.tick.maj{stroke:rgba(224,192,112,.75)}
#ring64{filter:drop-shadow(0 1px 2px rgba(4,14,28,.7))}

/* ===== מצב סיום · הפחתת תנועה =====
   ⚠️ חייב לשבת כאן, אחרי הגדרות ‎.art-*‎ ו-‎.bg‎, כי הבלוק של
   prefers-reduced-motion בראש הקובץ מוקדם מהן ולכן נדרס.
   הצורות מצוירות באנימציית draw מ-dashoffset מלא ל-0, והנקודות עולות
   מ-opacity 0. בלי אנימציה הן נתקעות במצב ההתחלה, כלומר בלתי נראות.
   מי שמבקש פחות תנועה צריך לקבל את התמונה, רק בלי הציור. (03.08.2026) */
@media(prefers-reduced-motion:reduce){
  .bg .shape,.art-shape,.art-arc{stroke-dashoffset:0}
  .bg .chan,.bg .star,.art-line,.art-node,.art-num{opacity:1}
  .bg .halo,.art-halo{opacity:.34}
  .art-pulse{opacity:.28}
}
@keyframes scan{0%,100%{transform:translateY(-58px);opacity:.15}50%{transform:translateY(58px);opacity:.75}}

@media(max-width:960px){
  .phero-grid{grid-template-columns:1fr;gap:22px}
  .phero-art{order:-1;max-width:330px;margin:0 auto;width:100%}
}
@media(max-width:640px){
  .phero-art{max-width:250px}
}

/* התווית הלועזית שמעל הכותרת, אחרי שה-eyebrow הוסר */
.phero .en{margin-bottom:18px}
.sec > .wrap > .en,.sec > .wrap.narrow > .en{margin-bottom:15px}
.hero-copy .en{margin-bottom:18px}
@media(max-width:640px){.phero .en,.hero-copy .en{margin-bottom:13px}}

/* ============================================================
   היומן · עמוד הרשימה ועמוד הפוסט (30.07.2026)
   ============================================================ */
.jyear{display:grid;grid-template-columns:120px 1fr;gap:40px;padding-block:34px;
  border-block-start:1px solid var(--line)}
.jyear:first-child{border-block-start:0}
.jy{font-size:1.5rem;font-weight:100;color:var(--gold);opacity:.65;letter-spacing:.04em;
  position:sticky;inset-block-start:110px;align-self:start}
.jposts{display:grid;gap:1px;background:var(--line)}
.jpost{display:block;background:rgba(var(--deep),.42);padding:26px 28px;
  transition:background .45s,padding-inline-start .45s;position:relative}
.jpost:hover{background:rgba(var(--deep),.72);padding-inline-start:36px}
.jpost h3{color:var(--white);font-weight:300;font-size:1.24rem;margin-bottom:9px;transition:color .45s}
.jpost:hover h3{color:var(--gold)}
.jpost p{color:var(--muted);font-size:.95rem;line-height:1.75;max-width:74ch;margin-bottom:12px}
.jdate{font-size:.78rem;color:#8294AE;letter-spacing:.04em}

/* גוף הפוסט: שורה קצרה יותר וריווח גדול יותר, כי זו קריאה רצופה */
.article p{font-size:1.06rem;line-height:1.95;margin-bottom:26px;max-width:62ch}
.article .sig{font-family:var(--serif);color:var(--gold);font-size:1.02rem;
  margin-top:44px;padding-top:24px;border-block-start:1px solid var(--line);max-width:none}

@media(max-width:760px){
  .jyear{grid-template-columns:1fr;gap:16px;padding-block:26px}
  .jy{position:static}
  .jpost{padding:22px 20px}
  .jpost:hover{padding-inline-start:20px}
  .article p{font-size:1rem;line-height:1.9;margin-bottom:22px}
}

/* ===== איור לכל פוסט ביומן ===== */
.jpost{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center}
.jart{display:block;overflow:hidden;border-radius:4px;background:rgba(var(--deep),.55);
  border:1px solid rgba(224,192,112,.12);transition:border-color .45s,transform .55s}
.jart img{display:block;width:100%;height:auto;opacity:.86;transition:opacity .45s}
.jpost:hover .jart{border-color:rgba(224,192,112,.32);transform:scale(1.03)}
.jpost:hover .jart img{opacity:1}
.jtext{display:block}
.jart-hero img{display:block;width:100%;height:auto;max-width:460px;
  filter:drop-shadow(0 18px 46px rgba(0,0,0,.5))}
@media(max-width:760px){
  .jpost{grid-template-columns:1fr;gap:16px}
  .jart{max-width:100%}
  .jart-hero{margin-top:26px}
  .jart-hero img{margin-inline:auto}
}

/* ===== טופס הפקת המפה =====
   ⚠️ הכללים האלה ישבו ב-home.css, ולכן עבדו רק בעמוד הבית. ב-03.08.2026
   הטופס עבר ל-reading.html#chart, שטוען style.css בלבד, ולכן הם הועברו
   לכאן ולא שוכפלו. בדרך זה תיקן גם את הטופס ב-contact.html, שהשתמש
   ב-.fields בלי שהכללים שלו נטענו אי פעם. */
.chart-panel{padding:52px 46px;margin-top:60px}
.chart-panel h3{color:var(--white);font-size:1.55rem;font-weight:200;margin-bottom:10px}
.chart-panel .sub{color:var(--muted);font-size:.97rem;margin-bottom:34px}
.fields{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
.fields label{display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.fields input{width:100%;padding:14px;background:rgba(var(--deep),.72);border:1px solid rgba(224,192,112,.12);color:var(--text);font-family:var(--sans);font-size:.98rem;font-weight:300;border-radius:3px;transition:.4s}
.fields input:focus{outline:none;border-color:rgba(79,216,206,.55);box-shadow:0 0 22px rgba(79,216,206,.15)}
.fineprint{font-size:.82rem;color:#93A2BA;margin-top:18px}
/* ⚠️ הבלוק הזה יושב אחרי בלוקי המובייל הראשיים של הקובץ, ולכן הוא חייב
   לחזור על ההתאמות שלהם. אחרת כלל הבסיס שמעליו גובר עליהן בזכות הסדר. */
@media(max-width:960px){
  .fields{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .chart-panel{padding:26px 20px}
  .chart-panel h3{font-size:1.3rem}
  .fields{grid-template-columns:1fr;gap:12px}
}

/* ============================================================
   סרגל המסלול · ראש כל עמוד קורס  (04.08.2026)
   מי שנוחת ישר על עמוד קורס בודד חייב לראות מיד איפה הוא בתוך
   המסלול המלא. ארבעה שלבים, והנוכחי מסומן.
   ⚠️ הבלוק יושב אחרי בלוקי המובייל הראשיים של הקובץ, ולכן הוא חוזר
   על ההתאמות שלהם בעצמו. בלי זה כלל הבסיס גובר בזכות סדר ההופעה.
   ============================================================ */
.trackbar-lead{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.trackbar{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0;list-style:none;padding:0}
.trackbar li{display:flex}
.trackbar li>a,.trackbar li.on{
  display:flex;flex-direction:column;gap:9px;width:100%;
  padding:16px 18px;border-radius:12px;border:1px solid var(--line);
  background:rgba(var(--deep),.40);transition:.35s;text-decoration:none
}
.trackbar li>a:hover{border-color:var(--turq-dim);background:rgba(var(--deep),.68)}
.trackbar li.on{border-color:var(--gold-soft);background:rgba(224,192,112,.07)}
.trackbar .tn{
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none;
  font-size:.85rem;border:1px solid var(--gold-dim);color:var(--gold);
  font-variant-numeric:tabular-nums
}
.trackbar li.on .tn{background:rgba(224,192,112,.15);border-color:var(--gold)}
.trackbar .th{font-size:.95rem;font-weight:300;color:var(--text);line-height:1.42}
.trackbar li.on .th{color:var(--white);font-weight:400}
.trackbar li.on small{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.trackbar-note{font-size:.9rem;color:var(--muted);max-width:72ch}

/* ===== שדות טופס על רקע בהיר · 05.08.2026 =====
   ⚠️⚠️ ‎.fields‎ נכתב כולו לסקציות כהות: רקע ‎rgba(--deep,.72)‎ וטקסט בהיר.
   בעמוד יצירת הקשר הטופס יושב על כרטיס לבן, ולכן השדות יצאו **מלבנים
   אפורים כהים ובלתי קריאים**, בזמן שה-‎textarea‎ תוקן ב-inline והיה לבן.
   עידו: "עמוד הצור קשר שבור ולא נראה טוב בכלל". הבלוק הזה מיישר את השדות
   לצד הבהיר. הספציפיות גוברת על כלל הבסיס בלי תלות בסדר.
   **אין להחזיר עיצוב inline לשדות.** */
.paper .fields label,.paper .field-block label{color:#5C6E85}
.paper .fields input,.paper .field-block textarea{
  background:#FBFAF7;border:1px solid rgba(14,23,38,.14);color:var(--ink)
}
.paper .fields input::placeholder{color:#93A0AE}
.paper .fields input:focus,.paper .field-block textarea:focus{
  outline:none;border-color:var(--bronze);box-shadow:0 0 0 3px rgba(168,129,58,.15)
}
/* בלוק שדה יחיד ברוחב מלא, כמו ה-textarea של ההודעה */
.field-block{margin-bottom:20px}
.field-block label{
  display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);margin-bottom:9px
}
.field-block textarea{
  width:100%;padding:14px;background:rgba(var(--deep),.72);
  border:1px solid rgba(224,192,112,.12);color:var(--text);
  font-family:var(--sans);font-size:.98rem;font-weight:300;border-radius:3px;
  transition:.4s;resize:vertical
}

/* ⚠️ ‎.path‎ נושא ‎margin-top:36px‎ מהזמן שמעליו ישבו כותרת ופסקה בתוך הכרטיס.
   הם הוסרו ב-05.08 כי חזרו על כותרת הסקציה שמעליהם. בלי האיפוס הזה נשאר
   חלל מת בראש הכרטיס. */
.track-c > .path:first-child{margin-top:0}

/* ===== תצלומים אמיתיים · 05.08.2026 =====
   עד היום היה באתר פורטרט אחד בלבד. דביר שלח תצלומי קבוצות אמיתיים,
   והם הראיה החזקה ביותר שיש כאן קבוצות קטנות ולמידה חיה.
   ⚠️ אין מסגרת דקורטיבית ואין הצללה כבדה. התמונה עצמה היא התוכן. */
.shot{margin:0;border-radius:6px;overflow:hidden;position:relative;border:1px solid var(--line)}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{
  font-size:.85rem;font-weight:300;color:var(--muted);
  padding:13px 4px 0;text-align:start
}
/* ⚠️ עידו 05.08: "בדסקטופ התמונות גדולות מדי, זה לא נראה טוב".
   התצלום יושב ב-‎.wrap‎ שרוחבו 1180, וזה יותר מדי לתצלום בתוך עמוד תוכן.
   נחסם ל-820 וממורכז, כך שהוא נוכח אבל לא משתלט. במובייל ממילא 100%. */
.shot-wide{margin-block:44px;max-width:820px;margin-inline:auto}
/* זוג תצלומים זה לצד זה */
.shots{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-block:44px}

/* ===== המלצות · 05.08.2026 =====
   ⚠️ כל ציטוט כאן הוא טקסט אמיתי של תלמיד או לקוח, כפי שנמסר.
   אין לערוך, לקצר בלי סימון, או להמציא שם. ראו תוכן/המלצות.md. */
/* ⚠️⚠️ הרכיב נקרא ‎.tstm‎ ולא ‎.quote‎ **בכוונה.** ‎.quote‎ כבר תפוסה באתר
   על ידי הציטוט הגדול והממורכז בעמוד הבית (שורה 332 ומטה). בגרסה הראשונה
   השתמשתי בשם הזה, וההמלצות ירשו ממנו ‎text-align:center‎, ‎letter-spacing‎
   ו-‎text-transform:uppercase‎ על השם. **אל תחזירו את השם ‎.quote‎ כאן.** */
.tstms{display:grid;gap:20px;margin-top:44px}
.tstms.two-col{grid-template-columns:1fr 1fr}
.tstm{
  background:rgba(var(--deep),.38);border:1px solid var(--line);
  border-radius:6px;padding:26px 28px;position:relative;text-align:start
}
.tstm>p{color:var(--text);font-weight:300;font-size:.98rem;line-height:1.75;margin:0}
.tstm>p+p{margin-top:12px}
.tstm cite{
  display:block;margin-top:18px;font-style:normal;font-size:.92rem;
  color:var(--gold);font-weight:400;letter-spacing:0;text-transform:none
}
.tstm cite small{
  display:block;color:var(--muted);font-size:.82rem;font-weight:300;
  margin-top:4px;letter-spacing:0;text-transform:none
}
.tstm.en>p{direction:ltr;text-align:left}

/* ===== "מי מלמד" בעמוד הבית · 04.08.2026 =====
   היו שלוש פסקאות מרוחפות בעמודה חצי רוחב, בלי צורה ובלי משקל, מול שתי
   פסקאות טקסט מולן. עידו: "משהו שם לא יושב בעיצוב". עכשיו זה פאנל.
   ⚠️ סלקטורים של צאצא ישיר בכוונה, כדי שלא ייתפס ‎.lat‎ מקונן. */
.teachers{padding:28px 30px;align-self:start}
.teachers h3{
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold);font-weight:400;margin:0
}
.teachers ul{list-style:none;padding:0;margin:6px 0 0}
.teachers li{padding:17px 0;border-block-start:1px solid var(--line)}
.teachers li:first-child{border-block-start:0}
.teachers li>b{display:block;font-size:1.02rem;font-weight:400;color:var(--white)}
.teachers li>span{display:block;font-size:.9rem;font-weight:300;color:var(--muted);margin-top:5px}

/* רשימת סימון עגולה, לסקציות תוכן שאינן סילבוס ממוספר */
.ticks{list-style:none;padding:0;margin-top:22px;display:grid;gap:13px}
.ticks li{position:relative;padding-inline-start:26px;color:var(--muted);font-weight:300}
.ticks li::before{
  content:'';position:absolute;inset-inline-start:0;top:.62em;
  width:9px;height:9px;border:1px solid var(--turq);border-radius:50%
}

/* שורת הפתיחה מעל כרטיס ההרשמה. הייתה בשימוש ב-training.html בלי הגדרה. */
.path-intro{color:var(--muted);max-width:66ch;margin-top:14px}

@media(max-width:960px){
  .trackbar{grid-template-columns:1fr 1fr}
}
@media(max-width:960px){
  .shots,.tstms.two-col{grid-template-columns:1fr}
}
@media(max-width:640px){
  .teachers{padding:22px 20px}
  .tstm{padding:20px 20px}
  .shot-wide,.shots,.tstms{margin-block:30px}
  .trackbar{grid-template-columns:1fr;gap:9px}
  .trackbar li>a,.trackbar li.on{flex-direction:row;align-items:center;gap:13px;padding:13px 15px}
  .trackbar .th{font-size:.92rem}
  .trackbar li.on small{margin-inline-start:auto}
}

/* ============================================================
   ⭐ קריאוּת בסקציות הבהירות · חובה שיישאר בסוף הקובץ
   הכללים של .paper נדרסו על ידי .prose p ודומיו, שיושבים אחריהם
   בקובץ ובעלי אותה ספציפיות. התוצאה הייתה טקסט בהיר על רקע בהיר,
   יחס ניגודיות 1.3. הבלוק הזה מוצהר אחרון, ולכן הוא גובר.
   ⚠️ כל כלל חדש שנוגע בצבע טקסט חייב להיכתב מעל הבלוק הזה.
   ============================================================ */
.paper p,.paper .prose p,.paper .lead,.paper li,.paper .prose ul li,
.paper .curric p,.paper .incl span,.paper small,.paper .note,
.paper .fineprint,.paper .sub,.paper .jdate{color:var(--ink-soft)}
.paper h2,.paper h3,.paper h4,.paper .prose h3,.paper b,.paper strong{color:var(--ink)}
.paper .curric h4,.paper .tile h3{color:var(--ink)}
.paper cite,.paper .pull cite{color:var(--bronze)}
.paper .crumbs,.paper .crumbs a{color:#5C6E85}
.paper .hair::before{background:linear-gradient(90deg,transparent,rgba(168,129,58,.3) 30%,rgba(168,129,58,.3) 70%,transparent)}
/* פאנל כהה בתוך סקציה בהירה יישאר כהה, ולכן הטקסט בתוכו נשאר בהיר */
.paper .pane,.paper .pane p,.paper .pane span,.paper .pane li{color:var(--text)}
.paper .pane h3,.paper .pane h4{color:var(--white)}
/* .mist קריר, ולכן הדגשים בו כחלחלים ולא ברונזה */
.mist cite{color:#14607A}
.mist .crumbs,.mist .crumbs a{color:#4E657B}

/* ============================================================
   ⭐ 10.08.2026 · חיזוק הקריאוּת בסקציות הבהירות (בקשת עידו)
   הבעיה לא הייתה רק הצבע אלא המשקל: ‎body‎ רץ על ‎font-weight:200‎,
   וטקסט דק כזה על נייר בהיר נשחק גם כשיחס הניגודיות תקין על הנייר.
   כאן שני תיקונים יחד, ושניהם מוגבלים ל-‎.paper‎ בלבד ולכן
   הסקציות הכהות של האתר לא זזות:
   1. משקל 300 במקום 200 לכל טקסט הגוף על נייר
   2. ‎--ink-soft‎ מוכהה ל-#3F5266 בשתי פלטות הנייר. מול השנהב
      (‎.dawn‎, #F4F1EA) היחס עולה מ-5.33 ל-7.14, ומול התכלת
      (‎.mist‎, #DEEAF1) מ-6.01 ל-6.57. השנהב עובר AAA, והתכלת
      עובר AA בנוחות ומתקרב ל-AAA. הכלל הזה גובר גם על
      ‎.mist{--ink-soft:#42586E}‎ כי הוא מאוחר לו בקובץ
   ============================================================ */
/* ‎--ink-soft‎ לטקסט הגוף, ו-‎--bronze‎ לכל הדגשים על נייר. הברונזה
   הישנה (#A8813A) רצה ביחס 3.17 מול השנהב ו-3.58 מול הלבן של כרטיס
   המחירים, כלומר נכשלה גם בתוויות הקטנות, גם במחירים וגם בטקסט הלבן
   שעל כפתורי ‎.buy‎ שהברונזה היא הרקע שלהם. ההכהיה ל-#7A5A1E מעלה את
   כל השלושה ל-5.63 עד 6.35 בבת אחת. ההגדרה מקומית ל-‎.paper‎ בלבד */
.paper{--ink-soft:#3F5266;--bronze:#7A5A1E}
/* ⛔ ‎.cdate‎ ירש ‎--gold‎ (#E0C070) ולא היה לו אף פעם override לנייר.
   שורת המועד בכרטיסי המסלול בעמוד הבית רצה ביחס 1.56 מול השנהב,
   כלומר כמעט בלתי קריאה. זה היה הליקוי החמור ביותר בסקציה הבהירה */
.paper .cdate{color:#6E5218}
/* ה-‎opacity‎ הוריד את הברונזה עוד יותר מתחת למה שנמדד בצבע עצמו */
.paper .en,.paper .eyebrow,.paper .eyebrow em{opacity:1}
/* ‎#6B7A90‎ ביחס 3.87, ומחיר מחוק ב-#9AA6B6 ביחס 2.47 מול הלבן */
.paper .terms,.paper .note,.paper .meta span,.paper .total small,
.paper small span{color:var(--ink-soft)}
.paper .amt s{color:#5B6B80}
.paper p,.paper .prose p,.paper .lead,.paper li,.paper .prose ul li,
.paper .curric p,.paper .incl span,.paper small,.paper .note,
.paper .fineprint,.paper .sub,.paper .jdate,.paper .path-intro{font-weight:300}
/* הפאנלים הכהים שיושבים בתוך סקציה בהירה נשארים כפי שהיו */
.paper .pane p,.paper .pane span,.paper .pane li{font-weight:300}

/* ============================================================
   טופס פניות · נוסף 11.08.2026
   ------------------------------------------------------------
   ⛔ החלטת עידו: כל הרשמה עוברת דרך דביר. אין באתר קישור תשלום
   ישיר, ולכן הטופס הזה הוא נקודת ההמרה היחידה של כל הקורסים.
   הוא יושב גבוה בעמוד בכוונה. עד 11.08 נקודת ההמרה ישבה
   כעשרה מסכי גלילה למטה במובייל, וזה בדיוק הדפוס שהניב אצל
   מור 2,343 צפיות ואפס פניות.
   ============================================================ */
.leadbox{max-width:760px;margin:0 auto;background:rgba(var(--deep),.62);
  border:1px solid var(--gold-dim);border-radius:5px;padding:34px 32px}
.leadbox h2{font-size:1.5rem;font-weight:400;color:var(--text);margin:0 0 8px;line-height:1.3}
.leadbox .lb-sub{color:var(--muted);font-size:.97rem;font-weight:300;line-height:1.75;margin:0 0 26px}
.leadbox .fields{grid-template-columns:repeat(3,1fr);margin-bottom:18px}
.leadbox .lb-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:24px}
.leadbox .lb-alt{color:var(--muted);font-size:.88rem;font-weight:300}
.leadbox .lb-alt a{color:var(--turq)}

/* מלכודת בוטים. מוסתרת מהעין ומקוראי מסך, ולא display:none, כי חלק
   מהבוטים מדלגים על שדות שמוסתרים לגמרי */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ⚠️ שתי תיבות הסימון זהות בגודל ובצבע במכוון. תיבה אופציונלית
   שמעוצבת חלש יותר מהחובה היא dark pattern, ועמדת הרשות מפברואר
   2026 אוסרת אותה במפורש */
.consent{display:grid;gap:12px;margin-top:6px}
.consent label{display:flex;align-items:flex-start;gap:10px;cursor:pointer;
  font-size:.87rem;font-weight:300;line-height:1.7;color:var(--muted);
  letter-spacing:normal;text-transform:none}
.consent input[type=checkbox]{flex:0 0 auto;width:17px;height:17px;margin-top:3px;
  accent-color:var(--gold);cursor:pointer}
.consent a{color:var(--turq);text-underline-offset:2px}

.form-status{margin-top:16px;font-size:.92rem;font-weight:300;line-height:1.7;min-height:1.2em}
.form-status.good{color:var(--turq)}
.form-status.bad{color:#FF9E8A}

/* אותו טופס בתוך סקציה בהירה. הצבעים עוברים לדיו כהה על נייר */
.paper .leadbox{background:#fff;border-color:rgba(168,129,58,.26)}
.paper .leadbox h2{color:var(--ink)}
.paper .leadbox .lb-sub,.paper .consent label,.paper .leadbox .lb-alt{color:var(--ink-soft)}
.paper .consent a,.paper .leadbox .lb-alt a{color:var(--teal)}
.paper .form-status.good{color:var(--teal)}
.paper .form-status.bad{color:#B23A2A}

@media(max-width:820px){
  .leadbox{padding:26px 20px}
  .leadbox .fields{grid-template-columns:1fr;gap:12px}
  .leadbox h2{font-size:1.3rem}
  .leadbox .lb-actions{gap:14px}
}

/* ⭐ 11.08.2026, החלטת עידו: הטופס יורד לתוך כרטיס ההרשמה ולא יושב גבוה
   ובולט. במקומו יש קריאות לפעולה חוזרות לאורך העמוד שמעגנות אליו.
   בתוך הכרטיס הוא כבר לא קופסה בפני עצמה, אלא המשך טבעי של המחיר. */
.enroll .leadbox{background:none;border:0;border-radius:0;padding:26px 0 0;
  margin-top:26px;border-top:1px solid rgba(168,129,58,.22);max-width:none}
.enroll .leadbox h2{font-size:1.25rem;margin-bottom:6px}
.enroll .leadbox .lb-sub{margin-bottom:22px;font-size:.94rem}
.enroll .leadbox .fields{grid-template-columns:repeat(3,1fr)}

/* קריאה לפעולה חוזרת באמצע העמוד.
   ⚠️ מכוון להיות מאופק. כפתור מלא בברונזה על סקציה כהה נראה כמו באנר
   פרסומת באתר הזה, וגם נמדד ב-3.58 בלבד מול לבן. הסגנון כאן הוא
   ‎.entry‎ של האתר עצמו, עם שורת הקשר קצרה מעליו. */
.cta-mid{margin-top:56px;padding-top:34px;border-top:1px solid var(--gold-dim);
  display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.cta-note{color:var(--muted);font-size:.97rem;font-weight:300;line-height:1.75;
  max-width:42ch;margin:0}
.cta-mid .entry{min-width:230px;text-align:center}
.paper .cta-mid{border-top-color:rgba(168,129,58,.2)}
.paper .cta-note{color:var(--ink-soft)}
@media(max-width:820px){
  .cta-mid{margin-top:42px;padding-top:28px;gap:14px}
  .cta-note{font-size:.92rem}
  .cta-mid .entry{width:100%;min-width:0}
  .enroll .leadbox{padding-top:22px;margin-top:22px}
}

/* ============================================================
   תיקוני כפתורים · 11.08.2026
   ------------------------------------------------------------
   1. ‎.entry‎ הוא inline-flex בלי ‎justify-content‎, ולכן בכל מקום שבו
      הכפתור רחב מהתוכן שלו (min-width, רוחב מלא במובייל) הטקסט נצמד
      לימין ולא מתמרכז. באתר RTL זה בולט מאוד.
   2. ‎.paper .entry‎ יושב על ספציפיות 0,2,0 ו-‎.entry-solid‎ על 0,1,0,
      ולכן כפתור השליחה בסקציה הבהירה ירש ברונזה שקופה במקום מילוי,
      ויצא דהוי בדיוק בנקודת ההמרה.
   ============================================================ */
.entry{justify-content:center;text-align:center}

.paper .entry-solid,
.mist .entry-solid{background:var(--bronze);border-color:var(--bronze);color:#fff}
.paper .entry-solid:hover,
.mist .entry-solid:hover{background:#7A5A1E;border-color:#7A5A1E;color:#fff;
  box-shadow:0 10px 30px rgba(168,129,58,.28)}

/* כפתור השליחה הוא נקודת ההמרה. הוא צריך להיראות ככה */
.lb-actions{gap:20px}
.lb-actions .entry-solid{min-width:240px;padding:16px 38px;font-size:1rem;letter-spacing:.01em}
@media(max-width:820px){
  .lb-actions{flex-direction:column;align-items:stretch;gap:14px}
  .lb-actions .entry-solid{width:100%;min-width:0}
  .lb-actions .lb-alt{text-align:center}
}

/* אותה קבוצת כוכבים של עמוד הבית, בהירו של קורס היסודות, קצת קטנה יותר.
   המנגנון עצמו כבר יושב למעלה בקובץ הזה מ-03.08, בדיוק כדי שעמודים
   פנימיים יוכלו להשתמש בו. site.js מאכלס אותו לפי מזהי ה-svg. */
.phero-grid .const{max-width:430px;margin-inline-start:auto}
.const-sm{transform:scale(.88);transform-origin:center}
@media(max-width:900px){
  .phero-grid .const{order:-1;max-width:340px;margin:0 auto 14px}
  .const-sm{transform:scale(1)}
}
@media(max-width:560px){
  .phero-grid .const{max-width:270px}
}

/* דיוקן בבלוק "מי מלמד". עגול, בגודל מדוד, ולא תמונה רחבה שגונבת
   את הסקציה. יושב לצד הטקסט בדסקטופ ומעליו במובייל. */
.portrait{margin:0 0 26px;float:inline-start;width:210px;shape-outside:circle(50%);
  shape-margin:22px;margin-inline-end:30px}
/* ⚠️ בלי צל כהה. הוא יצר הילה שחורה סביב העיגול והתמונה לא ישבה
   על הרקע. נשארת טבעת זהב דקה בלבד. */
.portrait img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;
  border-radius:50%;box-shadow:0 0 0 1px rgba(224,192,112,.42),0 0 0 8px rgba(224,192,112,.07)}
@media(max-width:700px){
  .portrait{float:none;width:190px;margin:0 auto 26px}
}

/* ⚠️ ‎min-width‎ על ‎.cta-mid .entry‎ לא נתפס בדפדפן אף שהכלל תקין, יושב
   ברמה העליונה, וה-media query שמאפס אותו אינו תואם. לא בוזבז עוד זמן
   על האבחון: הרוחב נקבע כאן בריפוד, שנמדד ונתפס בוודאות. */
.cta-mid .entry{padding-inline:58px}
.lb-actions .entry-solid{padding-inline:52px}
@media(max-width:820px){
  .cta-mid .entry,.lb-actions .entry-solid{padding-inline:24px}
}

/* ============================================================
   "מה מקבלים" ו"איך הקורס בנוי" · עוצב מחדש 11.08.2026
   ------------------------------------------------------------
   ⛔ הבעיה שהייתה: רשת של שתי עמודות עם ‎gap:1px‎ ורקע ‎--line‎ מאחוריה,
   וכל תא מלא ב-‎rgba(deep,.55)‎. כשמספר הפריטים אי זוגי, וזה המצב בשני
   העמודים (שבעה ביסודות, חמישה במבנה המפה), **התא האחרון נשאר ריק
   ומצייר כרטיס שחור ריק.** זה לא נראה כמו תקלה, זה נראה כמו רשלנות.

   הפתרון: לא כרטיסים. שורות עם קו שיער זהב וסמל גאומטרי מעולם התוכן,
   הצורות של תשעת המרכזים במפת הגוף. תא ריק פשוט אינו נראה, ולכן
   המבנה עמיד לכל מספר פריטים, זוגי או אי זוגי.
   ============================================================ */
.incl{grid-template-columns:repeat(2,1fr);gap:0 54px;background:none;
  border:0;border-radius:0;overflow:visible}
.incl > div{background:none;padding:26px 0 26px 0;position:relative;
  border-top:1px solid rgba(224,192,112,.20);display:grid;
  grid-template-columns:38px 1fr;column-gap:18px;align-items:start}
/* בשתי עמודות, שתי השורות הראשונות הן הראשונות אמיתית */
.incl > div:nth-child(-n+2){border-top:0;padding-top:6px}

/* הסמל. צורות המרכזים במפת הגוף, מסובבות במחזוריות של חמש */
.incl > div::before{content:'';grid-row:1 / span 2;width:34px;height:34px;
  margin-top:2px;background:var(--gold);opacity:.92;
  -webkit-mask:var(--gl) center/contain no-repeat;mask:var(--gl) center/contain no-repeat;
  filter:drop-shadow(0 0 12px rgba(224,192,112,.45))}
.incl > div:nth-child(5n+1){--gl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 L21 20 H3 Z' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='15' r='1.9' fill='%23000'/%3E%3C/svg%3E")}
.incl > div:nth-child(5n+2){--gl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21 L3 4 H21 Z' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='9' r='1.9' fill='%23000'/%3E%3C/svg%3E")}
.incl > div:nth-child(5n+3){--gl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='16' height='16' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='1.9' fill='%23000'/%3E%3C/svg%3E")}
.incl > div:nth-child(5n+4){--gl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L22 12 L12 22 L2 12 Z' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='1.9' fill='%23000'/%3E%3C/svg%3E")}
.incl > div:nth-child(5n+5){--gl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='2.4' fill='%23000'/%3E%3C/svg%3E")}

.incl b{margin-bottom:8px;font-size:1.04rem;letter-spacing:-.005em}
.incl span{display:block;grid-column:2}

/* בסקציה הבהירה הסמל עובר לברונזה, אחרת הזהב נעלם על הנייר */
.paper .incl > div{border-top-color:rgba(168,129,58,.24)}
.paper .incl > div::before{background:var(--bronze);filter:none;opacity:1}

@media(max-width:820px){
  .incl{grid-template-columns:1fr;gap:0}
  .incl > div{padding:22px 0;grid-template-columns:30px 1fr;column-gap:14px}
  .incl > div:nth-child(-n+2){border-top:1px solid rgba(224,192,112,.20);padding-top:22px}
  .incl > div:first-child{border-top:0;padding-top:6px}
  .incl > div::before{width:26px;height:26px}
}

/* סקציית "מי מלמד". דיוקן לצד טקסט, לא float.
   ⛔ הגרסה הקודמת הייתה ‎float‎ עם ‎shape-outside‎, והיא ייצרה שורות
   משוננות וטקסט שנשפך מתחת לתמונה. פריסת שתי עמודות נקייה במקום. */
.teach{display:grid;grid-template-columns:280px 1fr;gap:56px;align-items:center;
  max-width:960px;margin:0 auto}
.teach .portrait{float:none;width:100%;margin:0;shape-outside:none}
.teach-body h2{margin-bottom:22px}
.teach-body p{margin-bottom:18px}
.teach-body p:last-child{margin-bottom:0}
.teach-body .big{margin-top:24px;padding-top:22px;border-top:1px solid var(--gold-dim)}
.paper .teach-body .big{border-top-color:rgba(168,129,58,.24)}
@media(max-width:820px){
  .teach{grid-template-columns:1fr;gap:28px;justify-items:center;text-align:center}
  .teach .portrait{width:190px}
  .teach-body{text-align:start}
  .teach-body h2{text-align:center}
}

/* קרדיט בפוטר. מאופק בכוונה, לא מתחרה בקישורים המשפטיים */
.fbase .fcredit{color:#fff;opacity:1;font-weight:400}
.fbase .fcredit:hover{color:var(--gold)}

/* ⛔ תוויות הטופס בסקציה הבהירה יצאו אפור בהיר על שנהב, ובגודל 10.5
   פיקסל במשקל 200 זה בלתי קריא. כאן הן מקבלות דיו כהה, גודל אמיתי
   ומשקל, plus שדות עם רקע לבן וטקסט כהה. */
.paper .leadbox label,
.paper .leadbox .fields label,
.paper .leadbox .field-block label{color:#3E5266;font-size:.78rem;font-weight:400;
  letter-spacing:.08em;text-transform:none}
.paper .leadbox input,
.paper .leadbox textarea{background:#fff;color:var(--ink);font-weight:400;
  border:1px solid rgba(168,129,58,.38)}
.paper .leadbox input:focus,
.paper .leadbox textarea:focus{border-color:var(--bronze);
  box-shadow:0 0 0 3px rgba(168,129,58,.14);outline:none}
.paper .leadbox input::placeholder,
.paper .leadbox textarea::placeholder{color:#7C8A99}
.paper .leadbox .consent label{color:var(--ink-soft);font-size:.88rem;
  letter-spacing:normal;text-transform:none;font-weight:300}

/* לוגו בעמודה הראשונה של הפוטר, מתחת לשורת ההסבר */
.flogo{display:block;width:76px;height:76px;margin-top:22px;opacity:.92}
.flogo:hover{opacity:1}
@media(max-width:820px){.flogo{margin:18px auto 0}}

/* ============================================================
   ⛔ תיקון שורש: המלבן הכהה בתחתית עמודים · 11.08.2026
   ------------------------------------------------------------
   ‎.cosmic::before‎ רץ עם ‎z-index:-1‎ ו-‎filter:blur(80px)‎. הבלאר יוצר
   שכבה מורכבת משלה, והיא נחתכת בגבולות הסקציה ומציירת מלבן כהה עם
   קצה חד במקום הילה רכה. זה הופיע בתשעה עמודים, וזה מה שעידו ראה
   ב-source, ב-dvir וב-training.

   התיקון: בלי בלאר ובלי ‎z-index‎ שלילי. הגרדיאנט הרדיאלי כבר דועך
   מעצמו ל-‎transparent‎ ולכן הוא רך בלי הפילטר, והתוכן מורם מעליו.
   ============================================================ */
.cosmic{isolation:isolate}
.cosmic::before{filter:none;z-index:0;opacity:.9}
.cosmic > *{position:relative;z-index:1}

/* שם ותפקיד מתחת לדיוקן. עד 11.08 השם של דביר לא הופיע באף סקציית אודות */
/* שורת השם. יושבת בראש עמודת הטקסט ולא בתוך התמונה, כי שם היא
   נדחסה לרצועה של כמה פיקסלים וכל אות ירדה לשורה משלה. */
.pname{margin:0 0 22px;color:var(--gold);font-size:1.5rem;font-weight:400;
  line-height:1.35;letter-spacing:-.01em}
.pname small{display:block;margin-top:7px;color:var(--muted);font-size:.86rem;
  font-weight:300;letter-spacing:.03em}
.teach-body .pname{text-align:start}
.paper .pname{color:var(--ink)}
.paper .pname small{color:var(--ink-soft)}