/* ============ 13 · רגע לפני - זה לא מתאים לכולן ============
   Figma: desktop 279:269 (1280×662) / מובייל 279:295 (390×992).

   שני כרטיסים זה מול זה. סדר ה-DOM הוא ״זה בשבילך״ ואז ״זה לא בשבילך״,
   כי ב-RTL הראשון יושב מימין - וזה גם בדיוק הסדר במובייל. אותה קריאה
   בשני המסכים בלי שכפול מרקאפ.

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

.s13{
  background:var(--cream);
  padding-block:80px;
}
.s13__wrap{
  width:100%;max-width:var(--content);margin-inline:auto;
}
.s13__title{
  font-family:var(--f-head);font-weight:800;
  font-size:52px;line-height:62px;
  color:var(--navy);
  letter-spacing:-.015em;
  text-align:center;
}
.s13__cards{
  margin-top:56px;
  display:grid;grid-template-columns:1fr 1fr;gap:32px;
  align-items:stretch;
}
.s13__card{
  border-radius:var(--r-card);
  padding:48px 40px;
  display:flex;flex-direction:column;gap:28px;
}
.s13__card h3{
  font-family:var(--f-head);font-weight:800;
  font-size:34px;line-height:44px;
  letter-spacing:-.01em;
}
.s13__card ul{list-style:none;display:flex;flex-direction:column;gap:16px;}
.s13__card li{
  display:flex;align-items:flex-start;gap:16px;
  font-family:var(--f-body);font-weight:400;
  font-size:26px;line-height:40px;
  color:var(--ink);
}
/* הנקודה מיושרת לגובה השורה הראשונה, לא למרכז הפסקה */
.s13__card li::before{
  content:"";
  flex:0 0 14px;width:14px;height:14px;border-radius:999px;
  margin-top:13px;
}

.s13__card--yes{background:var(--sky-tint);}
.s13__card--yes h3{color:var(--sky-deep);}
.s13__card--yes li::before{background:var(--sky-deep);}

.s13__card--no{
  background:var(--red-tint);
  box-shadow:inset 0 0 0 1px var(--red-line);
}
.s13__card--no h3{color:var(--red);}
.s13__card--no li::before{background:var(--red);}

/* ============ mobile ============ */
@media (max-width:1199px){
  .s13{padding-block:60px;}
  .s13__title{font-size:36px;line-height:44px;}
  .s13__cards{
    margin-top:32px;
    display:flex;flex-direction:column;gap:16px;
    align-items:stretch;
  }
  .s13__card{padding:28px 24px;gap:20px;}
  .s13__card h3{font-size:28px;line-height:36px;}
  .s13__card li{font-size:24px;line-height:36px;gap:16px;}
  .s13__card li::before{margin-top:11px;}
}
