/* ============================================================
   Why ezee page - Figma frame 6187:2896
   "Why ezee — High Fidelity v1 (Desktop 1440)"
   ============================================================ */

/* ---------- 01 Hero (6187:2938) ---------- */
.why-hero{padding-top:128px} /* Figma Spacing/10 (128) - not in the shared scale */
.why-hero__head{max-width:920px}

/* ---------- 02 Principles (6188:2942) ---------- */
.why-principles{padding-top:var(--space-8)}
.why-row{display:flex;align-items:flex-start;gap:var(--space-8);padding-block:var(--space-6);border-top:1px solid var(--border)}
.why-row__num{flex:none;width:72px;color:var(--brand)}
.why-row__title{flex:none;width:330px}
.why-row__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-4)}

/* ============================================================
   Responsive - same content, re-flowed
   ============================================================ */
@media (max-width:1100px){
  .why-row{flex-wrap:wrap;column-gap:var(--space-5);row-gap:var(--space-3)}
  .why-row__title{flex:1;width:auto;align-self:center}
  .why-row__body{flex:1 1 100%;padding-left:calc(72px + var(--space-5))}
}

@media (max-width:640px){
  .why-hero{padding-top:var(--space-8)}
  .why-row{flex-direction:column;gap:var(--space-2)}
  .why-row__num,.why-row__title{width:auto;align-self:flex-start}
  .why-row__body{flex:none;padding-left:0;margin-top:var(--space-2)}
}