/* ==================================================================
   ELI · 2026-09-22 — בלוק התוכן בפתיחה

   שורה קטנה → כותרת גדולה → תת-כותרת כתומה → משפט → שני כפתורים.
   כל שדה ריק פשוט לא מוצג, ולכן הבלוק יכול להיות הכל
   או כפתור אחד בלבד, בלי לגעת בקוד.
   ================================================================== */

.hero__inner{ max-inline-size:100%; }

/* כשיש בלוק תוכן הוא מוגבל ברוחב — שורה ארוכה על סרטון לא נקראת */
.hero__eyebrow,
.hero__hl,
.hero__sub{
  max-inline-size:22ch;
}
.hero--btn-center .hero__eyebrow,
.hero--btn-center .hero__hl,
.hero--btn-center .hero__sub{
  margin-inline:auto;
}
.hero--btn-left .hero__eyebrow,
.hero--btn-left .hero__hl,
.hero--btn-left .hero__sub{
  margin-inline-start:0;
  margin-inline-end:auto;
}

.hero__eyebrow{
  margin-block:0 clamp(10px, 1.3vw, 16px);
  display:inline-flex;
  align-items:center;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(10px);
          backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.22);
  font-size:.8rem;
  font-weight:var(--w-bold, 700);
  letter-spacing:.03em;
  color:#FFFFFF;
  max-inline-size:none;
}

.hero__hl{
  margin:0;
  font-family:var(--font-display, 'Karantina', sans-serif);
  font-weight:700;
  font-size:clamp(3rem, 8vw, 6.4rem);
  line-height:.9;
  letter-spacing:0;
  color:#FFFFFF;
  text-shadow:0 2px 30px rgba(0,0,0,.45);
  text-wrap:balance;
}

.hero__sub{
  margin:clamp(4px, .6vw, 10px) 0 0;
  font-family:var(--font-display, 'Karantina', sans-serif);
  font-weight:700;
  font-size:clamp(1.9rem, 4.6vw, 3.6rem);
  line-height:.95;
  color:var(--c-orange, #F14B1C);
  text-shadow:0 2px 24px rgba(0,0,0,.4);
}

/* כשיש כותרת, המשפט מפסיק להיות הגיבור וחוזר למשקל רגיל */
.hero__hl ~ .hero__text,
.hero__sub ~ .hero__text{
  font-size:clamp(1rem, 1.35vw, 1.15rem);
  font-weight:var(--w-medium, 500);
  max-inline-size:44ch;
  margin-block-start:clamp(14px, 1.7vw, 22px);
}

.hero__actions{ gap:10px; flex-wrap:wrap; }

/* ---------- הכפתור השני ---------- */

/*
 * clip-path מוחק border רגיל, ולכן המסגרת בנויה מצל פנימי —
 * אותה שיטה של שאר כפתורי המתאר באתר.
 */
.btn-mini--ghost{
  background:rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(8px);
          backdrop-filter:blur(8px);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75);
  color:#FFFFFF;
  padding-inline:18px;
}
.btn-mini--ghost:hover,
.btn-mini--ghost:focus-visible{
  background:#FFFFFF;
  color:var(--c-ink, #0A0A0A);
  box-shadow:inset 0 0 0 1.5px #FFFFFF;
  filter:none;
}

@media (min-width:640px){
  .btn-mini--ghost{ padding-inline:24px; }
}

@media (max-width:560px){
  .hero__actions{ inline-size:100%; }
  .hero__actions .btn-mini{ flex:1 1 auto; justify-content:center; }
  .hero__eyebrow,
  .hero__hl,
  .hero__sub{ max-inline-size:none; }
}