/* ===== הבית של המנהיגות הפדגוגית היוצרת · מינהל הכשרה מקצועית — שפת העוגן v3 ===== */ :root{ --navy:#0D3B66; --navy-800:#124D7A; /* צבע ההדגשה בפועל — היה מפוזר ב-207 מקומות כקבוע */ --accent:#0A7799; /* סולם טיפוגרפי — באתר היו 55 גדלי גופן שונים, ובהם שבעה כמעט זהים לאותו תפקיד (.82 / .84 / .85 / .86 / .87 / .88 / .9). */ --fs-2xs:.74rem; --fs-xs:.8rem; --fs-sm:.86rem; --fs-md:.92rem; --fs-base:1rem; --fs-lg:1.05rem; --fs-xl:1.15rem; --fs-2xl:1.3rem; --fs-3xl:1.55rem; --fs-4xl:1.9rem; --fs-5xl:2.4rem; --blue:#1677FF; --blue-100:#E8F2FF; --cyan:#27C6F3; --cyan-100:#E7F9FE; --teal:#00CDBB; --teal-100:#E4FAF7; --canvas:#F8FBFF; --surface:#FFFFFF; --soft-bg:#F2F7FC; --blue-bg:#EEF6FF; --text:#102A43; --text2:#52687A; --muted:#5C7285; --border:#D8E6F2; --border-strong:#BED4E7; --grad:linear-gradient(135deg,#124D7A,#087B9C); --sh-sm:0 4px 14px rgba(13,59,102,.06); --sh-md:0 12px 34px rgba(13,59,102,.09); --sh-float:0 20px 60px rgba(13,59,102,.14); --ease:cubic-bezier(.2,.8,.2,1); --px:48px; /* פלטת המפגש (מצגת מנהלים) — צבעי הדגשה לקידוד מוקדי אחריות ורכיבי תוכן */ --m-blue:#2F74C0; --m-green:#2F9F55; --m-yellow:#F2B233; --m-red:#EF5656; --m-purple:#8F7AC3; --m-turq:#1FA6A0; --m-navy:#0B2B4C; --m-grad:linear-gradient(to left,var(--m-blue),var(--m-green),var(--m-yellow),var(--m-red),var(--m-purple)); --m-grad-v:linear-gradient(180deg,var(--m-blue),var(--m-green),var(--m-yellow),var(--m-red),var(--m-purple)); /* גווני הדיו — לטקסט בלבד. צבעי ההדגשה עצמם נועדו למילוי, מסגרת ונקודה; הצהוב על לבן עומד על 1.88:1 והטורקיז על 2.99:1. כל גוון דיו עובר 4.5:1 על לבן, על רקע הגוף ועל הרקע הרך — ושומר על גון הצבע. */ --m-blue-ink:#2A66AA; --m-green-ink:#1F7A42; --m-yellow-ink:#8A6209; --m-red-ink:#C42B2B; --m-purple-ink:#6E58A8; --m-turq-ink:#15736F; --m-navy-ink:var(--m-navy); --cyan-ink:#0C7095; --teal-ink:#0A6E66; --blue-ink:#0B62DA; } *{margin:0;padding:0;box-sizing:border-box} body{font-family:'Assistant','Noto Sans Hebrew',sans-serif;background:var(--canvas);color:var(--text);line-height:1.6} h1,h2,h3,h4{color:var(--navy);line-height:1.25;font-weight:800} /* מידות width/height על התג נותנות לדפדפן לשריין מקום לפני הטעינה; height:auto מוודא שהמידות הללו לא נועלות את הפרופורציה כשהרוחב מוגבל. */ img{max-width:100%;height:auto} .rv{animation:rise .55s var(--ease) both} .rv.d1{animation-delay:.07s}.rv.d2{animation-delay:.14s}.rv.d3{animation-delay:.21s} @keyframes rise{from{opacity:0;transform:translateY(14px);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}} @keyframes cardIn{from{opacity:0;transform:perspective(900px) translateY(24px) rotateX(8deg) scale(.96)}to{opacity:1;transform:none}} /* ===== חשיפה בגלילה (site.js מוסיף sr-on ל-html ו-in לאלמנטים שנכנסים למסך) ===== */ html.sr-on .sr{opacity:0 !important;animation:none !important} html.sr-on .sr.in{animation:rise .6s cubic-bezier(.16,1,.3,1) var(--d,0s) both !important} html.sr-on .sr.in.card,html.sr-on .sr.in.mokad,html.sr-on .sr.in.linkcard{animation:cardIn .7s cubic-bezier(.16,1,.3,1) var(--d,0s) both !important} /* ===== פס התקדמות גלילה (בהשראת פס השקפים במצגת) ===== */ #pagebar{position:fixed;top:0;right:0;height:4px;width:0;z-index:200;pointer-events:none; background:var(--m-grad);border-radius:0 0 0 3px;transition:width .25s var(--ease)} /* ===== ברק חד-פעמי על כרטיס מודגש ===== */ .shine{position:relative;overflow:hidden} .shine::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none; background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.65) 50%,transparent 62%); transform:translateX(-170%);animation:shine 1.15s ease-out calc(var(--d,0s) + 1s) forwards} html.sr-on .sr.shine::after{animation:none} html.sr-on .sr.in.shine::after{animation:shine 1.15s ease-out calc(var(--d,0s) + .85s) forwards} @keyframes shine{to{transform:translateX(170%)}} /* ===== פעימת צל עדינה לתגים עגולים (box-shadow בלבד) ===== */ @keyframes bubblePulse{0%,100%{box-shadow:0 2px 6px rgba(13,59,102,0)}50%{box-shadow:0 8px 22px rgba(13,59,102,.22)}} .pulse{animation:bubblePulse 4.6s ease-in-out 1.2s infinite} /* ===== תמונות רצות "מהשטח" — קרוסלת crossfade עם זום עדין ===== */ .fieldshow{position:relative;overflow:hidden} .fieldshow img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block; opacity:0;transform:scale(1.07);transition:opacity 1.1s ease,transform 9s linear} .fieldshow img.on{opacity:1;transform:scale(1)} /* כפתור השהיה/הפעלה של הקרוסלה — WCAG 2.2.2: להחלפה אוטומטית חייבת להיות דרך עצירה שזמינה גם במקלדת וגם בנייד (ריחוף עכבר לבדו לא נחשב). site.js מזריק אותו. */ .fieldshow-toggle{position:absolute;z-index:2;inset-block-end:10px;inset-inline-end:10px; width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center; border:1px solid rgba(255,255,255,.55);background:rgba(13,59,102,.55);color:#fff;cursor:pointer; -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:background .2s var(--ease),border-color .2s var(--ease)} .fieldshow-toggle:hover{background:rgba(13,59,102,.82);border-color:#fff} .fieldshow-toggle svg{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .fieldshow-toggle:focus-visible{outline:3px solid #fff;outline-offset:2px} /* ===== מוקדי אחריות — כרטיסים בקידוד הצבע של המפגש ===== */ .mokdim{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px} .mokad{--mc:var(--m-blue);--mc-ink:var(--m-blue-ink);display:block;background:var(--surface);border:1px solid var(--border); border-inline-start:5px solid var(--mc);border-radius:16px;padding:16px 18px 14px; text-decoration:none;color:inherit;box-shadow:var(--sh-sm);position:relative; transition:transform .25s var(--ease),box-shadow .25s var(--ease)} a.mokad:hover{transform:translateY(-3px);box-shadow:var(--sh-md)} .mokad .mk-head{display:flex;align-items:center;gap:9px;margin-bottom:5px} .mokad .dot{width:10px;height:10px;border-radius:50%;background:var(--mc);flex-shrink:0;animation:bubblePulse 4.6s ease-in-out 1.2s infinite} .mokad b{font-size:var(--fs-base);font-weight:800;color:var(--mc-ink,var(--mc))} .mokad .who{font-size:var(--fs-xs);color:var(--text2);font-weight:600} .mokad .who span{color:var(--muted);font-weight:400} /* ===== כרטיס קישור (linkcard מהמצגת, מותאם לשפת האתר) ===== */ .linkcard{--lc:var(--navy-800);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px; background:var(--surface);border:1.5px solid var(--border);border-radius:20px;padding:26px 22px; text-decoration:none;text-align:center;color:inherit;box-shadow:var(--sh-sm); transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s} .linkcard:hover{border-color:var(--lc);box-shadow:var(--sh-md);transform:translateY(-3px)} .linkcard .lc-icon{font-size:42px;line-height:1} .linkcard .lc-title{font-size:1.2rem;font-weight:800;color:var(--lc)} .linkcard .lc-desc{font-size:var(--fs-sm);color:var(--text2);line-height:1.55;max-width:34ch} .linkcard .lc-url{font-size:.76rem;color:var(--muted);direction:ltr;font-weight:600;background:#fff;border:1px solid var(--border);border-radius:999px;padding:4px 13px} /* ===== כרטיסי דגשים / טיפים (בהשראת כרטיסי הטיפים החיים במצגת) ===== */ .tips-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0} .tipcard{--tc:var(--m-blue);--tc-ink:var(--m-blue-ink);background:var(--surface);border:1px solid var(--border); border-inline-start:5px solid var(--tc);border-radius:14px;padding:14px 18px; font-size:var(--fs-md);line-height:1.6;color:var(--text);box-shadow:var(--sh-sm)} .tipcard .tn{display:inline-grid;place-content:center;width:24px;height:24px;border-radius:50%; background:var(--tc-ink,var(--tc));color:#fff;font-weight:800;font-size:var(--fs-xs);margin-inline-end:8px;transform:translateY(5px)} .tipcard b.tt{color:var(--navy);font-weight:800} @media(max-width:760px){.tips-grid{grid-template-columns:1fr}} @media print{#pagebar{display:none}} /* ===== הדפסה: ביטול חשיפה-בגלילה ===== site.js מוסיף .sr לאלמנטים שמתחת לקו המסך, ו-html.sr-on .sr מאפס להם opacity. בלי הכלל הזה, הדפסה של עמוד שלא נגללה מדפיסה את כל התוכן שמתחת לקו המסך בלתי נראה (נמצא 28.8.26 — עמוד 2 ואילך של כל עמוד באתר יצא ריק). אין למחוק. */ @media print{ html.sr-on .sr,html.sr-on .sr.in{opacity:1 !important;animation:none !important;transform:none !important;filter:none !important} .scrim,.drawer,.sbox,.rmodal{display:none !important} #pmh-cookies{display:none !important} .ogenw-launcher,.ogenw-launcher-label,.ogenw-panel,.ogenw-scrim{display:none !important} /* כללי ההדפסה ישבו עד כה רק בגיליון המאמר, ולכן 28 עמודים הדפיסו את הפוטר הכחול המלא — בלוק כהה שאוכל דיו ללא שום תועלת. */ .govbar,.nav,.foot,.cta-row,.btn-reset,.pn,.pnd,.pagenav,.searchbtn,.burger{display:none !important} body{background:#fff;color:#000} /* טבלאות הנהלים נחתכו בגלילה אופקית — בהדפסה אין לאן לגלול */ .tbl-scroll{overflow:visible !important} table{page-break-inside:auto} tr,img,figure,.card,.callout,.row{page-break-inside:avoid} h1,h2,h3,h4{page-break-after:avoid} /* קישור חיצוני בדף מודפס הוא טקסט צבוע בלבד — הכתובת עצמה אבדה */ .article a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;color:#444;word-break:break-all} a{color:#000;text-decoration:underline} } /* הגדרת עמוד — לא היתה בשום מקום באתר */ @page{size:A4;margin:16mm 14mm} /* ===== govbar + nav ===== */ .govbar{background:#fff;border-bottom:1px solid var(--border);padding:7px var(--px);display:flex;align-items:center;gap:12px;font-size:.78rem;color:var(--muted)} .govbar img{height:30px;width:auto} .govbar .sep{color:var(--border-strong)} .govbar .left{margin-inline-start:auto;display:flex;gap:16px} .govbar a{color:var(--text2);text-decoration:none} /* שני מרחבי ההנהלה — באמצע הפס העליון (הועברו מהתפריט הראשי) */ .govbar{position:relative;z-index:130} .govbar .gov-mid{margin-inline:auto;display:flex;align-items:center;gap:18px} .govbar .gov-mid .lnk{display:inline-flex;align-items:center;font-size:var(--fs-xs);font-weight:700; color:var(--navy);text-decoration:none;cursor:pointer;padding:4px 2px;white-space:nowrap; border-bottom:2px solid transparent;transition:border-color .2s var(--ease),opacity .2s} .govbar .gov-mid .lnk:hover{border-bottom-color:var(--cyan)} .govbar .gov-mid .lnk.active{border-bottom-color:var(--navy)} .govbar .gov-mid .caret{font-size:.6rem;color:var(--muted);margin-inline-start:4px} .govbar .gov-mid .sub{top:calc(100% + 7px);font-size:var(--fs-base)} /* מתחת ל-1180 יורד הכיתוב "מינהל הכשרה מקצועית" והמפריד שלפניו. הבורר היה `.govbar span:nth-of-type(2)` — צאצא, ולא בן ישיר — ולכן הפיל גם את הפריט השני בתוך .gov-mid, כלומר את כל תפריט "מרחב מנהלים". מאז שמנהלים חדשים יושב שם זה כבר לא ניואנס. `>` מחזיר את הכוונה. */ @media(max-width:1180px){.govbar .gov-mid{gap:12px}.govbar>span:nth-of-type(2):not(.langsw),.govbar .sep{display:none}} .langsw{display:inline-flex;align-items:center;gap:8px} .langsw .lsep{color:var(--border-strong)} .langsw button{background:none;border:0;padding:0;font:inherit;color:var(--text2);cursor:pointer;opacity:.75} .langsw button:hover{opacity:1} .langsw button.on{opacity:1;font-weight:700;cursor:default} /* ניקוי הפס העליון של Google Translate כשמצב ערבית פעיל */ .goog-te-banner-frame,#goog-gt-tt,.goog-te-balloon-frame,body>.skiptranslate{display:none!important} html.lang-ar body{top:0!important} .nav{position:sticky;top:0;z-index:100;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:12px var(--px);background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)} .navitem{position:relative;display:inline-block} .navitem .sub{position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--sh-md);padding:8px;min-width:238px;max-height:calc(100vh - 96px);overflow-y:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .2s var(--ease);z-index:120} .navitem:hover .sub,.navitem:focus-within .sub{opacity:1;visibility:visible;transform:none} .navitem .sub a,.navitem .sub .dis{display:block;padding:9px 14px;border-radius:9px;color:var(--text);font-size:var(--fs-md);font-weight:600;text-decoration:none;cursor:pointer;transition:background .15s} .navitem .sub a:hover{background:var(--soft-bg);color:var(--navy)} .navitem .sub .dis{color:var(--muted);cursor:default} .navitem .sub .dis:hover{background:none;color:var(--muted)} .navitem>.lnk .caret{font-size:.65rem;color:var(--muted);margin-inline-start:3px} .nav .brand{display:flex;align-items:center;gap:12px;cursor:pointer;text-decoration:none} .nav .brand .mark{width:38px;height:38px;border-radius:11px;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:var(--fs-lg)} .nav .brand b{font-size:.95rem;color:var(--navy);display:block;line-height:1.2;max-width:200px} .nav .brand span{font-size:var(--fs-2xs);color:var(--muted);display:block} .nav a.lnk{color:var(--text2);text-decoration:none;font-size:var(--fs-md);font-weight:600;cursor:pointer;padding:6px 2px;border-bottom:2.5px solid transparent;white-space:nowrap; background:var(--m-grad) no-repeat bottom right;background-size:0% 2.5px; transition:color .18s,background-size .3s var(--ease)} .nav a.lnk:hover{color:var(--navy);background-size:100% 2.5px} .nav a.lnk.active{color:var(--navy);background-size:100% 2.5px} .nav .tools{margin-inline-start:auto;display:flex;align-items:center;gap:12px} /* תובה וצוהר — קבועים ובולטים בראש כל עמוד, בנפרד מהקטגוריות (11.10.26). במחשב בפס העליון (.sys-d, במקום "מרחב פיקוח"), בנייד בפס הדביק מעל הצ'יפים (.sys-m). */ .sys{display:flex;gap:8px} .sys-m{display:none} a.sys-btn{display:inline-flex;align-items:center;gap:8px;padding:4px 14px 4px 5px;border-radius:999px; text-decoration:none;color:var(--navy);border:1.5px solid;white-space:nowrap;line-height:1.15; transition:box-shadow .2s var(--ease),transform .2s var(--ease)} .sys-btn img{width:28px;height:28px;flex:none;border-radius:8px} .sys-btn b{display:block;font-size:.92rem;font-weight:800} .sys-btn small{display:block;font-size:var(--fs-2xs);color:var(--text2);font-weight:600} a.sys-btn.tuva{border-color:#9f95c6;background:linear-gradient(135deg,#fff 40%,#eeeafb)} a.sys-btn.tzohar{border-color:#e7c77d;background:linear-gradient(135deg,#fff 40%,#fef3d9)} a.sys-btn.neta{border-color:#8db678;background:linear-gradient(135deg,#fff 40%,#ebf3e7)} a.sys-btn:hover{box-shadow:var(--sh-sm);transform:translateY(-1px)} @media(max-width:1180px){.sys-d .sys-btn small{display:none}} @media(max-width:720px){ .govbar .sys-d{display:none} /* מתחת לשורת הלוגו ומעל צ'יפי הקטגוריות */ .nav .sys-m{display:flex;order:1;flex-basis:100%} .nav .mcats{order:2}.nav .mcats-sheet{order:3} .sys-m .sys-btn{flex:1;justify-content:center;padding:7px 10px;border-radius:14px} .sys-m .sys-btn img{width:32px;height:32px} /* שלוש מערכות בשורה (נטע, 11.10.26): בטלפון צר — אייקון מעל השם ומתחתיו למי זה */ .sys-m{gap:6px} } @media(max-width:480px){ .sys-m .sys-btn{flex-direction:column;gap:3px;padding:7px 4px;min-width:0} .sys-m .sys-btn span{text-align:center} .sys-m .sys-btn img{width:28px;height:28px} .sys-m .sys-btn small{font-size:.7rem;white-space:normal} } .nav .ogen-btn{background:var(--grad);color:#fff;border-radius:999px;padding:9px 22px;font-size:var(--fs-md);font-weight:700;cursor:pointer;box-shadow:var(--sh-sm);transition:all .2s;text-decoration:none;white-space:nowrap} .nav .ogen-btn:hover{box-shadow:var(--sh-md);transform:translateY(-1px)} .burger{width:42px;height:42px;border-radius:11px;border:1px solid var(--border);background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;transition:all .18s;flex-shrink:0} .burger:hover{border-color:var(--cyan);background:var(--cyan-100)} .burger i{width:18px;height:2px;background:var(--navy);border-radius:2px;display:block} /* ===== buttons / tags / cards ===== */ .btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:12px 30px;font-weight:700;font-size:var(--fs-base);text-decoration:none;cursor:pointer;transition:all .2s;font-family:'Assistant',sans-serif;border:none} .btn.primary{background:var(--grad);color:#fff;box-shadow:var(--sh-sm)} .btn.primary:hover{box-shadow:var(--sh-md);transform:translateY(-2px)} /* הכפתור המשני — שני שמות לאותו רכיב בדיוק (24 מופעי line, 57 של ghost). הכלל יושב כאן כדי שיעבוד גם בעמוד שלא טוען את גיליון המאמר. */ .btn.line,.btn.ghost{border:1.5px solid var(--border-strong);color:var(--navy);background:#fff} .btn.line:hover,.btn.ghost:hover{border-color:var(--cyan);background:var(--cyan-100)} .tag{display:inline-block;font-size:var(--fs-2xs);font-weight:700;padding:3px 12px;border-radius:999px} .tag.gmr{background:var(--navy);color:#fff} .tag.bgr{background:var(--blue-100);color:#145FA8} .tag.cyn{background:var(--cyan-100);color:var(--accent)} .tag.tea{background:var(--teal-100);color:#087565} .tag.soon{background:#FFF7E4;color:#8A5A00} .card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:var(--sh-sm);transition:all .25s var(--ease);position:relative;overflow:hidden;display:block;color:inherit;text-decoration:none} /* הריחוף שמרים ומחליף מסגרת הוא הבטחה שיקרה משהו בלחיצה. 446 מתוך 668 הכרטיסים הם תיבות תוכן סטטיות — האפקט שמור לכרטיסים שהם קישור, ול-.card.link שנועד לבדיוק למקרים שהקישור נמצא בפנים. */ a.card:hover,.card.link:hover{box-shadow:var(--sh-md);transform:translateY(-3px);border-color:var(--border-strong)} .card .ic{transition:transform .3s var(--ease)} a.card:hover .ic,.card.link:hover .ic{transform:scale(1.07) rotate(-2deg)} a.card::after,.card.link::after{content:"←";position:absolute;bottom:14px;left:18px;color:var(--accent);font-weight:800;font-size:var(--fs-base);opacity:0;transform:translateX(8px);transition:all .28s var(--ease)} a.card:hover::after,.card.link:hover::after{opacity:1;transform:none} .card::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:0;background:var(--m-grad-v);transition:width .28s var(--ease)} a.card:hover::before,.card.link:hover::before{width:4px} .kicker{font-size:var(--fs-xs);font-weight:800;letter-spacing:.1em;color:var(--accent);text-transform:uppercase} .ic{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0} .ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} /* ===== layout helpers ===== */ .px{padding-inline:var(--px)} .pagehead{padding:44px var(--px) 6px} .pagehead.split{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center} .pagehead h1{font-size:var(--fs-5xl);margin:12px 0 6px} .pagehead .crumb{font-size:var(--fs-sm);color:var(--muted)} .pagehead .crumb a{color:var(--accent);cursor:pointer;font-weight:600;text-decoration:none} .pagehead .lead{color:var(--text2);font-size:var(--fs-lg);max-width:640px} .headshot{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--sh-md)} .headshot img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block} .headshot .chip{position:absolute;bottom:10px;inset-inline-start:10px;background:rgba(255,255,255,.92);border-radius:999px;padding:4px 14px;font-size:.76rem;font-weight:700;color:var(--navy)} .grid{display:grid;gap:14px} .grid.c2{grid-template-columns:1fr 1fr} .grid.c3{grid-template-columns:repeat(3,1fr)} .grid.c4{grid-template-columns:repeat(4,1fr)} .pills{display:flex;gap:8px;flex-wrap:wrap} /* ל-pill היה סמן לחיצה בלבד — בלי ריחוף, מיקוד או מעבר, בעוד ל-.spill ול-.pn-tab היה הכל. הושווה אליהם. */ .pill{border:1px solid var(--border);background:#fff;border-radius:999px;padding:7px 22px;font-weight:700;font-size:var(--fs-sm);color:var(--text2);cursor:pointer; font-family:inherit;transition:all .18s var(--ease)} .pill:hover:not(.on){border-color:var(--cyan);background:var(--cyan-100);color:var(--navy)} .pill:focus-visible{outline:3px solid var(--blue);outline-offset:2px} .pill.on{background:var(--grad);color:#fff;border-color:transparent} .notice{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 22px;font-size:var(--fs-md)} /* ===== micro-motion ===== */ .ogen-btn{position:relative;overflow:hidden} .ogen-btn::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-15deg);transition:left .6s var(--ease)} .ogen-btn:hover::after{left:120%} .typing{display:inline-flex;gap:4px;align-items:center;padding:4px 2px} .typing i{width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:.4;animation:blink 1.4s infinite} .typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s} @keyframes blink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}} .num-count{font-variant-numeric:tabular-nums} .timeline{position:relative;padding-inline-start:26px} .timeline::before{content:"";position:absolute;inset-inline-start:8px;top:6px;bottom:6px;width:2px;background:var(--border-strong)} .timeline .step{position:relative;padding:0 0 20px} .timeline .step::before{content:"";position:absolute;inset-inline-start:-24px;top:6px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--cyan);transition:transform .2s} .timeline .step:hover::before{transform:scale(1.25);border-color:var(--blue)} /* ===== footer ===== */ .foot{background:var(--navy);color:#B9CBE0;padding:34px var(--px);font-size:var(--fs-sm);margin-top:auto} .foot .row{display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between} .foot img{height:34px;width:auto;filter:brightness(0) invert(1);opacity:.9} .foot .partners{display:flex;gap:22px;font-weight:700;color:#7E99B8;font-size:var(--fs-sm);align-items:center} .foot a{color:#DCE8F5;text-decoration:none} /* שורת הקישורים המשפטיים — תקנות הנגישות מצפות לקישור להצהרה מכל עמוד */ .foot-links{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:var(--fs-xs)} .foot-links a{color:#B9CBE0;padding:2px 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s} .foot-links a:hover{color:#fff;border-bottom-color:#7E99B8} .foot-links a:focus-visible{outline:2px solid #27C6F3;outline-offset:3px;border-radius:4px} /* ===== drawer ===== */ .scrim{position:fixed;inset:0;background:rgba(13,59,102,.35);backdrop-filter:blur(2px);z-index:300;opacity:0;pointer-events:none;transition:opacity .25s} /* המגירה סגורה = visibility:hidden, לא רק מוזזת החוצה. בלי זה כל ~87 הקישורים שבתוכה נשארים ממוקדים ב-Tab ומוקראים לקורא מסך לפני הכותרת של העמוד (המגירה היא האלמנט הראשון ב-body) — כשל WCAG 2.0 A. ה-visibility נכלל ב-transition כדי שההחלקה לא תישבר — אבל כאן במפורש כמעבר של 0 שניות עם השהיה: בפתיחה הוא נדלק מיד (delay 0), ובסגירה הוא כבה רק אחרי .3s, כשההחלקה החוצה כבר הסתיימה. זה ההבדל מ-.pnd ב-pagenav.css, שמשתמש ב-visibility .3s: שם ה-visibility עדיין "hidden" בפריים הראשון של הפתיחה, ולכן focus() מיידי על פריט בתוך הפאנל נופל בשקט. */ .drawer{position:fixed;top:0;bottom:0;right:0;width:400px;max-width:92vw;background:#fff;z-index:310;box-shadow:var(--sh-float);visibility:hidden;transform:translateX(100%);transition:transform .3s var(--ease),visibility 0s linear .3s;display:flex;flex-direction:column} body.menu-open .scrim{opacity:1;pointer-events:auto} body.menu-open .drawer{visibility:visible;transform:none;transition:transform .3s var(--ease),visibility 0s linear 0s} .drawer .head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--border)} .drawer .head b{color:var(--navy);font-size:var(--fs-lg)} .drawer .close{width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--navy)} .drawer .close svg{width:17px;height:17px;display:block} .drawer .close:hover{border-color:var(--cyan);background:var(--cyan-100)} .drawer .body{overflow-y:auto;padding:10px 24px 24px;flex:1} .drawer .sect{font-size:.76rem;font-weight:800;letter-spacing:.08em;color:var(--accent);margin:20px 0 8px} .drawer a,.drawer .dis{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;color:var(--text);text-decoration:none;font-weight:600;font-size:.95rem;cursor:pointer;transition:background .15s,padding-inline-start .2s var(--ease)} .drawer a:hover{background:var(--soft-bg);padding-inline-start:18px} .drawer a .n,.drawer .dis .n{font-size:var(--fs-2xs);font-weight:800;color:var(--muted);width:22px;flex-shrink:0} /* אייקון קו במגירה — באותה עמודה של המספר, במקום אימוג׳י */ .drawer .di{width:22px;flex-shrink:0;display:grid;place-items:center;color:var(--muted)} .drawer .di svg{width:18px;height:18px;display:block} .drawer a:hover .di,.drawer .body button.open-ogen:hover .di{color:var(--accent)} .drawer .dis{opacity:.55;cursor:default} .drawer .dis:hover{background:none;padding-inline-start:12px} .drawer .foot-note{border-top:1px solid var(--border);padding:14px 24px;font-size:var(--fs-xs);color:var(--muted)} /* מדורי המגירה נפתחים ונסגרים (נבנים ב-site.js). הכפתור שומר על המראה של .sect בדיוק — רק לחיץ ועם חץ. */ .drawer .dsect{display:flex;align-items:center;justify-content:space-between;gap:10px; width:100%;background:none;border:0;font:inherit;text-align:start;cursor:pointer; font-size:.76rem;font-weight:800;letter-spacing:.08em;color:var(--accent); margin:20px 0 8px;padding:4px 2px;border-radius:8px;transition:background .15s} .drawer .dsect:hover{background:var(--soft-bg)} .drawer .dsect .dcaret{flex:none;transition:transform .2s var(--ease)} .drawer .dsect[aria-expanded="false"] .dcaret{transform:rotate(-90deg)} .drawer .dsect:focus-visible{outline:3px solid var(--blue);outline-offset:2px} /* ===== הוויג'ט של העוגן — בדסקטופ צף למעלה משמאל (שם יש שוליים פנויים), הפאנל נפתח מתחתיו. בנייד ובטאבלט (עד 960px) אין שוליים פנויים למעלה והוא מסתיר את התוכן — לכן שם לא דורסים כלום והוויג'ט חוזר לברירת המחדל שלו: פינה שמאלית תחתונה, פאנל במסך מלא. ===== */ @media(min-width:961px){ .ogenw-launcher{bottom:auto !important;top:128px !important;left:22px !important} .ogenw-launcher-label{bottom:auto !important;top:146px !important;left:92px !important;font-size:14px !important} .ogenw-panel{top:200px !important;bottom:auto !important;left:22px !important;height:min(520px,calc(100dvh - 230px)) !important} } /* מרווח בתחתית הפוטר כדי שהכפתור הצף לא יסתיר את הקישורים בסוף העמוד */ @media(max-width:960px){ .foot{padding-bottom:110px} } /* ===== רכיבי ליבה שהיו רק ב-article.css ===== שמונה עמודים משתמשים במחלקות האלה בלי לטעון את גיליון המאמר — ואז קישור בתוך טקסט יוצא כחול מקווקו, וכותרת מדור מאבדת את קו ההפרדה ואת הסמן. המקום שלהן הוא כאן — גיליון המאמר טוען תמיד אחרי זה. ===== */ a.lk{color:var(--accent);text-decoration:none;font-weight:600;border-bottom:1.5px solid var(--cyan-100);transition:.2s} a.lk:hover{background:var(--cyan-100);border-bottom-color:var(--accent)} a.lk::after{content:"↗";font-size:.7em;margin-inline-start:3px;color:var(--cyan-ink,#0C7095)} h2.sub-sec,h3.sub-sec{ font-size:clamp(1.25rem,2.4vw,1.6rem);font-weight:800;color:var(--navy); margin:clamp(30px,4.5vw,44px) 0 10px;padding-top:22px;border-top:1px solid var(--border); display:flex;align-items:baseline;gap:13px;flex-wrap:wrap; } h2.sub-sec::before,h3.sub-sec::before{content:"";width:30px;height:7px;border-radius:4px;background:linear-gradient(90deg,var(--cyan),var(--blue));flex:0 0 auto;transform:translateY(-3px)} h2.sub-sec.first,h3.sub-sec.first{border-top:none;padding-top:0;margin-top:0} h2.mini,h3.mini,h4.mini{ font-size:var(--fs-lg);font-weight:800;color:var(--navy-800);margin:22px 0 8px; display:flex;align-items:center;gap:12px; } h2.mini::after,h3.mini::after,h4.mini::after{content:"";flex:1;height:1px;background:var(--border);max-width:170px} .callout{ margin:22px 0;padding:16px 22px;background:var(--surface); border:1px solid var(--border);border-inline-start:4px solid var(--cyan); border-radius:0 14px 14px 0;box-shadow:var(--sh-sm);font-size:.95rem; } .callout.amber{border-inline-start-color:#C08A00;background:#FFFBF0} .callout.red{border-inline-start-color:#C0392B} .callout .ttl{font-weight:800;display:block;margin-bottom:5px;font-size:var(--fs-base);color:var(--navy)} .callout.petrol{border-inline-start-color:var(--teal)} /* ===== משוב לחיצה ===== עד כאן היו שני מצבי :active בכל מערכת העיצוב — במסך מגע, שאין בו ריחוף, לחיצה לא החזירה שום סימן שהיא נקלטה. שקיעה קלה ומהירה. */ .btn:active,.pill:active,.spill:active,a.card:active,.card.link:active, .burger:active,.searchbtn:active,.ogen-btn:active,.open-ogen:active{transform:translateY(1px)} @media (prefers-reduced-motion: reduce){ .btn:active,.pill:active,.spill:active,a.card:active,.card.link:active, .burger:active,.searchbtn:active,.ogen-btn:active,.open-ogen:active{transform:none} } /* ===== accessibility ===== */ a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:10px} @media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation:none !important;transition:none !important} } /* ===== responsive ===== */ /* התפריט העליון — תשעה פריטים, מותג ושני כפתורים דורשים כ-1,400 פיקסלים. מתחת לכך הוא נשבר לשלוש שורות — עוברים למגירה, שמכילה את כל המדורים. */ /* בין 1201 ל-1420 הפס העליון צפוף — תשעה פריטים + מותג + חיפוש נשברו לשורה שנייה. מצמצמים ריווח וגופן ומסתירים את מילת ה"חיפוש" (האייקון נשאר). */ @media(min-width:1201px) and (max-width:1420px){ .nav{gap:8px 9px} .nav a.lnk{font-size:var(--fs-sm)} .nav .brand b{max-width:150px;font-size:.88rem} .searchbtn{padding:7px 10px} .searchbtn span{display:none} } /* מתחת ל-1200 הפס נעלם עד כה לגמרי, והדרך היחידה לנווט הייתה המגירה — כלומר בכל טאבלט, בכל לפטופ עם זום 125% ובכל חצי מסך לא היה תפריט. שני שינויים החזירו אותו: כיתוב המותג יורד ונשאר רק הסימן (מעליו ה-govbar עם משרד העבודה), ומיטל הכריעה על צמצום מ-8 כניסות ל-5 — מנהלים חדשים עבר לפס הממשלתי תחת מרחב מנהלים, והשתלמויות והגאנט נכנסו לתפריט הנהלים. נמדד: חמש הכניסות מחזיקות שורה אחת עד 720px, כלומר כל האייפדים לאורך, כולל המיני. */ @media(min-width:721px) and (max-width:1200px){ .nav{gap:8px 9px} .nav a.lnk{font-size:var(--fs-sm)} .nav .brand>span:not(.mark){display:none} .searchbtn{padding:7px 10px} .searchbtn span{display:none} } @media(max-width:720px){ .nav a.lnk,.nav .navitem{display:none} .nav{gap:10px} .nav .brand b{max-width:none} } @media(max-width:960px){ :root{--px:24px} .grid.c4{grid-template-columns:1fr 1fr} .grid.c3{grid-template-columns:1fr 1fr} .pagehead.split{grid-template-columns:1fr;gap:22px} .hero-grid{grid-template-columns:1fr !important;gap:30px !important} } @media(max-width:640px){ :root{--px:18px} .govbar .left .dis{display:none} .govbar .gov-mid{display:none} .grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr} .pagehead h1{font-size:var(--fs-4xl)} .foot .row{justify-content:center;text-align:center} } /* ===== מרווח הגלילה לעוגן — מקור אמת יחיד ===== --pn-nav ו---pn-bar נמדדים בזמן אמת ב-pagenav.js; בעמודים בלעדיו נשארות ברירות המחדל. אין להוסיף scroll-margin-top על יעדי עוגן — הוא מצטבר. */ html{scroll-padding-top:calc(var(--pn-nav,64px) + var(--pn-bar,0px) + 14px)} /* ===== חיפוש באתר — כפתור בתפריט, חלון מהיר ועמוד התוצאות ===== */ .searchbtn{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:var(--fs-sm);font-weight:700; color:var(--text2);background:var(--soft-bg);border:1px solid var(--border);border-radius:999px; padding:7px 15px 7px 13px;cursor:pointer;transition:all .2s var(--ease)} .searchbtn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round} .searchbtn:hover{color:var(--navy);border-color:var(--border-strong);background:#fff;box-shadow:var(--sh-sm)} .drawer .body a.drawer-search{font-weight:800;color:var(--navy)} .drawer .body a.drawer-search svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round} .sbox{position:fixed;inset:0;z-index:400;display:none} .sbox.on{display:block} body.sbox-open{overflow:hidden} .sbox-scrim{position:absolute;inset:0;background:rgba(13,43,76,.45);backdrop-filter:blur(3px);animation:sfade .2s var(--ease) both} .sbox-panel{position:relative;margin:min(9vh,90px) auto 0;width:min(760px,calc(100% - 28px));max-height:78vh; display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border); border-radius:20px;box-shadow:var(--sh-float);overflow:hidden;animation:sup .28s var(--ease) both} @keyframes sfade{from{opacity:0}to{opacity:1}} @keyframes sup{from{opacity:0;transform:translateY(-14px) scale(.985)}to{opacity:1;transform:none}} .sbox-top{display:flex;align-items:center;gap:11px;padding:15px 20px;border-bottom:1px solid var(--border)} /* אייקון התוצאה — אותו רכיב בחלון המהיר ובעמוד התוצאות */ .sbox-ic,.sp-ic{flex:0 0 auto;color:var(--accent);display:grid;place-items:center} .sbox-ic svg,.sp-ic svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round} .sbox-in{flex:1;min-width:0;font:inherit;font-size:var(--fs-lg);font-weight:600;color:var(--text); border:0;outline:0;background:transparent} .sbox-in::placeholder{color:var(--muted);font-weight:500} .sbox-in::-webkit-search-cancel-button{-webkit-appearance:none} .sbox-x{font:inherit;font-size:var(--fs-base);line-height:1;color:var(--muted);background:var(--soft-bg);border:0; border-radius:9px;width:30px;height:30px;cursor:pointer;flex:0 0 auto;transition:all .2s} .sbox-x:hover{background:var(--blue-100);color:var(--navy)} .sbox-pills{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:11px 20px;border-bottom:1px solid var(--border)} .sbox-pills::-webkit-scrollbar{display:none} .spill{font:inherit;font-size:var(--fs-xs);font-weight:700;white-space:nowrap;cursor:pointer;color:var(--text2); background:var(--soft-bg);border:1px solid transparent;border-radius:999px;padding:5px 13px;transition:all .18s var(--ease)} .spill:hover{background:var(--blue-100);color:var(--navy)} .spill.on{background:var(--navy);border-color:var(--navy);color:#fff} .sbox-list{flex:1;overflow-y:auto;padding:8px} .sres{display:flex;align-items:flex-start;gap:12px;padding:11px 13px;border-radius:13px; text-decoration:none;color:inherit;transition:background .15s} .sres.on,.sres:hover{background:var(--blue-bg)} .sres-ic{flex:0 0 auto;width:33px;height:33px;border-radius:10px;display:grid;place-items:center; background:var(--blue-100);color:var(--navy-800)} .sres-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .sres-ic.i-drive{background:var(--teal-100);color:#087565} .sres-ic.i-pdf{background:#FDECEC;color:#C33} .sres-ic.i-link{background:var(--cyan-100);color:var(--accent)} .sres-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1} .sres-t{font-size:.97rem;font-weight:800;color:var(--navy);line-height:1.3} .sres-s{font-size:var(--fs-xs);color:var(--text2);line-height:1.5; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .sres-secs{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px} .ssec{font-size:.76rem;font-weight:700;color:var(--accent);background:var(--cyan-100);border-radius:7px; padding:2px 8px;text-decoration:none} .ssec:hover{background:#D3F2FB} .sres-cat{flex:0 0 auto;align-self:center;font-size:.71rem;font-weight:800;color:var(--muted); background:var(--soft-bg);border-radius:7px;padding:3px 9px;white-space:nowrap} .sbox mark,.searchpage mark{background:#FFF1B8;color:inherit;border-radius:3px;padding:0 1px;font-weight:800} .sempty{padding:38px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:7px} .sempty b{font-size:var(--fs-base);color:var(--navy)} .sempty span{font-size:var(--fs-sm);color:var(--text2)} .sask{margin-top:9px;font:inherit;font-size:var(--fs-sm);font-weight:700;color:#fff;background:var(--grad); border:0;border-radius:999px;padding:9px 22px;cursor:pointer;box-shadow:var(--sh-sm)} .squick{padding:12px 8px 16px} .sempty-act{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:6px} .sempty-act .sask{margin-top:0;display:inline-flex;align-items:center;gap:7px;text-decoration:none} .sask.alt{color:var(--navy);background:#fff;border:1.5px solid var(--border)} .sask.alt:hover{background:var(--surface)} .snear{width:100%;max-width:520px;text-align:start;margin:10px 0 4px;padding:10px 6px 4px;border-top:1px solid var(--border)} .sp-hint .snear .sq{font-size:var(--fs-sm)} .sq-h{font-size:var(--fs-2xs);font-weight:800;letter-spacing:.16em;color:var(--muted);padding:0 8px 9px} .sq{display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:11px;text-decoration:none; color:var(--text);font-size:var(--fs-md);font-weight:600;transition:background .15s} .sq:hover{background:var(--blue-bg);color:var(--navy)} .sq svg{width:17px;height:17px;fill:none;stroke:var(--muted);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto} .sbox-foot{display:flex;align-items:center;justify-content:space-between;gap:12px; padding:9px 20px;border-top:1px solid var(--border);background:var(--soft-bg)} .sbox-hint,.sbox-keys{font-size:var(--fs-2xs);color:var(--muted);font-weight:600} .sbox-keys kbd{font:inherit;font-size:.7rem;background:#fff;border:1px solid var(--border); border-bottom-width:2px;border-radius:5px;padding:1px 5px;margin:0 1px} @media(max-width:640px){ .searchbtn span{display:none} .searchbtn{padding:8px 10px} .sbox-panel{margin-top:0;width:100%;max-height:100vh;height:100%;border-radius:0;border:0} .sbox-keys{display:none} .sres-cat{display:none} } /* ===== עמוד החיפוש (chipus.html) ===== */ kbd.kb{font:inherit;font-size:.78rem;font-weight:700;background:#fff;border:1px solid var(--border); border-bottom-width:2px;border-radius:5px;padding:1px 6px;color:var(--navy)} .searchpage{padding:0 var(--px) 60px} .sp-form{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border); border-radius:16px;padding:10px 16px;box-shadow:var(--sh-sm);transition:border-color .2s,box-shadow .2s} .sp-form:focus-within{border-color:var(--cyan);box-shadow:var(--sh-md)} .sp-in{flex:1;min-width:0;font:inherit;font-size:var(--fs-lg);font-weight:600;color:var(--text);border:0;outline:0;background:transparent;padding:6px 0} .sp-in::placeholder{color:var(--muted);font-weight:500;font-size:.95rem} .sp-in::-webkit-search-cancel-button{-webkit-appearance:none} .sp-go{font:inherit;font-size:var(--fs-md);font-weight:700;color:#fff;background:var(--grad);border:0; border-radius:999px;padding:9px 24px;cursor:pointer;box-shadow:var(--sh-sm);transition:all .2s;flex:0 0 auto} .sp-go:hover{box-shadow:var(--sh-md);transform:translateY(-1px)} .sp-filters{display:flex;flex-direction:column;gap:9px;margin-top:18px} .sp-frow{display:flex;align-items:center;gap:11px;flex-wrap:wrap} .sp-flabel{font-size:var(--fs-2xs);font-weight:800;letter-spacing:.13em;color:var(--muted);flex:0 0 42px} .sp-pills{display:flex;gap:6px;flex-wrap:wrap} .sp-pills .spill.dim{opacity:.4} .sp-clear{font:inherit;font-size:.78rem;font-weight:700;color:var(--text2);background:transparent; border:1px dashed var(--border-strong);border-radius:999px;padding:4px 13px;cursor:pointer;margin-inline-start:auto} .sp-clear:hover{color:var(--navy);border-color:var(--navy);border-style:solid} .sp-count{font-size:var(--fs-sm);color:var(--text2);margin:20px 0 12px} .sp-count b{color:var(--navy);font-size:var(--fs-lg)} .sp-count span{color:var(--muted);font-size:var(--fs-xs)} .sp-results{display:flex;flex-direction:column;gap:10px} .sp-card{display:flex;align-items:flex-start;gap:14px;background:var(--surface);border:1px solid var(--border); border-radius:15px;padding:16px 18px;text-decoration:none;color:inherit;box-shadow:var(--sh-sm); transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s} .sp-card:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:var(--border-strong)} .sp-tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1} .sp-t{font-size:var(--fs-lg);font-weight:800;color:var(--navy);line-height:1.3} .sp-ext{font-size:var(--fs-xs);color:var(--muted);margin-inline-start:5px} .sp-s{font-size:var(--fs-sm);color:var(--text2);line-height:1.55} .sp-meta{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:5px;text-align:end} .sp-kind{font-size:.71rem;font-weight:800;border-radius:6px;padding:2px 9px;background:var(--blue-100);color:var(--navy-800)} .sp-kind.k-drive{background:var(--teal-100);color:#087565} .sp-kind.k-pdf{background:#FDECEC;color:#C33} .sp-kind.k-link{background:var(--cyan-100);color:var(--accent)} .sp-cat{font-size:var(--fs-2xs);font-weight:700;color:var(--muted)} .sp-where{font-size:.7rem;color:var(--muted);max-width:150px} .sp-hint{background:var(--surface);border:1px dashed var(--border-strong);border-radius:16px; padding:40px 26px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px} .sp-hint b{font-size:var(--fs-lg);color:var(--navy)} .sp-hint span{font-size:var(--fs-sm);color:var(--text2);max-width:60ch} @media(max-width:640px){ .sp-go{padding:9px 16px} .sp-flabel{flex:0 0 100%} .sp-card{flex-wrap:wrap} .sp-meta{order:3;flex-direction:row;align-items:center;width:100%;justify-content:flex-start;gap:8px} .sp-where{display:none} } .hero-search{border-color:var(--border-strong)} .hero-search .sp-in{font-size:var(--fs-base)} .hero-search .sp-in::placeholder{font-size:var(--fs-md)} @media(max-width:640px){.only-wide{display:none}} /* ===== מפת התפקידים — כרטיס תפקיד נלחץ + מודל הגדרת התפקיד (tafkidim.html) ===== */ .card.soon{opacity:.72} .card.soon:hover{transform:none;box-shadow:var(--sh-sm);border-color:var(--border)} .card.soon::before{display:none} .rolecard{cursor:pointer;text-align:start;width:100%;font:inherit;color:inherit} .rolecard:focus-visible{outline:3px solid var(--cyan);outline-offset:3px} .rolecard .open{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:var(--fs-xs);font-weight:800;color:var(--accent)} .rolecard .open svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)} .rolecard:hover .open svg{transform:translateX(-3px)} .rmodal{position:fixed;inset:0;z-index:400;display:none} .rmodal.on{display:block} .rmodal .bd{position:absolute;inset:0;background:rgba(13,59,102,.45);backdrop-filter:blur(3px);animation:rmFade .2s ease both} .rmodal .sheet{position:relative;margin:min(5vh,52px) auto;width:min(860px,calc(100% - 26px));max-height:88vh;background:#fff; border-radius:20px;box-shadow:var(--sh-float);display:flex;flex-direction:column;overflow:hidden;animation:rmIn .3s var(--ease) both} @keyframes rmFade{from{opacity:0}to{opacity:1}} @keyframes rmIn{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}} .rmodal .top{padding:20px 26px 16px;border-bottom:1px solid var(--border);background:linear-gradient(160deg,var(--blue-bg),#fff 75%);position:relative} .rmodal .top::before{content:"";position:absolute;top:0;right:0;left:0;height:4px;background:var(--m-grad)} .rmodal .top h2{font-size:1.24rem;margin:0 0 8px;padding-inline-end:46px} .rmodal .chips{display:flex;gap:6px;flex-wrap:wrap} .rmodal .x{position:absolute;top:18px;inset-inline-end:20px;width:36px;height:36px;border-radius:11px;border:1px solid var(--border); background:#fff;cursor:pointer;font-size:1.1rem;line-height:1;color:var(--navy)} .rmodal .x:hover{background:var(--soft-bg)} .rmodal .bodyx{overflow-y:auto;padding:6px 26px 24px;flex:1;overscroll-behavior:contain} .rmodal .lead{font-size:.95rem;color:var(--text2);margin:16px 0 4px;line-height:1.75} .rmodal .note{background:var(--soft-bg);border-inline-start:3px solid var(--cyan);border-radius:0 10px 10px 0; padding:11px 14px;font-size:var(--fs-sm);color:var(--text2);margin:16px 0 0} .rmodal h3{font-size:.78rem;font-weight:800;letter-spacing:.07em;color:var(--accent);margin:22px 0 8px;text-transform:none} .rmodal ul{margin:0;padding-inline-start:20px} .rmodal li{font-size:var(--fs-md);color:var(--text2);margin-bottom:7px;line-height:1.7} .rmodal li b{color:var(--text)} .rmodal .act{border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin-bottom:10px;background:var(--canvas)} .rmodal .act > b{display:block;color:var(--navy);font-size:.95rem;margin-bottom:7px} .rmodal .act ul{padding-inline-start:18px} .rmodal .src{border-top:1px solid var(--border);margin-top:22px;padding-top:16px;display:flex;gap:10px;flex-wrap:wrap;align-items:center} .rmodal .src .meta{font-size:var(--fs-xs);color:var(--muted);flex:1;min-width:200px} /* שורת שיתוף בהגדרת התפקיד */ .rmodal .rshare{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:12px} .rmodal .rshare .lbl{font-size:var(--fs-xs);color:var(--muted);font-weight:700;margin-inline-end:2px} .rmodal .sbtn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border-strong);background:#fff;color:var(--navy);border-radius:999px;padding:6px 13px;font:700 var(--fs-xs)/1 "Assistant",sans-serif;cursor:pointer;transition:border-color .15s,background .15s,color .15s} .rmodal .sbtn:hover{border-color:var(--cyan);background:var(--cyan-100)} .rmodal .sbtn:focus-visible{outline:2px solid var(--cyan);outline-offset:2px} .rmodal .sbtn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none} .rmodal .sbtn.ok{border-color:var(--cyan);background:var(--cyan-100);color:var(--accent)} @media print{.rmodal{display:none !important}} @media(max-width:640px){ .rmodal .sheet{margin:0;width:100%;max-height:100vh;height:100dvh;border-radius:0} .rmodal .top{padding:18px 18px 14px}.rmodal .bodyx{padding:6px 18px 26px} } /* קישורים בתוך מודל הגדרת התפקיד */ .rmodal li a,.rmodal .note a{color:var(--accent);font-weight:700;text-decoration:none;border-bottom:1.5px solid rgba(11,127,166,.28);transition:border-color .15s,color .15s} .rmodal li a:hover,.rmodal .note a:hover{color:var(--navy);border-bottom-color:var(--navy)} .rmodal li a[target="_blank"]::after{content:" ↗";font-size:.82em;border:0} /* ===== כפתור "הודעות ועדכונים" עם מונה חי (index.html) ===== */ .btn.hbtn{position:relative} .btn.hbtn:hover{border-color:var(--m-red);background:#FDEEEA} .hbadge{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 6px; border-radius:999px;background:var(--m-red);color:#fff;font-size:var(--fs-2xs);font-weight:800; line-height:1;margin-inline-start:2px;animation:hpop .35s var(--ease) both} .hbadge[hidden]{display:none} @keyframes hpop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}} /* קישור השער בראש תפריט "מרחב פדגוגי" — מוביל קודם לשער ורק אחריו לעמודים */ .navitem .sub a.gatelink{font-weight:800;color:var(--navy);background:var(--blue-100); box-shadow:0 7px 0 -6px var(--border);margin-bottom:7px} .navitem .sub a.gatelink:hover{background:#CFE3F7;color:var(--navy)} /* ===== נתיב הלימוד: גמר / בגרות (track.js קובע data-tk על ) ===== */ /* הסינון ב-CSS ולא ב-JS — כדי שהעמוד ייפתח כבר מסונן, בלי הבהוב. data-track="both" (או בלי סימון כלל) מוצג תמיד. */ html[data-tk="gmr"] [data-track="bgr"]:not(.pill), html[data-tk="bgr"] [data-track="gmr"]:not(.pill){display:none !important} /* מתג הנתיב — הבחירה הראשית בעמוד, לא כפתור בפינה */ .trackbar{margin:6px var(--px) 0;padding:14px 20px;display:flex;flex-wrap:wrap; align-items:center;gap:12px 20px;background:var(--surface); border:1px solid var(--border);border-radius:16px;box-shadow:var(--sh-sm)} .trackbar .tb-lbl{display:flex;align-items:center;gap:9px;font-size:var(--fs-2xs);font-weight:800; letter-spacing:.14em;color:var(--accent);white-space:nowrap} .trackbar .tb-lbl::before{content:"";width:22px;height:5px;border-radius:3px; background:linear-gradient(90deg,var(--cyan),var(--blue))} .trackbar .tb-hint{font-size:.83rem;color:var(--text2);margin-inline-start:auto} .trackpills{display:flex;gap:6px;flex-wrap:wrap;background:var(--soft-bg); border-radius:999px;padding:4px} .trackpills .pill{border:none;background:transparent;padding:8px 24px;font-size:var(--fs-md); color:var(--text2);text-decoration:none;text-align:center; transition:background .2s var(--ease),color .2s var(--ease),box-shadow .2s} .trackpills .pill:hover:not(.on){background:#fff;color:var(--navy)} .trackpills .pill:focus-visible{outline:2px solid var(--blue);outline-offset:2px} /* הכפתור הפעיל נקבע ב-CSS לפי data-tk — כדי שייצבע כבר בציור הראשון, בלי הבהוב. הכיתה .on נשארת עבור עמודים שבהם הכפתורים הם קישורים (שערי הנתיב). */ .trackpills .pill.on, html[data-tk="all"] .trackpills .pill[data-track="all"], html[data-tk="gmr"] .trackpills .pill[data-track="gmr"], html[data-tk="bgr"] .trackpills .pill[data-track="bgr"]{ background:var(--grad);color:#fff;box-shadow:var(--sh-sm)} .trackpills .pill[data-track="gmr"].on, html[data-tk="gmr"] .trackpills .pill[data-track="gmr"]{background:var(--navy)} .trackpills .pill[data-track="bgr"].on, html[data-tk="bgr"] .trackpills .pill[data-track="bgr"]{background:linear-gradient(135deg,#1677FF,var(--accent))} /* בלי אנימציית מעבר על המצב ההתחלתי */ html[data-tk] .trackpills .pill{transition:none} .trackbar.ready .trackpills .pill{transition:background .2s var(--ease),color .2s var(--ease),box-shadow .2s} @media(max-width:640px){ .trackbar{margin-inline:12px;padding:12px 14px} .trackbar .tb-hint{margin-inline-start:0;flex-basis:100%} .trackpills{width:100%}.trackpills .pill{flex:1;padding-inline:10px;text-align:center} } /* זוג כרטיסי הנתיב: כשאחד מהם מסונן החוצה, הנותר תופס את מלוא הרוחב */ html[data-tk="gmr"] .trackpair, html[data-tk="bgr"] .trackpair{grid-template-columns:1fr} /* שערי הנתיב — כרטיס מקצוע בדף גמר / בגרות */ .trkcard{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px 22px; background:var(--surface);border:1px solid var(--border);border-radius:16px; box-shadow:var(--sh-sm);text-decoration:none;color:inherit;overflow:clip; transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s} .trkcard::before{content:"";position:absolute;inset-inline:0;top:0;height:3px; background:var(--tc,var(--cyan));transform:scaleX(0);transform-origin:right; transition:transform .3s var(--ease)} .trkcard:hover{transform:translateY(-3px);border-color:var(--tc,var(--cyan));box-shadow:var(--sh-md)} .trkcard:hover::before{transform:scaleX(1)} .trkcard h3{font-size:var(--fs-lg);margin:0} .trkcard .meta{font-size:var(--fs-xs);color:var(--text2);line-height:1.5} .trkcard .go{margin-top:auto;padding-top:10px;font-size:var(--fs-xs);font-weight:700;color:var(--text2); transition:color .25s} .trkcard:hover .go{color:var(--tc-ink,var(--tc,var(--accent)))} /* פריט משנה בתפריט (שערי הנתיב תחת "תחומי דעת") */ .navitem .sub a.nested,.drawer .body a.nested{padding-inline-start:30px;font-size:var(--fs-sm);position:relative} .navitem .sub a.nested::before,.drawer .body a.nested::before{content:"";position:absolute;inset-inline-start:15px;top:50%;width:8px;height:1.5px;border-radius:2px;background:var(--cyan)} /* כותרת תת־תפריט בתוך התפריט הנפתח (למשל "רכז פדגוגי" תחת בעלי תפקידים) */ .navitem .sub .sect{font-size:.71rem;font-weight:800;letter-spacing:.1em;color:var(--accent); padding:10px 14px 4px;margin-top:4px;border-top:1px solid var(--border)} .navitem .sub .sect:first-child{margin-top:0;border-top:none} /* ===== דילוג לתוכן הראשי (WCAG 2.4.1, רמה A) ===== */ .skip{position:fixed;inset-inline-start:16px;top:-100px;z-index:500; background:var(--navy);color:#fff;padding:12px 22px;border-radius:0 0 12px 12px; font-family:inherit;font-weight:700;font-size:.95rem;text-decoration:none; box-shadow:var(--sh-md);transition:top .18s var(--ease)} .skip:focus{top:0} @media print{.skip{display:none}} /* ===== טקסט לקוראי מסך בלבד ===== */ .sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0; overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0} /* ===== "שאל את עוגן" במגירה — היה , הומר ל-