/* A large central card, smaller previous/next cards, centered pagination only. */
.classic-demo{overflow:hidden;padding:12px 0 0}
.classic-stage{padding:12px 0 26px;touch-action:pan-y pinch-zoom;outline-offset:-2px}
.classic-track{display:grid;width:60%;max-width:820px;margin-inline:auto;isolation:isolate}
.classic-card{grid-area:1/1;min-width:0;min-height:250px;padding:30px 34px;border:1px solid var(--line);border-radius:14px;background:var(--classic-surface,var(--card,var(--bg)));transform:translateX(calc(var(--slot) * 88% + var(--drag-x,0px))) scale(.84);opacity:0;pointer-events:none;z-index:0;transition:transform .65s cubic-bezier(.22,.7,.2,1),opacity .5s;will-change:transform}
.classic-card.is-current{transform:translateX(var(--drag-x,0px)) scale(1);opacity:1;pointer-events:auto;z-index:3;box-shadow:0 10px 30px #00000008}
.classic-stage.is-dragging .classic-card{transition:none;user-select:none}
.classic-card.is-neighbor{opacity:.5;pointer-events:auto;cursor:pointer;z-index:1}
.classic-card .classic-body{grid-template-columns:minmax(110px,.65fr) minmax(0,1.35fr);gap:28px}
.classic-dots{justify-content:center;gap:8px;margin:0 auto}
.classic-dots button{width:32px;min-width:32px;flex:0 0 32px;height:40px}
.classic-dots button:after{width:6px;height:6px}
.classic-dots button[aria-current=true]:after{width:24px;transform:none}

.classic-card-label{display:flex;justify-content:space-between;gap:18px;font-size:11px;color:var(--muted);margin-bottom:23px}
.classic-card-label small{font:inherit;opacity:.65}
.classic-body{display:grid;align-items:center}
.classic-metric>span{display:block;font-family:'Instrument Serif',serif;font-style:italic;font-size:48px;line-height:1.08;letter-spacing:-.035em;color:var(--muted)}
.classic-metric small{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:12px;max-width:27ch}
.classic-insight h3,.classic-insight h4{font-size:19px;line-height:1.4;letter-spacing:-.025em;font-weight:500;margin:0 0 10px}
.classic-insight p{font-size:14px;line-height:1.7;color:var(--muted);margin:0;max-width:65ch}
.classic-dots{display:flex;align-items:center}
.classic-dots button{display:grid;place-items:center;border:0;border-radius:8px;padding:0;background:transparent;color:var(--text);cursor:pointer}
.classic-dots button:after{content:'';border-radius:999px;background:var(--muted);opacity:.35;transition:width .25s,opacity .25s}
.classic-dots button[aria-current=true]:after{opacity:1;background:var(--text)}
.classic-dots button:hover:after{opacity:1}
.classic-dots button:focus-visible,.classic-stage:focus-visible{outline:2px solid var(--text);outline-offset:-2px}

@media(max-width:900px){.classic-track{width:74%}.classic-card{padding:26px}.classic-card .classic-body{grid-template-columns:1fr;gap:22px}}
@media(max-width:600px){.classic-track{width:80%}.classic-card{padding:24px 20px;min-height:380px;transform:translateX(calc(var(--slot) * 90% + var(--drag-x,0px))) scale(.84)}.classic-card.is-current{transform:translateX(var(--drag-x,0px)) scale(1)}.classic-card .classic-insight p{font-size:13px}.classic-card .classic-metric>span{font-size:38px}.classic-stage{padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.classic-card,.classic-dots button:after{transition:none}}

.classic-demo:not([data-classic-ready]) .classic-card{position:relative;transform:none;opacity:1;margin-bottom:16px}
.classic-demo:not([data-classic-ready]) .classic-track{display:block}
.classic-demo:not([data-classic-ready]) .classic-dots{display:none}
