/* Socialize: dimensional acquisition system */
:root{--electric:#b5a0ff;--neon:#ff62b1}
body{background:#fcfbfd}header{background:#100d20f2;color:#fff;border-color:#ffffff12}.nav{min-height:88px}.brand b{color:#ff70b9}.nav nav{color:#d8d0e7}.brand small{color:#b9afcd}.menu-toggle{color:var(--ink)}
.hero{background:#100d20;color:#fff;position:relative;isolation:isolate;padding-top:88px;min-height:820px;overflow:hidden}.hero:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 76% 40%,#65419730,transparent 51%),radial-gradient(ellipse at 4% 0%,#d9368718,transparent 48%);z-index:-1}.hero:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.25;background-image:linear-gradient(#c5aaff0b 1px,transparent 1px),linear-gradient(90deg,#c5aaff0b 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(black,transparent 85%);z-index:-1}.hero-grid{position:relative;z-index:2;gap:62px;align-items:center}.hero .eyebrow{color:#d5c8e7}.hero h1{font-size:clamp(42px,4.4vw,66px);letter-spacing:-2.6px;line-height:1.1}.hero h1 em{color:#ff70b9;background:linear-gradient(110deg,#ff70b9 5%,#f380ca 45%,#b8a1ff 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero .intro{color:#bcb3ce;max-width:530px}.hero .hero-note{color:#a99dbd;border-color:#ffffff20}.hero .hero-note strong{color:#d3c6e3}.hero .text-link{color:#e1d7ef}.hero .button,.nav .button{background:#ff63ac;color:#20102b;box-shadow:0 4px 24px #ef4d9b22}.hero .button:hover,.nav .button:hover{background:#ff85c0;box-shadow:0 6px 35px #ef4d9b55}.hero-strip{position:relative;z-index:2;border-color:#ffffff16;color:#b2a6c5;margin-top:90px;padding-bottom:30px}.hero-strip b{color:#f3d9ed}.hero .line{background:#ff70b9;box-shadow:0 0 20px #ff70b980}
.stage{position:relative;perspective:1200px;isolation:isolate;padding:23px 8px 30px;min-width:0}.orbit-canvas{position:absolute;width:calc(100% + 190px);height:calc(100% + 150px);left:-95px;top:-75px;z-index:-1;pointer-events:none;opacity:.85}.operation{transform:rotateX(var(--rx,5deg)) rotateY(var(--ry,-10deg)) rotateZ(-2deg);transform-style:preserve-3d;transition:transform .55s cubic-bezier(.22,1,.36,1);background:linear-gradient(145deg,#332345ee,#1c152eee 62%);border:1px solid #d2b3ff35;box-shadow:20px 24px 0 -12px #191126,21px 25px 0 -11px #c992ee2a,0 42px 90px #0009,inset 0 1px 0 #ffffff20;will-change:transform}.operation:before{content:'';position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(ellipse at var(--px,50%) var(--py,0%),#fbc3ff22,transparent 60%);pointer-events:none}.operation-title{transform:translateZ(28px)}.operation-title h2{font-size:27px}.flow{transform-style:preserve-3d}.flow-row{transform:translateZ(10px);transition:transform .6s,background .6s,border-color .6s,box-shadow .6s;background:#ffffff05;border-color:#ffffff12}.flow-row.active{background:#ee5baa12;border-color:#ef70b755;transform:translateZ(16px)}.flow-row.is-current{transform:translateZ(42px) translateX(-7px);border-color:#ff88c6a6;background:linear-gradient(100deg,#b53b7b5c,#342644e8);box-shadow:0 13px 24px #0005,0 0 25px #e650a314}.flow-row.is-current .flow-icon{color:#261536;background:#ff79bd;box-shadow:0 0 20px #ff62b155}.flow-row.is-current strong{color:#fff}.flow-row small{font-size:11px;color:#c5b2d7}.flow-row strong{font-size:14px}.flow-icon{transition:background .5s,box-shadow .5s}.flow-row.active .flow-icon{background:#ba5990;color:#fff}.flow-row.is-current.active .flow-icon{background:#ff79bd;color:#261536}.operation-top{font-size:11px}.operation-bottom,.operation-bottom small,.flow-end,.tag{font-size:11px}.orbit{background:#ffffff04;color:#ff85c6;box-shadow:inset 0 0 22px #d69dfc10}.float-chip{position:absolute;padding:13px 18px;background:linear-gradient(120deg,#4c2c59f5,#23182cf5);border:1px solid #e9b0ed50;border-radius:10px;box-shadow:0 18px 35px #0005;color:#f2dcef;z-index:4;display:flex;align-items:center;gap:12px;pointer-events:none;animation:chip-float 6s ease-in-out infinite}.float-chip b{font-size:13px;display:block;line-height:1.3}.float-chip small{font-size:11px;color:#c4adce;display:block}.chip-icon{font-size:24px;color:#ff84c5}.float-chip.top{top:-10px;right:-20px;transform:rotate(5deg)}.float-chip.bottom{bottom:2px;left:-38px;animation-delay:-3s;background:linear-gradient(120deg,#3d3159f5,#201831f5)}.float-chip.bottom .chip-icon{color:#c6b1ff}.stage:after{content:'';position:absolute;bottom:-18px;left:10%;right:10%;height:42px;border-radius:50%;background:#a639c73d;filter:blur(30px);z-index:-1}
.scroll-progress{position:fixed;left:0;top:0;height:2px;background:linear-gradient(90deg,#f35aa7,#b49aff);transform-origin:left;transform:scaleX(0);width:100%;z-index:50;pointer-events:none;box-shadow:0 0 12px #ed4d9b80}
.reveal-ready{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}.reveal-ready.is-visible{opacity:1;transform:translateY(0)}.system-grid{perspective:1100px}.system-step{position:relative;transition:transform .4s,background .4s,box-shadow .4s;background:#ffffff02;transform-style:preserve-3d}.system-step:hover{background:#ffffff08;transform:translateY(-7px) rotateX(3deg);box-shadow:0 18px 30px #0002;z-index:2}.system-step h3{transition:color .3s}.system-step:hover h3{color:#ff88c6}.system-step .num{display:inline-flex;align-items:center;justify-content:center;width:43px;height:43px;border:1px solid #f575b84d;border-radius:10px;background:linear-gradient(140deg,#f15ca52b,#231b32);box-shadow:4px 4px 0 #0e091c66;transform:rotate(-7deg)}.case{position:relative;overflow:hidden;transition:transform .4s,border-color .4s,box-shadow .4s;background:linear-gradient(140deg,#ffffff0a,#ffffff02)}.case:after{content:'';position:absolute;inset:0;transform:translateX(-120%) skewX(-20deg);background:linear-gradient(90deg,transparent,#ffffff0b,transparent);pointer-events:none}.case:hover{transform:translateY(-8px);border-color:#f574b277;box-shadow:0 20px 30px #0002}.case:hover:after{animation:shine .9s ease}.case-value{background:linear-gradient(90deg,#ff77b8,#c7a9ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.tool{transition:transform .35s,box-shadow .35s,border-color .35s}.tool:hover{transform:translateY(-7px);border-color:#ed4d9b60;box-shadow:0 15px 30px #21183f0a}.tool>span{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:linear-gradient(140deg,#fff,#f4d5e7);border:1px solid #ed4d9b20;box-shadow:4px 4px 0 #ed4d9b16;transform:rotate(-5deg)}.funnel{box-shadow:12px 14px 0 -4px #efe6f5;transform:perspective(1000px) rotateY(-5deg)}.funnel .bar{transform-origin:left;animation:none}.funnel.is-visible .bar{animation:bar-enter 1s cubic-bezier(.22,1,.36,1) both}.funnel.is-visible .bar:nth-child(3){animation-delay:.1s}.funnel.is-visible .bar:nth-child(4){animation-delay:.2s}.funnel.is-visible .bar:nth-child(5){animation-delay:.3s}.funnel.is-visible .bar:nth-child(6){animation-delay:.4s}.about-mark{background:radial-gradient(circle at 30% 25%,#f5d6ed,transparent 55%),#f2edf7;perspective:800px}.about-mark img{filter:drop-shadow(14px 18px 10px #40264425);transition:transform .6s}.about-mark:hover img{transform:rotateY(-15deg) rotateX(7deg) translateZ(30px)}.section.dark{background:radial-gradient(ellipse at 100% 0%,#70346422,transparent 65%),#1d142e}.dark .form{box-shadow:12px 14px 0 -4px #a8629d28;border:1px solid #e6cfe9}.button{position:relative;overflow:hidden}.button:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff35,transparent 70%);transform:translateX(-120%);pointer-events:none}.button:hover:after{animation:shine .65s ease}.button span{transition:transform .25s}.button:hover span{transform:translate(3px,-3px)}
@keyframes chip-float{0%,100%{translate:0 0}50%{translate:0 -12px}}@keyframes shine{to{transform:translateX(120%) skewX(-20deg)}}@keyframes bar-enter{from{opacity:.3;scale:.35 1}to{opacity:1;scale:1 1}}@keyframes hero-enter{from{opacity:0;translate:0 25px}to{opacity:1;translate:0 0}}.motion-on .hero h1{animation:hero-enter .9s ease both}.motion-on .hero .intro{animation:hero-enter .9s .12s ease both}.motion-on .hero-actions{animation:hero-enter .9s .22s ease both}
@media(min-width:1500px){.hero{padding-top:100px}.hero-grid{gap:100px}.operation{padding:30px}.hero-strip{margin-top:105px}}
@media(max-width:1150px){.hero-grid{gap:36px}.stage{padding-right:0;padding-left:0}.float-chip.top{right:-7px}.float-chip.bottom{left:-14px}.hero h1{font-size:clamp(43px,4.6vw,60px)}.operation-title h2{font-size:23px}.operation-top{font-size:10px}.hero .brand small{display:none}}
@media(max-width:760px){.hero{padding-top:46px;min-height:0}.hero-grid{gap:55px}.hero h1{font-size:clamp(39px,9.5vw,58px);letter-spacing:-1.8px}.nav{min-height:78px}.nav nav{background:#171025;color:#ddd0ed;border-color:#ffffff20}.hero .eyebrow{font-size:10px}.stage{margin:0 9px 0 6px;padding:28px 0 35px}.operation{transform:rotateX(3deg) rotateY(-6deg) rotateZ(-1deg);padding:24px 18px}.operation-title h2{font-size:24px}.flow-row{padding:12px;gap:10px}.flow-row small{font-size:10px}.flow-row strong{font-size:13px}.flow-row.is-current{transform:translateZ(24px) translateX(-3px)}.float-chip{padding:10px 13px}.float-chip.top{top:-3px;right:-8px}.float-chip.bottom{left:-8px;bottom:2px}.float-chip b{font-size:12px}.float-chip small{font-size:10px}.operation-bottom{flex-wrap:wrap;gap:3px;font-size:10px}.operation-bottom small{font-size:10px}.operation-top{font-size:9px;letter-spacing:.7px}.flow-end{font-size:10px;padding-right:0;padding-left:0}.orbit-canvas{width:calc(100% + 100px);left:-50px;height:calc(100% + 90px);top:-45px}.hero-strip{margin-top:30px;padding-bottom:25px}.funnel{transform:none;box-shadow:7px 9px 0 -3px #efe6f5}.system-step:hover{transform:none}.dark .form{box-shadow:6px 8px 0 -2px #a8629d28}.footer-bottom{padding-bottom:42px}}
