.journal-bridge{--bridge-progress:1;--deck-x:0;--deck-y:0;--deck-hover:0;position:relative;overflow:hidden;background:#f6f9fe;padding:84px 40px 95px;font-family:Satoshi,Arial,sans-serif;color:#111827;isolation:isolate;scroll-margin-top:100px}
.journal-bridge:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 76% 55%,#d6e8ff,transparent 52%);z-index:-1}
.jb-inner{width:min(1160px,100%);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.jb-kicker{font-size:10px;font-weight:700;letter-spacing:.14em;color:#0869f5;display:block;margin-bottom:29px}
.jb-copy h2{font-size:clamp(40px,4.8vw,66px);line-height:1.07;letter-spacing:-.05em;font-weight:500;margin:0 0 27px}.jb-copy h2 span{color:#0869f5}
.jb-copy p{color:#606e85;font-size:16px;line-height:1.8;margin:0 0 30px}
.jb-link{display:inline-flex;align-items:center;gap:22px;text-decoration:none;border-bottom:1px solid #b2d0fa;padding-bottom:12px;color:#0869f5;font-size:14px;font-weight:500}.jb-link svg{width:20px;height:20px;stroke-width:1.7;transition:transform .4s cubic-bezier(.22,1,.36,1)}.jb-link:hover svg{transform:translate(3px,-3px)}
.jb-stage{position:relative;min-width:0}.jb-deck{position:relative;height:calc(var(--deck-card-height,400px) + 80px);perspective:1200px}
.jb-page{position:absolute;left:60px;top:30px;width:350px;height:var(--deck-card-height,400px);border-radius:13px;background:#fff;border:1px solid #d5e4f8;transform-origin:50% 90%;backface-visibility:hidden}
.jb-page-back{background:#e6f1ff;opacity:calc(.2 + var(--bridge-progress)*.8);transform:translate3d(calc(20px + var(--bridge-progress)*10px + var(--deck-x)*-4px),calc(30px - var(--bridge-progress)*35px - var(--deck-hover)*3px),-20px) rotate(calc(3deg + var(--bridge-progress)*8deg + var(--deck-hover)*3deg));box-shadow:0 12px 25px #234f8b08}
.jb-page-middle{opacity:calc(.2 + var(--bridge-progress)*.8);transform:translate3d(calc(-5px - var(--bridge-progress)*22px + var(--deck-x)*-2px),calc(32px - var(--bridge-progress)*22px - var(--deck-hover)*5px),-10px) rotate(calc(-2deg - var(--bridge-progress)*7deg - var(--deck-hover)*2deg));box-shadow:0 20px 35px #234f8b09}
.jb-page-main{height:auto;min-height:400px;display:block;text-decoration:none;overflow:hidden;opacity:calc(.3 + var(--bridge-progress)*.7);box-shadow:0 22px 48px #214a851c;transform:translate3d(calc(40px - var(--bridge-progress)*40px + var(--deck-x)*6px),calc(40px - var(--bridge-progress)*40px - var(--deck-hover)*9px + var(--deck-y)*3px),0) rotateX(calc(var(--deck-y)*-3deg)) rotateY(calc(-10deg + var(--bridge-progress)*10deg + var(--deck-x)*5deg)) rotate(calc(5deg - var(--bridge-progress)*7deg));transition:box-shadow .4s,border-color .4s}
.jb-page-main:hover,.jb-page-main:focus-visible{box-shadow:0 30px 60px #214a852b;border-color:#a5c9fc}.jb-page-main:focus-visible{outline:3px solid #80b4ff;outline-offset:6px}
.jb-page-main>img{width:100%;height:205px;object-fit:cover;object-position:75% center;transition:transform .9s cubic-bezier(.22,1,.36,1)}.jb-page-main:hover>img,.jb-page-main:focus-visible>img{transform:scale(1.025)}
.jb-page-copy{padding:21px 25px}.jb-page-copy>span:first-child{font-size:10px;color:#0869f5;display:block}.jb-page-copy h3{font-size:25px;line-height:1.16;font-weight:500;letter-spacing:-.035em;margin:12px 0 17px;max-width:300px}
.jb-page-read{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#606e85}.jb-page-read svg{width:17px;height:17px;transition:transform .45s cubic-bezier(.22,1,.36,1)}.jb-page-main:hover .jb-page-read svg,.jb-page-main:focus-visible .jb-page-read svg{transform:translate(3px,-3px)}
.jb-ora{position:absolute;top:100px;left:-75px;width:170px;height:170px;z-index:3;pointer-events:none;transform:translate3d(calc(-60px + var(--bridge-progress)*35px + var(--deck-x)*-7px),calc(-40px + var(--bridge-progress)*40px + var(--deck-y)*-5px),50px) scale(calc(.78 + var(--bridge-progress)*.22));opacity:var(--bridge-progress);filter:drop-shadow(0 20px 22px #0c66e326)}.jb-ora canvas{width:100%;height:100%}
.jb-stage .jb-edition{position:relative;display:flex;align-items:center;gap:10px;margin:18px 0 0 70px;padding:0;font-size:11px;font-weight:400;line-height:1.6;letter-spacing:.025em;color:#647d9d;opacity:var(--bridge-progress);transform:translateY(calc(8px - var(--bridge-progress)*8px))}.jb-edition:before{content:'';width:22px;height:1px;background:#88b6f5;flex-shrink:0}
@media(max-width:1100px){.jb-inner{gap:30px}.jb-page{width:310px;left:45px}.jb-page-copy h3{font-size:23px}.jb-ora{width:140px;height:140px;left:-52px}.jb-copy h2{font-size:47px}.journal-bridge{padding-inline:35px}.jb-stage .jb-edition{margin-left:52px}}
@media(max-width:760px){.journal-bridge{padding:50px 24px 55px}.jb-inner{display:block;max-width:500px}.jb-kicker{font-size:9px;margin-bottom:22px}.jb-copy h2{font-size:44px;margin-bottom:22px}.jb-copy p{font-size:14px;margin-bottom:23px}.jb-copy p br{display:none}.jb-link{font-size:13px}.jb-stage{width:100%;max-width:360px;margin:37px auto 0}.jb-deck{height:calc(var(--deck-card-height,340px) + 70px)}.jb-page{width:min(270px,calc(100% - 60px));height:var(--deck-card-height,340px);left:43px;top:15px;border-radius:10px}.jb-page-main{height:auto;min-height:340px}.jb-page-main>img{height:170px}.jb-page-copy{padding:18px 20px}.jb-page-copy h3{font-size:22px;margin:10px 0 16px}.jb-page-copy>span:first-child{font-size:9px}.jb-ora{width:118px;height:118px;top:60px;left:28px}.jb-stage .jb-edition{margin:14px 0 0;justify-content:center;font-size:10px}}
@media(max-width:370px){.jb-page-copy{padding:16px}.jb-page-copy h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.journal-bridge{--bridge-progress:1!important;--deck-x:0!important;--deck-y:0!important;--deck-hover:0!important}.jb-page,.jb-ora,.jb-page-read svg,.jb-link svg,.jb-page-main>img{transition:none!important}.jb-page-main:hover>img{transform:none}}
