/* ── Heebo, מוגש מאצלנו ──────────────────────────────────────────────
   היה נטען מ-fonts.googleapis.com בראש כל 87 העמודים, לפני באנר-ההסכמה,
   כלומר ה-IP של כל מבקר הגיע לגוגל בלי שאישר כלום. Heebo הוא פונט משתנה,
   ולכן קובץ אחד לכל תת-קבוצה מכסה 200–900. */
/* hebrew */
@font-face{font-family:'Heebo';font-style:normal;font-weight:200 900;font-display:swap;src:url(/assets/fonts/heebo-hebrew.woff2?v=85a40404) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
/* latin */
@font-face{font-family:'Heebo';font-style:normal;font-weight:200 900;font-display:swap;src:url(/assets/fonts/heebo-latin.woff2?v=df6ae575) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* latin-ext */
@font-face{font-family:'Heebo';font-style:normal;font-weight:200 900;font-display:swap;src:url(/assets/fonts/heebo-latin-ext.woff2?v=e18a8a54) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

/* ============================================================================
   SQUARE — brand.css · שכבת המותג
   ----------------------------------------------------------------------------
   נטענת **אחרי** dark.css ורוכבת עליה. הסיבה שזו שכבה נפרדת ולא עריכה של
   dark.css: הגיליון ההוא בן 41KB ומשרת 43 עמודים, וסשנים מקבילים נוגעים בו.
   שכבה נפרדת = אפס סיכון לדריסה, ואפשר להסיר אותה בשורה אחת.

   האבחנה שהולידה את הקובץ (נמדדה, לא שוערה):
     · ארבעת השחורים ב-dark.css:5 נפרשים על 18 ערכים מתוך 255 — 7%. העין
       לא מבחינה ביניהם, ולכן 164 פתיחות-סקשן נקראות כמשטח **אחד**.
     · `.hero-bg .g2{display:none}` (dark.css:216) הרג את מקור-האור השני;
       השורה שאחריה מעצבת אותו ולא מחזירה display. הירו רץ על זוהר אחד ב-9%.
     · `.photo-strip img` (dark.css:491) משמיד את הצילום היחיד באתר
       ב-`grayscale(.85)`, ומחזיר צבע רק ב-hover — כלומר **בנייד לעולם לא**.

   כל מידה כאן ב-rem. פקד גודל-הטקסט ב-a11y.js מכפיל את שורש-הפונט;
   px אחד שובר אותו בשקט.
   ============================================================================ */

/* ── 1 · אסימונים ─────────────────────────────────────────────────────────
   אדום נשאר צבע-הפעולה **היחיד**. מה שנוסף הוא טווח-טמפרטורה לאווירה,
   ונייטרל חם אחד (שמפניה) שאינו אינטראקטיבי לעולם.
   יחס: ~80% כהה · ~12% טקסט · ~6% אדום · ~2% שמפניה. */
:root{
  /* משטחים — טעונים, לא נייטרליים */
  --ink:#0B0B0B;
  --ink-warm:#120E0E;          /* סקשנים אנושיים */
  --ink-cool:#0A0C12;          /* סקשני טכנולוגיה */
  --elev-1:#171516;            /* כרטיס — נוטה לחום, במקום #17171A הכחלחל */
  --elev-2:#1F1C1D;
  --bone:#F6F3EE;              /* המשטח הבהיר היחיד באתר */
  --bone-2:#EDE8E1;
  --bone-ink:#14110F;
  --bone-ink-2:#4A4340;

  /* אדום כמשפחה */
  --red-hi:#FF5258;
  --red-ember:#FF7A5C;         /* גחלת — זוהר בלבד, אף פעם לא טקסט */
  --red-deep:#B01F24;
  --red-ox:#5C1216;

  /* שמפניה — אף פעם לא כפתור, אף פעם לא קישור */
  --gold:#E9C9A0;
  --gold-2:#F3E3CC;
  --gold-dim:rgba(233,201,160,.14);
  --gold-line:rgba(233,201,160,.24);

  /* משקל-נגד קר — זוהר בלבד, ≤8% */
  --cool:#6E86FF;

  /* טקסט מחומם (היה נוטה לכחול) */
  --txt:#F6F4F2;
  --txt-2:#BCB6B2;
  --txt-3:#928C88;

  --shadow-lift:inset 0 1px 0 rgba(255,255,255,.07), 0 1.875rem 4.375rem rgba(0,0,0,.5);
}

/* ── 2 · אטמוספרה גלובלית ─────────────────────────────────────────────────
   שתי שכבות שמאחדות את כל מה שמעליהן — "פילם סטוק".
   ה-grain הוא גם מה שהורג banding: ברגע שמניחים זוהר אדום על כמעט-שחור,
   מדרגות הגרדיאנט נעשות גלויות. רעש שובר אותן. */
.grain{opacity:.045}
@media(max-width:51.25rem){.grain{opacity:.025}}

body::after{
  content:"";position:fixed;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(125% 95% at 50% 45%, transparent 62%, rgba(0,0,0,.38) 100%);
}

/* ── 3 · מערכת הרקעים ─────────────────────────────────────────────────────
   שדה אורורה per-section. הגוון מגיע משני custom properties שמחלקת-המשנה
   של הסקשן קובעת — כך שאיזור-הטמפרטורה מגיע בחינם.
   כללים שמפרידים בין יקר לזול:
     · אלפא 0.04–0.16 בלבד       · רדיוסים אליפטיים, לעולם לא circle
     · inset שלילי לפני ה-blur   · הכתם הדומיננטי למעלה-ימין (כניסת העין ב-RTL)
     · מקור-אור דומיננטי אחד לכל viewport */
.sec,.page-hero,.hero{--glow-a:229,46,51;--glow-b:255,122,92}
.sec,.page-hero{position:relative;isolation:isolate}

.sec::before,.page-hero::before{
  content:"";position:absolute;inset:-20% -10%;z-index:-1;pointer-events:none;
  background:
    radial-gradient(70% 55% at 78% 8%,  rgba(var(--glow-a),.13) 0%, transparent 60%),
    radial-gradient(55% 45% at 12% 32%, rgba(var(--glow-b),.07) 0%, transparent 62%);
  filter:blur(2.5rem);
}

/* משפחות משטח — ממופות על המחלקות שכבר קיימות ב-43 העמודים,
   ולכן התיקון חל על 164 הסקשנים בלי לגעת באף קובץ HTML. */
.sec-soft{background:linear-gradient(180deg,var(--ink),var(--ink-warm))}
.sec-soft{--glow-a:255,122,92;--glow-b:255,170,120}
.sec-darker{background:var(--ink-cool)}
.sec-darker{--glow-a:110,134,255;--glow-b:229,46,51}

/* מודיפיירים מפורשים לעמודים שנכתבים מחדש */
.sec--human{background:var(--ink-warm);--glow-a:255,122,92;--glow-b:255,170,120}
.sec--tech {background:var(--ink-cool);--glow-a:110,134,255;--glow-b:80,200,220}
.sec--trust{background:var(--ink);--glow-a:233,201,160;--glow-b:229,46,51}

/* גריד תוכניות — מאחורי טכנולוגיה / מערכות / תהליך.
   ציר אדום יחיד, כמו תוכנית מסומנת ביד. תמיד ממוסך: תבנית שמגיעה עד
   שפת הסקשן היא הסימן המובהק של תבנית-מדף. */
.grid-bg::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(to right, rgba(229,46,51,.28) 1px, transparent 1px);
  background-size:4.5rem 4.5rem, 4.5rem 4.5rem, 100% 100%;
  background-position:0 0, 0 0, 38.2% 0;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 40%,#000 0%,transparent 100%);
          mask-image:radial-gradient(70% 60% at 50% 40%,#000 0%,transparent 100%);
}

/* קווי-גובה טופוגרפיים — רק מאחורי אזורי-פעילות ועמודי ערים.
   לעולם לא מאחורי צילום או טקסט ארוך. */
.topo-bg::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='420' viewBox='0 0 760 420' fill='none'%3E%3Cg stroke='%23ffffff' stroke-opacity='.07' stroke-width='1'%3E%3Cpath d='M-20 330c120-60 210 20 330-30s250-90 370-40'/%3E%3Cpath d='M-20 290c130-58 215 18 335-32s245-86 365-36'/%3E%3Cpath d='M-20 250c140-56 220 16 340-34s240-82 360-32'/%3E%3Cpath d='M-20 130c120-50 210 16 330-28s250-74 370-30'/%3E%3Cpath d='M-20 90c130-48 215 14 335-30s245-70 365-26'/%3E%3C/g%3E%3Cg stroke='%23E52E33' stroke-opacity='.2' stroke-width='1.2'%3E%3Cpath d='M-20 210c145-54 222 14 342-36s238-78 358-28'/%3E%3Cpath d='M-20 170c135-52 218 15 338-35s242-80 360-30'/%3E%3C/g%3E%3C/svg%3E");
  background-size:47.5rem auto;
  -webkit-mask-image:radial-gradient(75% 70% at 60% 45%,#000 0%,transparent 100%);
          mask-image:radial-gradient(75% 70% at 60% 45%,#000 0%,transparent 100%);
}

/* זוהר-אופק — סוגר סקשן בקו אור במקום בקצה חד */
.horizon{position:relative}
.horizon::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:11.25rem;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 100% at 50% 100%, rgba(229,46,51,.16), transparent 70%);
}

/* קו-שיער דועך — מחליף border-top אחיד */
.rule{height:1px;border:0;margin:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10) 22%,rgba(229,46,51,.5) 50%,rgba(255,255,255,.10) 78%,transparent)}

/* מפריד מעוקל בין בנדים.
   top:-1px הורג את תפר התת-פיקסל שנוצר כשהעקומה נפגשת עם רקע אחר. */
.curve{position:relative;line-height:0}
.curve svg{display:block;width:100%;height:3.75rem;position:relative;top:-1px}

/* ── 4 · הבנד הבהיר ───────────────────────────────────────────────────────
   המשטח הבהיר היחיד באתר. עובד **בגלל הנדירות** — אחד בכל עמוד ארוך.
   שניים הורגים את שניהם. */
.band--bone{
  background:var(--bone);color:var(--bone-ink);position:relative;isolation:isolate;
  padding:6.25rem 0;
}
.band--bone::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background:
    radial-gradient(60% 50% at 82% 6%, rgba(229,46,51,.07), transparent 62%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.35'/%3E%3C/svg%3E");
}
.band--bone h1,.band--bone h2,.band--bone h3,.band--bone h4{color:var(--bone-ink)}
.band--bone .section-lead,.band--bone p{color:var(--bone-ink-2)}
.band--bone .eyebrow{color:var(--red-deep)}
.band--bone .eyebrow::before{background:var(--red-deep)}
.band--bone .btn-ghost{background:rgba(0,0,0,.04);color:var(--bone-ink);border-color:rgba(0,0,0,.16)}
.band--bone .btn-ghost:hover{background:rgba(0,0,0,.08);border-color:rgba(0,0,0,.3)}
.band--bone .card{background:#fff;border-color:rgba(0,0,0,.09);color:var(--bone-ink);
  box-shadow:0 1.25rem 2.5rem rgba(20,17,15,.08)}
.band--bone .card p{color:var(--bone-ink-2)}

/* ── 5 · הבנד האדום ───────────────────────────────────────────────────────
   הרגע הרווי היחיד בעמוד. זו התשובה ל"תוסיף צבע" — לא עוד אדום בכל מקום. */
.band--red{
  background:linear-gradient(135deg,var(--red-deep) 0%,var(--red) 45%,#F0474C 100%);
  color:#fff;position:relative;isolation:isolate;overflow:hidden;padding:5.5rem 0;
}
.band--red::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.16;pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.5) 1px, transparent 1px);
  background-size:4.5rem 4.5rem;
  -webkit-mask-image:radial-gradient(70% 80% at 80% 10%,#000,transparent 75%);
          mask-image:radial-gradient(70% 80% at 80% 10%,#000,transparent 75%);
}
.band--red h2,.band--red h3{color:#fff}
.band--red p{color:rgba(255,255,255,.9)}
.band--red .btn-pill{background:#fff;color:var(--red-deep);border-radius:999px;font-weight:800}
.band--red .btn-pill:hover{background:#fff;transform:translateY(-1px);box-shadow:0 .875rem 1.875rem rgba(0,0,0,.25)}

/* ── 6 · טיפוגרפיה ────────────────────────────────────────────────────────
   היום h1–h4 כולם 900 — משקל אחיד קורא רועש, לא יוקרתי. יוקרה טיפוגרפית
   בעברית מגיעה מה**מרווח** בין המשקלים, לא מהמשקל המקסימלי. */
.display{font-size:clamp(2.2rem,5vw,4.15rem);line-height:1.06;letter-spacing:-.022em;font-weight:200}
.display span{display:block}
.display .thin{font-weight:200;color:var(--txt-2);font-size:.52em;letter-spacing:-.005em;line-height:1.3;margin-bottom:.35em}
.display .black{font-weight:900;color:#fff}
.display .hl{font-weight:900;color:var(--red-hi)}

/* מידה — עברית צפופה מלטינית. 75ch הוא מקור עיקרי ל"מעייף את העין". */
.measure{max-width:56ch}
.eyebrow{letter-spacing:.09em}

/* פסקת פתיחה בשתי עמודות — קורא "מגזין" מיד */
@media(min-width:56.25rem){
  .lead-2col{column-count:2;column-gap:2.75rem;column-rule:1px solid rgba(255,255,255,.08)}
  .band--bone .lead-2col{column-rule-color:rgba(0,0,0,.1)}
}

/* ספרות-רפאים — ספרות לטיניות דווקא: הן הניטרליות בטיפוגרפיה עברית
   ואינן מתחרות בכיוון הקריאה. */
.ghostnum{position:absolute;z-index:-1;pointer-events:none;user-select:none;
  font-size:clamp(7rem,14vw,13rem);font-weight:900;line-height:.8;color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.09);inset-inline-end:-.5rem;top:-2rem;
  font-variant-numeric:tabular-nums}
.band--bone .ghostnum{-webkit-text-stroke-color:rgba(20,17,15,.09)}

.tnum{font-variant-numeric:tabular-nums}

/* שמפניה — חוק: אף פעם לא כפתור, אף פעם לא קישור.
   אדום אומר "עשו את זה". שמפניה אומרת "זה מה שהרווחנו". */
.gold{color:var(--gold)}
.stamp{display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:700;
  letter-spacing:.04em;color:var(--gold);background:var(--gold-dim);
  border:1px solid var(--gold-line);border-radius:999px;padding:.3rem .7rem}
.stamp svg{width:.875rem;height:.875rem;flex:none}

/* ── 7 · צילום — שלוש דרגות ───────────────────────────────────────────────
   כל תמונה באתר שייכת לאחת מהן. זה מה שגורם לצילום מעורב-איכות
   להפסיק להיראות מעורב. */

/* דרגה A — הקשר. בניינים, לובי, חניון, גינה, מערכות. */
.duo{filter:grayscale(1) contrast(1.1) brightness(.9) sepia(.18) hue-rotate(-12deg) saturate(1.5);
  transition:filter .5s var(--ease)}

/* דרגה B — רגש. רק על פנים, וחוזר לצבע מלא.
   חיוך ב-duotone מלא הוא כבר לא חיוך: זה המקום היחיד שבו שוברים את המערכת. */
.duo--face{filter:grayscale(.55) contrast(1.06) brightness(.96) saturate(.9)}
.duo--face:hover,.duo--face.in{filter:none}

/* 🔴 תיקון dark.css:491 — הצילום היחיד באתר היה מושמד ב-grayscale(.85)
   וחוזר לצבע רק ב-hover, כלומר **בנייד לצמיתות**. */
.photo-strip img{filter:grayscale(.35) contrast(1.04) brightness(.94)}
.photo-strip a:hover img{filter:none}

/* scrim אמיתי — לעולם לא blend-mode לצורך קריאוּת: ברגע שמחליפים תמונה,
   ה-blend משתנה וה-WCAG נשבר בלי שאיש ישים לב. */
.scrim{position:relative}
.scrim::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top, rgba(11,11,11,.92) 0%, rgba(11,11,11,.55) 38%, transparent 78%)}
.scrim--side::after{
  background:linear-gradient(to left, rgba(11,11,11,.95) 0%, rgba(11,11,11,.72) 34%, rgba(11,11,11,.15) 68%, transparent 100%)}

/* מסכת דעיכה בקצה — התמונה מתמוססת ולא נגמרת במלבן.
   ב-RTL הדעיכה רצה שמאלה: התמונה מתרחקת מעמודת הקריאה. */
.fade-edge{-webkit-mask-image:linear-gradient(to left,#000 55%,transparent 100%);
                   mask-image:linear-gradient(to left,#000 55%,transparent 100%)}

.ph{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--elev-1)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph figcaption{position:absolute;inset-inline:0;bottom:0;padding:1.5rem 1.375rem .9rem;
  font-size:.8125rem;line-height:1.5;color:var(--txt-2);
  background:linear-gradient(to top,rgba(11,11,11,.92),transparent)}

/* ── 8 · הירו המצולם ──────────────────────────────────────────────────────
   🔴 dark.css:216 מכבה את `.hero-bg .g2` והשורה הבאה מעצבת אותו בלי
   להחזיר display — כלומר מקור-האור השני מעולם לא רונדר. מוחזר כאן. */
.hero-bg .g2{display:block}

.hero--photo{padding:clamp(8rem,15vw,11rem) 0 clamp(3.5rem,6vw,5.5rem);overflow:hidden}

/* 🔴 בגרסה הראשונה התמונה הייתה רקע מלא-רוחב עם מסכה `to left` — כלומר אטומה
   בצד ימין, בדיוק מתחת לעמודת הטקסט העברית. הטקסט נעשה קשה לקריאה והתמונה
   נחתכה. ב-RTL הטקסט יושב ימין, ולכן **התמונה חייבת לחיות שמאל**.
   היא עכשיו אלמנט אמיתי בעמודה השמאלית, דועכת ימינה אל תוך העמוד. */
.hero-shot{position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,#000 62%,transparent 100%);
          mask-image:linear-gradient(to right,#000 62%,transparent 100%)}
.hero-shot::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to right, transparent 35%, rgba(11,11,11,.55) 78%, var(--ink) 100%),
             linear-gradient(to top, rgba(11,11,11,.55), transparent 45%)}
.hero-shot img{width:100%;height:clamp(21rem,38vw,30rem);object-fit:cover;object-position:32% 45%;
  display:block;filter:grayscale(.28) contrast(1.06) brightness(.92) saturate(.96)}

.hero--photo .hero-veil{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(85% 70% at 22% 40%, rgba(229,46,51,.10), transparent 62%)}

/* שורת-הוכחה מתחת ל-H1 */
.hero-proof{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.125rem;
  font-size:.875rem;color:var(--txt-2);font-weight:600}
.hero-proof .sep{width:.25rem;height:.25rem;border-radius:50%;background:var(--txt-3);flex:none}
.hero-proof b{color:var(--white)}
.hero-proof .gold{color:var(--gold)}

/* ── 9 · טופס מעל הקיפול ──────────────────────────────────────────────────
   פער-ההמרה הגדול באתר: ל-index.html אין כיום markup של טופס בכלל,
   ושני כפתורי הירו הם עוגנים פנימיים. */
/* טופס-רצועה בהירו — פער-ההמרה הגדול באתר: ל-index.html לא היה markup של
   טופס בכלל, ושני כפתורי הירו היו עוגנים פנימיים (#contact, #about), כלומר
   המבקר נדרש לגלול תשעה סקשנים כדי להגיע לשדה הראשון. */
.form-strip{margin:2rem 0 1.75rem;max-width:40rem}
.form-strip .fields{display:grid;grid-template-columns:1.1fr 1fr .8fr;gap:.5rem;margin-bottom:.625rem}
.form-strip input{width:100%;font-family:inherit;font-size:.9375rem;
  background:rgba(23,21,22,.78);border:1px solid var(--line);border-radius:.625rem;
  color:var(--txt);padding:.875rem .9375rem;
  -webkit-backdrop-filter:blur(.5rem);backdrop-filter:blur(.5rem)}
.form-strip input::placeholder{color:var(--txt-3)}
/* ⚠️ `:focus` ולא `:focus-visible` הסיר את טבעת-המיקוד גם ממשתמש-מקלדת,
   דווקא בטופס-ההמרה הראשי. הכלל הגלובלי ב-dark.css:33 חוזר לפעול. */
.form-strip input:focus{border-color:var(--red);background:rgba(23,21,22,.95)}
.form-strip input:focus:not(:focus-visible){outline:none}
.form-strip .btn{width:100%}
@media(max-width:37.5rem){.form-strip .fields{grid-template-columns:1fr 1fr}
  .form-strip .fields input:first-child{grid-column:1 / -1}}
.microtrust{display:block;margin-top:.6875rem;font-size:.75rem;color:var(--txt-3)}
.form-card .microtrust{text-align:center}

/* ── 10 · סרגל שירות דביק ─────────────────────────────────────────────────
   זמינות מיידית בכל עמוד ובכל מיקום גלילה. אין היום ולו מופע אחד של
   whatsapp באתר — ובישראל זה ערוץ ראשי. */
.topbar{position:fixed;top:0;left:0;right:0;z-index:61;background:rgba(9,9,10,.92);
  -webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem);
  border-bottom:1px solid var(--line-2);font-size:.8125rem}
.topbar .in{max-width:var(--maxw);margin:0 auto;padding:.4375rem 1.625rem;
  display:flex;align-items:center;gap:1.25rem;justify-content:flex-end}
.topbar a{color:var(--txt-2);display:inline-flex;align-items:center;gap:.4375rem;font-weight:600}
.topbar a:hover{color:var(--white)}
.topbar svg{width:.9375rem;height:.9375rem;flex:none}
.topbar .hours{color:var(--txt-3);margin-inline-end:auto}
.topbar .wa:hover{color:#25D366}
@media(max-width:47.5rem){.topbar .hours{display:none}.topbar .in{justify-content:center;gap:1.5rem}}
html.has-topbar .topline{top:2rem}
html.has-topbar .nav-wrap{top:2.1875rem}
@media(max-width:47.5rem){html.has-topbar .nav-wrap{top:2.0625rem}}

/* ── 11 · סרגל CTA בנייד ──────────────────────────────────────────────────
   שני עיגולים צפים מתחרים היום על אותה פינה (וואטסאפ שמאל, נגישות ימין)
   ואין פעולה קבועה. הסרגל מחליף את הצף בנייד. */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:58;display:none;
  background:rgba(9,9,10,.96);-webkit-backdrop-filter:blur(.875rem);backdrop-filter:blur(.875rem);
  border-top:1px solid var(--line);padding:.5rem .625rem calc(.5rem + env(safe-area-inset-bottom));
  gap:.5rem}
.sticky-cta a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.4375rem;
  font-size:.8125rem;font-weight:700;padding:.75rem .375rem;border-radius:.625rem;min-height:2.75rem}
.sticky-cta .c{background:rgba(255,255,255,.07);color:var(--white);border:1px solid var(--line)}
.sticky-cta .w{background:#25D366;color:#08210F}
.sticky-cta .q{background:var(--red);color:#fff}
.sticky-cta svg{width:1rem;height:1rem;flex:none}
@media(max-width:47.5rem){
  .sticky-cta{display:flex}
  body{padding-bottom:3.75rem}
  .wa-float{display:none}
}

/* ── 12 · כרטיסים ─────────────────────────────────────────────────────────
   ה-inset העליון הוא הפרט המכריע: הוא מדמה מקור-אור מעל העמוד וגורם
   לכרטיס כהה להיראות **עצם**, לא **חור**. */
.card,.rel-card,.pstep,.tcard{background:var(--elev-1);box-shadow:var(--shadow-lift)}
.card:hover,.rel-card:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 2.25rem 4.5rem rgba(0,0,0,.6)}

/* וריאנט מצולם — גריד תצלומים קורא "אנחנו באמת עושים את זה";
   גריד אייקונים קורא "בנינו אתר". */
.card--photo{padding:0;overflow:hidden;display:flex;flex-direction:column}
.card--photo .thumb{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--elev-2)}
/* מקור לאורך בתוך מסגרת לרוחב — `cover` גוזר מלמעלה ומלמטה וחותך את הפנים.
   הפנים הן כל העניין בכרטיסים האלה. */
.thumb--top img{object-position:50% 12%!important}
.thumb--face img{object-position:50% 22%!important}
.card--photo .thumb img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.32) contrast(1.05) brightness(.86);transition:filter .45s var(--ease),transform .6s var(--ease)}
.card--photo:hover .thumb img{filter:grayscale(.05) contrast(1.02) brightness(.95);transform:scale(1.045)}
.card--photo .thumb::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(11,11,11,.9),rgba(11,11,11,.15) 60%,transparent);
  transition:opacity .4s}
.card--photo:hover .thumb::after{opacity:.55}
.card--photo .body{padding:1.25rem 1.375rem 1.5rem}
.card--photo h3{font-size:1.0625rem;margin-bottom:.4375rem}
.card--photo p{font-size:.875rem;color:var(--txt-2);line-height:1.6}

/* וריאנט שמפניה — הסמכה / התחייבות */
.card--gold{border-color:var(--gold-line);
  background:linear-gradient(180deg,rgba(233,201,160,.05),transparent 55%),var(--elev-1)}

/* ── 13 · אנשים ───────────────────────────────────────────────────────────
   עסק שירות בלי פנים מעל הקיפול נקרא כמוקד טלפוני. עם פנים — כשכנים. */
.people{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(13.75rem,1fr))}
.person{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--elev-1);
  border:1px solid var(--line);box-shadow:var(--shadow-lift)}
.person img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 22%;display:block;
  filter:grayscale(.38) contrast(1.05) brightness(.95);transition:filter .5s var(--ease)}
/* 🔑 `height:auto` חייב להופיע לפני `aspect-ratio`. תכונת ה-HTML `height="1062"`
   היא רמז-תצוגה שנכנס לגיליון של הדפדפן, ו-`aspect-ratio` פועל רק כשאחד
   משני הממדים הוא auto — בלי השורה הזו הכרטיסים יצאו 1,156px גובה במקום 360. */
.person:hover img{filter:none}
.person .meta{position:absolute;inset-inline:0;bottom:0;padding:2.5rem 1.125rem .9375rem;
  background:linear-gradient(to top,rgba(11,11,11,.95),transparent)}
.person b{display:block;font-size:.9375rem;color:#fff}
.person small{display:block;font-size:.75rem;color:var(--red-hi);font-weight:700;margin-top:.125rem}

/* ── 14 · קיר הביקורות ────────────────────────────────────────────────────
   דירוג מצרפי בלי אף ביקורת = גוגל עלול להתעלם משניהם. */
.reviewwall{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(17.5rem,1fr))}
.rv{background:var(--elev-1);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.375rem 1.375rem 1.125rem;box-shadow:var(--shadow-lift);display:flex;flex-direction:column;gap:.75rem}
.rv .stars{color:var(--gold);font-size:.9375rem;letter-spacing:.1em;line-height:1}
.rv p{font-size:.9375rem;line-height:1.7;color:var(--txt-2);flex:1}
.rv .by{display:flex;align-items:center;gap:.625rem;padding-top:.75rem;border-top:1px solid var(--line-2)}
.rv .av{width:2.125rem;height:2.125rem;border-radius:50%;display:grid;place-items:center;flex:none;
  background:var(--red-soft);color:var(--red-hi);font-weight:800;font-size:.875rem}
.rv .by b{font-size:.8125rem;color:var(--white);display:block}
.rv .by small{font-size:.6875rem;color:var(--txt-3)}
.gsource{display:inline-flex;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--txt-2);font-weight:600}
.gsource svg{width:1.0625rem;height:1.0625rem}

/* ── 15 · ההתחייבויות ─────────────────────────────────────────────────────
   הדבר היחיד באתר שאף מתחרה בישראל לא מצהיר — והיום הוא הבלוק הכי שטוח. */
.commit{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.commit article{position:relative;background:linear-gradient(180deg,rgba(233,201,160,.045),transparent 50%),var(--elev-1);
  border:1px solid var(--gold-line);border-radius:var(--radius);padding:1.5rem 1.375rem 1.25rem;
  box-shadow:var(--shadow-lift);display:flex;flex-direction:column;gap:.75rem}
.commit .ic{width:2.5rem;height:2.5rem;border-radius:.75rem;display:grid;place-items:center;
  background:var(--red-soft);color:var(--red-hi)}
.commit .ic svg{width:1.25rem;height:1.25rem}
.commit h3{font-size:1.0625rem}
.commit p{font-size:.875rem;color:var(--txt-2);line-height:1.65;flex:1}

/* ── 16 · טיקר ────────────────────────────────────────────────────────────
   ב-RTL הכיוון הטבעי כבר נכון — לא להפוך. */
.ticker{overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ticker .track{display:flex;gap:3rem;width:max-content;animation:tick 38s linear infinite}
.ticker:hover .track{animation-play-state:paused}
.ticker .it{display:inline-flex;align-items:center;gap:.625rem;font-size:.9375rem;
  font-weight:700;color:var(--txt-2);white-space:nowrap}
.ticker .it b{color:var(--white);font-size:1.0625rem;font-variant-numeric:tabular-nums}
.ticker .it .gold{color:var(--gold)}
@keyframes tick{to{transform:translateX(50%)}}

/* ── 17 · תנועה ───────────────────────────────────────────────────────────
   מצומצם בכוונה. הכול מאחורי prefers-reduced-motion **וגם** מאחורי
   html.a11y-motion. אסור: tilt על טקסט עברי · פרלקסה על טקסט ·
   יותר ממכשיר תנועה אחד פעיל באותו viewport. */

/* זרקור סמן — שתי כתיבות custom-property לכרטיס */
@media(hover:hover){
  .spot{position:relative}
  .spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
    opacity:0;transition:opacity .35s;
    background:radial-gradient(11rem 11rem at var(--mx,50%) var(--my,50%), rgba(229,46,51,.16), transparent 70%)}
  .spot:hover::after{opacity:1}
}

/* כפתור מגנטי — ≤8px, transform בלבד, אף פעם לא על ניווט */
.mag{will-change:transform}

/* חשיפת תמונה במסכה — רץ בקומפוזיטור, זול יותר מ-IntersectionObserver+JS */
@supports (animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .maskin{animation:maskin linear both;animation-timeline:view();animation-range:entry 8% cover 34%}
    @keyframes maskin{
      from{clip-path:inset(0 0 0 100%)}
      to{clip-path:inset(0 0 0 0)}
    }
  }
}

/* ברק קונוס — פעם אחת בעמוד, על כרטיס "כניסת דיירים".
   @property חובה: בלי ההצהרה הזווית לא מתאינטרפלטת ואין אנימציה. */
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
.shine{position:relative;isolation:isolate}
.shine::before{content:"";position:absolute;inset:-1px;border-radius:inherit;z-index:-1;padding:1px;
  background:conic-gradient(from var(--ang), transparent 0deg, rgba(229,46,51,.75) 28deg, rgba(233,201,160,.5) 48deg, transparent 90deg, transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:spin 6s linear infinite}
@keyframes spin{to{--ang:360deg}}

@media(prefers-reduced-motion:reduce){
  .ticker .track,.shine::before{animation:none}
}

/* ── 18 · ניווט ───────────────────────────────────────────────────────────
   הקהל שהאתר קיים בשבילו קיבל עד היום את הכפתור השקט: "כניסת דיירים"
   הוא outline שקוף לצד CTA אדום מלא. מושווה כאן במעמד. */
.btn-res{background:rgba(233,201,160,.09);border-color:var(--gold-line);color:var(--gold-2)}
.btn-res:hover{background:rgba(233,201,160,.16);border-color:var(--gold);color:#fff}

/* תפריט-על שירותים — ארבעת עמודי הכסף אינם בניווט העליון בכלל היום */
.has-mega{position:relative}
/* 🔴 היה `inset-inline-end:0`. ב-RTL הקצה הלוגי inline-end הוא **שמאל**, ולכן
   התפריט נעץ את שפתו השמאלית בפריט וגדל ימינה — ונמדד גולש 133px מחוץ למסך
   בכל רוחב דסקטופ (1440→megaR 1573). הצד הנכון ב-RTL הוא inline-start. */
.mega{position:absolute;top:calc(100% + 1.125rem);inset-inline-start:0;
  width:max-content;max-width:min(40rem,calc(100vw - 3rem));
  background:rgba(16,15,15,.985);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:.75rem;box-shadow:var(--shadow-card);display:none;
  grid-template-columns:repeat(2,minmax(11rem,1fr));gap:.125rem;
  -webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);z-index:70}
/* גשר בלתי-נראה בין הפריט לתפריט — בלי זה העכבר חוצה 1.125rem של ריק
   והתפריט נסגר לפני שהמשתמש הגיע אליו. זו הסיבה הנפוצה ביותר ל«אי-אפשר ללחוץ». */
.has-mega::after{content:"";position:absolute;inset-inline:0;top:100%;height:1.375rem;display:none}
.has-mega:hover::after,.has-mega:focus-within::after{display:block}
.has-mega:hover .mega,.has-mega:focus-within .mega{display:grid}
.mega--wide{grid-template-columns:repeat(3,minmax(10.5rem,1fr));max-width:min(48rem,calc(100vw - 3rem))}
.mega--one{grid-template-columns:1fr;max-width:min(22rem,calc(100vw - 3rem))}
.mega a{display:block;padding:.5625rem .75rem;border-radius:.5rem;font-size:.875rem;
  font-weight:600;color:var(--txt-2);line-height:1.35}
.mega a:hover,.mega a:focus-visible{background:rgba(255,255,255,.07);color:#fff}
.mega a::after{display:none}
.mega a small{display:block;font-size:.75rem;color:var(--txt-3);font-weight:400;margin-top:.0625rem}
.mega .mega-head{grid-column:1/-1;font-size:.6875rem;font-weight:800;letter-spacing:.08em;
  color:var(--txt-3);padding:.5rem .75rem .25rem}
.mega .mega-all{grid-column:1/-1;border-top:1px solid var(--line-2);margin-top:.25rem;
  padding-top:.5rem;color:var(--red-hi);font-weight:700}
@media(max-width:61.25rem){.mega,.has-mega::after{display:none!important}}

/* ── 19 · אייקונים ────────────────────────────────────────────────────────
   מחליפים 476 תווי אמוג'י שנרנדרו באמנות של מערכת ההפעלה — כחול-אפור של
   אפל מול פלטה אדום/שחור, ושונה לגמרי באנדרואיד ובחלונות.
   זו דליפת-איכות-המותג הרועשת ביותר מול "מותג יוקרתי". */
.i{width:1.125em;height:1.125em;flex:none;vertical-align:-.19em;
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.i--lg{width:1.5rem;height:1.5rem}
.ibox{width:2.5rem;height:2.5rem;border-radius:.75rem;display:grid;place-items:center;flex:none;
  background:var(--red-soft);color:var(--red-hi)}
.ibox--gold{background:var(--gold-dim);color:var(--gold);border:1px solid var(--gold-line)}

/* ── 20 · נגישות — רשימת ההרג ─────────────────────────────────────────────
   ⚠️ a11y.js:32-33 מכבה ידנית את .grain ואת שכבות ההירו במצב ניגודיות
   גבוהה. כל שכבת רקע שנוספת כאן **חייבת** להיכבות גם היא, אחרת הבטחת
   ה-WCAG נשברת ברגע שמשתמש מפעיל את הפקד. הכללים יושבים כאן ולא ב-a11y.js
   כדי שלא ייווצר תלות בסדר-הזרקה. */
html.a11y-contrast .sec::before,
html.a11y-contrast .page-hero::before,
html.a11y-contrast .grid-bg::after,
html.a11y-contrast .topo-bg::after,
html.a11y-contrast .horizon::after,
html.a11y-contrast .band--bone::before,
html.a11y-contrast .band--red::before,
html.a11y-contrast .shine::before,
html.a11y-contrast body::after,
html.a11y-contrast .hero--photo .hero-shot{display:none}
html.a11y-contrast .hero--photo .hero-veil{background:#000}
html.a11y-contrast .duo,
html.a11y-contrast .duo--face,
html.a11y-contrast .photo-strip img,
html.a11y-contrast .card--photo .thumb img,
html.a11y-contrast .person img{filter:none}
html.a11y-contrast .band--bone{background:#fff;color:#000}
html.a11y-contrast .band--bone h2,html.a11y-contrast .band--bone h3,
html.a11y-contrast .band--bone p,html.a11y-contrast .band--bone .section-lead{color:#000}
html.a11y-contrast .band--red{background:#8A0F13}
html.a11y-contrast .stamp{color:#FFE9CC;border-color:#FFE9CC}
html.a11y-contrast .rv .stars,html.a11y-contrast .gold{color:#FFD9A8}
html.a11y-contrast .topbar{background:#000}
html.a11y-contrast .sticky-cta{background:#000}
html.a11y-contrast .form-strip input{background:#000}

html.a11y-motion .ticker .track,
html.a11y-motion .shine::before,
html.a11y-motion .maskin{animation:none!important;clip-path:none!important}

/* ── 21 · רכיבי דף הבית ───────────────────────────────────────────────────
   נוספו יחד עם כתיבת דף הבית מחדש. */

/* הירו — שתי עמודות: העתק מימין, הטופס משמאל */
.hero-wrap{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(1.75rem,4vw,3.5rem);
  align-items:center;width:100%}
.hero--photo .hero-copy{padding-inline-start:2.125rem}
.hero--photo .hero-copy::before{content:"";position:absolute;inset-inline-start:0;top:.75rem;bottom:.75rem;
  width:2px;background:linear-gradient(180deg,var(--red),transparent)}
.hero--photo .hero-sub{font-size:clamp(1.0625rem,1.9vw,1.25rem);color:var(--txt-2);margin:1.5rem 0 1.75rem}
@media(max-width:61.25rem){
  .hero-wrap{grid-template-columns:1fr;gap:2rem}
  .hero--photo .hero-copy{padding-inline-start:0}
  .hero--photo .hero-copy::before{display:none}
  .hero-shot{-webkit-mask-image:none;mask-image:none;order:-1}
  .hero-shot img{height:clamp(14rem,48vw,20rem);object-position:38% 42%}
  .hero-shot::after{background:linear-gradient(to top,rgba(11,11,11,.85),transparent 55%)}
  .form-strip{max-width:none}
}

/* סרגל ההוכחה */
.proofbar{background:var(--ink);border-block:1px solid var(--line-2);padding:1.125rem 0;position:relative;z-index:2}

/* הכאב — «תשכחו מ…» כאנאפורה */
.pain-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
@media(max-width:56.25rem){.pain-grid{grid-template-columns:1fr;gap:2.25rem}}
.forget{display:grid;gap:.5rem}
.forget li{display:flex;align-items:flex-start;gap:.75rem;font-size:clamp(1rem,1.6vw,1.125rem);
  color:var(--txt-2);line-height:1.6;padding:.875rem 1.125rem;border-radius:.75rem;
  background:linear-gradient(90deg,rgba(255,255,255,.035),transparent);
  border-inline-start:2px solid rgba(229,46,51,.45)}
.forget .x{color:var(--red-hi);font-weight:900;flex:none}
#pain{overflow:hidden}
#pain .giant{position:absolute;inset-inline-start:-1rem;top:2rem;z-index:-1;text-align:start;padding:0;
  -webkit-text-stroke-width:2px}

/* סרט תצלומים — גלילה אופקית, הצילום בגודל שמראים בו עבודה */
.filmstrip{display:flex;gap:1rem;overflow-x:auto;padding-bottom:1rem;
  padding-inline:max(1.625rem,calc((100vw - var(--maxw))/2));
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scroll-padding-inline-start:max(1.625rem,calc((100vw - var(--maxw))/2))}
.filmstrip::-webkit-scrollbar{height:.375rem}
.filmstrip::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:999px}
.filmstrip figure{flex:0 0 clamp(14rem,24vw,19rem);margin:0;position:relative;scroll-snap-align:start;
  border-radius:var(--radius-lg);overflow:hidden;background:var(--elev-1);border:1px solid var(--line)}
.filmstrip img{width:100%;height:clamp(12rem,19vw,15rem);object-fit:cover;display:block;
  filter:grayscale(.28) contrast(1.04) brightness(.9);transition:filter .45s var(--ease),transform .6s var(--ease)}
.filmstrip figure:hover img{filter:none;transform:scale(1.04)}
.filmstrip figcaption{position:absolute;inset-inline:0;bottom:0;padding:2.25rem .9375rem .8125rem;
  font-size:.8125rem;color:var(--txt-2);line-height:1.45;
  background:linear-gradient(to top,rgba(11,11,11,.95),transparent)}

/* כרטיס כניסת דיירים — נושא את ברק-הקונוס היחיד בעמוד */
.resident-card{display:flex;align-items:center;justify-content:space-between;gap:1.75rem;flex-wrap:wrap;
  background:linear-gradient(120deg,rgba(233,201,160,.06),rgba(110,134,255,.05) 60%,transparent),var(--elev-1);
  border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.875rem 2rem;
  box-shadow:var(--shadow-lift)}
.resident-card h3{font-size:clamp(1.25rem,2.4vw,1.75rem);margin:.25rem 0 .5rem}
.resident-card p{color:var(--txt-2);font-size:.9375rem;max-width:34rem}

/* חתימת הפוטר */
.foot-sig{font-size:clamp(1.5rem,4.5vw,3rem);font-weight:200;color:var(--txt-2);
  letter-spacing:-.015em;line-height:1.2}
.foot-sig b{font-weight:900;color:#fff}

/* לוגו הפוטר — היה כמעט בלתי-נראה ב-opacity:.04 */
.footer .foot-logo img{opacity:.92}

/* ה-eyebrow בבנד הבהיר ובבנד האדום */
.band--red .eyebrow{color:rgba(255,255,255,.85)}
.band--red .eyebrow::before{background:#fff}

/* ── 22 · תיקוני מסך צר ───────────────────────────────────────────────────
   נמדדו ב-390px וב-500px. */

/* `.lbl-f/.lbl-s` הוגדרו ב-dark.css רק בתוך `.btn-res`; בסרגל העליון הכתובת
   המלאה גלשה לשתי שורות. */
.topbar .lbl-s{display:none}
@media(max-width:37.5rem){
  .topbar .lbl-f{display:none}
  .topbar .lbl-s{display:inline}
  .topbar .in{gap:1.125rem;padding-inline:1rem}
}

/* ה-.giant הוא מכשיר-רקע. במסך צר הוא מתנגש ב-eyebrow ובכותרת. */
@media(max-width:43.75rem){
  #pain .giant{display:none}
  .giant{font-size:clamp(3rem,16vw,5rem)}
}

/* סרגל הפעולה התחתון מכסה את התוכן האחרון בעמוד */
@media(max-width:47.5rem){
  .footer{padding-bottom:1.25rem}
  /* ⚠️ ה-!important כאן הוא כוונה: להרים את הכפתור מעל סרגל ה-CTA.
     אבל הוא ניצח גם את ההרמה מעל באנר-העוגיות, והכפתור נבלע בתוכו —
     נמדד: elementFromPoint במרכזו החזיר את «מאשר». הבורר `:not(...)`
     מוציא מהכלל בדיוק את המצב שבו הבאנר פתוח. */
  html:not(.sqc-open) #sqA11yBtn{bottom:4.75rem!important}
  html.sqc-open #sqA11yBtn{bottom:var(--sqc-lift,4.75rem)!important}
  html.sqc-open #sqA11yPanel{bottom:calc(var(--sqc-lift,4.75rem) + 3.875rem)!important}
}

/* טבלאות וגושי-קוד רחבים לא יגלשו מהעמוד */
.sec table{display:block;overflow-x:auto;max-width:100%}

/* ── 23 · ניגודיות — תיקונים מדודים ───────────────────────────────────────
   נמדד: טקסט לבן על #E52E33 נותן יחס 4.40:1. הסף ל-AA בטקסט רגיל הוא 4.5,
   ו«טקסט גדול» מתחיל ב-18.66px מודגש — תווית הכפתור היא 16px/700 ולכן
   אינה נחשבת גדולה. האתר נושא הצהרת-נגישות, ולכן זה פער אמיתי ולא תיאורטי.
   הפתרון: **אסימון המותג `--red` לא זז.** מכהים ב-2% אך ורק את המילוי שמתחתיו
   יושב טקסט לבן — הפרש שאינו נראה לעין (ΔE≈1) ומעביר את הסף.
   נמדד אחרי: 4.57:1. */
:root{--red-btn:#E02D32}
.btn-primary,.sticky-cta .q{background:var(--red-btn)}
.btn-primary:hover{background:#E93940}

/* אותו חשבון בתוך הבנד האדום: העצירה הבהירה הייתה #F0474C ⇒ 3.68:1 בלבד,
   ו-`rgba(255,255,255,.9)` הוריד אותה ל-3.25. העצירה הוחלפה, והפסקה עברה
   ללבן מלא. */
.band--red{background:linear-gradient(135deg,var(--red-deep) 0%,#D92F34 52%,#DE3439 100%)}
.band--red p{color:#fff}

/* תיבת-ההסכמה בטופס המקוצר של המאמרים */
.mf-consent{display:flex;gap:.5rem;align-items:flex-start;font-size:.75rem;color:var(--txt-3);
  margin:0 0 .75rem;cursor:pointer;line-height:1.5}
.mf-consent input[type=checkbox]{width:auto;min-width:0;flex:0 0 auto;
  margin-top:.1875rem;accent-color:var(--red)}
/* 🔴 `dark.css:153` מגדיר `.mini-form input{width:100%}`. `flex:none` אינו מבטל
   רוחב — ולכן תיבת-ההסכמה נמתחה ל-294px והטקסט לצידה נדחס לעמודה של 46px
   בגובה 126px. נמדד בדפדפן על 45 הטפסים. `width:auto` הוא התיקון. */
.mf-consent a{color:#ff8e8e;text-decoration:underline}

/* קישור-עולה מהמאמר לאשכול שלו */
.hub-up{margin:2rem 0 0;padding-top:1.125rem;border-top:1px solid var(--line-2);
  font-size:.9375rem;color:var(--txt-2)}
.hub-up a{color:var(--red-hi);font-weight:700}
.hub-up a:hover{text-decoration:underline}

/* חלופה טקסטואלית לסרטון — WCAG 1.2.3 ברמה A. בלי זה הצהרת-הנגישות
   טוענת AA ובו-בזמן מודה בכשל ברמה A. */
.vid-alt{margin-top:.75rem;border-top:1px solid var(--line-2);padding-top:.75rem}
.vid-alt summary{cursor:pointer;font-size:.875rem;font-weight:700;color:var(--txt-2)}
.vid-alt summary:hover{color:var(--white)}
.vid-alt .ans{padding-top:.625rem;font-size:.875rem;line-height:1.7;color:var(--txt-2)}
.vid-alt .ans a{color:var(--red-hi);text-decoration:underline}


/* ── 27 · גלישה אופקית בטופס-הקשר ─────────────────────────────────────────
   נמדד ב-390px: `.contact-grid` נותן עמודה של 390.6px, אבל `min-content` של
   `form.form-card` הוא 391px — כי `.btn{white-space:nowrap}` יחד עם
   `.btn-lg{padding:17px 34px}` ו-`.form-card{padding:34px}` לא מאפשרים לכפתור
   להתכווץ. מסלול-grid ברירת-מחדל אינו יורד מתחת ל-min-content, ולכן הסקציה
   גלשה 27px שמאלה — ונחתכה בשקט על ידי `html,body{overflow-x:hidden}`.
   `min-width:0` הוא התיקון התקני לפריט-grid שמנפח את המסלול שלו. */
.contact-grid > *{min-width:0}
@media(max-width:32.5rem){
  .contact-grid .form-card{padding:1.25rem}
  .contact-grid .btn{white-space:normal}
}


/* ── 28 · מקלדת וניגודיות — תיקונים שנמדדו ───────────────────────────────
   1. אזור שנגלל אופקית חייב להיות ממוקד-מקלדת (WCAG 2.1.1, רמה A). ה-outline
      הגלובלי חל על a/button/input בלבד, ולכן ל-div צריך כלל משלו.
   2. לבן על ‎#E52E33‎ נותן 4.40:1 — מתחת ל-4.5 שנדרש ל-AA. ‎#E02D32‎ נותן
      4.57:1 והעין לא מבחינה. כאן זה מוחל על שני המשטחים שנמצאו: קישור-הדילוג
      ושבבי-הסינון בגלריה. אסימון-המותג עצמו לא זז. */
.filmstrip:focus-visible,.tablewrap:focus-visible{
  outline:.125rem solid var(--red-2,#FF5258);outline-offset:.1875rem;border-radius:.5rem}
.skip-link{background:var(--red-btn,#E02D32)}

/* 3. שורת-הפעולות העליונה היא ניווט, לא טקסט רץ — יעדי-מגע מתחת ל-24px שם
      אינם פטורים. 1.5rem = 24px בדיוק. */
.topbar .in a,.topbar .in button{min-height:1.5rem;display:inline-flex;align-items:center}


/* ── 29 · הסכמה לדיוור — תיבה שנייה, נפרדת בכוונה ────────────────────────
   התיבה הראשונה (privacy_consent) היא חובה ומאשרת יצירת קשר בעניין הפנייה.
   השנייה (marketing_consent) אינה חובה, אינה מסומנת מראש, ומאשרת דיוור.
   ערבוב שתיהן לתיבה אחת הופך את ההסכמה לחסרת-תוקף לפי סעיף 30א — ולכן הן
   גם נראות שונה: השנייה עדינה יותר, כדי שיהיה ברור שהיא רשות. */
.mf-news{margin-top:-.375rem;opacity:.9}
.mf-news span{font-size:.8125rem;line-height:1.5}
.mf-news input[type=checkbox]{width:auto;min-width:0;flex:0 0 auto;
  margin-top:.1875rem;accent-color:var(--red)}
.mini-form input[type=email]{width:100%}