.proc{--p:1;--s1:1;--s2:1;--s3:1;--s4:1;--s5:1;--s6:1;color:#fff;isolation:isolate;background:#061640;position:relative}.proc-on{height:640vh}.proc-stage{align-content:center;min-height:100svh;display:grid;position:relative;overflow:hidden}.proc-on .proc-stage{height:100svh;padding-top:4rem;padding-bottom:1rem;position:sticky;top:0}@media (max-width:1023px){.proc-on .proc-stage{padding-top:3.5rem;padding-bottom:calc(4.5rem + env(safe-area-inset-bottom))}}.proc-sky{z-index:0;background:radial-gradient(120% 80% at 50% 8%,#2c4c8f 0%,#12295f 45%,#061640 100%);position:absolute;inset:0}.proc-on .proc-sky:after{will-change:opacity}.proc-sky:after{content:"";opacity:calc(var(--s5) * .55 + var(--s6) * .45);background:radial-gradient(120% 85% at 50% 100%,#08132f 0%,#03091d 70%,#01050f 100%);position:absolute;inset:0}.proc-floor{z-index:0;transform-origin:bottom;opacity:.5;pointer-events:none;background:linear-gradient(#0000,#ffffff12 92%),repeating-linear-gradient(90deg,#ffffff17 0 1px,#0000 1px 84px);height:42%;position:absolute;bottom:0;left:-20%;right:-20%;transform:perspective(600px)rotateX(72deg)}.proc-grid{z-index:1;grid-template-rows:auto 1fr;align-items:center;gap:1rem;width:100%;max-width:1180px;margin:0 auto;padding:0 1rem;display:grid;position:relative}@media (min-width:1024px){.proc-grid{grid-template-rows:none;grid-template-columns:minmax(0,34%) minmax(0,1fr);gap:2.5rem;padding:0 1.5rem}}.proc-view{perspective:1150px;perspective-origin:50% 45%;place-items:center;min-height:46svh;display:grid}@media (min-width:1024px){.proc-view{min-height:62svh}}.sg{--w:min(74vw, 380px);--h:calc(var(--w) * .5625);--d:calc(var(--w) * .055);width:var(--w);height:var(--h);transform-style:preserve-3d;transform:rotateX(calc(9deg - var(--p) * 9deg)) rotateY(calc(-36deg + var(--p) * 31deg)) translateY(calc(var(--p) * -1.5%)) scale3d(calc(.9 + var(--p) * .1), calc(.9 + var(--p) * .1), calc(.9 + var(--p) * .1));position:relative}.proc-on .sg{will-change:transform}@media (min-width:640px){.sg{--w:min(62vw, 460px)}}@media (min-width:1024px){.sg{--w:min(40vw, 540px)}}.sg-layer{transform-style:preserve-3d;position:absolute;inset:0}.sg-wall{--fade:calc(1 - var(--s2));width:152%;height:178%;transform:translateZ(calc(var(--w) * -.34));opacity:calc(.16 + var(--fade) * .62);background:linear-gradient(#ffffff0b,#ffffff04),repeating-linear-gradient(0deg,#ffffff1f 0 1px,#0000 1px 34px),repeating-linear-gradient(90deg,#ffffff1f 0 1px,#0000 1px 34px);border:1px solid #ffffff24;position:absolute;top:-34%;left:-26%}.sg-measure{transform:translateZ(calc(var(--w) * -.3));opacity:calc(var(--s1) * (1 - var(--s2)));position:absolute;inset:-14% -12%}.sg-measure span{background:var(--color-cam);position:absolute;box-shadow:0 0 12px #f47a1fb3}.sg-measure .mx{height:2px;transform:scaleX(var(--s1));transform-origin:0;bottom:6%;left:12%;right:12%}.sg-measure .my{width:2px;transform:scaleY(var(--s1));transform-origin:top;top:14%;bottom:14%;left:6%}.sg-measure b{font-family:var(--font-heading);letter-spacing:.1em;color:var(--color-cam);opacity:var(--s1);background:#061640e6;padding:2px 7px;font-size:clamp(9px,1.5vw,12px);position:absolute}.sg-measure .lx{bottom:calc(6% - 9px);left:46%}.sg-measure .ly{top:44%;left:calc(6% - 4px)}.sg-blueprint{transform:translateZ(calc(var(--w) * -.02));opacity:calc(var(--s2) * (1 - var(--s3) * .92));position:absolute;inset:0;overflow:visible}.sg-blueprint text{font-family:var(--font-sign), cursive}.sg-blueprint [data-draw]{stroke-dasharray:var(--len,1200);stroke-dashoffset:calc(var(--len,1200) * (1 - var(--s2)))}.sg-frame{transform:translateZ(0)}.sg-bar{opacity:var(--s3);background:linear-gradient(160deg,#b9c3d4 0%,#7e8a9e 42%,#5a6577 100%);position:absolute;box-shadow:inset 0 1px #ffffff8c,0 6px 18px #00000073}.sg-bar-t{height:7%;transform:translateY(calc((var(--s3) - 1) * var(--h) * .85));top:0;left:0;right:0}.sg-bar-b{height:7%;transform:translateY(calc((1 - var(--s3)) * var(--h) * .85));bottom:0;left:0;right:0}.sg-bar-l{width:4%;transform:translateX(calc((var(--s3) - 1) * var(--w) * .7));top:0;bottom:0;left:0}.sg-bar-r{width:4%;transform:translateX(calc((1 - var(--s3)) * var(--w) * .7));top:0;bottom:0;right:0}.sg-bar-v{width:2.4%;transform:scaleY(var(--s3));transform-origin:top;top:7%;bottom:7%;left:48%}.sg-bar-h{height:3.4%;transform:scaleX(var(--s3));transform-origin:0;top:48%;left:4%;right:4%}.sg-weld{background:radial-gradient(circle, #fff 0%, var(--color-vang) 38%, #f47a1f00 72%);width:9px;height:9px;opacity:calc(max(0, var(--s3) - .78) * (1 - var(--s3)) * 82);border-radius:50%;position:absolute}.sg-weld.w1{top:5%;left:4%}.sg-weld.w2{top:5%;right:4%}.sg-weld.w3{bottom:5%;left:4%}.sg-weld.w4{bottom:5%;right:4%}.sg-face{opacity:var(--s4);background:linear-gradient(152deg,#16326e 0%,#0d2456 46%,#081b40 100%);border:1px solid #ffffff24;position:absolute;inset:0}.sg-front{transform:translateZ(calc(var(--d) / 2 + (1 - var(--s4)) * var(--w) * .14));box-shadow:inset 0 0 60px #00000080}.sg-back{transform:translateZ(calc(var(--d) / -2)) rotateY(180deg);background:linear-gradient(152deg,#0b1c44 0%,#071433 100%)}.sg-side{height:100%;width:var(--d);top:0;left:calc(50% - var(--d) / 2);opacity:var(--s4);background:linear-gradient(90deg,#47526b,#2b3346);position:absolute}.sg-side-l{transform:rotateY(-90deg) translateZ(calc(var(--w) / 2))}.sg-side-r{transform:rotateY(90deg) translateZ(calc(var(--w) / 2))}.sg-cap{width:100%;height:var(--d);left:0;top:calc(50% - var(--d) / 2);opacity:var(--s4);background:linear-gradient(#5a6579,#333c4d);position:absolute}.sg-cap-t{transform:rotateX(90deg) translateZ(calc(var(--h) / 2))}.sg-cap-b{transform:rotateX(-90deg) translateZ(calc(var(--h) / 2))}.sg-text{transform:translateZ(calc(var(--d) / 2 + 4px));transform-style:preserve-3d;place-items:center;display:grid;position:absolute;inset:0}.sg-word{transform-style:preserve-3d;font-family:var(--font-sign), cursive;font-weight:400;font-size:calc(var(--w) * .16);letter-spacing:0;white-space:nowrap;line-height:1.06;position:relative}.sg-slice{transform:translateZ(calc(var(--i) * var(--w) * .0038 * var(--s4)));color:#2a3350;opacity:var(--s4);place-items:center;display:grid;position:absolute;inset:0}.sg-ghost{visibility:hidden;position:relative}.sg-slice-top{color:color-mix(in srgb, #eef3ff calc(100% - var(--s5) * 100%), var(--color-vang) calc(var(--s5) * 100%));text-shadow:0 0 18px rgba(255, 199, 44, calc(var(--s5) * .85)), 0 0 44px rgba(255, 199, 44, calc(var(--s6) * .6))}.sg-led{transform:translateZ(calc(var(--d) / 2 + .5px));background-image:radial-gradient(circle,#ffd65ce6 0 1.7px,#0000 2.4px);background-size:calc(var(--w) * .05) calc(var(--w) * .05);opacity:calc(var(--s5) * .6);position:absolute;inset:6%}.sg-halo{transform:translateZ(calc(var(--d) / 2 + 3px));opacity:calc(var(--s5) * .5 + var(--s6) * .5);mix-blend-mode:screen;pointer-events:none;background:radial-gradient(60% 60%,#ffc72c6b 0%,#ffc72c00 72%);position:absolute;inset:0}.sg-rim{transform:translateZ(calc(var(--d) / 2 + 2px));opacity:calc(var(--s5) * .9);border:2px dashed #ffc72cf2;position:absolute;inset:1.5%;box-shadow:0 0 16px #ffc72c8c,inset 0 0 16px #ffc72c59}@supports (mask-composite:exclude){html.anim .proc-on .sg-rim{background-image:repeating-linear-gradient(90deg,#ffc72cf2 0 12px,#0000 12px 30px);background-size:42px 100%;background-origin:border-box;background-clip:border-box;border:3px solid #0000;animation:1.1s linear infinite sg-chase;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-clip:padding-box,border-box;mask-clip:padding-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude}}@keyframes sg-chase{to{background-position:42px 0}}.sg-spill{height:130%;transform:translateZ(calc(var(--d) / 2)) rotateX(74deg);transform-origin:top;opacity:var(--s6);filter:blur(10px);mix-blend-mode:screen;pointer-events:none;background:radial-gradient(50% 60% at 50% 0,#ffc72c80 0%,#ffc72c00 74%);position:absolute;top:88%;left:-35%;right:-35%}.sg-arm{width:6px;height:calc(var(--w) * .3);transform:translateZ(calc(var(--d) / -2)) rotateX(-90deg);transform-origin:top;opacity:var(--s6);background:linear-gradient(90deg,#6d788c,#39424f);position:absolute;top:46%;left:calc(50% - 3px)}.proc-copy{display:grid}.proc-step{--o:0;opacity:var(--o);transform:translateY(calc((1 - var(--o)) * 16px));pointer-events:none;grid-area:1/1}.proc-step[data-live]{pointer-events:auto}.proc-step-t{font-family:var(--font-heading);color:#fff;margin-top:.55rem;font-size:1.5rem;font-weight:700;line-height:1.2}@media (min-width:1024px){.proc-step-t{font-size:34px}}.proc-step-d{color:#ffffffbf;max-width:34rem;margin-top:.9rem;font-size:1rem;line-height:1.65}.proc-step dl{flex-wrap:wrap;gap:.4rem 1.6rem;margin-top:1rem;font-size:.8125rem;display:flex}.proc-step dt{color:#ffffff80;letter-spacing:.05em}.proc-step dd{font-family:var(--font-heading);color:#fff;font-weight:700}.proc-rail{z-index:1;gap:.4rem;width:100%;max-width:1180px;margin:0 auto;padding:1.1rem 1rem 0;display:flex;position:relative}@media (min-width:1024px){.proc-rail{padding:1.5rem 1.5rem 0}}.proc-rail i{background:#ffffff24;flex:1;height:3px;display:block;position:relative;overflow:hidden}.proc-rail i:after{content:"";background:linear-gradient(90deg, var(--color-cam), var(--color-vang));transform:scaleX(var(--f,0));transform-origin:0;position:absolute;inset:0}.proc-hint{z-index:2;font-family:var(--font-heading);letter-spacing:.18em;text-transform:uppercase;color:#ffffff80;opacity:calc(1 - var(--p) * 9);pointer-events:none;place-items:center;gap:.45rem;font-size:.6875rem;font-weight:600;display:grid;position:absolute;bottom:1.4rem;left:50%;transform:translate(-50%)}.proc-hint svg{width:18px;height:18px;stroke:var(--color-vang);stroke-width:2px;fill:none}html.anim .proc-on .proc-hint svg{animation:1.6s ease-in-out infinite proc-bob}@keyframes proc-bob{0%,to{opacity:.55;transform:translateY(-3px)}50%{opacity:1;transform:translateY(3px)}}.proc:not(.proc-on) .proc-hint{display:none}.proc:not(.proc-on) .proc-copy{grid-auto-flow:row;gap:2.25rem}.proc:not(.proc-on) .proc-step{opacity:1;pointer-events:auto;grid-area:auto;transform:none}.proc:not(.proc-on) .proc-rail{display:none}.proc:not(.proc-on) .proc-stage{padding:3.5rem 0}@media (max-width:1023px){.proc-grid{align-content:center;gap:.25rem}.proc-view{min-height:38svh}.sg{--w:min(84vw, 420px)}.proc-rail{padding-bottom:4rem}.sg-word .sg-slice:nth-child(2n){display:none}.sg-slice{transform:translateZ(calc(var(--i) * var(--w) * .0076 * var(--s4)))}.proc-hint{bottom:calc(5rem + env(safe-area-inset-bottom))}.sg-spill{filter:none;mix-blend-mode:normal;background:radial-gradient(50% 60% at 50% 0,#ffc72c57 0%,#ffc72c00 78%)}}@media (prefers-reduced-motion:reduce){html.anim .proc-on .sg-rim{animation:none}}