/* ==================================================================
   ELI · 2026-09-22 (סבב רביעי)

   1. סרטון האווירה — בלי נקודות, וגדול על כל הסקשן
   2. הפתיחה — מסך מלא, כפתור גדול יותר במרכז, בלי נדנוד החצים
   3. אריחי הקטגוריות בנייד — רווח קטן ביניהם
   ================================================================== */


/* ==================================================================
   1. סרטון האווירה
   ==================================================================

   הנקודות ירדו — הרצף ממשיך להתנגן לבד מפריט לפריט,
   רק בלי השורה שמרמזת שצריך ללחוץ עליהן.

   המסגרת היתה 16:9 על כל הרוחב, ולכן במסך רחב היא יצאה
   נמוכה. עכשיו הגובה נמדד מול גובה המסך — הסרטון תופס
   כמעט את כל החלון ונוכח בהתאם. */

.bx-atmo__dots{ display:none; }

.bx-atmo{ padding-block:0; }

.bx-atmo__frame{
  inline-size:100%;
  max-inline-size:none;
  margin-inline:0;
  aspect-ratio:auto;
  block-size:clamp(460px, 82svh, 940px);
  clip-path:none;
  border-radius:0;
}

.bx-atmo__item,
.bx-atmo__video{
  inline-size:100%;
  block-size:100%;
}

@media (max-width:860px){
  .bx-atmo__frame{ block-size:clamp(360px, 68svh, 660px); }
}


/* ==================================================================
   2. הפתיחה
   ==================================================================

   קודם הסרטון נעצר 26px לפני תחתית המסך (--bx-peek), כדי
   להציץ את הסקשן הבא. הצצה הורדה — הפתיחה מגיעה עד
   קצה המסך בדיוק. svh ולא vh כדי ששורת הכתובת בנייד
   לא תחתוך את התחתית. */

.hero{
  min-height:calc(100svh - var(--head-actual, 0px));
}

/* הכפתור עולה למרכז המסך במקום לשבת בתחתית */
.hero--has-text{ align-items:center; }

.hero--has-text .hero__inner,
.hero--no-text .hero__inner{
  align-self:center;
  padding-block-end:0;
}

/* ---------- הכפתור ---------- */

.btn-mini{
  block-size:38px;
  padding-inline-start:16px;
  padding-inline-end:4px;
  gap:7px;
  font-size:13px;
  letter-spacing:.01em;
  clip-path:polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
}

.btn-mini__cube{
  inline-size:30px;
  block-size:30px;
  clip-path:polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px);
}

.btn-mini__cube svg{
  inline-size:15px;
  block-size:15px;
  animation:none;
}

/* גם בריחוף אין נדנוד — רק הסיבוב העדין של הקובייה */
.btn-mini:hover .btn-mini__cube svg,
.btn-mini:focus-visible .btn-mini__cube svg{ animation:none; }

@media (min-width:640px){
  .btn-mini{
    block-size:46px;
    padding-inline-start:22px;
    padding-inline-end:5px;
    gap:9px;
    font-size:15px;
  }
  .btn-mini__cube{ inline-size:36px; block-size:36px; }
  .btn-mini__cube svg{ inline-size:17px; block-size:17px; }
}


/* ==================================================================
   3. אריחי הקטגוריות בנייד — רווח קטן
   ==================================================================

   האריחים נשארים על כל רוחב המסך, רק נשימה קטנה ביניהם.
   קו השיער שהפריד ביניהם מיותר עכשיו — הרווח עושה את העבודה. */

@media (max-width:820px){

  .cat__grid--mob{
    --cat-gap:10px;
    gap:10px;
  }

  .cat__grid--mob .cat__tile + .cat__tile{ box-shadow:none; }
}