/* PC Builder / Studio Edition — major visual redesign, layered on existing app */
:root{--navy:#080f1d;--navy2:#101c30;--ink:#111c2e;--muted:#657187;--line:#e4e9f0;--bg:#f5f7fa;--blue:#2666ed;--blue-soft:#e9f0ff;--radius:20px;--shadow:0 16px 50px rgba(13,29,52,.065)}
body{background:var(--bg);letter-spacing:-.008em}
.wrap{max-width:1320px;padding-left:32px;padding-right:32px}
.topbar{background:#fff;color:#111c2e;border-bottom:1px solid #e9edf4;position:relative;z-index:12}
.topbar .wrap{padding-top:20px;padding-bottom:20px}
.logo{width:47px;height:47px;border-radius:14px;background:#101c30;box-shadow:0 5px 18px rgba(16,28,48,.15)}
.brand strong{font-size:19px;font-weight:800;letter-spacing:-.04em}
.brand span{color:#7c879a;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:700}
.contact{font-weight:650;font-size:13px}.contact a{color:#24354c;opacity:1}
.hero{background:#080f1d;min-height:680px;padding:105px 0 168px;isolation:isolate}
.hero .wrap{position:relative;z-index:2}
.hero-slides{left:43%;z-index:-2;overflow:hidden}
.hero-slides:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#080f1d 0%,rgba(8,15,29,.06) 35%,rgba(8,15,29,.05) 80%),linear-gradient(0deg,rgba(8,15,29,.4),transparent 60%);pointer-events:none}
.hero-shade{background:linear-gradient(90deg,#080f1d 0%,#080f1d 31%,rgba(8,15,29,.93) 42%,rgba(8,15,29,.25) 72%,rgba(8,15,29,.15) 100%)}
.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 16% 24%,rgba(34,98,227,.16),transparent 36%);pointer-events:none}
.hero-eyebrow{display:inline-flex;align-items:center;border:1px solid rgba(133,170,255,.27);border-radius:100px;padding:10px 15px;background:rgba(56,102,188,.12);color:#a8c6ff;font-size:11px;letter-spacing:.17em;font-weight:800;margin-bottom:27px}
.hero h1{font-size:clamp(50px,5.5vw,78px);line-height:1.04;letter-spacing:-.065em;max-width:770px;margin-bottom:25px;font-weight:800}
.hero h1 em{display:block;color:#8db7ff;background:none;-webkit-text-fill-color:initial}
.hero p{font-size:16px;line-height:1.85;color:#b3c0d3;max-width:555px}
.badges{max-width:610px;gap:10px;margin-top:30px}
.badges li{border:1px solid rgba(153,180,218,.2);background:rgba(255,255,255,.045);border-radius:9px;padding:10px 13px;font-size:12px;color:#d9e4f5}
.badges svg{color:#7fe1bf}
.hero-cta{margin-top:35px}.hero-main-link{background:#f1f6ff;color:#0d1a2e;border-radius:12px;font-size:15px;font-weight:800;padding:18px 25px;box-shadow:0 18px 40px rgba(0,0,0,.2)}.hero-main-link:hover{background:#fff;color:#0d1a2e}.hero-cta-note{color:#b4c3d9}
.hero-ctrl{margin-top:36px}.hero-cap{color:#d8e2f1}
main.wrap{margin-top:-70px}
.wizard-intro{padding:0 4px 25px}.wizard-intro h2{font-size:35px;letter-spacing:-.055em}.wizard-intro p{font-size:15px}.section-kicker{color:#9bbdff}
.panel{border:1px solid #e6eaf1;border-radius:22px;box-shadow:0 16px 55px rgba(10,29,58,.075)}
#wizard{overflow:hidden;border:1px solid rgba(222,230,240,.9);box-shadow:0 25px 65px rgba(10,29,58,.11)}
.steps{background:#f8fafd;border-bottom:1px solid #e7ebf2;gap:0;padding:10px 16px}
.steps button{padding:20px 17px;border-bottom:0;border-radius:13px;position:relative;transition:background .2s}
.steps button.active{background:#fff;box-shadow:0 4px 20px rgba(23,43,77,.075)}
.steps button.active .n{background:#142641;color:#fff}
.steps .n{width:38px;height:38px;background:#e9eef6;font-size:14px}
.steps .t{font-size:14px;font-weight:750}.steps .t small{margin-top:5px;font-size:11px;font-weight:500}
.stepbody{padding:46px 48px 52px}.stepbody h2{font-size:32px;letter-spacing:-.05em;font-weight:800}.stepbody .sub{font-size:15px;line-height:1.7;margin:9px 0 28px}
.grid{gap:18px}
.choice{border:1px solid #e0e6ef;border-radius:18px;padding:28px 24px 30px;background:linear-gradient(155deg,#fff 65%,#f9fbff);min-height:195px;box-shadow:0 3px 10px rgba(17,37,65,.025);transition:transform .2s,border-color .2s,box-shadow .2s}
.choice:hover{transform:translateY(-5px);border-color:#98b5ef;box-shadow:0 20px 35px rgba(22,51,93,.09)}
.choice.sel{border:2px solid #2867ed;padding:27px 23px 29px;background:linear-gradient(150deg,#fff,#eff5ff);box-shadow:0 0 0 4px #eaf1ff,0 16px 35px rgba(34,94,203,.1)}
.choice h3{font-size:18px;font-weight:800;letter-spacing:-.035em;margin-top:19px}.choice p{font-size:13px;line-height:1.7}
.choice .check{width:25px;height:25px;top:17px;right:17px}
.brand-logo{height:90px}.brand-logo img{object-position:left center}
.ico{width:54px;height:54px;border-radius:15px;background:#e9f0ff;color:#2465e9}
.btn{border-radius:11px;padding:15px 23px;font-weight:750}.btn-primary{background:#1559df;box-shadow:0 8px 20px rgba(25,85,211,.2)}.btn-primary:hover{background:#0c47bc}
.btn-ghost{background:#f1f4f9}.actions{margin-top:36px}
select,input[type=number],input[type=text],input[type=email],textarea,.toggle{border-radius:12px;padding:13px 15px}
label.f{font-weight:750;color:#40516a}
.budget-box{gap:36px}.breakdown{background:#f7f9fc;border-radius:18px;padding:26px}.money-in{border-radius:16px;padding:13px 20px;max-width:400px}.money-in input{font-size:44px}
.block{margin-top:75px}.sec-head h2,.service h2,.faq h2{font-size:30px;letter-spacing:-.05em}
.pcards{gap:20px}.service{border-radius:22px}.dark{background:#101d31}.faq{padding:38px}
footer{margin-top:90px}
/* Distinctive editorial detail */
#wizard:before{content:"CONFIGURE / YOUR SYSTEM";display:block;padding:13px 48px;background:#101e33;color:#a6c1e7;font-size:10px;font-weight:800;letter-spacing:.23em}
@media(max-width:980px){.hero{min-height:620px}.hero-slides{left:30%}.hero-shade{background:linear-gradient(90deg,#080f1d 0%,rgba(8,15,29,.92) 40%,rgba(8,15,29,.38) 100%)}.hero h1{font-size:clamp(44px,7vw,68px)}.stepbody{padding:32px}.steps button{padding:14px 10px}.choice{padding:20px}}
@media(max-width:760px){.wrap{padding-left:18px;padding-right:18px}.topbar .wrap{padding-top:14px;padding-bottom:14px}.hero{padding:65px 0 135px;min-height:0}.hero-slides{left:0;opacity:.45}.hero-shade{background:linear-gradient(90deg,rgba(8,15,29,.94),rgba(8,15,29,.8))}.hero h1{font-size:clamp(41px,10vw,58px)}.hero p{font-size:14px;line-height:1.75}.hero-eyebrow{font-size:9px}.badges li{font-size:11px}.hero-main-link{width:100%}main.wrap{margin-top:-48px}.wizard-intro h2{font-size:27px}#wizard:before{padding:12px 20px}.steps{padding:6px}.steps button{padding:11px 4px;flex-direction:column;text-align:center;gap:7px}.steps .n{width:31px;height:31px}.steps .t{font-size:11px}.steps .t small{display:none}.stepbody{padding:26px 20px 32px}.stepbody h2{font-size:26px}.choice{min-height:0}.grid{gap:12px}.block{margin-top:50px}.contact{font-size:12px}}
@media(prefers-reduced-motion:reduce){.choice{transition:none}}