/* ============ 17 · פוטר ============
   Figma: desktop 295:152 (1280×375) / מובייל 295:165 (390×549).

   פוטר שקט בכוונה: אין בו ניווט, אין בו קריאה לפעולה נוספת. אחרי הטופס
   אין לאן ללכת חוץ מהמסמכים המשפטיים, וזה בדיוק מה שיש כאן.

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

.s17{
  background:var(--navy);
  /* בלי מרווח עליון: הקו של הפוטר הוא הפיקסל הראשון של הסקשן, וכך קו
     החיתוך של טל בתחתית הטופס נוגע בו בדיוק. כל מרווח כאן היה מחזיר
     את הפס הריק שטל תלוי מעליו */
  padding-block:0 80px;
}
.s17__wrap{
  width:100%;max-width:var(--content);margin-inline:auto;
  display:flex;flex-direction:column;gap:40px;
}
.s17__rule{
  height:1px;background:var(--footer-divider);
  border:0;margin:0;
}
.s17__row{
  display:flex;align-items:flex-start;justify-content:space-between;gap:40px;
}
.s17__brand{
  display:flex;flex-direction:column;gap:14px;
}
/* גובה נגזר ולא קבוע: הלוגו הוא 495×206, כלומר יחס 2.403. גובה קבוע של
   56 פיקסל על רוחב 109 מצהיר על יחס 1.95, ולכן הוא יצר קופסה גבוהה
   בכעשרה פיקסלים מהציור עצמו, וה-contain רק מרכז אותו בתוך החלל הריק
   במקום להצמיד אותו לקו של הפוטר */
/* רוחב מפורש על העוגן כדי שלא יימתח לכל רוחב העמודה מ-align-items:stretch
   ויצור אזור לחיצה ענק סביב לוגו קטן */
.s17__logo{display:block;width:109px;}
.s17__brand img{width:100%;height:auto;object-position:right;}
.s17__brand p{
  font-family:var(--f-body);font-weight:400;
  font-size:22px;line-height:32px;
  color:var(--cream-80);
}
.s17__legal{
  display:flex;gap:32px;
  list-style:none;
  align-self:center;
}
.s17__legal a{
  font-family:var(--f-body);font-weight:600;
  font-size:22px;line-height:32px;
  color:var(--cream-80);
  text-decoration:none;
}
.s17__legal a:hover{color:#fff;}
.s17__legal a:focus-visible{outline:2px solid var(--sky);outline-offset:4px;border-radius:4px;}

/* row-reverse כדי שהקרדיט יישב משמאל והזכויות מימין, בדיוק כמו בפיגמה,
   בלי להפוך את סדר הקריאה ב-DOM */
.s17__bottom{
  display:flex;flex-direction:row-reverse;
  align-items:center;justify-content:space-between;gap:40px;
}
.s17__credit{
  font-family:var(--f-body);font-weight:600;
  font-size:22px;line-height:32px;
  color:var(--sky);
  text-decoration:none;
}
.s17__credit:hover{text-decoration:underline;}
.s17__credit:focus-visible{outline:2px solid var(--sky);outline-offset:4px;border-radius:4px;}
.s17__copy{
  font-family:var(--f-body);font-weight:400;
  font-size:22px;line-height:32px;
  color:var(--cream-80);
}

/* ============ mobile ============ */
@media (max-width:1199px){
  .s17{padding-block:0 60px;}
  .s17__wrap{gap:32px;text-align:center;}
  .s17__row{flex-direction:column;align-items:center;gap:28px;}
  .s17__brand{align-items:center;gap:14px;}
  .s17__logo{width:98px;}
  .s17__brand img{width:100%;height:50px;object-position:center;}
  .s17__legal{flex-direction:column;gap:16px;align-items:center;}
  .s17__bottom{flex-direction:column;align-items:center;gap:8px;}
}
