.worlds{background:#111316;color:#f4f6fb;position:relative;--world-travel:0px}
.worlds-shell{padding:100px 0 55px;overflow:hidden}
.worlds-heading{padding:0 var(--pad);display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px}
.worlds-heading .eyebrow{color:#9ea5b2;margin:0 0 18px}
.worlds-heading h2{font-size:clamp(44px,5.7vw,90px);font-weight:450;letter-spacing:-.065em;line-height:1.03;margin:0}
.worlds-heading h2 em{font-family:Georgia,serif;font-weight:400;color:#849dcf}
.worlds-heading>p{font-size:12px;line-height:1.8;color:#a0a7b5;max-width:225px;margin:0 0 5px}
.worlds-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#5e7ebd #262930;outline-offset:-4px}
.worlds-viewport:focus-visible{outline:2px solid #839ed4}
.worlds-track{display:flex;gap:28px;width:max-content;padding:0 var(--pad) 20px}
.world-card{width:min(72vw,1050px);flex:none;margin:0;scroll-snap-align:center}
.world-image{overflow:hidden;border-radius:5px;aspect-ratio:1.93;background:#202329;position:relative}
.world-image img{display:block;width:100%;height:100%;object-fit:cover}
.world-card figcaption{display:flex;justify-content:space-between;gap:24px;align-items:baseline;padding:20px 0 0}
.world-card h3{font-size:clamp(23px,2.4vw,38px);font-weight:450;letter-spacing:-.04em;margin:0}
.world-card figcaption p{margin:0;color:#a8aebb;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.worlds-bottom{margin:22px var(--pad) 0;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:9px;letter-spacing:1px}
.worlds-direction{display:flex;gap:28px;align-items:center;color:#a8aebb}
.worlds-controls{display:flex;align-items:center;gap:12px;font-variant-numeric:tabular-nums}
.worlds-controls button{width:46px;height:46px;border:1px solid #5b6374;border-radius:50%;background:transparent;color:inherit;font-size:22px;cursor:pointer}
.worlds-controls button:hover:not(:disabled){background:#809dd6;color:#111316;border-color:#809dd6}
.worlds-controls button:disabled{opacity:.3;cursor:default}
.worlds-controls span{margin-right:14px;min-width:49px}
.worlds-all{border-bottom:1px solid #5f687a;padding:12px 0;white-space:nowrap;font-size:11px;letter-spacing:0}
.worlds.is-pinned{height:calc(100svh + var(--world-travel))}
.worlds.is-pinned .worlds-shell{position:sticky;top:0;height:100svh;padding-top:86px;padding-bottom:20px;display:flex;flex-direction:column;justify-content:center}
.worlds.is-pinned .worlds-viewport{overflow-x:hidden;scroll-snap-type:none;scrollbar-width:none}
.worlds.is-pinned .world-image{height:clamp(200px,calc(100svh - 440px),590px);aspect-ratio:auto}
.worlds.is-pinned .worlds-heading{margin-bottom:18px}
.worlds.is-pinned .worlds-heading h2{font-size:clamp(44px,5vw,72px)}
.worlds.is-pinned .worlds-heading .eyebrow{margin-bottom:12px}
.worlds.is-pinned figcaption{padding-top:14px}
.worlds.is-pinned h3{font-size:28px}
.worlds.is-pinned .worlds-bottom{margin-top:12px}
@media(max-width:900px){.worlds-shell{padding:75px 0 45px}.worlds-heading{display:block}.worlds-heading>p{max-width:300px;margin:22px 0 0}.world-card{width:84vw}.worlds-track{gap:18px}.world-image{aspect-ratio:1.4}.world-card figcaption{display:block;padding-top:16px}.world-card figcaption p{font-size:9px;margin-top:8px}.worlds-bottom{flex-wrap:wrap;gap:22px}.worlds-direction{display:none}.worlds-controls{gap:9px}.worlds-controls span{margin-right:6px}.worlds-all{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.worlds-viewport{scroll-behavior:auto}}
.worlds-segments{display:flex;gap:6px;width:150px}
.worlds-segments i{flex:1;height:2px;background:#444a56;position:relative;overflow:hidden}
.worlds-segments i:after{content:'';position:absolute;inset:0;background:#809dd6;transform-origin:left;transform:scaleX(0)}
.worlds-segments i[data-state=past]:after{transform:scaleX(1)}
.worlds-segments i[data-state=active]:after{transform:scaleX(var(--clip,0))}
.still-mode .worlds-segments i[data-state=active]:after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.worlds-segments i[data-state=active]:after{transform:scaleX(1)}}
.world-card h3 a{color:inherit;text-decoration:none;border-bottom:1px solid #5f687a}
.world-card h3 a:hover{border-color:#809dd6}
