/* ═══════════════════════════════════════════════════════════════════
   About page

   Long-form copy, so the measure is capped near 65 characters.
   ═══════════════════════════════════════════════════════════════════ */

/* ── About page ─────────────────────────────────────────────────── */
.about-hero{background:linear-gradient(170deg,var(--surface) 0%,var(--surface) 50%,var(--warm-tint) 100%);
  color:var(--ink-2);padding-block:var(--sp-10);border-bottom:1px solid var(--line)}
.about-hero h1{color:var(--ink);font-size:2rem;font-weight:900;letter-spacing:-.02em}
.about-hero p{color:var(--ink-2);font-size:1.0625rem;max-width:60ch;
  margin-top:var(--sp-3)}
.about-body{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-6);
  padding-block:var(--sp-8)}
.about-body h2{font-size:1.375rem;margin-bottom:var(--sp-3)}
.about-body p{font-size:1.0625rem;line-height:1.75;margin-bottom:var(--sp-3);max-width:68ch}
.about-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3)}
.fact{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:var(--sp-4);min-width:0}
.fact .ico{width:30px;height:30px;color:var(--brand-ink);margin-bottom:var(--sp-2)}
.fact b{display:block;font-size:1.0625rem;color:var(--ink);font-weight:800}
.fact span{font-size:.9375rem;color:var(--ink-3)}


@media (min-width:480px){ .about-facts{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:640px){ .about-body{grid-template-columns:minmax(0,1fr)} }
@media (min-width:768px){
  .about-hero h1{font-size:2.5rem}
  .about-body{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-10)}
}