


.pc-host{ position:relative; isolation:isolate }
.sb1-pc{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:0; transition:opacity 1.6s ease }
.sb1-pc.on{ opacity:var(--pc-o,.75) }
.pc-host > .wrap{ position:relative; z-index:1 }
@media print{ .sb1-pc{ display:none!important } }


.card,.lift{ transform-style:preserve-3d; transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out),background .35s,border-color .35s,opacity .35s }
.lift{ position:relative }
.lift::after{ content:""; position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 2px 0 var(--yellow); opacity:0; transition:opacity .35s; border-radius:inherit }
.lift-on{ transform:perspective(900px) translateY(-10px) translateZ(24px) rotateX(4deg)!important; z-index:3;
  background:linear-gradient(160deg,rgba(0,74,173,.6),rgba(2,33,80,.95))!important; border-color:rgba(26,124,255,.55)!important;
  box-shadow:0 46px 70px -28px rgba(0,0,0,.75),0 22px 60px -24px rgba(26,124,255,.6),0 0 0 1px rgba(26,124,255,.55)!important }
.lift-on::after,.card.lift-on::before{ opacity:1; transform:none }
.lift-on h3,.lift-on h4,.lift-on .n:not(.y){ color:#fff!important }
.lift-on .k,.lift-on .when{ color:var(--yellow)!important }
.lift-on p,.lift-on .c{ color:#D6E2EA!important }
.lift-on .tlink{ color:var(--ice)!important }
@media (hover:hover){
  .card:hover,.lift:hover{ transform:perspective(900px) translateY(-10px) translateZ(24px) rotateX(4deg); z-index:3;
    background:linear-gradient(160deg,rgba(0,74,173,.6),rgba(2,33,80,.95)); border-color:rgba(26,124,255,.55);
    box-shadow:0 46px 70px -28px rgba(0,0,0,.75),0 22px 60px -24px rgba(26,124,255,.6),0 0 0 1px rgba(26,124,255,.55) }
  .card:hover::before,.lift:hover::after{ opacity:1; transform:none }
  .card:hover h3,.lift:hover h3,.lift:hover .n:not(.y){ color:#fff }
  .card:hover .k,.card:hover .when{ color:var(--yellow) }
  .card:hover p,.lift:hover .c{ color:#D6E2EA }
  .card:hover .tlink{ color:var(--ice) }
  .tiles:hover > :is(.card,.lift):not(:hover){ opacity:.5 }
}
.tiles.has-on > :is(.card,.lift):not(.lift-on){ opacity:.5 }

.light .card h3,.light .card p{ transition:color .3s }
@media (prefers-reduced-motion:reduce){ .card:hover,.lift:hover,.lift-on{ transform:none!important } }


.stats4{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:28px }
@media (min-width:900px){ .stats4{ grid-template-columns:repeat(4,1fr); gap:16px } }
.stats4 .lift{ padding:22px 18px 20px; border:1px solid var(--line); border-radius:4px; background:rgba(1,22,56,.7) }
@media (min-width:900px){ .stats4 .lift{ padding:28px 24px 26px } }
.stats4 .n{ font-family:var(--f-display); font-weight:700; font-size:clamp(34px,4.4vw,64px); line-height:.95; letter-spacing:-.02em; transition:color .3s }
.stats4 .n.y{ color:var(--yellow) }
.stats4 .c{ font-size:13.5px; color:var(--text-2); margin-top:10px; line-height:1.45; transition:color .3s }


.ivl{ position:relative }
.ivl-stage{ position:relative; overflow:hidden; border:1px solid var(--line-strong); border-radius:4px; background:#01143A; aspect-ratio:1/1.02 }
.ivl-frame{ position:absolute; top:0; height:100%; aspect-ratio:1600/893; left:50%; transform:translateX(-73.3%) }
.ivl-frame > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:filter .6s var(--ease-out) }
.ivl .slice{ position:absolute; inset:0; clip-path:var(--clip); pointer-events:none; opacity:0; transition:opacity .5s var(--ease-out) }
.ivl .slice .cut,.ivl .slice .cut img{ position:absolute; inset:0; width:100%; height:100% }
.ivl .slice .cut img{ object-fit:cover; filter:brightness(1.18) saturate(1.05) }
.ivl .slice::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(26,124,255,.10),rgba(108,167,249,0) 40%,rgba(26,124,255,.12)); mix-blend-mode:screen }
.ivl .slice .sweep{ position:absolute; left:0; right:0; height:2px; top:0; background:linear-gradient(90deg,transparent,var(--ice),transparent); box-shadow:0 0 18px 4px rgba(108,167,249,.55); opacity:0 }
.ivl .datum{ position:absolute; left:49%; right:2%; top:10%; height:0; border-top:1px dashed rgba(242,203,7,.45); pointer-events:none }
.ivl .lead{ position:absolute; left:var(--x); top:10%; width:1px; height:var(--h); background:linear-gradient(to bottom,var(--yellow),rgba(242,203,7,.15)); pointer-events:none; opacity:.8; transition:opacity .4s }
.ivl .pin{ position:absolute; left:var(--x); top:10%; transform:translate(-50%,-100%); display:flex; flex-direction:column; align-items:center; gap:4px; pointer-events:none; opacity:1; transition:opacity .4s,transform .5s var(--ease-out) }
.ivl .pin b{ font-family:var(--f-mono); font-weight:500; font-size:10px; letter-spacing:.1em; color:#0B1A2E; background:var(--yellow); padding:2px 6px; border-radius:2px }
.ivl .pin span{ font-family:var(--f-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ice); background:rgba(1,20,58,.85); border:1px solid rgba(242,203,7,.5); padding:3px 6px; white-space:nowrap }
.ivl-ro{ position:absolute; left:12px; bottom:12px; z-index:3; font-family:var(--f-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; line-height:1.85; color:var(--sky); padding:8px 10px; background:rgba(1,20,58,.8); border:1px solid var(--line) }
.ivl-ro b{ color:var(--ice); font-weight:500 } .ivl-ro span{ color:var(--yellow) }
.ivl-stage .illus{ left:auto; right:10px; bottom:12px }
.ivl-tabs{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:4px; overflow:hidden; margin-top:10px }
@media (min-width:600px){ .ivl-tabs{ grid-template-columns:repeat(4,1fr) } }
.ivl-tabs button{ position:relative; text-align:left; background:var(--ground); border:0; color:var(--mist); padding:12px 12px 14px; min-height:44px; font:inherit; display:flex; flex-direction:column; gap:2px; cursor:pointer; transition:background .25s }
.ivl-tabs button:hover{ background:#022150 }
.ivl-tabs b{ font-family:var(--f-mono); font-weight:500; font-size:10.5px; letter-spacing:.14em; color:var(--sky) }
.ivl-tabs span{ font-family:var(--f-display); font-weight:600; font-size:15px; line-height:1.2 }
.ivl-tabs small{ font-size:11.5px; color:var(--text-2); line-height:1.35 }
.ivl-tabs button::before{ content:""; position:absolute; left:0; top:0; height:2px; width:100%; transform-origin:0 50%; transform:scaleX(0); background:var(--yellow) }

html.js .ivl.live .ivl-frame > img{ filter:brightness(.5) saturate(.8) }
html.js .ivl .slice.on{ opacity:1 }
html.js .ivl .pin{ opacity:0 }
html.js .ivl .pin.on{ opacity:1; transform:translate(-50%,calc(-100% - 4px)) }
html.js .ivl .pin.done{ opacity:.55 }
html.js .ivl .lead{ opacity:0 } html.js .ivl .lead.on{ opacity:1 } html.js .ivl .lead.done{ opacity:.45 }
html.js .ivl-tabs button.on{ background:linear-gradient(to bottom,rgba(0,74,173,.45),var(--ground)) }
html.js .ivl-tabs button.on b{ color:var(--yellow) }
html.js .ivl-tabs button.on::before{ transform:scaleX(var(--p,1)) }
html.js .ivl-tabs button.done::before{ transform:scaleX(1); background:var(--slate) }
html.js .ivl-stage{ cursor:crosshair }
html.motion .ivl .slice.on .sweep{ opacity:1; animation:ivlSweep 1.6s var(--ease-io) both }
@keyframes ivlSweep{ from{ top:10% } to{ top:88%; opacity:0 } }


.lanes{ display:grid; gap:44px }
@media (min-width:900px){ .lanes{ grid-template-columns:1fr 1fr; gap:64px } }
.lane-t{ font-family:var(--f-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--slate); margin-bottom:18px }
.tl{ --p:1; list-style:none; margin:0; padding:0; position:relative; display:grid }
.tl::before{ content:""; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:linear-gradient(to bottom,var(--cobalt),var(--sky)) }
.tl::after{ content:""; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:var(--yellow); box-shadow:0 0 10px rgba(242,203,7,.6); transform-origin:50% 0; transform:scaleY(var(--p)); display:none }
html.motion .tl::after{ display:block }
.tl li{ position:relative; padding:0 0 22px 30px; transition:opacity .4s }
.tl li::before{ content:""; position:absolute; left:0; top:5px; width:11px; height:11px; border-radius:50%; background:var(--ground); border:1px solid var(--sky) }
.tl li.now::before{ background:var(--yellow); border-color:var(--yellow); box-shadow:0 0 0 5px rgba(242,203,7,.15) }
.tl .d{ font-family:var(--f-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--sky) }
.tl li.now .d{ color:var(--yellow) }
.tl .w{ font-family:var(--f-display); font-weight:600; font-size:19px; line-height:1.25; margin-top:4px }
.tl .x{ color:var(--text-2); font-size:14.5px; margin-top:2px }
html.motion .tl li:not(.on){ opacity:.42 }
html.motion .tl li.on::before{ border-color:var(--yellow); background:var(--yellow); box-shadow:0 0 0 5px rgba(242,203,7,.15) }
html.motion .tl li.on .d{ color:var(--yellow) }

.statement{ margin-top:56px; padding:36px 0 8px; border-top:1px solid var(--line-strong); position:relative }
.statement::before{ content:""; position:absolute; left:0; top:-1px; width:96px; height:2px; background:var(--yellow) }
.statement p{ margin:0; font-family:var(--f-display); font-weight:600; line-height:1.06; letter-spacing:-.01em; text-wrap:balance }
.statement .st-a{ font-size:clamp(32px,5vw,70px) }
.statement .st-b{ font-size:clamp(21px,2.6vw,36px); margin-top:14px; color:var(--text-2); font-weight:500; max-width:30ch }
.statement .st-b em{ color:var(--yellow); font-weight:500 }
.statement .outline{ -webkit-text-stroke-width:1px }
