/* Fixed grid with independent text fades; every variant shares the same space. */
.solved { padding-top: 20px; border-top: 1px solid var(--line); }
.solved-heading { margin-bottom: 32px; }
.solved-heading h2 { font-size: clamp(42px,4.6vw,68px); line-height: 1.04; letter-spacing: -.045em; }
.solved-collage { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.solved-frame { min-width: 0; padding: 24px; border: 1px solid var(--line); background: #f8f8f3; }
.solved-category { display: block; margin-bottom: 15px; color: var(--accent); font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; }
.solved-copy h3 { margin-bottom: 12px; font-size: 26px; font-weight: 500; line-height: 1.12; letter-spacing: -.035em; text-wrap: pretty; }
.solved-copy p { color: var(--muted); font-size: 15px; line-height: 1.5; }
@media (max-width: 1100px) { .solved-collage { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) { .solved-collage { grid-template-columns: 1fr; gap: 16px; } }

.solved-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 24px; }
.solved-pause { min-width: 44px; min-height: 44px; padding: 10px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; }
.solved-pause:is(:hover,:focus-visible) { color: var(--ink); border-color: var(--ink); }
.solved-pause[hidden] { display: none; }
.solved-copy { display: grid; transition: opacity 330ms ease-in-out; }
.solved-variant { grid-area: 1 / 1; align-self: start; visibility: hidden; }
.solved-variant.is-active { visibility: visible; }
.solved-frame.is-changing .solved-copy { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .solved-copy { transition: none; } }