/* Cyberpunk skin for the services page. Loaded after /cyber.css (shared tokens, HUD, terminal, effects)
   and after services.css, so it only restyles this page's own components into the lab's neon look. */
:root{--r:0px;--accent-ink:#fff;--ok:#3DFFA2;--bad:#FF4D6D;--warn:#FFC940}
:root[data-theme="light"]{--accent-ink:#fff;--ok:#0E9A5C;--bad:#D0204A;--warn:#A77A00}

/* header */
.top{border-bottom:1px solid var(--line2)}
.top nav a{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.top nav{gap:14px}
.top nav a:hover{color:var(--neon);text-shadow:0 0 10px var(--neon)}
.seg,.seg button,.menu,.menu i,.theme,.theme i{border-radius:0}
.seg{clip-path:var(--cut-sm)}
.seg button.on{background:var(--accent);color:#fff;box-shadow:0 0 14px -2px var(--accent)}
.menu i{background:var(--neon)}
@media (max-width:1360px){.top nav{background:rgba(5,10,28,.96);border-bottom:1px solid var(--neon);box-shadow:0 20px 40px rgba(0,0,0,.5),0 0 30px -10px var(--accent)}:root[data-theme="light"] .top nav{background:rgba(255,255,255,.96)}}

/* type */
h1,h2,.sec-h h2,.cta h2,.group h3,.card .name,.mcard .name,.mcard .size,.tile.lead h3,.term-done .serif,.sizer .out b{font-family:var(--serif);font-weight:700;letter-spacing:-.01em}
h1,.sec-h h2,.cta h2,.card .name,.mcard .size{text-transform:uppercase}
.hero h1{font-size:clamp(34px,4.2vw,56px);line-height:1.02;text-shadow:0 0 22px var(--glow)}
.hero h1 em{font-style:normal;color:var(--accent);text-shadow:-2px 0 var(--hot),2px 0 var(--neon),0 0 24px var(--accent)}
.card .name{font-size:19px;line-height:1.2;letter-spacing:.01em}
.mono{color:var(--neon)}
.hero .mono::before,.sec-h .mono::before{content:"// ";color:var(--hot)}
.sec-h::after{background:linear-gradient(90deg,var(--neon),var(--accent) 30%,var(--line) 60%)}
.progress{background:linear-gradient(90deg,var(--hot),var(--accent),var(--neon));box-shadow:0 0 12px var(--accent)}

/* buttons, chips, fields */
.btn{border-radius:0;clip-path:var(--cut-sm);text-transform:uppercase;letter-spacing:.12em;font:700 13.5px/1 var(--sans);background:var(--accent);color:#fff;box-shadow:0 0 22px -4px var(--accent)}
.btn:hover{box-shadow:0 0 30px var(--accent);text-shadow:-1px 0 var(--hot),1px 0 var(--neon)}
.btn.ghost{background:rgba(77,243,255,.08);color:var(--neon);border:1px solid var(--neon);box-shadow:none}
.btn.ghost:hover{background:rgba(255,61,219,.1);border-color:var(--hot);color:var(--tx)}
.chip{border-radius:0;clip-path:var(--cut-sm);font-family:var(--mono);font-size:12px;letter-spacing:.06em;border-color:var(--line2);background:rgba(77,121,255,.08)}
.chip:hover,.chip.on,.chip[aria-pressed="true"]{border-color:var(--neon);color:var(--neon);background:rgba(77,243,255,.08);box-shadow:0 0 14px -4px var(--neon)}
.search input,.sel,.fld input,.fld select,.fld textarea{border-radius:0;background:rgba(5,10,28,.6);font-family:var(--sans)}
:root[data-theme="light"] .search input,:root[data-theme="light"] .sel,:root[data-theme="light"] .fld input,:root[data-theme="light"] .fld select,:root[data-theme="light"] .fld textarea{background:#fff}
.search input:focus,.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--neon);box-shadow:0 0 0 1px var(--neon),0 0 18px -4px var(--neon)}
.fld > span b{color:var(--hot)}
.badge{border-radius:0;clip-path:var(--cut-sm)}
.meta span,.founding,.summary,.sizer,.calc .in,.calc .stat,.calc .bar,.search kbd,.toast{border-radius:0}

/* panels: cut corners, neon edge */
.card,.mcard,.tile,.readout,.term,.founding,.sizer,.calc .in,.calc .stat,.calc .bar{border-radius:0;clip-path:var(--cut);border-color:var(--line2);box-shadow:inset 0 0 0 1px rgba(77,243,255,.08),inset 0 0 40px -18px var(--accent)}
.card:hover,.mcard:hover{border-color:var(--c,var(--accent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c,var(--accent)) 40%,transparent),inset 0 0 60px -20px var(--c,var(--accent))}
.card.flag-flagship{--c:var(--bosla)} .card.flag-new{--c:var(--neon)} .card.flag-start{--c:var(--atlas)}
.card::before,.mcard::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--c);opacity:.9}
.card::after,.mcard::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(var(--line2) .7px,transparent .9px);background-size:9px 9px;opacity:.22;mask-image:radial-gradient(ellipse at 100% 0%,#000 0%,transparent 55%)}
.card > *,.mcard > *{position:relative;z-index:1}
.price .v{color:var(--neon);text-shadow:0 0 10px var(--glow)}
.card .waits{border-left-color:var(--hot)}
.term-hd{background:rgba(77,121,255,.08);border-bottom:1px dashed var(--line2)}
.term-hd .mono::before{content:"▮ ";color:var(--hot)}
.cbar,.sticky{border-radius:0;clip-path:var(--cut-sm);border-color:var(--neon);background:rgba(5,10,28,.92)}
:root[data-theme="light"] .cbar,:root[data-theme="light"] .sticky{background:rgba(255,255,255,.95)}
.strip{border-color:var(--line2);background:rgba(77,121,255,.05)}
.strip li b{color:var(--neon);text-shadow:0 0 10px var(--neon)}
.faq summary{font-family:var(--serif);font-weight:600;letter-spacing:.02em}
.faq details[open] summary{color:var(--neon)}
.steps li{border-top-color:var(--line2)}
.status i,.cap{border-radius:0}
.founding .ring .fg{stroke:var(--neon);filter:drop-shadow(0 0 6px var(--neon))}
.calc .stat.win b{color:var(--atlas);text-shadow:0 0 12px var(--atlas)}
dialog.cdlg{border-radius:0;border-color:var(--neon);box-shadow:0 0 60px -10px var(--accent)}
.cdlg .hd{background:rgba(77,121,255,.08)}
.card.hit{box-shadow:0 0 0 1px var(--neon),0 0 30px -8px var(--neon)}