.bifrost{position:relative;isolation:isolate;overflow:hidden;background:#121310;color:#f7f5ef;font-family:Outfit,"Segoe UI",sans-serif;padding:130px 24px 220px}
.bifrost-space{position:absolute;inset:-16px;z-index:-2;background:url('page7-space.png') center/100% 100% no-repeat;pointer-events:none}
.bifrost:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#121310 0%,transparent 12%,transparent 85%,#121310 100%);pointer-events:none}
.bifrost-header{text-align:center;max-width:900px;margin:0 auto 90px}
.bifrost-header h2{font-size:clamp(42px,5.4vw,76px);line-height:1.04;letter-spacing:-.03em;font-weight:650;margin:0 0 24px;text-wrap:balance}
.bifrost-header p{font-size:20px;line-height:1.65;margin:0;color:#dbdfeb}
.bifrost-journey{position:relative;max-width:1080px;margin:auto}
.bifrost-rail{position:absolute;top:0;bottom:260px;left:50%;width:7px;transform:translateX(-50%);background:#b0ceff18;pointer-events:none}
.bifrost-fill{height:100%;width:100%;transform-origin:top;background:linear-gradient(#62cfff,#ffe788 22%,#ff6269 40%,#c483ff 58%,#6fffaa 75%,#ffb15f);box-shadow:0 0 16px #b4e3ff,0 0 40px #a28eff70;transform:scaleY(1)}
.bifrost-fill:after{content:'';position:absolute;inset:0 2px;background:#fff8dc}
.bifrost-enhanced .bifrost-fill{transform:scaleY(0)}
.bifrost-step{position:relative;display:grid;grid-template-columns:1fr 150px 1fr;align-items:center;min-height:270px;margin:0}
.bifrost-panel{grid-column:1;padding:28px 30px;border:1px solid color-mix(in srgb,var(--stone) 24%,transparent);border-radius:16px;background:#09101bd9;backdrop-filter:blur(12px);position:relative;transition:border-color 200ms ease,box-shadow 200ms ease,transform 200ms cubic-bezier(.23,1,.32,1)}
.bifrost-step:nth-of-type(even) .bifrost-panel{grid-column:3}
.bifrost-panel:after{content:'';position:absolute;left:100%;top:50%;width:75px;height:1px;background:var(--stone);opacity:.3;transition:opacity 200ms ease}
.bifrost-step:nth-of-type(even) .bifrost-panel:after{left:auto;right:100%}
.bifrost-step.is-active .bifrost-panel{border-color:var(--stone);box-shadow:0 9px 32px color-mix(in srgb,var(--stone) 18%,transparent)}
.bifrost-step.is-active .bifrost-panel:after{opacity:1}
.bifrost-number{font-size:28px;font-weight:600;color:var(--stone);font-variant-numeric:tabular-nums}
.bifrost-panel h3{font-size:28px;line-height:1.2;letter-spacing:-.015em;font-weight:600;margin:10px 0 12px}
.bifrost-panel p{font-size:18px;line-height:1.65;color:#dce0e9;margin:0}
.bifrost-stone{position:absolute;left:50%;top:50%;width:100px;height:125px;object-fit:contain;transform:translate(-50%,-50%);filter:hue-rotate(var(--hue)) brightness(.6);transition:filter 200ms ease;pointer-events:none}
.bifrost-step.is-active .bifrost-stone{filter:hue-rotate(var(--hue)) brightness(1.15) drop-shadow(0 0 16px var(--stone))}
.bifrost-step.is-active:after{content:'';position:absolute;left:50%;top:50%;width:220px;height:2px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--stone),#fff,var(--stone),transparent);pointer-events:none;opacity:.7}
.bifrost-finale{text-align:center;padding:80px 0 0;position:relative}
.bifrost-solar{position:relative;width:min(620px,100%);aspect-ratio:1;margin:auto;isolation:isolate}
.bifrost-sun{position:absolute;inset:-12%;background:radial-gradient(ellipse at center,#fffef2 0%,#fff5c9 2%,#ffe6a6bf 6%,#ffd37366 14%,#efb34228 27%,#d79c3210 40%,transparent 60%);pointer-events:none}
.bifrost-solar:before{content:none}
.bifrost-solar:after{content:'';position:absolute;top:50%;left:50%;width:160%;aspect-ratio:1200/140;transform:translate(-50%,-50%);background:url('flare-anamorphic.svg') center/100% 100% no-repeat;mix-blend-mode:screen;opacity:.85;pointer-events:none}
.bifrost-orbit{position:absolute;inset:0;animation:stone-orbit 32s linear infinite;animation-play-state:paused}
.bifrost-orbit-slot{position:absolute;left:50%;top:50%;width:90px;height:110px;margin-left:-45px;margin-top:-55px;transform:rotate(var(--angle)) translateY(-240px)}
.bifrost-orbit-slot img{width:100%;height:100%;object-fit:contain;filter:hue-rotate(var(--hue)) drop-shadow(0 0 12px var(--stone));animation:stone-counter 32s linear infinite;animation-play-state:paused}
.bifrost.is-visible:not(.is-paused) .bifrost-orbit,.bifrost.is-visible:not(.is-paused) .bifrost-orbit-slot img{animation-play-state:running}
.bifrost-result{font-size:clamp(34px,4.6vw,60px);line-height:1.1;letter-spacing:-.025em;font-weight:650;margin:25px 0 20px;position:relative;display:inline-block;color:#f7f5ef;text-wrap:balance}
.bifrost-shine{position:absolute;inset:0;color:transparent;background:linear-gradient(110deg,transparent 35%,#fff5bc 47%,#fff 50%,#fff5bc 53%,transparent 65%);background-size:300% 100%;background-position:200% 0;background-clip:text;-webkit-background-clip:text;clip-path:inset(0 0 0 0);animation:text-shine 5s linear infinite;animation-play-state:paused;pointer-events:none}
.bifrost.is-visible:not(.is-paused) .bifrost-shine{animation-play-state:running}
.bifrost-finale>p{font-size:20px;line-height:1.6;color:#dce0e9;margin:0}
.bifrost-pause{display:block;margin:30px auto 0;background:#10141ccc;border:1px solid #dae1ed55;border-radius:30px;padding:12px 20px;color:#f5f2e9;font:500 14px Outfit,sans-serif;cursor:pointer;min-height:44px}
.bifrost-pause:focus-visible{outline:3px solid #ffe4a1;outline-offset:5px}
.bifrost-progress{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@keyframes stone-orbit{to{transform:rotate(360deg)}}
@keyframes stone-counter{to{transform:rotate(-360deg)}}
@keyframes text-shine{0%,15%{background-position:200% 0;opacity:0}20%{opacity:1}55%{background-position:-100% 0;opacity:1}60%,100%{background-position:-100% 0;opacity:0}}
@media(max-width:700px){.bifrost{padding:85px 20px 130px}.bifrost-header{margin-bottom:55px}.bifrost-header p{font-size:17px}.bifrost-step{grid-template-columns:62px 1fr;min-height:225px}.bifrost-panel,.bifrost-step:nth-of-type(even) .bifrost-panel{grid-column:2;padding:22px}.bifrost-panel:after,.bifrost-step:nth-of-type(even) .bifrost-panel:after{left:auto;right:100%;width:30px}.bifrost-rail{left:28px;bottom:215px}.bifrost-stone{left:28px;width:65px;height:88px}.bifrost-step.is-active:after{left:28px;width:85px}.bifrost-panel h3{font-size:23px}.bifrost-panel p{font-size:16px}.bifrost-number{font-size:23px}.bifrost-solar{max-width:350px}.bifrost-orbit-slot{width:58px;height:75px;margin-left:-29px;margin-top:-37.5px;transform:rotate(var(--angle)) translateY(-130px)}.bifrost-finale{padding-top:50px}.bifrost-finale>p{font-size:17px}}
@media(prefers-reduced-motion:reduce){.bifrost-orbit,.bifrost-orbit-slot img,.bifrost-shine{animation:none!important}.bifrost-shine{display:none}.bifrost-panel{transition:border-color 200ms ease}.bifrost-pause{display:none}}
/* Optical anamorphic streaks: consistent lens optics across all six stones. */
.bifrost-step:after,.bifrost-step.is-active:after{content:'';position:absolute;left:50%;top:50%;width:min(560px,65vw);height:auto;aspect-ratio:1200/140;transform:translate(-50%,-50%);background:url('flare-anamorphic.svg') center/100% 100% no-repeat;mix-blend-mode:screen;opacity:0;transition:opacity 200ms ease;pointer-events:none}
.bifrost-step.is-active:after{opacity:.9}
@media(max-width:700px){.bifrost-step:after,.bifrost-step.is-active:after{left:28px;width:230px}}

/* Radiant spill behind the active panels, without obscuring the copy. */
.bifrost-step:before{content:'';position:absolute;left:-5%;top:8%;width:calc((100% - 150px)/2 + 10%);height:84%;background:radial-gradient(ellipse,var(--stone) 0%,color-mix(in srgb,var(--stone) 75%,transparent) 38%,transparent 78%);filter:blur(30px) brightness(1.8);opacity:.06;pointer-events:none;transition:opacity 350ms ease}
.bifrost-step:nth-of-type(even):before{left:auto;right:-5%}
.bifrost-step.is-active:before{opacity:1}
.bifrost-panel{z-index:1}
.bifrost-stone{z-index:2}
.bifrost-step:after{z-index:3}
.bifrost-fill{background:linear-gradient(#ffb064,#ffda66 22%,#c585ff 40%,#63efa0 58%,#ff626b 75%,#58d4ff)}
@media(max-width:700px){.bifrost-step:before,.bifrost-step:nth-of-type(even):before{left:50px;right:auto;width:calc(100% - 35px);filter:blur(24px) brightness(1.8)}.bifrost-step.is-active:before{opacity:.95}}
@media(prefers-reduced-motion:reduce){.bifrost-step:before{transition:none}}