.story { padding: 64px 0 72px; border-top: 1px solid #e6eefb; }
.story-heading { margin-bottom: 36px; }
.story-row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4.5vw, 64px); align-items: center; padding: 28px 0 40px; }
.story-row + .story-row { border-top: 1px solid #e5edf9; padding-top: 40px; }
.story-row.reverse .story-photo { order: 2; }
.story-photo { min-width: 0; padding: 14px; border: 1px solid #dce9fa; border-radius: 22px; background: linear-gradient(135deg, #f0f7ff, #f8fbff); box-shadow: 0 17px 45px rgba(28, 83, 167, .09); }
.story-photo img { width: 100%; border-radius: 12px; }
.story-number { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 12px; color: var(--blue); font-size: 13px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.story-number::before { content: ''; width: 32px; height: 2px; background: var(--blue); }
.story-body h3 { font: 700 clamp(27px, 2.4vw, 36px)/1.25 var(--font-display); letter-spacing: -.01em; margin-bottom: 14px; }
.story-body > p:not(.story-number) { font-size: 16px; line-height: 1.7; color: var(--muted); max-width: 520px; margin-bottom: 14px; }
.story-points { display: grid; gap: 10px; }
.story-points li { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 1.5; color: #1e3358; }
.story-points li::before { content: '✓'; flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e4eeff; color: var(--blue); font-size: 13px; font-weight: 800; }
.story-footer { max-width: 1000px; margin: 12px auto 0; padding: 20px 24px; text-align: center; border: 1px solid #dfebfb; border-radius: 18px; background: linear-gradient(110deg, #edf5ff, #f8fbff); font-size: 19px; font-weight: 700; }
@media (max-width: 800px) { .story { padding: 48px 0 56px; } .story-row { grid-template-columns: 1fr; gap: 20px; padding: 20px 0 28px; } .story-row.reverse .story-photo { order: 0; } .story-footer { font-size: 17px; } }
