/* ==========================================================================
   נץ — Hero של דף הבית · מפרט 2.2, רמה 3 · בלוק ג׳
   --------------------------------------------------------------------------
   מקור: netz-hero-reference.html (הקוד שממנו צולמה אופציה 12.1). כל ערך
   מועתק כמו שהוא. הצבעים, הצללים והגופנים דרך משתני --nz- שב-tokens.css,
   באותם ערכים בדיוק. ערך בלי טוקן (שקיפויות באיור, גרדיאנטים, קואורדינטות,
   המטריצה) נשאר כאן בלבד.
   כל בורר תחת .nz-hero — כך שום כלל לא דולף להדר, לסרגל התחתון או לרכיבים
   אחרים באתר (תלות 3, 3.11: .nz-btn משותף עם header.css).
   נכסים: /assets/hero/netz-hero-map.svg · /assets/hero/netz-hero-mascot.webp
   ========================================================================== */

/* ===== 3.1 · המכל ===== */
.nz-hero{position:relative;overflow:hidden;background:var(--nz-page-bg);padding-block:32px}
.nz-hero .nz-hero__inner{position:relative;box-sizing:border-box;max-width:1248px;margin-inline:auto;padding-inline:24px;
  display:grid;grid-template-columns:minmax(0,40fr) minmax(0,60fr);gap:48px;align-items:center}

/* ===== 3.2 · עמודת הטקסט ===== */
.nz-hero .nz-hero__text{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start}
.nz-hero .nz-badge{margin:0 0 20px;display:inline-flex;align-items:center;gap:12px;padding:8px 16px;border-radius:999px;
  background:var(--nz-navy);color:var(--nz-white);font-weight:700;font-size:16px;line-height:1.3}
.nz-hero .nz-badge__item{display:inline-flex;align-items:center;gap:6px}
.nz-hero .nz-badge__item svg{width:18px;height:18px;flex:none}
.nz-hero .nz-badge__dot{width:4px;height:4px;border-radius:999px;background:var(--nz-sky-bg);flex:none}
.nz-hero .nz-hero__title{margin:0;font-family:var(--nz-font-heading);font-weight:900;font-size:52px;line-height:1.1;letter-spacing:-0.02em;
  color:var(--nz-navy);text-wrap:balance}
.nz-hero .nz-hero__title em{font-style:normal;color:var(--nz-orange-text)}
.nz-hero .nz-hero__sub{margin:8px 0 0;font-weight:700;font-size:18px;line-height:1.4;color:var(--nz-link-blue)}
.nz-hero .nz-hero__lead{margin:12px 0 0;font-size:16px;line-height:1.65;color:var(--nz-text-secondary);max-width:52ch}

/* ===== 3.3 · הכפתורים — רק בתוך ה-Hero ===== */
.nz-hero .nz-hero__ctas{display:flex;gap:12px;margin-top:24px;width:100%}
.nz-hero .nz-btn{flex:1 1 0;min-width:0;box-sizing:border-box;min-height:48px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:var(--nz-radius-btn);font-family:var(--nz-font-body);font-weight:700;font-size:16px;line-height:1;text-decoration:none;
  cursor:pointer;transition:background 150ms ease}
.nz-hero .nz-btn--primary{padding:14px 28px;border:0;background:var(--nz-orange-btn);color:var(--nz-text-primary)}
.nz-hero .nz-btn--primary:hover{background:var(--nz-orange-btn-hover)}
.nz-hero .nz-btn--secondary{padding:12.5px 26.5px;border:1.5px solid var(--nz-navy);background:transparent;color:var(--nz-navy)}
.nz-hero .nz-btn--secondary:hover{background:var(--nz-sky-bg)}
.nz-hero .nz-hero__trust{margin:16px 0 0;font-size:14px;line-height:1.55;color:var(--nz-text-secondary)}
.nz-hero :focus-visible{outline:2px solid var(--nz-navy);outline-offset:2px}

/* ===== 3.4 · הבמה (691×616) ===== */
.nz-hero .nz-stage{position:relative;z-index:1;width:691px;height:616px;justify-self:start}
/* העטיפה של המפה, המסלול והנץ (11/11/2026): בגודל הבמה בדיוק, ולכן כל קואורדינטה בפנים כמו קודם */
.nz-hero .nz-art{position:absolute;inset:0}
.nz-hero .nz-map{position:absolute;left:-1000px;top:-32px;width:3200px;height:680px;max-width:none;display:block;pointer-events:none}
.nz-hero .nz-fade{position:absolute;left:-1000px;top:-32px;width:3200px;height:680px;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(245,247,251,0) 1513.6px, #F5F7FB 1758.4px),
    linear-gradient(0deg, #F5F7FB 0, rgba(245,247,251,0) 56px),
    linear-gradient(180deg, #F5F7FB 0, rgba(245,247,251,0) 32px)}

/* ===== 3.5 · המסלול, הערים והרכב ===== */
.nz-hero .nz-routes{position:absolute;left:0;top:0;overflow:visible}
.nz-hero .nz-route{fill:none;stroke-linecap:round;transition:opacity 0ms}
.nz-hero .nz-route--base{stroke:rgba(15,46,99,.35);stroke-width:3;stroke-dasharray:2 6}
.nz-hero .nz-route--progress{stroke:var(--nz-link-blue);stroke-width:3.5}
.nz-hero .nz-route.is-anim{transition:stroke-dashoffset 900ms ease}
.nz-hero .nz-dot--p{fill:var(--nz-navy);stroke:var(--nz-white);stroke-width:2}
.nz-hero .nz-dot--s{fill:var(--nz-text-secondary);stroke:var(--nz-white);stroke-width:1.5}
.nz-hero .nz-city{position:absolute;white-space:nowrap;line-height:1.2;font-family:var(--nz-font-body)}
.nz-hero .nz-city--p{font-weight:700;font-size:12px;color:var(--nz-navy)}
.nz-hero .nz-city--s{font-weight:600;font-size:11px;color:var(--nz-text-secondary)}
.nz-hero .nz-city--sea{text-shadow:0 0 2px var(--nz-sky-bg),0 0 2px var(--nz-sky-bg),0 0 3px var(--nz-sky-bg),0 0 4px var(--nz-sky-bg)}
.nz-hero .nz-city--land{text-shadow:0 0 2px var(--nz-white),0 0 2px var(--nz-white),0 0 3px var(--nz-white),0 0 4px var(--nz-white)}
.nz-hero .nz-lake{position:absolute;white-space:nowrap;line-height:1.2;font-weight:600;font-size:12px;color:var(--nz-link-blue);
  text-shadow:0 0 2px var(--nz-white),0 0 3px var(--nz-white),0 0 4px var(--nz-white)}
.nz-hero .nz-van{position:absolute;left:0;top:0;width:34px;height:34px;box-sizing:border-box;border-radius:999px;background:var(--nz-white);
  border:1.5px solid var(--nz-navy);box-shadow:var(--nz-shadow-md),var(--nz-shadow-sm);display:flex;align-items:center;justify-content:center;
  offset-rotate:0deg;offset-anchor:center;offset-distance:0%}
.nz-hero .nz-van.is-anim{transition:offset-distance 900ms ease}
.nz-hero .nz-van svg{display:block;width:24px;height:15px}
.nz-hero .nz-ring{position:absolute;width:22px;height:22px;box-sizing:border-box;border-radius:999px;border:2px solid var(--nz-link-blue)}
@keyframes nzRing{0%{transform:scale(1);opacity:.8}100%{transform:scale(2.6);opacity:0}}
.nz-hero .nz-ring--pulse{animation:nzRing 1.8s ease-out infinite}
.nz-hero .nz-stage.is-paused .nz-ring--pulse{animation:none;opacity:0}

/* ===== 3.7 · הדמות עם הטלפון — מרחב המקור 864×1184, מוקטן ל-0.35 ===== */
.nz-hero .nz-mascot{position:absolute;left:-139px;bottom:-49px;width:864px;height:1184px;transform:scale(.35);transform-origin:0 100%;pointer-events:none}
.nz-hero .nz-mascot__img{position:absolute;left:0;top:0;width:864px;height:1184px;display:block;max-width:none}
.nz-hero .nz-phone{position:absolute;left:0;top:0;width:130px;height:268px;transform-origin:0 0;
  transform:matrix3d(0.85297608, 0.0521059, 0, -0.00020010212, -0.1615122, 1.0195847, 0, 6.91558e-05, 0, 0, 1, 0, 583.59595, 268.3299, 0, 1)}
.nz-hero .nz-phone__bar{position:absolute;left:0;right:0;top:24px;height:40px;background:var(--nz-navy);display:flex;align-items:center;justify-content:center;
  color:var(--nz-white);font-family:var(--nz-font-heading);font-weight:900;font-size:24px;line-height:1}
.nz-hero .nz-phone__icon{position:absolute;left:29px;top:84px;width:72px;height:72px;border-radius:999px;background:var(--nz-sky-bg);display:flex;align-items:center;justify-content:center}
.nz-hero .nz-phone__icon svg{display:block}
.nz-hero .nz-phone__word{position:absolute;left:0;right:0;top:168px;text-align:center;font-family:var(--nz-font-heading);font-weight:900;font-size:30px;line-height:1.1;color:var(--nz-navy)}
.nz-hero .nz-phone__segs{position:absolute;left:16px;right:16px;top:214px;display:flex;gap:6px}
.nz-hero .nz-phone__seg{flex:1 1 0;height:8px;border-radius:4px;background:var(--nz-border);transition:background 300ms ease}
.nz-hero .nz-phone__seg.is-done{background:var(--nz-link-blue)}
.nz-hero .nz-phone__seg.is-current{background:rgba(26,87,194,.4)}
.nz-hero .nz-phone__home{position:absolute;left:45px;bottom:9px;width:40px;height:4px;border-radius:2px;background:var(--nz-text-primary)}

/* ===== 3.6 · כרטיס ההדמיה ===== */
.nz-hero .nz-card{position:absolute;top:50%;right:20px;transform:translateY(-50%);width:320px;box-sizing:border-box;padding:18px;background:var(--nz-white);
  border:1px solid var(--nz-border);border-radius:16px;box-shadow:var(--nz-shadow-md),var(--nz-shadow-sm);display:flex;flex-direction:column;z-index:2}
.nz-hero .nz-toggle{display:flex;gap:4px;padding:4px;border-radius:8px;background:var(--nz-page-bg)}
.nz-hero .nz-toggle button{flex:1 1 0;min-height:48px;border-radius:8px;font-family:var(--nz-font-body);font-weight:600;font-size:15px;cursor:pointer;
  padding:0 6px;white-space:nowrap;background:transparent;color:var(--nz-text-secondary);border:1px solid transparent}
.nz-hero .nz-toggle button[aria-pressed="true"]{background:var(--nz-white);color:var(--nz-navy);border-color:var(--nz-border);box-shadow:var(--nz-shadow-sm)}
.nz-hero .nz-card__meta{margin:8px 0 0;font-weight:600;font-size:12px;line-height:1.3;color:var(--nz-text-secondary)}
.nz-hero .nz-steps{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.nz-hero .nz-step{display:flex;align-items:center;gap:10px;height:46px;box-sizing:border-box;padding:0 12px;border-radius:8px;border:1px solid var(--nz-border);
  background:var(--nz-white);transition:border-color 300ms ease}
.nz-hero .nz-step.is-active{border-color:var(--nz-link-blue)}
.nz-hero .nz-step__icon{width:20px;height:20px;flex:none;box-sizing:border-box;border-radius:999px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--nz-text-secondary)}
.nz-hero .nz-step.is-done .nz-step__icon{background:var(--nz-navy);border:0}
.nz-hero .nz-step.is-done .nz-step__icon::after{content:"";width:10px;height:10px;background:no-repeat center/10px 10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.nz-hero .nz-step.is-active .nz-step__icon{border:2px solid var(--nz-link-blue)}
.nz-hero .nz-step.is-active .nz-step__icon::after{content:"";width:8px;height:8px;border-radius:999px;background:var(--nz-link-blue)}
.nz-hero .nz-step__label{font-weight:600;font-size:16px;color:var(--nz-text-primary)}
.nz-hero .nz-step__pill{margin-right:auto;padding:3px 11px;border-radius:999px;font-weight:700;font-size:13px;line-height:1.3;background:var(--nz-page-bg);color:var(--nz-text-secondary)}
.nz-hero .nz-step.is-done .nz-step__pill{background:var(--nz-sky-bg);color:var(--nz-navy)}
.nz-hero .nz-step.is-active .nz-step__pill{background:var(--nz-white);color:var(--nz-link-blue);box-shadow:inset 0 0 0 1px var(--nz-link-blue)}

/* כפתור העצירה (WCAG 2.2.2) */
.nz-hero .nz-pause{position:absolute;left:16px;top:16px;z-index:3;width:44px;height:44px;border-radius:999px;border:1px solid var(--nz-border);background:var(--nz-white);
  box-shadow:var(--nz-shadow-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.nz-hero .nz-pause:hover{background:var(--nz-page-bg)}
.nz-hero .nz-pause svg{width:16px;height:16px;fill:var(--nz-navy)}
.nz-hero .nz-pause .i-play{display:none}
.nz-hero .nz-stage.is-paused .nz-pause .i-play{display:block}
.nz-hero .nz-stage.is-paused .nz-pause .i-pause{display:none}

/* ===== 3.9 · מתחת ל-1280px: המפה, המסלול והנץ מוקטנים מעל הכרטיס (ניר 11/11/2026; עד אז הוסתרו) =====
   החלק של הבמה שבו הם נמצאים: x מ-139- (הנץ) עד 341 (הכנרת), y מ-0 (חיפה) עד 616 — 480×616. העטיפה חותכת אותו,
   כל רכיב בפנים זז 139 ימינה (translate, בנוסף ל-transform שלו), והכול מוקטן ל---nz-art-s. ה-margin מחזיר
   לפריסה את הגודל המוקטן, כך שאין גלילה לצדדים. הקצוות נמוגים לרקע (mask) */
@media (max-width:1279px){
  .nz-hero{padding-block:48px}
  .nz-hero .nz-hero__inner{grid-template-columns:minmax(0,1fr) 320px}
  .nz-hero .nz-stage{--nz-art-s:.62;width:auto;height:auto;justify-self:stretch;display:flex;flex-direction:column;align-items:center;gap:12px}
  .nz-hero .nz-art{position:relative;inset:auto;flex:none;width:480px;height:616px;overflow:hidden;
    transform:scale(var(--nz-art-s));transform-origin:50% 0;
    margin-block-end:calc(616px * (var(--nz-art-s) - 1));margin-inline:calc(240px * (var(--nz-art-s) - 1));
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%);
            mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%)}
  .nz-hero .nz-art > *{translate:139px 0}
  .nz-hero .nz-card{position:relative;z-index:1;transform:none;top:auto;right:auto;width:100%}
  .nz-hero .nz-pause{position:static;align-self:flex-start}
}
@media (max-width:1023px){
  .nz-hero .nz-hero__inner{grid-template-columns:minmax(0,1fr);gap:32px}
  .nz-hero .nz-hero__title{font-size:32px}
  .nz-hero .nz-hero__ctas{flex-direction:column}
  .nz-hero .nz-btn{flex:none;width:100%}
  .nz-hero .nz-stage{max-width:420px}
}
@media (max-width:767px){
  .nz-hero .nz-hero__inner{padding-inline:16px}
  .nz-hero .nz-badge{font-size:14px;gap:10px;padding:8px 14px}
  .nz-hero .nz-badge__item svg{width:16px;height:16px}
}
@media (prefers-reduced-motion:reduce){
  .nz-hero *,.nz-hero *::before,.nz-hero *::after{transition-duration:.01ms !important;animation:none !important}
  .nz-hero .nz-ring--pulse{opacity:0}
}

/* ===== התאמה לפרויקט — לא מקובץ הייחוס =====
   בדף הבית נטענים כללים כלליים ישנים (box-sizing לכל רכיב, גובה שורה ופונט של
   body, כפתורים שיורשים פונט, ו-.nz-btn של header.css). הכללים כאן רק מחזירים
   ל-Hero את הערך שיש לו בקובץ הייחוס, ולא מוסיפים שום ערך חדש. נמדד מול
   קובץ הייחוס ב-1440 / 1280 / 1100 / 375. */
.nz-hero{font-family:var(--nz-font-body);line-height:normal;
  -webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-feature-settings:normal}
.nz-hero,.nz-hero *,.nz-hero *::before,.nz-hero *::after{box-sizing:revert}
.nz-hero button{font-family:revert}
.nz-hero svg{max-width:revert}
.nz-hero .nz-btn{text-align:start;white-space:normal}
@media (prefers-reduced-motion:reduce){
  .nz-hero{transition-duration:0s !important}
}
