@property --sec-lift{syntax:"<length>";inherits:true;initial-value:0}.sec-section{position:relative}.sec-sticky{padding-block:clamp(72px,9vw,128px);position:relative;overflow:hidden}.sec-grid{align-items:center;gap:48px;display:grid}.sec-stage{--e:1;--sh:clamp(420px, 108vw, 540px);--plate:min(calc(var(--sh) * .44), 62vw);--g:calc(var(--plate) * (.03 + var(--e) * .2));height:var(--sh);perspective:1800px;perspective-origin:50% 56%;width:100%;position:relative}.sec-stack{transform-style:preserve-3d;transform:translateY(calc(var(--sh) * .06)) rotateX(62deg) rotateZ(-38deg);position:absolute;inset:0}.sec-plate{width:var(--plate);height:var(--plate);margin:calc(var(--plate) / -2) 0 0 calc(var(--plate) / -2);transform-style:preserve-3d;transform:translateZ(calc((var(--i) - 3) * var(--g) + var(--sec-lift)));transition:--sec-lift .7s var(--ease-out-expo);position:absolute;top:50%;left:50%}.sec-plate[data-on=true]{--sec-lift:calc(var(--plate) * .13)}.sec-slab{border-radius:calc(var(--plate) * .07);background:color-mix(in oklab, var(--c) 35%, #050824);box-shadow:0 0 0 1px color-mix(in oklab, var(--c) 40%, transparent);position:absolute;inset:0;transform:translateZ(-10px)}.sec-face{border-radius:calc(var(--plate) * .07);background:radial-gradient(circle at 1px 1px, #ffffff38 1px, transparent 1.4px) 0 0 / 16px 16px, linear-gradient(125deg, #ffffff2e, transparent 38%), linear-gradient(135deg, color-mix(in oklab, var(--c) 46%, #0a1250), color-mix(in oklab, var(--c) 22%, #070c3a));border:1px solid color-mix(in oklab, var(--c) 70%, white 18%);box-shadow:inset 0 0 calc(var(--plate) * .16) color-mix(in oklab, var(--c) 40%, transparent);transition:opacity .5s,box-shadow .5s,border-color .5s;position:absolute;inset:0;overflow:hidden}.sec-stack[data-focus=true] .sec-plate:not([data-on=true]) .sec-face{opacity:.5}.sec-plate[data-on=true] .sec-face{box-shadow:inset 0 0 calc(var(--plate) * .2) color-mix(in oklab, var(--c) 70%, transparent), 0 0 calc(var(--plate) * .25) color-mix(in oklab, var(--c) 60%, transparent);border-color:#fff}.sec-icon{color:#ffffffeb;filter:drop-shadow(0 0 14px #ffffff73);position:absolute;top:50%;left:50%;translate:-50% -50%}.sec-n{font-family:var(--font-mono);font-size:clamp(10px, calc(var(--plate) * .05), 14px);letter-spacing:.1em;color:#ffffffbf;position:absolute;top:6%;left:7%}.sec-tag{font-family:var(--font-mono);font-size:clamp(10px, calc(var(--plate) * .05), 14px);letter-spacing:.12em;text-transform:uppercase;color:#fff;position:absolute;bottom:6%;left:7%}.sec-beam{left:calc(50% + var(--bx) * var(--plate) / 2);top:calc(50% + var(--by) * var(--plate) / 2);width:1px;height:calc(6 * var(--g));transform-origin:0 0;transform:translateZ(calc(-3 * var(--g))) rotateX(90deg);opacity:calc(var(--e) * .9);background:linear-gradient(#7fd8ffa6,#7fd8ff0d);position:absolute}.sec-shield{left:50%;bottom:calc(var(--sh) * .44 + 3 * var(--g) * .883 + var(--sh) * .045);width:calc(var(--sh) * .26);filter:drop-shadow(0 30px 40px #0000008c);pointer-events:none;height:auto;animation:var(--animate-float);z-index:2;position:absolute;translate:-50%}.sec-list{border-bottom:1px solid #ffffff1a;margin:0;padding:0;list-style:none}.sec-item{border-top:1px solid #ffffff1a;padding:20px 0;transition:opacity .5s}.sec-head{align-items:center;gap:16px;display:flex}.sec-num{font-family:var(--font-mono);color:#7f89b5;flex:none;width:26px;font-size:12px;transition:color .4s}.sec-name{font-family:var(--font-display);letter-spacing:-.02em;color:#fff;font-size:clamp(1.1rem,1.5vw,1.4rem);font-weight:700}.sec-item[data-on=true] .sec-num{color:#7fd8ff}.sec-body{grid-template-rows:1fr;padding-left:42px;display:grid}.sec-body>div{min-height:0;overflow:hidden}.sec-inner{flex-direction:column;gap:10px;padding-top:10px;display:flex}.sec-body p{color:#c9cfee;max-width:52ch;margin:0}.sec-body ul{color:#9aa3c7;gap:7px;margin:0;padding:0;font-size:14.5px;list-style:none;display:grid}.sec-body li{align-items:baseline;gap:10px;display:flex}.sec-body li:before{content:"";background:linear-gradient(135deg,#22c8ff,#7b3fff);border-radius:99px;flex:none;width:6px;height:6px;translate:0 -1px}.sec-headline{font-family:var(--font-display);color:#fff;letter-spacing:-.01em;font-size:1.1rem;font-weight:700}@media (min-width:1024px) and (hover:hover) and (prefers-reduced-motion:no-preference){.sec-section{height:250vh}.sec-sticky{top:var(--nav-h);height:calc(100svh - var(--nav-h));align-items:center;padding-block:0;display:flex;position:sticky}.sec-grid{grid-template-columns:1.05fr .95fr;gap:56px;width:100%}.sec-stage{--sh:min(calc(100svh - var(--nav-h) - 28px), 880px);--plate:calc(var(--sh) * .34)}.sec-item{opacity:.4;padding:clamp(6px,1.15vh,12px) 0}.sec-name{font-size:clamp(1rem,2.3vh,1.35rem)}.sec-inner{gap:7px;padding-top:7px}.sec-body ul{gap:4px;font-size:14px}.sec-body p{font-size:14.5px;line-height:1.5}.sec-item[data-on=true]{opacity:1}.sec-body{transition:grid-template-rows .65s var(--ease-out-expo);grid-template-rows:0fr}.sec-item[data-on=true] .sec-body{grid-template-rows:1fr}}@media (min-width:1024px) and (not ((hover:hover) and (prefers-reduced-motion:no-preference))){.sec-grid{grid-template-columns:1.05fr .95fr;gap:56px}.sec-stage{--sh:600px}}
