/* ============================================================
   CORTEZ — טיפוגרפיה וקומפוזיציה
   נטען מעל cz-home-v8.css. שני הדברים שהבעלים ציין.

   טיפוגרפיה — Heebo הוא פונט עבודה, לא הצהרה. עוברים ל-Rubik 900:
   גאומטרי יותר, רחב יותר, ונוכחות חזקה במיוחד בעברית.
   הסקאלה נפתחת: הפער בין כותרת לגוף היה צר מדי והכול נראה באותו משקל.

   קומפוזיציה — כל סקשן היה באותה תבנית: כותרת למעלה, רשת מתחת.
   עכשיו ראש הסקשן אסימטרי (4/8), האריחים בגבהים שונים,
   והמספר יושב בשוליים כסימן מערכת ולא כאלמנט בזרם.
   ============================================================ */

:root{--disp:"Rubik","Heebo","Noto Sans Hebrew",system-ui,sans-serif}

/* ---------- סקאלה פתוחה ---------- */
.d1{font-family:var(--disp);font-weight:900;font-size:clamp(40px,6.6vw,84px);line-height:.98;letter-spacing:-.005em}
.d2{font-family:var(--disp);font-weight:900;font-size:clamp(32px,4.4vw,58px);line-height:1.02;letter-spacing:-.004em}
.d3{font-family:var(--disp);font-weight:800;font-size:clamp(20px,2vw,27px);line-height:1.2;letter-spacing:0}
.lede{font-size:18px;line-height:1.6;max-width:46ch}
.stp b,.step h3,.hot-txt h3,.mv-c b,.mani-sub b{font-family:var(--disp);font-weight:800}
.step h3{font-size:clamp(21px,2.2vw,30px);line-height:1.18}
.hot-txt h3{font-size:23px}

/* תווית מערכת — קטנה, מרווחת, אחידה */
.idx b{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}

/* ---------- ראש סקשן אסימטרי ---------- */
/* המספר יוצא לשוליים והכותרת מקבלת את כל העמודה */
.shead{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:end;gap:32px;margin-bottom:48px}
.shead > div:first-child{grid-column:1}
.shead > a,.shead > div:last-child:not(:first-child){grid-column:2;justify-self:end;align-self:end}
.shead[style*="center"]{display:block;text-align:center}
.shead .idx{margin-bottom:18px}

/* קו אדום דק מעל כל ראש סקשן — סימן מערכת חוזר */
.s .wrap > .shead::before{content:"";display:block;width:56px;height:3px;background:var(--red);margin-bottom:26px}

/* ---------- אריחים אסימטריים ---------- */
.tiles{grid-template-columns:1.32fr 1fr;align-items:stretch}
.tiles .tile:first-child{min-height:600px}
.tiles .tile:last-child{min-height:600px}
.tile-in{padding:38px}
.tile-in .d3{font-size:clamp(23px,2.4vw,32px)}

/* ---------- צעדים: מספר גדול, לא תווית ---------- */
.stp{padding:34px 30px}
.stp i{font-size:44px;opacity:.9}
.stp b{font-size:21px;margin-top:16px}

/* ---------- רגע מוצר גדול ---------- */
/* הסיפור של MAX 6 — המוצר היה באותו גודל כמו כל שאר התמונות בעמוד.
   עכשיו הוא האלמנט הגדול בעמוד אחרי הגיבור. */
.story{grid-template-columns:1.25fr .75fr;gap:48px}
.story-pin{min-height:620px;padding:40px;background:radial-gradient(58% 58% at 50% 46%,rgba(229,11,5,.14),transparent 70%),#0E0E13}
.story-pin img{max-height:560px}
.story-steps{gap:10px}
.step{padding:26px 28px}

/* ---------- חוקר הנקודות ---------- */
.hot{grid-template-columns:1.45fr .55fr}
.hot-stage{min-height:600px}

/* ---------- פאנל הצבעים ---------- */
.sw-stage{min-height:700px}
.sw-stage img{max-height:620px}
.sw-name b{font-size:clamp(34px,4.4vw,64px)}

/* ---------- הגיבור ---------- */
.hero .d1{max-width:11ch}
.hero .lede{max-width:44ch;font-size:19px}
.hero-in{padding-bottom:64px}

/* ---------- מניפסט ---------- */
.mani-t span{font-family:var(--disp);font-weight:900;font-size:clamp(34px,5.8vw,78px);letter-spacing:-.004em}

/* ---------- מונים ומפרט ---------- */
.trust b{font-size:clamp(34px,4vw,56px)}
.specbar .sv{font-size:clamp(20px,2.1vw,28px)}

@media (max-width:900px){
  .shead{grid-template-columns:1fr;gap:20px;margin-bottom:34px}
  .shead > a,.shead > div:last-child:not(:first-child){grid-column:1;justify-self:start}
  .tiles{grid-template-columns:1fr}
  .tiles .tile:first-child,.tiles .tile:last-child{min-height:380px}
  .story{grid-template-columns:1fr;gap:22px}
  .story-pin{min-height:400px;padding:24px}
  .story-pin img{max-height:330px}
  .hot{grid-template-columns:1fr}
  .hot-stage{min-height:380px}
  .sw-stage{min-height:460px}
  .sw-stage img{max-height:360px}
}
@media (max-width:640px){
  .lede{font-size:16.5px}
  .hero .lede{font-size:17px}
  .tile-in{padding:26px}
  .stp{padding:26px 22px}
  .stp i{font-size:34px}
  .s .wrap > .shead::before{width:44px;margin-bottom:20px}
}