.wonders-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center;padding:25px 0 30px}
.wonders-heading .world-headline{font-size:clamp(38px,10.5cqi,68px);margin-bottom:0}
.wonders-intro .lede{font-size:21px;margin:0 0 12px;max-width:430px}
.wonders-intro p:not(.lede){font-size:15px;color:var(--muted);max-width:460px;line-height:1.7;margin:0}
.wonder-tally{display:flex;gap:30px;margin-top:20px;font:10px/1.4 Plex,monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.wonder-tally span{display:flex;align-items:center;gap:9px}
.wonder-tally strong{font:500 29px/1 Hanken,sans-serif;letter-spacing:-.04em;color:var(--accent)}
.wonder-tally span:last-child strong{color:var(--gold)}
.wonder-experience{position:relative;border:1px solid #83d9ea2d;border-radius:12px;background:linear-gradient(150deg,#14344746,#081824a6);overflow:hidden;margin-bottom:50px}
.wonder-stage{position:relative;height:clamp(410px,46vw,635px);container-type:size;perspective:1500px;isolation:isolate;overflow:hidden;touch-action:pan-y;--spread:clamp(195px,24vw,340px);--look-x:0deg;--look-y:0deg;outline-offset:-5px}
.wonder-stage:focus-visible{outline:2px solid var(--accent)}
.wonder-aura{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,#2094a333,transparent 61%),radial-gradient(ellipse at 20% 15%,#467ba326,transparent 36%);pointer-events:none}
.wonder-orbits{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#90dce543;stroke-width:.65;pointer-events:none;filter:drop-shadow(0 0 6px #8ee9f23a)}
.wonder-orbits ellipse:nth-child(2){stroke:#e5bf7c30;stroke-dasharray:2 9}
.wonder-orbits path{stroke:#70c9e324;stroke-width:.6}
.wonder-depth{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--look-x)) rotateY(var(--look-y));pointer-events:none}
.wonder-pane{position:absolute;top:48%;left:50%;width:min(60%,680px);max-width:calc((100cqh - 115px)*1.28);margin:0;background:#0b2030;border:1px solid #8cddeb80;border-radius:5px;box-shadow:0 12px 45px #0008,0 0 0 5px #78d6e710;transform-style:preserve-3d;pointer-events:auto;transition:transform .85s cubic-bezier(.22,.7,.16,1),opacity .65s,border-color .65s;will-change:transform;backface-visibility:hidden}
.wonder-pane:before,.wonder-pane:after{content:'';position:absolute;width:35px;height:35px;pointer-events:none;z-index:2;border-color:var(--accent);border-style:solid}
.wonder-pane:before{left:-6px;top:-6px;border-width:2px 0 0 2px}
.wonder-pane:after{right:-6px;bottom:-6px;border-width:0 2px 2px 0}
.wonder-pane[data-slot="0"]{transform:translate(-50%,-50%) translateZ(60px) rotateY(-1deg);opacity:1;border-color:#b2eeed;box-shadow:0 25px 55px #0007,0 0 45px #80dbea20,0 0 0 5px #80dbea10}
.wonder-pane[data-slot="1"]{transform:translate(calc(-50% + var(--spread)),calc(-50% - 8px)) translateZ(-170px) rotateY(-37deg) scale(.78);opacity:.83}
.wonder-pane[data-slot="-1"]{transform:translate(calc(-50% - var(--spread)),calc(-50% - 8px)) translateZ(-170px) rotateY(37deg) scale(.78);opacity:.83}
.wonder-pane[data-slot="2"]{transform:translate(calc(-50% + var(--spread)*1.66),calc(-50% - 22px)) translateZ(-330px) rotateY(-47deg) scale(.58);opacity:.6}
.wonder-pane[data-slot="-2"]{transform:translate(calc(-50% - var(--spread)*1.66),calc(-50% - 22px)) translateZ(-330px) rotateY(47deg) scale(.58);opacity:.6}
.wonder-image-button{width:100%;padding:0;border:0;display:block;line-height:0;background:#06121e;cursor:pointer;border-radius:4px 4px 0 0;overflow:hidden}
.wonder-image-button img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;pointer-events:none;border-radius:0}
.wonder-image-button:focus-visible{outline:3px solid #e5bf7c;outline-offset:-4px}
.wonder-pane figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 20px;min-height:62px;background:linear-gradient(110deg,#122f40,#0b2030);line-height:1.2}
.wonder-pane figcaption span{font:8px/1.4 Plex,monospace;letter-spacing:.1em;color:#92d5de;text-transform:uppercase;white-space:nowrap}
.wonder-pane figcaption strong{font:500 19px/1.2 Hanken,sans-serif;color:var(--ink);letter-spacing:-.02em;text-wrap:balance;text-align:right}
.wonder-stage-label{position:absolute;left:25px;right:25px;bottom:18px;display:flex;justify-content:space-between;align-items:center;font:8px/1.4 Plex,monospace;letter-spacing:.09em;color:#86a9ba;pointer-events:none}
.wonder-stage-label .tag{font-size:8px}
.wonder-controls{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:24px 30px;border-top:1px solid #85ddea26;background:#0b2130a6}
.wonder-selected h2{font-size:clamp(27px,3vw,37px);line-height:1.1;letter-spacing:-.04em;margin:8px 0 0;text-wrap:balance}
.wonder-selected .tag{font-size:9px}
.wonder-actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;justify-content:flex-end}
.wonder-arrow{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:39px;height:39px;border:1px solid #8cdce24d;border-radius:50%;color:var(--ink);background:#1a3d4c77;cursor:pointer;font:19px/1 Hanken,sans-serif}
.wonder-arrow:hover{background:#235969;border-color:var(--accent)}
.wonder-position{font:11px/1.4 Plex,monospace;color:var(--muted);min-width:36px;text-align:center}
.wonder-tour{font:11px/1.4 Hanken,sans-serif;background:#102d3e;border:1px solid #8ddbe345;border-radius:20px;padding:9px 13px;color:var(--ink);cursor:pointer;min-height:39px}
.wonder-tour:hover,.wonder-tour[aria-pressed=true]{background:#245463;border-color:var(--accent)}
.wonder-tour:disabled{opacity:.4;cursor:default}
.wonder-actions .btn{font-size:11px;padding:10px 12px;min-height:39px;cursor:pointer}
.wonder-filmstrip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:22px 30px 28px;border-top:1px solid #80d6e21b}
.wonder-thumb{position:relative;padding:0;text-align:left;background:#0d2534;border:1px solid #8bc8d335;border-radius:5px;cursor:pointer;overflow:hidden;font:inherit;display:flex;flex-direction:column;color:var(--ink);transition:border-color .2s,background .2s}
.wonder-thumb img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;display:block;opacity:.78;border-radius:0}
.wonder-thumb span{padding:12px 13px;display:flex;flex-direction:column;gap:6px}
.wonder-thumb strong{font-size:14px;line-height:1.2;font-weight:550;text-wrap:balance}
.wonder-thumb small{font:9px/1.4 Plex,monospace;color:#9bb7c6}
.wonder-thumb[aria-pressed=true],.wonder-thumb:hover{border-color:var(--accent);background:#173a49}
.wonder-thumb[aria-pressed=true] img,.wonder-thumb:hover img{opacity:1}
.wonder-thumb[aria-pressed=true]:before{content:'';position:absolute;inset:0 auto auto 0;width:100%;height:2px;background:var(--accent);box-shadow:0 0 14px var(--accent);z-index:1}
.wonders-next .section-heading p{max-width:440px;font-size:15px}
.wonder-future-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.wonder-future{position:relative;margin:0;border:1px solid #e5bf7c40;border-radius:7px;overflow:hidden;display:grid;grid-template-columns:1.2fr 1fr;background:#102632;box-shadow:0 10px 30px #0002}
.wonder-future img{display:block;width:100%;height:100%;min-height:235px;object-fit:cover}
.wonder-future>div{padding:25px;align-self:center}
.wonder-future .tag{color:var(--gold);font-size:8px}
.wonder-future h3{font-size:29px;margin:14px 0 10px;line-height:1.1;letter-spacing:-.03em;text-wrap:balance}
.wonder-future p{font:10px/1.4 Plex,monospace;color:var(--muted);margin:0}
.wonders-continue{display:flex;justify-content:space-between;align-items:center;gap:30px}
.wonders-continue h2{font-size:37px;margin:15px 0;line-height:1.15;letter-spacing:-.04em}
.wonders-continue p{font-size:15px;max-width:480px;color:var(--muted)}
.wonders-continue .actions{justify-content:flex-end}
.wonder-dialog{width:min(1300px,96vw);max-width:96vw;max-height:94dvh;padding:0;border:1px solid #a0e1df70;border-radius:10px;background:#081924;color:var(--ink);box-shadow:0 40px 120px #000a;overflow:auto}
.wonder-dialog::backdrop{background:#020a13f0;backdrop-filter:blur(12px)}
.wonder-dialog-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:18px 25px;border-bottom:1px solid #8ad3df2b}
.wonder-dialog-head h2{font-size:25px;line-height:1.15;letter-spacing:-.035em;margin:7px 0 0;text-wrap:balance}
.wonder-dialog-head .tag{font-size:8px}
.wonder-dialog-head .btn{cursor:pointer;font-size:11px;padding:9px 12px;flex-shrink:0}
.wonder-dialog-image{background:#030b12;display:flex;justify-content:center;align-items:center;padding:12px;min-height:200px}
.wonder-dialog-image img{width:100%;height:min(68dvh,780px);object-fit:contain;display:block;border-radius:0;max-width:100%}
.wonder-dialog-foot{display:flex;align-items:center;justify-content:center;gap:18px;padding:14px 22px;border-top:1px solid #80d6e22a;font:11px/1.4 Plex,monospace;color:var(--muted)}
.wonder-dialog-foot .btn{font-size:11px;padding:9px 12px;margin-left:auto}
body:has(.wonder-experience) .guide-trigger{position:static;width:max-content;display:flex;margin:25px auto 30px;transform:none}
.wonder-teaser.card{padding:0;overflow:hidden;background:linear-gradient(135deg,#17394a,#102837)}
.wonder-teaser-photos{height:240px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:1fr 1fr;gap:4px;padding:15px;background:radial-gradient(ellipse,#2b85904a,transparent 70%);transform:perspective(900px) rotateX(5deg);border-bottom:1px solid #7fc9da29}
.wonder-teaser-photos img{width:100%;height:100%;object-fit:contain;background:#091722;border:1px solid #8edfe34a;border-radius:3px;min-height:0;min-width:0}
.wonder-teaser-photos img:nth-child(1){grid-column:2/6;grid-row:1/3;z-index:2;box-shadow:0 0 18px #86ddea22}
.wonder-teaser-photos img:nth-child(2){grid-column:6/7;grid-row:1/2;transform:perspective(200px) rotateY(-13deg)}
.wonder-teaser-photos img:nth-child(3){grid-column:1/2;grid-row:1/2;transform:perspective(200px) rotateY(13deg)}
.wonder-teaser-photos img:nth-child(4){grid-column:1/2;grid-row:2/3;transform:perspective(200px) rotateY(13deg)}
.wonder-teaser-photos img:nth-child(5){grid-column:6/7;grid-row:2/3;transform:perspective(200px) rotateY(-13deg)}
.wonder-teaser-copy{padding:25px 30px 35px;position:relative}
.wonder-teaser-copy .arrow{position:absolute;right:27px;bottom:22px}
@media(prefers-reduced-motion:no-preference){
 .wonder-depth{animation:wonder-hover 9s ease-in-out infinite}
 .wonder-stage:hover .wonder-depth,.wonder-stage:focus-within .wonder-depth{animation-play-state:paused}
 .wonder-orbits ellipse:nth-child(2){animation:wonder-orbit 28s linear infinite}
}
@keyframes wonder-hover{0%,100%{transform:translateY(0) rotateX(var(--look-x)) rotateY(var(--look-y))}50%{transform:translateY(-6px) rotateX(var(--look-x)) rotateY(var(--look-y))}}
@keyframes wonder-orbit{to{stroke-dashoffset:-220}}
@media(max-width:1050px){
 .wonders-heading{gap:45px}
 .wonders-intro .lede{font-size:19px}
 .wonder-controls{padding:22px;gap:18px;align-items:start}
 .wonder-actions{max-width:350px}
 .wonder-pane{width:62%}
 .wonder-pane figcaption{padding:13px 15px;min-height:55px}
 .wonder-pane figcaption strong{font-size:17px}
 .wonder-filmstrip{padding:20px 22px;gap:10px}
 .wonder-thumb span{padding:10px}
 .wonder-thumb strong{font-size:12px}
 .wonder-future{grid-template-columns:1fr}
 .wonder-future img{height:240px;min-height:0;object-fit:cover}
 .wonder-future>div{padding:23px}
 .wonders-continue{align-items:start}
}
@media(max-width:780px){
 .wonders-heading{grid-template-columns:1fr;gap:20px;padding:20px 0 28px}
 .wonders-heading .hero-copy{max-width:550px}
 .wonders-intro .lede{max-width:600px}
 .wonders-intro p:not(.lede){max-width:590px}
 .wonder-tally{margin-top:16px}
 .wonder-stage{height:450px;--spread:clamp(140px,24vw,240px)}
 .wonder-pane{width:70%}
 .wonder-pane figcaption{flex-direction:column;gap:4px;align-items:start;padding:10px 14px;min-height:54px}
 .wonder-pane figcaption strong{text-align:left;font-size:16px}
 .wonder-stage-label{left:17px;right:17px;font-size:7px}
 .wonder-controls{flex-direction:column;gap:18px;padding:22px}
 .wonder-actions{max-width:none;justify-content:flex-start;gap:9px}
 .wonder-selected h2{font-size:31px}
 .wonder-filmstrip{grid-template-columns:repeat(5,145px);overflow:auto;scroll-snap-type:x proximity;padding:18px 22px 22px}
 .wonder-thumb{scroll-snap-align:center}
 .wonder-thumb strong{font-size:12px}
 .wonder-thumb img{opacity:1}
 .wonder-future-grid{gap:15px}
 .wonder-future img{height:180px}
 .wonder-future h3{font-size:25px}
 .wonder-future>div{padding:20px}
 .wonders-continue{flex-direction:column;gap:10px}
 .wonders-continue .actions{justify-content:flex-start}
 .wonder-teaser-photos{height:210px}
}
@media(max-width:480px){
 .wonders-heading .world-headline{font-size:clamp(35px,11.3cqi,48px)}
 .wonders-intro .lede{font-size:19px}
 .wonders-intro p:not(.lede){font-size:14px}
 .wonder-stage{height:clamp(300px,88vw,410px);--spread:clamp(105px,30vw,145px);perspective:1000px}
 .wonder-pane{width:84%}
 .wonder-pane[data-slot="2"],.wonder-pane[data-slot="-2"]{opacity:.25}
 .wonder-pane figcaption{padding:9px 12px;min-height:57px}
 .wonder-pane figcaption strong{font-size:15px}
 .wonder-stage-label{bottom:10px;font-size:6px}
 .wonder-stage-label .tag{font-size:6px}
 .wonder-controls{padding:20px 16px}
 .wonder-selected h2{font-size:28px}
 .wonder-actions{gap:8px}
 .wonder-actions .btn{font-size:10px;padding:10px}
 .wonder-filmstrip{grid-template-columns:repeat(5,137px);padding:16px;gap:10px}
 .wonder-future-grid{grid-template-columns:1fr}
 .wonder-future{grid-template-columns:1.2fr 1fr}
 .wonder-future img{height:185px}
 .wonder-future>div{padding:16px}
 .wonder-future h3{font-size:24px}
 .wonder-future .tag{font-size:7px}
 .wonder-dialog-head{padding:15px;gap:10px;align-items:start}
 .wonder-dialog-head h2{font-size:21px}
 .wonder-dialog-head .btn{font-size:9px;padding:8px}
 .wonder-dialog-image{padding:4px}
 .wonder-dialog-image img{height:54dvh}
 .wonder-dialog-foot{padding:13px;gap:11px;flex-wrap:wrap}
 .wonder-dialog-foot .btn{margin-left:0;font-size:10px}
 .wonder-dialog-head .tag{font-size:7px}
 .wonder-teaser-copy{padding:24px 25px 35px}
 .wonder-teaser-photos{height:210px;padding:10px;grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.wonder-pane{transition:none}.wonder-depth,.wonder-orbits ellipse{animation:none!important}}
body.motion-paused .wonder-pane{transition:none}