.why { margin-top: clamp(96px, 14vh, 160px); }
.why-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 40px 72px; align-items: end; }
.why-text { display: grid; gap: 20px; }
.why-text p { margin: 0; font-size: 18px; color: var(--ink-2); max-width: 60ch; }
.why-text p.big { font: 500 clamp(20px, 1.8vw, 25px)/1.45 var(--body); letter-spacing: -.012em; color: var(--ink); max-width: 40ch; }
.author { margin: 0; padding: 28px 30px; border-radius: 18px; background: var(--bg-2); border: 1px solid var(--line); display: grid; gap: 20px; }
.author blockquote { margin: 0; font-size: 17.5px; line-height: 1.6; color: var(--ink-2); }
.author figcaption { display: flex; align-items: center; gap: 14px; }
.author img { border-radius: 50%; }
.author figcaption > span { display: grid; line-height: 1.3; }
.author b { font-weight: 650; }
.author figcaption span span { color: var(--ink-3); font-size: 15px; }

.slots { margin-top: 72px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(0, 1.7fr); border-top: 1px solid var(--line); }
.stat { display: flex; flex-direction: column; justify-content: flex-end; padding: 28px 24px 0; border-left: 1px solid var(--line); min-width: 0; }
.stat:first-child { padding-left: 0; border-left: 0; }
.num { font: 700 clamp(34px, 3.6vw, 56px)/1.1 var(--display); letter-spacing: -.035em; font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; }
.stat:last-child .num { font-size: clamp(28px, 3vw, 48px); }
.stat p { margin: 8px 0 0; font-size: 15px; color: var(--ink-3); line-height: 1.3; }

.rs { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .06em; }
.rs > span { display: inline-block; transition: transform .9s cubic-bezier(.16, 1, .3, 1), opacity .9s; transition-delay: calc(var(--s) * 80ms); }
.slots:not(.in) .rs > span { transform: translateY(100%); opacity: 0; transition: none; }

@media (max-width: 1000px) { .slots { grid-template-columns: repeat(3, minmax(0, 1fr)); } .stat:nth-child(3n + 1) { padding-left: 0; border-left: 0; } .stat:nth-child(n + 4) { border-top: 1px solid var(--line); margin-top: 24px; } }
@media (max-width: 860px) { .why-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .slots { grid-template-columns: repeat(2, minmax(0, 1fr)); } .stat { padding: 20px 14px 0; } .stat:nth-child(3n + 1) { padding-left: 14px; border-left: 1px solid var(--line); } .stat:nth-child(2n + 1) { padding-left: 0; border-left: 0; } .stat:nth-child(n + 3) { border-top: 1px solid var(--line); margin-top: 20px; } .stat:nth-child(n + 4) { margin-top: 20px; } }
