.problems { padding: 64px 0 72px; border-top: 1px solid #e5effb; }
.problem-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 40px auto 0; max-width: 1220px; }
.problem-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #dce8f8; border-radius: 18px; padding: 18px 18px 24px; box-shadow: var(--shadow-sm); }
.card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; padding: 0 4px; }
.num { font: 800 26px var(--font-display); color: var(--blue); background: var(--pale); border-radius: 12px; padding: 4px 14px; }
.micro { font-size: 13px; font-weight: 700; color: #53648a; }
.problem-card img { width: 100%; aspect-ratio: 5 / 3; object-fit: cover; border-radius: 14px; border: 1px solid #deebfb; margin-bottom: 18px; }
.problem-card h3 { font-size: 21px; line-height: 1.35; font-weight: 800; letter-spacing: -.01em; margin-bottom: 10px; }
.problem-card p { font-size: 16px; line-height: 1.65; color: var(--muted); }
.closing { display: flex; align-items: center; justify-content: center; gap: 18px; max-width: 1220px; margin: 28px auto 0; padding: 24px 30px; background: #fff; border: 1px solid #dce8fa; border-left: 4px solid var(--blue); border-radius: 14px; box-shadow: var(--shadow-sm); font: 700 clamp(19px, 2vw, 26px)/1.5 var(--font-display); text-align: center; }
.closing strong { color: var(--blue); }
.spark { font-size: 28px; color: var(--blue); }
@media (max-width: 900px) { .problem-cards { grid-template-columns: 1fr; max-width: 560px; } }
@media (max-width: 650px) { .problems { padding: 48px 0 52px; } .closing { padding: 20px; } .spark { display: none; } }
