/* Composition follows the selected Violet × Lime reference. */
body{background:#09060f;overflow-x:clip}
.wrap{width:calc(100% - 76px);max-width:1536px;padding-left:28px;padding-right:28px;border-left:1px solid #6e459c30;border-right:1px solid #6e459c30}
.edition{height:48px;padding:12px 55px;color:#b99de9;font-size:10px;letter-spacing:2.5px;border-bottom:1px solid #71529e55;background:linear-gradient(90deg,transparent,#36204920,transparent)}
.header{height:82px;border-bottom:1px solid #71529e55;background:transparent}
.header .brand{font-size:28px;letter-spacing:-1px}.header nav{gap:42px;font-size:15px}.header .small{padding:14px 20px;min-width:190px;border-radius:15px}.bolt{font-size:0;width:34px;height:44px;background:var(--lime);clip-path:polygon(63% 0,6% 58%,46% 58%,28% 100%,96% 38%,55% 38%)}
.hero{height:460px;min-height:0;isolation:isolate;overflow:visible;border-bottom:1px solid #8c5db577;background:linear-gradient(90deg,#11091a66,transparent 60%)}
.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,#8d5fbd28 45%,transparent calc(45% + 1px)),linear-gradient(0deg,transparent 58%,#8d5fbd19 58%,transparent calc(58% + 1px));z-index:-1;pointer-events:none}
.hero-art{width:75%;height:660px;right:-28px;top:-130px;object-fit:cover;object-position:center;opacity:1;z-index:-2;mask-image:linear-gradient(90deg,transparent,#000 18%);clip-path:inset(0 0 70px 0)}
.hero:after{inset:auto 0 0;height:45px;background:linear-gradient(transparent,#09060f88);z-index:-1}
.hero-copy{padding:0;z-index:1;width:100%}.hero .eyebrow{font-size:13px;letter-spacing:4px;margin-bottom:24px}.hero .eyebrow span{display:none}
h1{font-size:clamp(64px,6.5vw,104px);font-weight:900;line-height:.96;letter-spacing:-4.5px;margin:0 0 24px;max-width:800px;text-shadow:0 2px 20px #09060f33}
.hero-description{font-size:23px;margin:0 0 25px;color:#f2edf7;letter-spacing:-.4px}.hero-actions{gap:30px}.hero-actions .button{min-width:248px;padding:19px 25px;font-size:18px;border-radius:17px;gap:28px;box-shadow:0 0 32px #b5ff5520}.hero-actions .text-link{font-size:17px;gap:24px;border-image:linear-gradient(90deg,#a771ef,transparent) 1}.hero-side{position:absolute;right:27px;top:61px;font-size:9px;line-height:1.7;letter-spacing:3px;color:#b08ddd;width:54px}.hero-side i{display:block;width:18px;height:1px;background:var(--lime);margin:20px 0}
.device-choice{padding-top:35px;padding-bottom:34px;border-bottom:1px solid #805ba677;background:radial-gradient(ellipse at 88% 95%,#44216725,transparent 50%);position:relative}.device-choice:after{content:'';position:absolute;right:25px;top:30px;width:240px;height:55px;background-image:radial-gradient(#a678e84d 1px,transparent 1px);background-size:11px 11px;pointer-events:none}
.device-choice h2{font-size:clamp(38px,3.65vw,60px);font-weight:850;letter-spacing:-1.7px;margin:0 0 24px}.device-tabs{gap:14px;margin:0}.device-tabs button{height:170px;padding:28px 24px;background:radial-gradient(ellipse at 75% 100%,#4a24673d,transparent 65%),#0c0912;border:1px solid #60437b;border-radius:11px;overflow:hidden}.device-tabs button.selected{background:radial-gradient(ellipse at 75% 100%,#4a24673d,transparent 65%),#0c0912;border-color:#76549c}.device-tabs button:hover{border-color:var(--lime);background-color:#1a1025}.device-tabs strong{position:relative;z-index:1;font-size:26px;line-height:1.2;margin-bottom:16px}.device-tabs small{position:relative;z-index:1;font-size:15px;line-height:1.35;color:#b9a9cc;max-width:140px}.device-arrow{width:40px;height:40px;display:grid;place-items:center;border:1px solid #b78cfc;border-radius:50%;right:23px;bottom:35px;font-size:23px;background:#160c2366;z-index:2}.device-visual{display:block;position:absolute;right:58px;bottom:10px;width:145px;height:145px;background-image:url('assets/devices.png');background-size:400% 100%;background-repeat:no-repeat;filter:drop-shadow(0 10px 12px #8c42ef20)}.visual-xbox{background-position:0 50%}.visual-windows{background-position:33.333% 50%}.visual-router{background-position:66.666% 50%}.visual-phone{background-position:100% 50%}
.setup{padding-top:30px;padding-bottom:50px;background:linear-gradient(#09060fe8,#09060f),url('assets/portal.png') center 40%/cover}.steps-title{text-align:center;margin-bottom:34px}.steps-title h2{font-size:48px;letter-spacing:-1.5px;font-weight:850}.steps-title>span{display:block;width:52px;height:2px;background:#b590ed;margin:14px auto}.steps-title p{font-size:13px;color:#b09ec2;margin:0}.setup-panel{max-width:1100px;margin:auto}.notice{max-width:1100px;margin:18px auto 0}.services,.how,.faq{padding-top:64px;padding-bottom:64px}.header:before,.hero:before,.device-choice:before{background-repeat:no-repeat}.final-cta{padding-top:50px;padding-bottom:50px}footer{padding-top:30px;padding-bottom:30px}.final-cta .bolt{width:46px;height:66px;flex-shrink:0}footer .bolt{width:22px;height:30px}
@media(min-width:1700px){.hero{height:510px}.hero-art{height:710px}.device-tabs button{height:180px}}
@media(max-width:1200px) and (min-width:761px){.wrap{width:calc(100% - 48px);padding-left:22px;padding-right:22px}.edition{padding-left:46px}.header nav{gap:22px}.hero{height:420px}h1{font-size:6.4vw;letter-spacing:-3px}.hero-description{font-size:19px}.hero-art{right:-22px;height:600px;top:-100px;clip-path:inset(0 0 80px 0)}.hero-side{display:none}.device-tabs button{padding:22px 17px;height:155px}.device-tabs strong{font-size:22px}.device-tabs small{font-size:12px}.device-visual{width:110px;height:125px;right:24px;bottom:4px}.device-arrow{width:29px;height:29px;right:12px;bottom:15px;font-size:18px}.steps-title h2{font-size:40px}}
@media(max-width:760px){.wrap{width:calc(100% - 28px);padding-left:14px;padding-right:14px}.edition{height:30px;padding:8px 28px;font-size:7px;letter-spacing:2px}.header{height:68px}.header .brand{font-size:22px}.header .bolt{width:24px;height:34px}.header .small{padding:9px 12px;font-size:10px;min-width:0;border-radius:10px;gap:12px}.hero{height:650px;min-height:0;display:block;padding-top:34px}.hero-copy{padding:0}.hero .eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:23px}h1{font-size:clamp(39px,8.8vw,64px);letter-spacing:-2px;line-height:1.02;margin-bottom:20px}.hero-description{font-size:14px;max-width:320px;line-height:1.5;margin-bottom:20px}.hero-actions{gap:16px;align-items:center}.hero-actions .button{min-width:0;padding:14px 17px;font-size:12px;gap:15px;border-radius:12px}.hero-actions .text-link{font-size:11px;gap:12px}.hero-art{width:calc(100% + 28px);right:-14px;top:255px;height:395px;object-fit:cover;clip-path:none;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 90%,transparent)}.hero:after{display:none}.hero-side{display:none}.device-choice{padding-top:25px;padding-bottom:25px}.device-choice:after{display:none}.device-choice h2{font-size:31px;line-height:1.1;letter-spacing:-1px;max-width:300px;margin-bottom:23px}.device-tabs{gap:10px}.device-tabs button{height:190px;padding:16px 13px}.device-tabs strong{font-size:21px;margin-bottom:7px}.device-tabs small{font-size:11px;line-height:1.3}.device-visual{height:104px;width:104px;right:23px;bottom:1px}.device-arrow{height:27px;width:27px;right:10px;bottom:13px;font-size:17px}.setup{padding-top:28px;padding-bottom:32px}.steps-title h2{font-size:31px;letter-spacing:-1px}.steps-title p{font-size:11px}.steps-title{margin-bottom:25px}.services,.how,.faq{padding-top:42px;padding-bottom:42px}.final-cta{padding-top:35px;padding-bottom:35px}.final-cta .bolt{width:30px;height:47px}.final-cta h2{font-size:22px}footer{padding-top:25px;padding-bottom:25px}}
.device-visual{background-size:400% auto}.hero-side{width:70px;right:12px}
.service-card{min-height:232px;padding:22px 20px 25px;background:radial-gradient(ellipse at 50% 25%,#6334a225,transparent 66%),linear-gradient(135deg,#171020,#0d0913);transition:border-color .2s,background .2s}.service-card:hover{border-color:#9465c8}.service-mark{width:118px;height:118px;margin:0 auto 19px;border-radius:0;background-image:url(assets/services.png);background-color:transparent;background-size:500% 200%;background-repeat:no-repeat;filter:drop-shadow(0 8px 12px #773bd12b);transition:transform .2s}.service-card:hover .service-mark{transform:translateY(-4px)}.service-card h3{text-align:center;font-size:15px}.service-card p{text-align:center;line-height:1.5;margin-top:6px}@media(max-width:760px){.service-card{padding:17px 10px 20px;min-height:209px}.service-mark{width:100px;height:100px;margin-bottom:15px}.service-card h3{font-size:13px}.service-card p{font-size:10px}}
