/* ══════════════════════════════════════════════════════════════════
   נגישות — תקן ישראלי 5568 · WCAG 2.2 רמה AA · ‏22/08/2026
   ══════════════════════════════════════════════════════════════════
   ⛔ **הכרעת עו"ד גבע:** „האתר חייב לעמוד בסטנדרט AA."
   ⚠️ כל צבע כאן נמדד בדפדפן על הדף החי (``pipeline/wcag_audit.py``),
   ולא הוערך. הגוון והרוויה נשמרו; רק הבהירות זזה עד הסף.
   ══════════════════════════════════════════════════════════════════ */
 :root{
   --bg:#f4f7f9; --card:#fff; --line:#dbe4ec; --ink:#101d28; --dim:#5a6d7d;
   --machine:#12303f; --machine-2:#1a3c4d; --machine-line:#2b5568; --machine-ink:#dde9f2;
   --live:#197a9a; --live-dim:#155f7d; --act:#c58b2a; --act-ink:#1f1705;
   --live-on-dark:#24aedb; --act-on-dark:#d3962f;
   --machine-dim:#8ba4b7;
   --paper:#fbfcfd;
   --disp:'David','Frank Ruhl Libre','Times New Roman',serif;
   --ui:'Segoe UI','Noto Sans Hebrew',Arial,sans-serif;
   --num:'Segoe UI',ui-monospace,'Consolas',monospace;
 }
 @media (prefers-color-scheme:dark){
   :root{--bg:#0a1119; --card:#111d27; --line:#213141; --ink:#e6eef5; --dim:#93a8b8;
     --machine:#0d2430; --machine-2:#12303f; --machine-line:#234454; --paper:#0f1b24;
     --live:#4fb0d4; --act:#dfa94e;
   --live-on-dark:#4fb0d4; --act-on-dark:#dfa94e;
   --machine-dim:#9fb6c6;}
 }
 :root[data-theme="dark"]{--bg:#0a1119; --card:#111d27; --line:#213141; --ink:#e6eef5; --dim:#93a8b8;
   --machine:#0d2430; --machine-2:#12303f; --machine-line:#234454; --paper:#0f1b24;
   --live:#4fb0d4; --act:#dfa94e;
   --live-on-dark:#4fb0d4; --act-on-dark:#dfa94e;
   --machine-dim:#9fb6c6;}
 :root[data-theme="light"]{--bg:#f4f7f9; --card:#fff; --line:#dbe4ec; --ink:#101d28; --dim:#5a6d7d;
   --machine:#12303f; --machine-2:#1a3c4d; --machine-line:#2b5568; --paper:#fbfcfd;
   --live:#197a9a; --act:#c58b2a;
  --live-on-dark:#24aedb; --act-on-dark:#d3962f; --machine-dim:#8ba4b7;}

 *{box-sizing:border-box}
 img{max-width:100%;height:auto}
 body{margin:0;direction:rtl;background:var(--bg);color:var(--ink);font-family:var(--ui);line-height:1.65;}
 .wrap{max-width:1080px;margin:0 auto;padding:0 20px;}
 section{padding:56px 0;}

 /* ── מקטע עם רקע ── */
 /* ⛔ **הכרעת עו"ד גבע ‏17/08/2026, בלשונו:** „הרקע של השורה „משלמים על
    מסמך, לא על מנוי" **רחב מדי** (תופס את רוחב כל המסך). הוא צריך להיות
    זהה לרוחב ‏4 הקוביות שמעליו."
    ⚠️ **וזה היה הבאג המקורי שהוא הצביע עליו** — ואני קראתי אותו הפוך:
    חשבתי שהרצועה צרה מדי ופרסתי אותה לרוחב, במקום שהרקע רחב מדי.
    ⚠️ **הרוחב כאן הוא ‏1040 ולא ‏1080** — בדיוק כרוחב ‏`.proof`, שהוא
    ‏1080 פחות ריפוד ‏20 מכל צד. שוויון-רוחב הוא כל העניין.
    ⚠️ **חל על חמישה מקטעים** — תשלום והדגמות בדף-הבית, ודוגמאות בשלושת
    עמודי-התחומים — שכולם נשאו את אותו סגנון-שורה מוטבע. */
 section.band{padding:0}
 section.band > .wrap{max-width:1040px;padding:56px 20px;
   background:var(--card);border-block:1px solid var(--line)}
 h1,h2,h3{text-wrap:balance;margin:0}

 /* ── גופן-הכותרות ──
    ⛔ **הכרעת עו"ד גבע ‏16/08/2026.** ‏--disp הוגדר מלכתחילה כגופן-תצוגה,
       אך שימש רק במסך-ההדגמה של המסמך — הכותרות עצמן ירשו את גופן-הממשק.
    ⚠️ **גופן אינו קישוט כאן.** מסמך משפטי נקרא בגופן עם תגים, והכותרת
       שמעליו היא ההבטחה הראשונה על אופי המוצר.
    ⚠️ **אין טעינת גופן-רשת, במכוון.** אצל עו"ד גבע (Windows) יוצג David.
       במכשירים שאין בהם David או Frank Ruhl Libre — תוצג ברירת-המחדל
       הסריפית של המערכת. טעינת גופן חיצוני הייתה פותחת בקשת-רשת מכל
       דפדפן-לקוח, וזה שינוי שטעון החלטה נפרדת. */
 h1,h2{font-family:var(--disp);font-weight:700}
 h2{font-size:clamp(1.5rem,3.4vw,2.05rem);line-height:1.22;letter-spacing:-.01em;}
 .kick{font-size:.72rem;font-weight:800;letter-spacing:.16em;color:var(--live);margin:0 0 8px}
 p{margin:10px 0 0;color:var(--dim);max-width:66ch}
 b{color:inherit}
 a{color:inherit}
 .btn{display:inline-block;font:inherit;font-weight:700;font-size:.97rem;padding:13px 24px;
   border-radius:7px;text-decoration:none;border:1px solid transparent;cursor:pointer;}
 .btn.p{background:var(--act);color:var(--act-ink)} .btn.p:hover{filter:brightness(1.07)}
 .btn.o{background:transparent;border-color:var(--line);color:var(--ink)}
 .btn.o:hover{border-color:var(--live)}
 .btn.dk{background:transparent;border-color:#2b5568;color:var(--machine-ink)}

 /* ── top ── */
 .top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);
   backdrop-filter:blur(9px);border-bottom:1px solid var(--line)}
 .top .wrap{display:flex;align-items:center;gap:14px;padding-block:11px}
 .brand{font-weight:800;letter-spacing:-.02em;font-size:1rem}
 .brand i{font-style:normal;color:var(--live)}
 .top nav{margin-inline-start:auto;display:flex;gap:18px;font-size:.88rem;color:var(--dim)}
 @media(max-width:720px){.top nav{display:none}}

 /* ── hero ── */
 .hero{display:grid;gap:34px;grid-template-columns:1fr;align-items:center;padding:52px 0 44px}
 @media(min-width:900px){.hero{grid-template-columns:1.02fr .98fr}}
 .hero h1{font-size:clamp(2.05rem,5.4vw,3.2rem);line-height:1.1;letter-spacing:-.025em}
 .hero h1 em{font-style:normal;color:var(--live)}
 .hero .sub{font-size:1.08rem;max-width:46ch}
 .hero .row{display:flex;gap:11px;flex-wrap:wrap;margin-top:22px}
 .hero .fine{font-size:.83rem;margin-top:12px}

 /* מסך-המכונה: המסמך נכתב מעצמו */
 .machine{background:var(--machine);border:1px solid var(--machine-line);border-radius:12px;
   overflow:hidden;color:var(--machine-ink);box-shadow:0 18px 50px -22px rgba(18,48,63,.45)}
 .mbar{display:flex;align-items:center;gap:7px;padding:9px 13px;border-bottom:1px solid var(--machine-line);
   background:var(--machine-2);font-size:.76rem;color:var(--machine-dim)}
 .dot{width:9px;height:9px;border-radius:50%;background:#2c445a}
 .mbar .live{margin-inline-start:auto;color:var(--live-on-dark);font-weight:700;display:flex;align-items:center;gap:6px}
 .pulse{width:7px;height:7px;border-radius:50%;background:var(--live);animation:pl 1.5s infinite}
 @keyframes pl{0%,100%{opacity:1}50%{opacity:.25}}
 .msheet{background:var(--paper);color:var(--ink);margin:14px;border-radius:6px;padding:18px 20px;
   font-family:var(--disp);font-size:.86rem;line-height:1.85;min-height:250px;text-align:justify}
 .msheet .ttl{text-align:center;font-weight:700;text-decoration:underline;margin-bottom:12px;font-size:1.05rem}
 .caret{display:inline-block;width:2px;height:1em;background:var(--live);vertical-align:-2px;
   animation:bl .9s step-end infinite}
 @keyframes bl{50%{opacity:0}}

 /* ── proof ──
    ⛔ **רוחב-התוכן, ולא פריסה-לרוחב-המסך. הכרעת עו"ד גבע ‏17/08/2026,
    אחרי שראה שלוש אפשרויות מצוירות.**

    מה שקדם לה: הרצועה הייתה הרכיב היחיד בדף שבנוי כתיבה ברוחב-קבוע,
    ולכן הרקע והקווים שלה נעצרו לפני קצה המסך. פרסתי אותה לרוחב —
    ⚠️ **וזה יצר פער חדש:** תיבת „בפיתוח" שמעליה (‏`.soonline`) נשארה
    ברוחב-התוכן, ופתאום נראתה צרה מן הרצועה שמתחתיה.

    ⛔ **והמוקאפ שאושר לא הראה את הפער הזה — וזו טעות שלי בהכנתו.**
    ציירתי בו את „בפיתוח" כשורת-טקסט פשוטה, בעוד שבפועל היא כרטיס עם
    מסגרת מקווקוות ופינות מעוגלות. ההשוואה בין השתיים כלל לא נראתה שם.
    ⚠️ **אישור שניתן על מוקאפ לא-מדויק אינו אישור** — ולכן הוצגו שלוש
    אפשרויות מצוירות נכון, ונבחרה יישור-לרוחב-התוכן.

    ⚠️ **ההעדפה שנלמדת מכאן: יישור בין רכיבים שכנים גובר על פריסה
    לקצה המסך.** מי שירצה לפרוס את הרצועה בעתיד — יצטרך לפרוס איתה גם
    את התיבה שמעליה, אחרת הפער חוזר. */
 .proof{display:grid;gap:1px;background:var(--line);
   border-top:1px solid var(--line);border-bottom:1px solid var(--line);
   grid-template-columns:1fr}
 /* ארבעה אריחים — נקודות-שבירה מפורשות (4/2/1) ולא auto-fit, כדי שלעולם
    לא ייווצרו שלוש עמודות שמשאירות תא רביעי ריק בצבע-הקו */
 @media(min-width:560px){.proof{grid-template-columns:repeat(2,1fr)}}
 @media(min-width:900px){.proof{grid-template-columns:repeat(4,1fr)}}
 .proof > div{background:var(--card);padding:16px 20px}
 /* ⚠️ אותו רוחב ואותו ריפוד כמו ‏`.wrap` — כך הרצועה מיושרת עם התיבה
    שמעליה ועם שאר התוכן בדף. */
 .proofwrap{max-width:1080px;margin:0 auto;padding:0 20px}
 .proof .n{font-family:var(--num);font-size:1.62rem;font-weight:700;line-height:1;color:var(--live);
   display:block;font-variant-numeric:tabular-nums;text-align:center}
 .proof .t{font-size:.82rem;color:var(--dim)}

 /* ── tabs ── */
 .tabs{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0 16px}
 .tabs button{font:inherit;font-size:.9rem;font-weight:700;padding:10px 17px;border-radius:8px;
   border:1px solid var(--line);background:var(--card);color:var(--dim);cursor:pointer}
 .tabs button[aria-selected=true]{background:var(--machine);border-color:var(--machine);color:#fff}
 .tabs button:focus-visible{outline:2px solid var(--live);outline-offset:2px}
 .panel[hidden]{display:none}

 /* דמו 1 — צ'אט */
 .chat{padding:16px;display:flex;flex-direction:column;gap:10px;min-height:340px}
 .bub{max-width:82%;padding:10px 14px;border-radius:13px;font-size:.9rem;line-height:1.6;
   animation:pop .3s both}
 @keyframes pop{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
 .bub.b{background:var(--machine-2);border:1px solid var(--machine-line);align-self:flex-start;
   border-end-start-radius:4px}
 .bub.u{background:var(--live-dim);color:#eaf4f8;align-self:flex-end;border-end-end-radius:4px}
 .bub .hl{color:var(--act-on-dark);font-weight:700}
 .chipset{display:flex;gap:7px;flex-wrap:wrap;align-self:flex-start;animation:pop .3s both}
 .chipset span{font-size:.8rem;border:1px solid var(--machine-line);border-radius:999px;padding:6px 13px;
   background:var(--machine-2);color:#a9c3d5}
 .ctr{display:flex;gap:9px;align-items:center;padding:11px 14px;border-top:1px solid var(--machine-line);
   background:var(--machine-2);font-size:.82rem;color:var(--machine-dim)}
 .ctr button{font:inherit;font-size:.82rem;font-weight:700;padding:7px 15px;border-radius:6px;
   border:1px solid #2b5568;background:transparent;color:var(--machine-ink);cursor:pointer}
 .ctr .bar{flex:1;height:3px;background:#2b5568;border-radius:2px;overflow:hidden}
 .ctr .bar i{display:block;height:100%;background:var(--live);width:0;transition:width .3s}

 /* דמו 2 — קריאת מסמך */
 .read{display:grid;gap:0;grid-template-columns:1fr}
 @media(min-width:760px){.read{grid-template-columns:1fr 1fr}}
 .slip{position:relative;margin:16px;background:var(--paper);color:var(--ink);border-radius:6px;
   padding:16px;font-size:.78rem;font-family:var(--num)}
 .slip h4{margin:0 0 10px;font-size:.86rem;font-family:var(--ui)}
 .slip table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
 .slip td{padding:5px 4px;border-bottom:1px dashed var(--line)}
 /* ⛔ **מספרים מוסטים ימינה — הכרעת עו"ד גבע, ‏07/09/2026.**
    ⚠️ **והורחב ב-‏08/09/2026 גם לדף-השיווק**, בלשונו: „להחיל".
    ⛔ **היה ``text-align:left``** — ⚠️ **וזה הצמיד את הסכומים
    לקצה הרחוק, בניגוד למה שהמערכת עצמה עושה.**
    ⚠️ **``tabular-nums`` נדרש כדי שטור-מספרים יתיישר
    אחדות-מול-אחדות** — ⛔ **בלעדיו הרוחב משתנה לפי הספרה.** */
 .slip td:last-child{text-align:right;font-variant-numeric:tabular-nums}
 .slip tr.mark td{background:rgba(26,127,160,.18);transition:background .25s}
 .out{border-inline-start:1px solid var(--machine-line);padding:16px}
 .out h4{margin:0 0 12px;font-size:.86rem;color:var(--machine-dim);font-weight:700}
 .fld{display:flex;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:7px;
   background:var(--machine-2);border:1px solid var(--machine-line);margin-bottom:8px;
   font-size:.86rem;opacity:.25;transform:translateY(4px);transition:.35s}
 .fld.on{opacity:1;transform:none;border-color:var(--live-dim)}
 .fld b{font-family:var(--num);font-variant-numeric:tabular-nums;color:#fff}

 /* דמו 3 — מחשבון */
 .calc{display:grid;gap:0;grid-template-columns:1fr}
 @media(min-width:760px){.calc{grid-template-columns:1fr 1fr}}
 .ctrls{padding:18px}
 .ctrls label{display:block;font-size:.82rem;color:#a9c3d5;margin:14px 0 5px;font-weight:700}
 .ctrls label:first-child{margin-top:0}
 .ctrls output{float:left;font-family:var(--num);color:var(--live);font-variant-numeric:tabular-nums}
 input[type=range]{width:100%;accent-color:var(--live);height:22px}
 .res{border-inline-start:1px solid var(--machine-line);padding:18px;display:flex;flex-direction:column}
 .big{font-family:var(--num);font-size:2.5rem;font-weight:700;line-height:1;color:var(--live);
   font-variant-numeric:tabular-nums}
 .res .lbl{font-size:.82rem;color:var(--machine-dim)}
 .brk{margin-top:16px;border-top:1px solid var(--machine-line);padding-top:12px;font-size:.84rem}
 .brk div{display:flex;justify-content:space-between;padding:4px 0;color:#a9c3d5}
 .brk b{font-family:var(--num);color:#fff;font-variant-numeric:tabular-nums}
 .disc{margin-top:auto;padding-top:14px;font-size:.75rem;color:#6f8a9e}

 /* ── דוגמאות ── */
 .gal{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));margin-top:20px}
 .doc{background:var(--card);border:1px solid var(--line);border-radius:11px;overflow:hidden;
   display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s}
 .doc:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(10,30,45,.4)}
 @media (prefers-reduced-motion:reduce){.doc,.doc:hover{transform:none;transition:none}}
 /* תמונה-ממוזערת: רינדור אמיתי של העמוד הראשון מקובץ ה-PDF שבגלריה */
 .thumb{background:var(--paper);border-bottom:1px solid var(--line);max-height:186px;overflow:hidden;
   position:relative;display:block;min-width:0}
 .doc > *{min-width:0}
 .thumb img{width:100%;display:block;object-fit:cover;object-position:top center}
 .thumb::after{content:"";position:absolute;inset:auto 0 0 0;height:56px;
   background:linear-gradient(transparent,var(--paper))}
 .doc .meta{padding:12px 14px;display:block}
 .doc .meta .t,.doc .meta .s{display:block}
 .doc .meta .t{font-weight:700;font-size:.92rem}
 .doc .meta .s{font-size:.78rem;color:var(--dim)}
 .slot{display:inline-block;margin-top:7px;font-size:.7rem;font-family:var(--num);color:var(--dim);
   background:var(--bg);border:1px dashed var(--line);border-radius:5px;padding:2px 7px}

 /* ── יכולות ── */
 .caps{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:11px;
   overflow:hidden;margin-top:20px;grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
 /* שש יכולות: מידה רחבה יותר כדי שהשורות תמיד יתמלאו (3/2/1 עמודות) ולא ייוותרו תאים ריקים */
 .caps.six{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
 .cap{background:var(--card);padding:18px}
 .cap .t{font-weight:700;margin-bottom:3px}
 .cap .s{font-size:.86rem;color:var(--dim)}

 /* ── מחיר ── */
 .price{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px}
 .pc{flex:1 1 220px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:18px}
 .pc .amt{font-size:1.12rem;font-weight:800;letter-spacing:-.01em;color:var(--live)}
 .pc .s{font-size:.85rem;color:var(--dim)}

 /* ── סיום ── */
 .end{background:var(--machine);color:var(--machine-ink);border-radius:14px;padding:34px 26px;margin:0 0 40px}
 .end h2{color:#fff}
 .end p{color:#a9c3d5}
 /* בורר-ההליך: היעד של כל כפתורי-"התחילו". /chat חוסם כניסה ללא ?domain=,
    ולכן קישור ישיר אליו מוחזר מיד לדף-הבית — הבחירה חייבת לקרות כאן. */
 .start{display:grid;gap:10px;margin-top:20px;grid-template-columns:1fr}
 @media(min-width:640px){.start{grid-template-columns:repeat(3,1fr)}}
 .dm{display:flex;flex-direction:column;gap:3px;padding:15px 16px;border-radius:9px;
   background:rgba(255,255,255,.06);border:1px solid var(--machine-line);
   text-decoration:none;color:var(--machine-ink);transition:background .15s,border-color .15s}
 .dm:hover{background:rgba(255,255,255,.12);border-color:var(--act)}
 .dm:focus-visible{background:rgba(255,255,255,.12);border-color:var(--act)}
 .dm .t{font-weight:800;font-size:1rem}
 .dm .s{font-size:.8rem;color:#a9c3d5}
 .dm .go{font-size:.78rem;color:var(--act-on-dark);font-weight:700;margin-top:5px}
 @media (prefers-reduced-motion:reduce){.dm{transition:none}}
 .by{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:26px;padding-top:18px;
   border-top:1px solid var(--machine-line);font-size:.86rem;color:#8fa9bc}
 /* התצלום הוא לאורך (2:3) והפנים בשליש העליון — object-position ממקד עליהן,
    אחרת חיתוך-עיגול מרכזי היה חותך את הראש. */
 .by .ph{width:56px;height:56px;border-radius:50%;flex:none;object-fit:cover;
   object-position:50% 16%;border:2px solid var(--machine-line);display:block}
 /* ── פוטר ──
    עד כה שורה אפורה אחת. משהתווסף התקנון נדרש מקום קבוע לקישור משפטי:
    המקום המקובל שבו צרכן מחפש תקנון הוא הפוטר, לא תפריט-הניווט — שהוא
    ציר-המכירה. ארבע עמודות, ובהן טור "משפטי", וכן פרטי-העוסק בשורת-התחתית
    מכוח חובת-הגילוי שבסעיף 14ג(א)(1) לחוק הגנת הצרכן.
    (‏/for-lawyers עומד בפני עצמו — גיליון משלו ופוטר משלו.) */
 footer{background:var(--machine);color:var(--machine-ink);padding:34px 0 20px;
   border-top:1px solid var(--line)}
 footer .fgrid{display:grid;gap:26px;grid-template-columns:1fr}
 @media(min-width:760px){footer .fgrid{grid-template-columns:1.5fr 1fr 1fr 1fr}}
 footer .col .h{font-size:.68rem;font-weight:800;letter-spacing:.15em;
   color:color-mix(in srgb,var(--live) 70%,#fff);margin-bottom:10px}
 footer .col a{display:block;font-size:.845rem;color:var(--machine-ink);opacity:.82;
   text-decoration:none;padding:2.5px 0}
 footer .col a:hover{opacity:1;text-decoration:underline}
 footer .about{font-size:.845rem;opacity:.8;max-width:34ch;margin:0;color:var(--machine-ink)}
 footer .about b{color:#fff}
 footer .frule{margin-top:24px;border-top:1px solid var(--machine-line);padding-top:14px;
   font-size:.775rem;opacity:.62;display:flex;flex-wrap:wrap;gap:6px 16px}
/* ═══════════════════════════════════════════════════════════════════════
   שער-הכניסה (/) ועמודי-ההליך (/alimony · /custody · /property)
   נוסף לגיליון-הבסיס שלמעלה. כל השמות מתחילים ב-g- (שער) או ב-d- (מכשיר),
   כדי שלא יתנגשו במחלקות הקיימות (.cap · .out · .calc · .tabs).
   ═══════════════════════════════════════════════════════════════════════ */

/* צבע-התראה (מועד-הגשה) + מבטא-לכל-הליך. אותו דפוס-ארבע-הצהרות כמו הבסיס. */
:root{--alert:#a8452f; --alert-bg:#fdf0ec; --alert-line:#eec6bb;
  --d-ali:#197a9a; --d-cus:#2c7e62; --d-pro:#46658f;
  --d-gua:#7a5c8f; --d-wil:#8a6a3c; --d-agr:#3f7d7a;
  /* ── שני מבטאים שנוספו ‏12/08/2026 ────────────────────────────────
     בורדו לבית-הדין הרבני, ואפור-אבן לנזיקין. שניהם רחוקים משש
     הקוביות הקיימות בגלגל-הגוון, ורחוקים גם מ--alert הכתום-אדום —
     קובייה „בקרוב" שנצבעת בצבע-התראה נקראת כדחופה.               */
  --d-rab:#7d3f52; --d-tor:#5f6b74;
  --edit:#8a6a1f; --edit-bg:#fbf4e4; --edit-line:#e8d5a6;}
@media (prefers-color-scheme:dark){
  :root{--alert:#e08d76; --alert-bg:#2b1712; --alert-line:#5c3025;
    --d-ali:#4fb0d4; --d-cus:#5cbb96; --d-pro:#8aa6d8;
    --d-gua:#b394c9; --d-wil:#c9a469; --d-agr:#6fb8b4;
    --d-rab:#c98ea1; --d-tor:#9fb0bc;
    --edit:#d9ab55; --edit-bg:#241e10; --edit-line:#4b3c1c;}
}
:root[data-theme="dark"]{--alert:#e08d76; --alert-bg:#2b1712; --alert-line:#5c3025;
  --d-ali:#4fb0d4; --d-cus:#5cbb96; --d-pro:#8aa6d8;
    --d-gua:#b394c9; --d-wil:#c9a469; --d-agr:#6fb8b4;
    --d-rab:#c98ea1; --d-tor:#9fb0bc;
    --edit:#d9ab55; --edit-bg:#241e10; --edit-line:#4b3c1c;}
:root[data-theme="light"]{--alert:#a8452f; --alert-bg:#fdf0ec; --alert-line:#eec6bb;
  --d-ali:#197a9a; --d-cus:#2c7e62; --d-pro:#46658f;
  --d-gua:#7a5c8f; --d-wil:#8a6a3c; --d-agr:#3f7d7a;
  --d-rab:#7d3f52; --d-tor:#5f6b74;
  --edit:#8a6a1f; --edit-bg:#fbf4e4; --edit-line:#e8d5a6;}

/* ── השער: שתי שאלות, שש דלתות ── */
.ghero{padding:48px 0 8px}
.ghero h1{font-size:clamp(2rem,5.2vw,3.05rem);line-height:1.1;letter-spacing:-.025em}
.ghero h1 em{font-style:normal;color:var(--live)}
.ghero .sub{font-size:1.06rem;max-width:48ch}
.gqhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:32px 0 2px}
.gqhead h2{font-size:1.1rem}
.gqhead .hint{font-size:.83rem;color:var(--dim)}
.gqn{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--live);color:#fff;
  align-items:center;justify-content:center;font-size:.8rem;font-weight:800;font-family:var(--num);flex:none}

/* ── רשת-הקוביות: שש עמודות, וכל קובייה תופסת שתיים ───────────────────
   ⛔ **הכרעת עו"ד גבע ‏12/08/2026:** „8 קוביות, השורה השלישית תחזיק 2
      קוביות ממורכזות."
   ⚠️ **ולמה שש ולא שלוש.** ברשת של שלוש, מירכוז שתי הקוביות האחרונות
      מחייב שוליים על אחת מהן — ושוליים על פריט-רשת **מכווצים אותו**,
      כלומר יוצרים שתי מידות-קובייה באותו דף. ברשת של שש, קובייה =
      שתי עמודות, והמירכוז נעשה בהזזה של עמודה אחת. הרוחב זהה לחלוטין:
      ‏3×(2c+g) + 2g = 6c+5g, בדיוק רוחב-המכל.
   ⚠️ במסך צר הרשת חד-עמודית ואין „שורה אחרונה"; הכלל חל מ-800px ומעלה. */
.gdoms{display:grid;gap:12px;grid-template-columns:1fr;margin-top:14px}
@media(min-width:800px){
  .gdoms{grid-template-columns:repeat(6,1fr)}
  .gdoms > .gdom{grid-column:span 2}
  /* הקובייה שפותחת שורה אחרונה בת שתיים — נדחפת עמודה אחת פנימה,
     והבאה אחריה נסגרת אחריה מאליה. ‏nth-child(3n+1) = „פותחת שורה". */
  .gdoms > .gdom:nth-child(3n+1):nth-last-child(2){grid-column:2 / span 2}
}
.gdom{background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;
  display:flex;flex-direction:column}
.gstripe{height:4px;background:var(--acc);display:block}
.gdom .in{padding:16px 17px 17px;display:flex;flex-direction:column;flex:1;gap:9px}
.gdom h3{font-size:1.05rem;margin:0}
.gdom .s{font-size:.83rem;color:var(--dim);margin:0}
.gdoors{margin-top:auto;display:flex;flex-direction:column;gap:7px;padding-top:6px}
.gdoor{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.88rem;
  font-weight:600;text-decoration:none;color:var(--ink);border:1px solid var(--line);
  border-radius:8px;padding:9px 12px;transition:border-color .15s}
.gdoor:hover{border-color:var(--acc)}
.gdoor:focus-visible{border-color:var(--acc)}
.gdoor .ar{color:var(--acc);font-weight:700}
.gdoor.urg{border-color:var(--alert-line);background:var(--alert-bg);color:var(--alert)}
.gdoor.urg .ar{color:var(--alert)}
@media (prefers-reduced-motion:reduce){.gdoor{transition:none}}
/* ── תת-תווית בדלת: התפקיד הדיוני (תובע/נתבע/מבקש), מתחת לפעולה. ── */
.gdoor .sub{display:block;font-size:.72rem;font-weight:400;color:var(--dim);margin-top:1px}
.gdoor.urg .sub{color:var(--alert);opacity:.8}
.gdoor.edit{border-color:var(--edit-line);background:var(--edit-bg);color:var(--edit)}
.gdoor.edit .ar{color:var(--edit)}
.gdoor.edit .sub{color:var(--edit);opacity:.8}
/* ── תחום עתידי: מוצג כדי שהלקוח יראה לאן זה הולך, ואינו לחיץ. ── */
.gdom.soon{opacity:.72}
.gdom.soon .gdoor{pointer-events:none;border-style:dashed;background:transparent;color:var(--dim)}
.gdom.soon .gdoor .ar{visibility:hidden}
.soonbadge{align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.05em;
  color:var(--acc);border:1px solid var(--acc);border-radius:999px;padding:1px 9px;opacity:.85}

.gsides{display:grid;gap:12px;grid-template-columns:1fr;margin-top:16px}
@media(min-width:720px){.gsides{grid-template-columns:1fr 1fr}}
.gside{border:1px solid var(--line);border-radius:13px;background:var(--card);padding:16px 17px}
.gside.urg{border-color:var(--alert-line)}
.gside h3{font-size:1rem;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0}
.gside p{font-size:.86rem;margin-top:6px}
.gclock{font-family:var(--num);font-weight:800;color:var(--alert);font-size:.78rem;
  border:1px solid var(--alert-line);border-radius:99px;padding:1px 9px}
.gnote{font-size:.83rem;color:var(--dim);margin-top:18px}

/* ── עמוד-הליך: פירורי-לחם + מכשיר ── */
.crumb{font-size:.81rem;color:var(--dim);padding-top:18px;margin:0}
.crumb a{color:var(--acc);text-decoration:none;font-weight:600}
.crumb a:hover{text-decoration:underline}

.dbody{padding:16px 17px 18px;color:var(--machine-ink)}
.frow{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-bottom:10px}
.frow label{font-size:.86rem;color:#b9d0de}
.frow input{width:120px;background:rgba(255,255,255,.06);border:1px solid var(--machine-dim);
  border-radius:8px;padding:7px 10px;color:#fff;font:inherit;font-family:var(--num);
  font-size:.94rem;text-align:center}
.frow input:focus{outline:2px solid var(--acc);outline-offset:1px;border-color:var(--acc)}
.drng{width:100%;accent-color:var(--acc);height:22px}
.rslt{margin-top:15px;padding-top:14px;border-top:1px dashed var(--machine-line);text-align:center}
.rslt .lb{font-size:.81rem;color:#9fbccd;display:block}
.rslt .big{display:block;margin:3px 0 2px;font-size:2.35rem;color:#a9e0f5}
.rslt .who{font-size:.83rem;color:#b9d0de;display:block}
.dbody .brk{margin-top:12px;border-top:0;padding-top:0;font-size:.79rem}
.dbody .brk div{padding:2px 0}
.dbody .disc{margin-top:12px;font-size:.74rem;color:#8fadbf;line-height:1.5}

/* לוח-הלינות (זמני שהות) */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.cal button{aspect-ratio:1;border-radius:7px;border:1px solid var(--machine-line);cursor:pointer;
  background:rgba(255,255,255,.05);color:#c6dbe8;font:inherit;font-size:.74rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;padding:0}
.cal button[data-w="f"]{background:var(--d-cus);border-color:var(--d-cus);color:#04231a}
.cal button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.wklbl{font-size:.7rem;color:#8fadbf;margin:9px 0 4px}
.bars{margin-top:14px;display:grid;gap:7px}
.dbar2{display:grid;grid-template-columns:62px 1fr auto;gap:9px;align-items:center;
  font-size:.78rem;color:#b9d0de}
.dbar2 .tr{height:9px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
.dbar2 .tr i{display:block;height:100%;border-radius:99px;transition:width .2s}
.dbar2 b{font-family:var(--num);color:#e2f1f8;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.dbar2 .tr i{transition:none}}

/* מאזן-הרכוש */
.scale{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:end;margin-top:14px}
.pan{text-align:center}
.pcap{font-size:.76rem;color:#9fbccd;display:block}
.pan .col{margin-top:5px;border-radius:8px 8px 0 0;background:var(--d-pro);min-height:6px;
  transition:height .25s ease}
.pan .v{font-family:var(--num);font-size:.86rem;color:#e2f1f8;font-variant-numeric:tabular-nums;
  display:block;margin-bottom:4px}
.fulcrum{font-size:1.3rem;color:#7f9dc4;padding-bottom:10px}
@media (prefers-reduced-motion:reduce){.pan .col{transition:none}}

/* ── מועד-הגשת כתב-ההגנה ── */
.dl{background:var(--alert-bg);border:1px solid var(--alert-line);border-radius:13px;
  padding:20px 21px;margin-top:8px}
.dl h2{font-size:1.2rem;color:var(--alert)}
.dl p{font-size:.89rem;margin-top:8px}
.dlgrid{display:grid;gap:12px;grid-template-columns:1fr;align-items:end;margin-top:15px}
@media(min-width:660px){.dlgrid{grid-template-columns:1fr 1fr auto}}
.dlf label{display:block;font-size:.79rem;font-weight:700;color:var(--dim);margin-bottom:5px}
.dlf input{width:100%;font:inherit;font-family:var(--num);font-size:.94rem;padding:9px 11px;
  border-radius:8px;border:1px solid var(--alert);background:var(--card);color:var(--ink)}
.dlf input:focus{outline:2px solid var(--alert);outline-offset:1px}
.dlout{text-align:center;min-width:132px;border:1px solid var(--alert-line);border-radius:10px;
  padding:8px 14px;background:var(--card)}
.dlout .n{display:block;font-family:var(--num);font-size:1.85rem;font-weight:800;line-height:1.1;
  color:var(--alert);font-variant-numeric:tabular-nums}
.dlout .u{font-size:.76rem;color:var(--dim)}
.dlnote{font-size:.79rem;color:var(--dim);margin-top:13px;line-height:1.55}
.dl .row{display:flex;gap:11px;flex-wrap:wrap;margin-top:16px}

/* ═══════════════════════════════════════════════════════════════════════
   דף-הבית החדש ועמוד-האודות — ‏16/08/2026
   לפי הבריף של עו"ד גבע ולפי המוקאפ שהוצג לפניו.
   ═══════════════════════════════════════════════════════════════════════ */

/* גוני-אישור. ⚠️ --alert כבר קיים למעלה (הצד הדחוף); זהו הצד המרגיע. */
:root{--ok:#2c7e62; --ok-bg:#eef7f3; --ok-line:#bcdccf;}
@media (prefers-color-scheme:dark){
  :root{--ok:#5cbb96; --ok-bg:#12261e; --ok-line:#2c5443;}
}
:root[data-theme="dark"]{--ok:#5cbb96; --ok-bg:#12261e; --ok-line:#2c5443;}
:root[data-theme="light"]{--ok:#2c7e62; --ok-bg:#eef7f3; --ok-line:#bcdccf;}

/* ── שורת-הביטחון בראש הדף ──
   ⛔ **הכרעת עו"ד גבע ‏16/08/2026:** מקטע-התשלום עולה מן המקום השביעי
      לשלישי, ושורה אחת ממנו עולה עוד יותר — עד לראש הדף.
   ⚠️ **הנימוק:** „אין חיוב מראש" הוא המשפט שמסיר את החשש הראשון של מי
      שנכנס. כשהוא יושב במקום השביעי, מי שלא גלל אינו רואה אותו כלל. */
.safe{display:flex;gap:11px;align-items:flex-start;margin-top:22px;padding:14px 17px;
  border:1px solid var(--ok-line);background:var(--ok-bg);border-radius:11px;max-width:62ch}
.safe .ic{color:var(--ok);font-weight:800;font-size:1.05rem;line-height:1.5;flex:none}
.safe p{margin:0;color:var(--ink);font-size:.95rem;font-weight:600;max-width:none}
.safe .s{display:block;font-weight:400;font-size:.85rem;color:var(--dim);margin-top:3px}

/* כפתור-הנתבע. מחלקה נפרדת ולא ‎.btn.o — ‎.btn.o הוא הכפתור הנייטרלי
   ומשמש בעמודים אחרים; דריסתו הייתה צובעת אותם באדום בלי שאיש ביקש. */
.btn.urgent{background:var(--alert-bg);border-color:var(--alert-line);color:var(--alert)}
.btn.urgent:hover{border-color:var(--alert)}

/* ── שלוש הקוביות הפעילות ──
   ⛔ **הכרעת עו"ד גבע ‏16/08/2026:** חמש הקוביות המסומנות „בקרוב" יורדות
      מן המסך, ובמקומן שורה אחת. ⚠️ **בלי טופס-המתנה** — נשאל והוכרע.
   הרשת עצמה אינה משתנה: ‏6 עמודות × span 2 נותנת שלוש בשורה בדיוק. */
.gdoms.three .gdom .in{padding:19px 20px 20px;gap:10px}
.gdoms.three .gdom h3{font-size:1.14rem}
.gdoms.three .gdom .s{font-size:.86rem}
.gdoms.three .gdoor{font-size:.9rem;font-weight:700;padding:11px 13px}
.soonline{margin-top:18px;font-size:.87rem;color:var(--dim);border:1px dashed var(--line);
  border-radius:11px;padding:13px 16px;background:var(--card);max-width:none}
.soonline b{color:inherit}

/* ── ארבע ההתחייבויות ──
   ⛔ **הכרעת עו"ד גבע ‏16/08/2026:** „אם אתה הלקוח שלנו, הצד השני לא
      יוכל להיות לקוח."
   ⚠️ **וכל ארבע נבדקו בקוד לפני שנכתבו כאן** — חסימת-ניגוד-העניינים
      (clients.identity_check), אי-שמירת צילום-הת״ז (_persist_uploaded),
      תדפיסי-בנק שאינם נספח, ושער-ההצפנה בעליית השרת.
   ⛔ **מי שמשנה כאן טקסט — חייב לבדוק שהקוד עדיין תומך בו.** הבטחה
      שהקוד חדל לקיים היא הצהרה שקרית ללקוח, לא אי-דיוק שיווקי. */
/* ⛔ **פריסה מקובצת — אישור עו"ד גבע ‏16/08/2026.** עשר התחייבויות
   בשלוש קבוצות: מי מטפל בכם (2) · מה נכנס לכתב-הטענות (4) · מה קורה
   למידע שלכם (4).
   ⚠️ **הקיבוץ אינו קישוט.** עשר קוביות ברצף אחד נקראות פחות מחמש —
   הראשונות והאחרונות נקראות, והאמצע לא. הכותרות הן שלוש השאלות
   שהלקוח באמת שואל, ולכן הן חלק מן התוכן ולא עיטור. */
.grp{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap;
  margin:26px 0 0;padding-top:16px;border-top:1px solid var(--line)}
.grp:first-of-type{border-top:0;padding-top:0;margin-top:20px}
.grp h3{font-size:1.05rem;font-family:var(--ui);font-weight:800}
.grp .c{font-size:.75rem;color:var(--dim);font-family:var(--num)}
.vows{display:grid;gap:11px;grid-template-columns:1fr;margin-top:12px}
@media(min-width:760px){.vows{grid-template-columns:repeat(2,1fr)}}
.vow{display:flex;gap:13px;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-radius:12px;padding:15px 17px}
.vow.lead{border-color:var(--ok);border-width:2px;background:var(--ok-bg)}
.vn{display:inline-flex;width:26px;height:26px;border-radius:50%;background:var(--live);color:#fff;
  align-items:center;justify-content:center;font-size:.82rem;font-weight:800;
  font-family:var(--num);flex:none;margin-top:2px}
.vow.lead .vn{background:var(--ok)}
.vow h3{font-size:1rem;margin:0}
.vow.lead h3{font-size:1.12rem}
.vow p{font-size:.86rem;margin-top:5px}
.vow .src{font-size:.78rem;color:var(--dim);border-top:1px dashed var(--line);
  padding-top:7px;margin-top:9px}
.vow.lead .src{border-top-color:var(--ok-line)}

/* ── עמוד האודות ── */
.about .lead{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-top:20px}
.about .lead img{width:104px;height:104px;border-radius:50%;object-fit:cover;object-position:50% 16%;
  border:1px solid var(--line);flex:none}
.about .lead p{margin:0;font-size:1rem;color:var(--ink);flex:1 1 340px}
.ablock{border:1px solid var(--line);background:var(--card);border-radius:12px;
  padding:20px 21px;margin-top:16px}
.ablock h3{font-size:1.05rem;margin:0 0 7px}
.ablock p{margin:8px 0 0;font-size:.93rem;max-width:none}
.ablock.core{border-color:var(--live);border-width:2px}
.ablock.limit{background:var(--alert-bg);border-color:var(--alert-line)}
.ablock.limit h3{color:var(--alert)}
.ablock.limit p{color:var(--ink)}
.facts{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:11px;
  overflow:hidden;margin-top:16px;grid-template-columns:1fr}
/* ⚠️ מספר-העמודות מפורש ולא auto-fit: שש משבצות ברשת של ארבע משאירות
   שתיים ריקות, והן נראות על המסך כריבוע אפור תלוש. ‏3×2 נסגר בדיוק. */
@media(min-width:600px){.facts{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.facts{grid-template-columns:repeat(3,1fr)}}
.facts > div{background:var(--card);padding:13px 16px}
.facts .k{font-size:.72rem;font-weight:800;letter-spacing:.09em;color:var(--dim)}
.facts .v{font-size:.95rem;font-weight:600;margin-top:2px}

/* מתג מצב-הלילה. הכפתור נבנה ב-site.js ומוזרק לסרגל העליון בכל דף. */
.themebtn{font:inherit;font-size:1rem;line-height:1;cursor:pointer;flex:none;
  width:34px;height:34px;border-radius:8px;border:1px solid var(--line);
  background:transparent;color:var(--dim);display:inline-flex;
  align-items:center;justify-content:center}
.themebtn:hover{border-color:var(--live);color:var(--live)}
/* בלי מקום בסרגל — התפריט נעלם מתחת ל-720px, והכפתור נשאר. */
.top nav + .themebtn{margin-inline-start:0}
.top .themebtn{margin-inline-start:auto}
.top nav ~ .themebtn{margin-inline-start:0}

/* ══════════════════════════════════════════════════════════════════
   ‏2.4.7 · סימון-מיקוד — רק למי שמנווט במקלדת
   ══════════════════════════════════════════════════════════════════
   ⚠️ ‏``:focus-visible`` ולא ``:focus`` — הדפדפן מדליק אותו בניווט-מקלדת
   בלבד. ⛔ **מי שלוחץ בעכבר אינו רואה דבר**, והמסך זהה למה שהיה.

   ⚠️ **מוגדר אחרי כל השאר, בכוונה** — כדי שכלל ספציפי שביטל סימון לא
   יגבר עליו בשקט. זה בדיוק מה שקרה ב-‏11 הרכיבים שנמדדו.

   ⚠️ שלושה פיקסלים במרווח: נראה גם על משטח בהיר וגם על כהה, ואינו
   מוסתר על-ידי גבול-הרכיב עצמו.
   ══════════════════════════════════════════════════════════════════ */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--live) !important;
  outline-offset:2px !important;
  border-radius:4px;
}

/* ══════════════════════════════════════════════════════════════════
   ‏2.5.8 · גודל-מטרה מזערי — ‏24×24
   ══════════════════════════════════════════════════════════════════
   ⛔ **נמדד: ‏16 מטרות קטנות מדי**, כולן בגובה ‏22–23 פיקסלים.
   ⚠️ הרשימה כללה **רק** מי שגם קטן וגם צפוף; מי שעמד בחריג-המרווח
   של התקן לא נספר כלל.
   ⚠️ **הגובה מושג בריווח ולא בגופן** — הטקסט אינו גדל, והפריסה
   כמעט אינה זזה.
   ══════════════════════════════════════════════════════════════════ */
/* ⛔ **הכרעת עו"ד גבע, ‏22/08/2026: „אל תקטין כפתורים שגדולים
   מהמינימום."** ⚠️ ולכן ``min-height`` בלבד — הוא **מרים** מטרה
   קטנה מדי ואינו נוגע באף אחת שכבר גדולה.
   ⛔ הגרסה הראשונה שלי כתבה ``height:24px`` על המחוון — וזה **גם
   מקטין**: כל הקשר שבו הוא היה גבוה יותר היה מצטמצם. תוקן. */
.top nav a{ display:inline-flex; align-items:center; min-height:24px; }
.drng, input[type=range]{ min-height:24px; }

/* ══════════════════════════════════════════════════════════════════
   ⛔ שדות-המחשבון בטלפון — ‏02/09/2026
   ══════════════════════════════════════════════════════════════════
   ⚠️ **שלושת דפי-התחום (מזונות · אחריות-הורית · רכוש) כבר מכריזים
   רוחב-מסך** — ⛔ **ומה שחסר היה רק גודל-השדה.** נמדד: ‏15.04
   (‏.94rem) ב-``.frow input`` וב-``.dlf input``, ⚠️ **פיקסל אחד מתחת
   לקו** — ⛔ **ואייפון מגדיל את המסך בכל לחיצה על שדה קטן מ-‏16.**

   ⛔ **גופן בלבד, ובלי שינוי-פריסה** — ⚠️ **הכרעת עו"ד גבע,
   ‏02/09/2026:** „מקבל את ההמלצות שלך ל-‏4 השאלות." ✅ **וההמלצה שם
   הייתה: ‏16 בלבד.** ⛔ **תווית-מעל-שדה וסרגל-גרירה בגובה ‏44 הם
   שינוי-פריסה, ומחכים למוקאפ ולאישור.**
   השומר: ``pipeline/test_mobile_responsive.py`` —
   ``TheDomainCalculatorsDoNotInviteZoom``. */
@media(max-width:600px){
  .frow input,.dlf input{font-size:16px}
}
