*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}

:root{
  --bg:#0a0a0a;
  --fg:#f5f5f5;
  --dim:#7a7a7a;
  --dim2:#9a9a9a;
  --accent:#ff3d00;
  --accent-dim:rgba(255,61,0,0.12);
  --line:#222;
  --line2:#333;
  --grid:rgba(255,61,0,0.06);
  --good:#00d97e;
}

body{
  background:var(--bg);
  color:var(--fg);
  font-family:'Space Mono',monospace;
  font-size:14px;
  line-height:1.55;
  overflow-x:hidden;
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:80px 80px;
  background-position:-1px -1px;
  background-attachment:fixed;
}

/* ============ CUSTOM BRUTALIST CURSOR ============ */
@media (hover:hover) and (pointer:fine){
  *,*:hover{cursor:none !important;}
  .cursor-dot{
    position:fixed;top:0;left:0;width:6px;height:6px;
    background:var(--accent);pointer-events:none;z-index:9999;
    transform:translate(-50%,-50%);transition:width .15s, height .15s;
    mix-blend-mode:difference;
  }
  .cursor-ring{
    position:fixed;top:0;left:0;width:32px;height:32px;
    border:1px solid var(--accent);pointer-events:none;z-index:9998;
    transform:translate(-50%,-50%);
    transition:width .2s, height .2s, border-color .2s, transform .12s linear;
  }
  .cursor-ring::before,.cursor-ring::after{
    content:'';position:absolute;background:var(--accent);
  }
  .cursor-ring::before{
    top:50%;left:-6px;right:-6px;height:1px;transform:translateY(-50%);
  }
  .cursor-ring::after{
    left:50%;top:-6px;bottom:-6px;width:1px;transform:translateX(-50%);
  }
  body.cursor-hover .cursor-ring{
    width:48px;height:48px;
  }
  body.cursor-hover .cursor-dot{
    width:0;height:0;
  }
  body.cursor-click .cursor-ring{
    width:24px;height:24px;
  }
}

/* grain + scanlines */
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:200;opacity:0.04;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:199;
  background:repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(255,255,255,0.01) 2px, rgba(255,255,255,0.01) 4px);
}

/* ============ NAV ============ */
nav.topnav{
  position:fixed;top:0;left:0;right:0;z-index:150;
  height:64px;padding:0 32px;
  display:flex;justify-content:space-between;align-items:center;
  border-bottom:1px solid var(--line);
  background:rgba(10,10,10,0.92);
  backdrop-filter:blur(10px);
  font-family:'VT323',monospace;font-size:18px;
}
.logo{display:flex;align-items:center;gap:11px;cursor:pointer;text-decoration:none;color:var(--fg);user-select:none;}
.logo-mark{width:30px;height:30px;flex-shrink:0;display:block;transition:transform .35s cubic-bezier(.22,1,.36,1);}
.logo:hover .logo-mark{transform:rotate(-12deg) scale(1.06);}
.logo-text{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;
  font-weight:900;font-size:24px;letter-spacing:-0.02em;line-height:1;
  text-transform:uppercase;color:var(--fg);
}
.logo-text b{color:var(--accent);font-weight:900;}
@keyframes blink{50%{opacity:0;}}

.nav-center{display:flex;gap:0;list-style:none;align-items:center;}
.nav-center a{
  font-family:'Space Mono',monospace;font-size:12px;font-weight:700;
  color:var(--dim2);text-decoration:none;text-transform:uppercase;letter-spacing:0.06em;
  padding:8px 14px;cursor:pointer;transition:color .15s;position:relative;
}
.nav-center a:hover,.nav-center a.active{color:var(--accent);}
.nav-center a.active::after{content:'';position:absolute;bottom:-22px;left:14px;right:14px;height:2px;background:var(--accent);}

.nav-right{display:flex;align-items:center;gap:10px;}
.lang-toggle{display:flex;border:1px solid var(--line2);overflow:hidden;}
.lang-btn{padding:5px 9px;font-size:11px;font-weight:700;border:none;
  background:transparent;color:var(--dim2);cursor:pointer;font-family:'Space Mono',monospace;
  letter-spacing:0.1em;transition:all .15s;}
.lang-btn.active{background:var(--accent);color:var(--bg);}
.btn-cta{
  background:transparent;color:var(--accent);
  padding:8px 16px;border:1px solid var(--accent);
  font-size:11px;font-weight:700;cursor:pointer;font-family:'Space Mono',monospace;
  text-transform:uppercase;letter-spacing:0.1em;transition:all .15s;
}
.btn-cta:hover{background:var(--accent);color:var(--bg);}

.menu-toggle{display:none;background:none;border:1px solid var(--line2);color:var(--fg);
  padding:6px 10px;cursor:pointer;font-family:'VT323',monospace;font-size:18px;}

/* ============ PAGES ============ */
.page{display:none;padding-top:64px;min-height:100vh;flex-direction:column;}
.page.active{display:flex;}
.page>footer{margin-top:auto;}

/* ============ HERO ============ */
.hero{
  padding:80px 32px 60px;
  display:grid;grid-template-columns:1.15fr 1fr;
  gap:48px;align-items:center;
  position:relative;border-bottom:1px solid var(--line);
  min-height:calc(100vh - 64px);
  overflow:hidden;
}

/* PCB traces — circuit lines forming from a single point */
.pcb-bg{
  position:absolute;inset:0;z-index:0;
  pointer-events:none;opacity:0.55;
}
.pcb-bg svg{width:100%;height:100%;}
.pcb-bg .trace{
  fill:none;
  stroke:var(--accent);
  stroke-width:1.5;
  stroke-linecap:square;
  stroke-linejoin:miter;
  stroke-dasharray:2000;
  stroke-dashoffset:2000;
  animation:pcbDraw 4s ease-out forwards;
  filter:drop-shadow(0 0 3px rgba(255,61,0,0.4));
}
.pcb-bg .trace-2{stroke:var(--accent);opacity:0.6;animation-delay:.3s;}
.pcb-bg .trace-3{stroke:var(--accent);opacity:0.4;animation-delay:.6s;}
.pcb-bg .trace-4{stroke:var(--accent);opacity:0.7;animation-delay:.9s;}
.pcb-bg .trace-5{stroke:var(--accent);opacity:0.5;animation-delay:1.2s;}
.pcb-bg .trace-6{stroke:var(--accent);opacity:0.3;animation-delay:1.5s;}
@keyframes pcbDraw{
  0%{stroke-dashoffset:2000;}
  100%{stroke-dashoffset:0;}
}
.pcb-bg .pad{
  fill:var(--accent);
  opacity:0;
  animation:padFade .4s ease-out forwards;
}
.pcb-bg .pad-ring{
  fill:none;
  stroke:var(--accent);
  stroke-width:1;
  opacity:0;
  animation:padFade .5s ease-out forwards;
}
@keyframes padFade{
  to{opacity:1;}
}
.pcb-bg .origin{
  fill:var(--accent);
  animation:originPulse 1.5s ease-in-out infinite;
}
@keyframes originPulse{
  0%,100%{opacity:1;transform:scale(1);}
  50%{opacity:0.6;transform:scale(1.5);}
  transform-origin:center;
}
.pcb-bg .origin-ring{
  fill:none;
  stroke:var(--accent);
  stroke-width:1;
  animation:originRing 2s ease-out infinite;
}
@keyframes originRing{
  0%{r:4;opacity:1;}
  100%{r:30;opacity:0;}
}
.hero-meta-bar{
  position:absolute;top:24px;left:32px;right:32px;
  display:flex;justify-content:space-between;
  font-family:'VT323',monospace;font-size:15px;color:var(--dim);
}
.hero-meta-bar .acc{color:var(--accent);}

.hero-text{z-index:2;}
.hero-tag{
  font-family:'VT323',monospace;font-size:18px;color:var(--accent);
  margin-bottom:24px;display:flex;align-items:center;gap:8px;
}
.hero-tag::before{content:'> ';}
.hero-tag::after{content:'_';animation:blink 1s steps(2) infinite;}

h1.hero-h{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:clamp(52px,8vw,128px);line-height:0.98;letter-spacing:-0.02em;
  text-transform:uppercase;margin-bottom:28px;
}
h1.hero-h .line{display:block;overflow:hidden;}
h1.hero-h .line-inner{display:block;transform:translateY(110%);animation:rise .9s cubic-bezier(0.65,0,0.35,1) forwards;}
h1.hero-h .line:nth-child(1) .line-inner{animation-delay:.1s;}
h1.hero-h .line:nth-child(2) .line-inner{animation-delay:.25s;color:var(--accent);}
h1.hero-h .line:nth-child(3) .line-inner{animation-delay:.4s;}
@keyframes rise{to{transform:translateY(0);}}

.hero-sub{
  max-width:540px;color:var(--dim2);font-size:14.5px;line-height:1.7;
  border-left:2px solid var(--accent);padding-left:16px;margin-bottom:36px;
  opacity:0;animation:fadeIn .8s ease .7s forwards;
}
@keyframes fadeIn{to{opacity:1;}}

.hero-cta{display:flex;gap:14px;flex-wrap:wrap;
  opacity:0;animation:fadeIn .8s ease .85s forwards;}
.btn{
  font-family:'Space Mono',monospace;font-size:12px;font-weight:700;
  padding:14px 24px;text-transform:uppercase;letter-spacing:0.08em;
  border:1px solid var(--fg);background:transparent;color:var(--fg);
  cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;
  transition:all .2s;
}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--bg);}
.btn-primary:hover{background:transparent;color:var(--accent);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--accent);}
.btn:not(.btn-primary):hover{background:var(--fg);color:var(--bg);}

/* hero 3d */
.hero-3d{position:relative;height:480px;perspective:1200px;z-index:1;}
.cube-stage{position:absolute;inset:0;transform-style:preserve-3d;}
.cube{position:absolute;top:50%;left:50%;width:240px;height:240px;
  transform-style:preserve-3d;margin-left:-120px;margin-top:-120px;}
.face{position:absolute;width:240px;height:240px;border:1px solid var(--accent);
  background:rgba(255,61,0,0.04);display:flex;align-items:center;justify-content:center;
  font-family:'VT323',monospace;color:var(--fg);
  cursor:pointer;transition:background .2s, border-color .2s;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.face:hover{background:rgba(255,61,0,0.18);border-color:#fff;}
.face:hover .face-label .name{color:#fff;}
.face .corner{position:absolute;width:12px;height:12px;border:1px solid var(--accent);}
.face .corner.tl{top:8px;left:8px;border-right:none;border-bottom:none;}
.face .corner.tr{top:8px;right:8px;border-left:none;border-bottom:none;}
.face .corner.bl{bottom:8px;left:8px;border-right:none;border-top:none;}
.face .corner.br{bottom:8px;right:8px;border-left:none;border-top:none;}
.face-label{text-align:center;}
.face-label .num{color:var(--accent);font-size:14px;display:block;margin-bottom:4px;}
.face-label .name{font-size:28px;letter-spacing:0.05em;}
.front{transform:translateZ(120px);}
.back{transform:rotateY(180deg) translateZ(120px);}
.right{transform:rotateY(90deg) translateZ(120px);}
.left{transform:rotateY(-90deg) translateZ(120px);}
.top{transform:rotateX(90deg) translateZ(120px);}
.bottom{transform:rotateX(-90deg) translateZ(120px);}

.wireframe-cage{position:absolute;top:50%;left:50%;width:360px;height:360px;
  margin-left:-180px;margin-top:-180px;transform-style:preserve-3d;
  animation:rotateCage 30s linear infinite reverse;}
@keyframes rotateCage{
  0%{transform:rotateY(0deg) rotateX(20deg);}
  100%{transform:rotateY(360deg) rotateX(20deg);}
}
.cage-face{position:absolute;width:360px;height:360px;border:1px dashed var(--line2);}
.cage-face.cf1{transform:translateZ(180px);}
.cage-face.cf2{transform:rotateY(180deg) translateZ(180px);}
.cage-face.cf3{transform:rotateY(90deg) translateZ(180px);}
.cage-face.cf4{transform:rotateY(-90deg) translateZ(180px);}

/* ============ 3D HEADER OBJECTS (per page) ============ */
.sec-3d-row{
  display:grid;grid-template-columns:1fr 280px;gap:48px;
  margin-bottom:64px;align-items:center;border-bottom:1px solid var(--line);
  padding-bottom:48px;
}
.sec-3d-stage{
  position:relative;height:240px;perspective:900px;
}

/* SERVICES: stacked rotating layers (depth grid) */
.stack-3d{position:absolute;inset:0;transform-style:preserve-3d;
  animation:stackSpin 18s linear infinite;}
@keyframes stackSpin{
  0%{transform:rotateX(60deg) rotateZ(0deg);}
  100%{transform:rotateX(60deg) rotateZ(360deg);}
}
.stack-layer{
  position:absolute;top:50%;left:50%;width:180px;height:180px;
  margin:-90px 0 0 -90px;border:1px solid var(--accent);
  background:rgba(255,61,0,0.03);
}
.stack-layer.l1{transform:translateZ(-30px);opacity:0.3;}
.stack-layer.l2{transform:translateZ(0);opacity:0.55;}
.stack-layer.l3{transform:translateZ(30px);opacity:0.8;}
.stack-layer.l4{transform:translateZ(60px);border-color:#fff;}
.stack-layer .num{
  position:absolute;top:8px;left:8px;
  font-family:'VT323',monospace;font-size:14px;color:var(--accent);
}
.stack-layer.l4 .num{color:#fff;}
.stack-layer .label{
  position:absolute;bottom:8px;right:8px;
  font-family:'VT323',monospace;font-size:14px;color:var(--accent);
}

/* PRICING: 3 vertical bars rising at different heights */
.bars-3d{position:absolute;inset:0;display:flex;justify-content:center;
  align-items:flex-end;gap:24px;perspective:600px;}
.bar-3d{
  width:50px;transform-style:preserve-3d;
  animation:barFloat 4s ease-in-out infinite;
  transform:rotateY(-25deg) rotateX(5deg);
}
.bar-3d.b1{height:40%;animation-delay:0s;}
.bar-3d.b2{height:75%;animation-delay:.3s;}
.bar-3d.b3{height:55%;animation-delay:.6s;}
@keyframes barFloat{
  0%,100%{transform:rotateY(-25deg) rotateX(5deg) translateY(0);}
  50%{transform:rotateY(-25deg) rotateX(5deg) translateY(-12px);}
}
.bar-face{position:absolute;border:1px solid var(--accent);
  background:rgba(255,61,0,0.06);}
.bar-face.bf-front{inset:0;}
.bar-face.bf-side{
  top:0;bottom:0;right:0;width:24px;
  transform:rotateY(90deg) translateZ(24px);transform-origin:right;
  background:rgba(255,61,0,0.15);border-left:none;
}
.bar-face.bf-top{
  left:0;right:0;top:0;height:24px;
  transform:rotateX(90deg) translateZ(24px);transform-origin:top;
  background:rgba(255,61,0,0.25);border-bottom:none;
}
.bar-3d.b2 .bar-face{border-color:#fff;}
.bar-label{position:absolute;bottom:-22px;left:0;right:0;text-align:center;
  font-family:'VT323',monospace;font-size:14px;color:var(--accent);}

/* ABOUT: rotating tetrahedron / pyramid wireframe */
.pyramid-3d{position:absolute;inset:0;perspective:800px;}
.pyr-stage{position:absolute;top:50%;left:50%;width:180px;height:180px;
  margin:-90px 0 0 -90px;transform-style:preserve-3d;
  animation:pyrSpin 14s linear infinite;}
@keyframes pyrSpin{
  0%{transform:rotateX(-15deg) rotateY(0deg);}
  100%{transform:rotateX(-15deg) rotateY(360deg);}
}
.pyr-face{
  position:absolute;left:50%;bottom:0;
  width:0;height:0;
  border-left:90px solid transparent;
  border-right:90px solid transparent;
  border-bottom:160px solid transparent;
  margin-left:-90px;
  transform-origin:50% 100%;
}
.pyr-face::before{
  content:'';position:absolute;
  left:-90px;top:0;
  width:0;height:0;
  border-left:90px solid transparent;
  border-right:90px solid transparent;
  border-bottom:160px solid rgba(255,61,0,0.05);
}
.pyr-face.pf-outline{
  border-bottom-color:transparent;
}
.pyr-face.pf-outline::after{
  content:'';position:absolute;
  left:-90px;top:0;
  width:180px;height:160px;
  background:
    linear-gradient(to top right, transparent calc(50% - 0.5px), var(--accent) calc(50% - 0.5px), var(--accent) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(to top left, transparent calc(50% - 0.5px), var(--accent) calc(50% - 0.5px), var(--accent) calc(50% + 0.5px), transparent calc(50% + 0.5px));
}
.pyr-f1{transform:rotateY(0deg);}
.pyr-f2{transform:rotateY(90deg);}
.pyr-f3{transform:rotateY(180deg);}
.pyr-f4{transform:rotateY(270deg);}
.pyr-base{
  position:absolute;left:50%;top:50%;
  width:180px;height:180px;
  margin:-90px 0 0 -90px;
  border:1px solid var(--accent);
  transform:rotateX(90deg) translateZ(-90px);
  background:rgba(255,61,0,0.04);
}

/* CONTACT: terminal-style envelope/signal pulse 3D */
.signal-3d{position:absolute;inset:0;perspective:800px;
  display:flex;align-items:center;justify-content:center;}
.signal-stage{
  position:relative;width:180px;height:180px;transform-style:preserve-3d;
  animation:signalSpin 12s linear infinite;
}
@keyframes signalSpin{
  0%{transform:rotateX(-20deg) rotateY(0deg);}
  100%{transform:rotateX(-20deg) rotateY(360deg);}
}
.signal-ring{
  position:absolute;top:50%;left:50%;
  width:120px;height:120px;margin:-60px 0 0 -60px;
  border:1px solid var(--accent);border-radius:50%;
}
.signal-ring.r1{transform:rotateX(0deg);}
.signal-ring.r2{transform:rotateX(60deg);}
.signal-ring.r3{transform:rotateY(60deg);}
.signal-ring.r4{
  width:60px;height:60px;margin:-30px 0 0 -30px;
  border-color:#fff;border-style:dashed;
}
.signal-pulse{
  position:absolute;top:50%;left:50%;
  width:24px;height:24px;margin:-12px 0 0 -12px;
  background:var(--accent);
  animation:pulse 1.5s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{transform:scale(1);opacity:1;}
  50%{transform:scale(1.4);opacity:0.6;}
}
.signal-label{
  position:absolute;bottom:-8px;left:0;right:0;text-align:center;
  font-family:'VT323',monospace;font-size:16px;color:var(--accent);
}

/* ============ TICKER ============ */
.ticker{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--accent);color:var(--bg);overflow:hidden;padding:14px 0;
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;font-size:26px;
  text-transform:uppercase;letter-spacing:0.05em;
}
.ticker-track{display:flex;gap:48px;animation:scroll 40s linear infinite;
  white-space:nowrap;width:max-content;}
.ticker-track span{display:flex;align-items:center;gap:48px;}
.ticker-track .dot{color:var(--bg);}
@keyframes scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ============ SECTIONS ============ */
.sec{padding:96px 32px 96px;max-width:1400px;margin:0 auto;width:100%;}
.sec-narrow{max-width:1100px;}

.sec-header{
  display:grid;grid-template-columns:1fr 2fr;gap:40px;
  margin-bottom:64px;align-items:end;
}
.sec-meta{font-family:'VT323',monospace;font-size:18px;color:var(--dim);}
.sec-meta .num{color:var(--accent);font-size:32px;display:block;line-height:1;}

.sec-title{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:clamp(40px,5.5vw,84px);line-height:1.02;
  text-transform:uppercase;letter-spacing:-0.01em;
}
.sec-title .acc{color:var(--accent);}

.sec-p{font-size:14px;color:var(--dim2);line-height:1.7;max-width:560px;}

/* ============ PILLARS (5) ============ */
.pillar-rows{
  border-top:1px solid var(--line);
  margin-top:48px;
}
.p-row{
  display:grid;grid-template-columns:80px 1fr 200px 60px;
  gap:24px;padding:24px 0;border-bottom:1px solid var(--line);
  align-items:center;cursor:pointer;
  transition:all .25s;position:relative;
}
.p-row:hover{padding-left:16px;border-bottom-color:var(--accent);}
.p-row:hover .p-arrow{color:var(--accent);transform:translateX(8px);}
.p-row:hover .p-title{color:var(--accent);}
.p-row::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:0;
  background:var(--accent-dim);transition:width .3s;z-index:-1;
}
.p-row:hover::before{width:100%;}

.p-num{font-family:'VT323',monospace;font-size:24px;color:var(--accent);}
.p-title{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:clamp(28px,3.5vw,56px);line-height:1.05;text-transform:uppercase;
  letter-spacing:-0.01em;transition:color .25s;
}
.p-tag{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:0.08em;text-align:right;}
.p-arrow{font-family:'VT323',monospace;font-size:32px;color:var(--dim);transition:all .25s;text-align:right;}

/* ============ WHY US ============ */
.why-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);
}
.why-cell{
  padding:36px 28px;border-right:1px solid var(--line);
  position:relative;background:var(--bg);transition:background .2s;
}
.why-cell:last-child{border-right:none;}
.why-cell:hover{background:rgba(255,61,0,0.03);}
.why-cell::before{
  content:'';position:absolute;top:0;left:0;width:0;height:3px;
  background:var(--accent);transition:width .3s;
}
.why-cell:hover::before{width:100%;}
.why-num{font-family:'VT323',monospace;font-size:14px;color:var(--accent);
  letter-spacing:0.08em;margin-bottom:14px;}
.why-h{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  font-size:24px;line-height:1.05;text-transform:uppercase;
  letter-spacing:-0.005em;margin-bottom:14px;}
.why-p{font-size:13px;color:var(--dim2);line-height:1.65;}

/* ============ SERVICES GRID (services list page) ============ */
.srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);
  perspective:1400px;}
.srv-card{
  padding:36px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  cursor:pointer;background:var(--bg);position:relative;transition:all .25s;
  min-height:240px;display:flex;flex-direction:column;justify-content:space-between;
}
.srv-card:nth-child(3n){border-right:none;}
.srv-card:nth-last-child(-n+3){border-bottom:none;}
.srv-card::before{
  content:'';position:absolute;inset:0;background:var(--accent);
  transform:scaleY(0);transform-origin:bottom;transition:transform .3s ease;z-index:0;
}
.srv-card:hover::before{transform:scaleY(1);}
.srv-card>*{position:relative;z-index:1;transition:color .3s;}
.srv-card:hover *{color:var(--bg) !important;}
.srv-card:hover .srv-num,.srv-card:hover .srv-arrow{color:var(--bg) !important;opacity:0.7;}

.srv-num{font-family:'VT323',monospace;font-size:18px;color:var(--accent);
  letter-spacing:0.05em;margin-bottom:16px;}
.srv-ico{width:48px;height:48px;border:1px solid var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-family:'VT323',monospace;font-size:24px;color:var(--accent);margin-bottom:18px;}
.srv-title{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  font-size:24px;text-transform:uppercase;line-height:1;margin-bottom:12px;}
.srv-desc{font-size:12.5px;color:var(--dim2);line-height:1.65;flex-grow:1;}
.srv-foot{display:flex;justify-content:space-between;align-items:center;
  margin-top:20px;padding-top:14px;border-top:1px solid var(--line);
  font-family:'VT323',monospace;font-size:16px;color:var(--dim);}
.srv-card:hover .srv-foot{border-top-color:rgba(10,10,10,0.3);}
.srv-arrow{font-size:22px;color:var(--accent);}

/* ============ PRICING ============ */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);}
.price-card{
  padding:48px 32px;border-right:1px solid var(--line);
  position:relative;background:var(--bg);
}
.price-card:last-child{border-right:none;}
.price-card.featured{background:var(--accent);color:var(--bg);}
.price-card.featured *{color:var(--bg);}
.price-badge{position:absolute;top:0;right:0;
  background:var(--bg);color:var(--accent);
  font-family:'VT323',monospace;font-size:14px;
  padding:4px 12px;letter-spacing:0.1em;
  border-left:1px solid var(--bg);border-bottom:1px solid var(--bg);}
.price-plan{font-family:'VT323',monospace;font-size:18px;
  color:var(--accent);letter-spacing:0.08em;margin-bottom:8px;}
.price-card.featured .price-plan{color:var(--bg);opacity:0.7;}
.price-amt{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:84px;line-height:1;margin-bottom:24px;letter-spacing:-0.02em;}
.price-amt sup{font-size:32px;vertical-align:super;font-weight:400;}
.price-amt .price-mo{font-size:14px;color:var(--dim);font-weight:400;
  font-family:'Space Mono',monospace;letter-spacing:0;}
.price-card.featured .price-mo{color:var(--bg);opacity:0.7;}
.price-amt .indiv{font-size:32px;}
.price-list{list-style:none;margin-bottom:32px;}
.price-list li{
  font-size:13px;padding:10px 0;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:10px;
}
.price-card.featured .price-list li{border-bottom-color:rgba(10,10,10,0.2);}
.price-list .pchk{color:var(--accent);font-family:'VT323',monospace;font-size:18px;}
.price-card.featured .pchk{color:var(--bg);}
.price-list .pno{color:var(--dim);}
.price-list .pno span:first-child{color:var(--dim);}
.price-btn{
  width:100%;padding:14px;border:1px solid var(--accent);background:transparent;
  color:var(--accent);font-family:'Space Mono',monospace;font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.1em;cursor:pointer;transition:all .2s;
}
.price-btn:hover{background:var(--accent);color:var(--bg);}
.price-card.featured .price-btn{border-color:var(--bg);color:var(--bg);}
.price-card.featured .price-btn:hover{background:var(--bg);color:var(--accent);}

/* ============ ABOUT ============ */
.about-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start;}
.about-img-wrap{position:relative;}
.about-ascii-box{
  border:1px solid var(--line2);
  background:rgba(255,61,0,0.02);
  padding:32px;
  font-family:'VT323',monospace;
  font-size:14px;
  line-height:1.4;
  color:var(--accent);
  white-space:pre;
  overflow-x:auto;
}
.about-img-badge{
  position:absolute;bottom:-20px;left:32px;
  background:var(--bg);border:1px solid var(--accent);
  padding:14px 18px;display:flex;align-items:center;gap:12px;
}
.about-img-badge .ic{font-family:'VT323',monospace;font-size:24px;color:var(--accent);}
.about-img-badge .lbl{font-size:12px;font-weight:700;color:var(--fg);}
.about-img-badge .sub{font-size:10px;color:var(--dim);font-family:'VT323',monospace;}

.about-text .sec-meta{margin-bottom:14px;}
.about-text h2{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:clamp(36px,4.5vw,64px);line-height:1.05;
  text-transform:uppercase;margin-bottom:24px;letter-spacing:-0.01em;
}
.about-text h2 .acc{color:var(--accent);}
.about-highlight{
  border:1px solid var(--accent);padding:20px 24px;margin-bottom:24px;
  background:var(--accent-dim);display:flex;gap:14px;align-items:flex-start;
}
.about-highlight .ic{font-family:'VT323',monospace;font-size:24px;color:var(--accent);flex-shrink:0;}
.about-highlight strong{display:block;color:var(--fg);font-size:13px;margin-bottom:6px;
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;font-size:18px;text-transform:uppercase;}
.about-highlight span{font-size:13px;color:var(--dim2);line-height:1.7;}

.about-text p{color:var(--dim2);font-size:13.5px;line-height:1.75;margin-bottom:16px;}
.check-list{list-style:none;margin:24px 0;}
.check-list li{padding:8px 0;display:flex;gap:10px;align-items:flex-start;
  font-size:13px;color:var(--fg);border-bottom:1px solid var(--line);}
.check-list .chk{color:var(--accent);font-family:'VT323',monospace;font-size:18px;flex-shrink:0;}
.about-tag{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  color:var(--accent);font-size:24px;text-transform:uppercase;
  letter-spacing:-0.01em;margin-top:24px;}

/* testimonials */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);}
.testi-card{
  padding:32px 28px;border-right:1px solid var(--line);
  background:var(--bg);position:relative;
}
.testi-card:last-child{border-right:none;}
.t-stars{color:var(--accent);font-size:14px;letter-spacing:2px;margin-bottom:14px;}
.t-quote{font-size:13.5px;color:var(--fg);line-height:1.65;margin-bottom:20px;
  font-style:italic;border-left:2px solid var(--accent);padding-left:14px;}
.t-author{display:flex;align-items:center;gap:12px;}
.t-avatar{width:40px;height:40px;border:1px solid var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-family:'VT323',monospace;font-size:18px;color:var(--accent);}
.t-name{font-size:13px;font-weight:700;color:var(--fg);}
.t-role{font-size:11px;color:var(--dim);font-family:'VT323',monospace;}

/* ============ CONTACT ============ */
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;}
.contact-info-card{
  border:1px solid var(--line);padding:32px;background:var(--bg);
  position:relative;
}
.ci-title{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:32px;text-transform:uppercase;line-height:0.95;margin-bottom:8px;}
.ci-sub{font-size:12px;color:var(--dim2);line-height:1.6;margin-bottom:28px;
  border-bottom:1px solid var(--line);padding-bottom:20px;}
.ci-item{display:flex;gap:14px;align-items:flex-start;padding:12px 0;
  border-bottom:1px solid var(--line);}
.ci-item:last-child{border-bottom:none;}
.ci-ico{font-family:'VT323',monospace;font-size:22px;color:var(--accent);
  width:32px;flex-shrink:0;}
.ci-label{font-size:11px;color:var(--dim);text-transform:uppercase;
  letter-spacing:0.08em;font-family:'Space Mono',monospace;margin-bottom:2px;}
.ci-val{font-size:13px;color:var(--fg);}
.ci-val a{color:inherit;text-decoration:none;}
.ci-val a:hover{color:var(--accent);}

.cform{border:1px solid var(--line);padding:32px;background:var(--bg);}
.cform-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.fg{margin-bottom:18px;}
.fg label{display:block;font-size:11px;color:var(--accent);
  text-transform:uppercase;letter-spacing:0.1em;margin-bottom:6px;
  font-family:'VT323',monospace;font-size:14px;}
.fg label::before{content:'> ';}
.fg input,.fg select,.fg textarea{
  width:100%;padding:12px 14px;background:transparent;
  border:1px solid var(--line2);color:var(--fg);
  font-family:'Space Mono',monospace;font-size:13px;outline:none;
  transition:border-color .2s;
}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--accent);}
.fg textarea{min-height:120px;resize:vertical;}
.fg select{cursor:pointer;}
.fg select option{
  background:var(--bg);color:var(--fg);
  font-family:'Space Mono',monospace;padding:8px;
}
.form-submit{
  width:100%;padding:16px;background:var(--accent);
  color:var(--bg);border:none;
  font-family:'Space Mono',monospace;font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:0.1em;cursor:pointer;
  transition:all .2s;margin-top:8px;
}
.form-submit:hover{background:transparent;color:var(--accent);
  box-shadow:inset 0 0 0 1px var(--accent);}
.form-status{margin-top:16px;padding:12px;font-size:12px;font-family:'VT323',monospace;font-size:15px;display:none;}
.form-status.show{display:block;}
.form-status.success{border:1px solid var(--good);color:var(--good);}
.form-status.error{border:1px solid var(--accent);color:var(--accent);}

/* ============ DETAIL PAGES ============ */
.detail-back{
  background:none;border:none;cursor:pointer;color:var(--accent);
  font-family:'VT323',monospace;font-size:18px;
  margin-bottom:32px;display:inline-flex;align-items:center;gap:8px;
  padding:0;transition:transform .2s;
}
.detail-back:hover{transform:translateX(-4px);}

.detail-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:64px;
  margin-top:40px;}
.detail-text p.lead{font-size:15px;color:var(--dim2);line-height:1.8;margin-bottom:32px;}
.detail-text h3{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  font-size:24px;text-transform:uppercase;margin-bottom:18px;color:var(--fg);
}
.detail-side .vorteil-box{
  border:1px solid var(--accent);background:var(--accent-dim);
  padding:32px;margin-bottom:24px;
}
.vorteil-icon{
  width:56px;height:56px;border:1px solid var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-family:'VT323',monospace;font-size:30px;color:var(--accent);margin-bottom:16px;
}
.vorteil-h{font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  font-size:22px;text-transform:uppercase;margin-bottom:12px;}
.vorteil-p{font-size:13px;color:var(--dim2);line-height:1.7;}
.cta-box{
  border:1px solid var(--line);padding:24px;text-align:center;
}
.cta-box p{font-size:12px;color:var(--dim2);margin-bottom:16px;
  font-family:'VT323',monospace;font-size:15px;}

/* ============ LEGAL ============ */
.legal-content{max-width:820px;margin:0 auto;}
.legal-content p.sec-label{
  font-family:'VT323',monospace;font-size:18px;color:var(--accent);
  letter-spacing:0.1em;margin-bottom:8px;
}
.legal-content h2.sec-h{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:clamp(36px,4.5vw,64px);line-height:1.05;
  text-transform:uppercase;margin-bottom:32px;
}
.legal-content h3{
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:700;
  font-size:20px;text-transform:uppercase;margin:32px 0 12px;
  color:var(--accent);letter-spacing:-0.005em;
  border-bottom:1px solid var(--line);padding-bottom:8px;
}
.legal-content p,.legal-content li{
  font-size:13px;color:var(--dim2);line-height:1.7;margin-bottom:10px;
}
.legal-content ul{list-style:none;padding-left:0;}
.legal-content ul li::before{content:'▸ ';color:var(--accent);}
.legal-content strong{color:var(--fg);}

/* ============ FOOTER ============ */
footer.page-footer{
  border-top:1px solid var(--line);padding:48px 32px 32px;
}
.foot-contact{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line);margin-bottom:32px;
}
.foot-btn{
  padding:20px;border-right:1px solid var(--line);
  display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--fg);
  transition:all .2s;
}
.foot-btn:last-child{border-right:none;}
.foot-btn:hover{background:var(--accent);color:var(--bg);}
.foot-btn:hover .foot-btn-ico{color:var(--bg);}
.foot-btn-ico{font-family:'VT323',monospace;font-size:24px;color:var(--accent);
  width:32px;flex-shrink:0;transition:color .2s;}
.foot-btn span{font-size:12px;}
.foot-bottom{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:16px;padding-top:20px;border-top:1px solid var(--line);
  font-family:'VT323',monospace;font-size:15px;color:var(--dim);
}
.foot-logo{display:flex;align-items:center;gap:10px;
  font-family:'Big Shoulders Display','Anton','Arial Narrow Bold','Impact',sans-serif;font-weight:900;
  font-size:24px;text-transform:uppercase;letter-spacing:-0.01em;color:var(--fg);}
.foot-logo .logo-mark{width:26px;height:26px;flex-shrink:0;}
.foot-logo span{color:var(--accent);}
.foot-links{display:flex;gap:24px;}
.foot-links a{color:var(--dim);text-decoration:none;cursor:pointer;
  transition:color .15s;font-family:'Space Mono',monospace;font-size:11px;
  text-transform:uppercase;letter-spacing:0.08em;}
.foot-links a:hover{color:var(--accent);}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(40px);
  transition:opacity .8s cubic-bezier(.65,0,.35,1),transform .8s cubic-bezier(.65,0,.35,1);}
.reveal.visible{opacity:1;transform:translateY(0);}

/* ============ SERVICE CARDS — staggered 3D reveal ============ */
.srv-grid .srv-card{
  opacity:0;
  transform:translateY(60px) rotateX(-25deg) scale(0.92);
  transform-origin:center bottom;
  transition:opacity .7s cubic-bezier(.34,1.56,.64,1),
             transform .7s cubic-bezier(.34,1.56,.64,1),
             border-color .25s, background .25s;
}
.srv-grid.cards-in .srv-card{
  opacity:1;
  transform:translateY(0) rotateX(0) scale(1);
}
.srv-grid.cards-in .srv-card:nth-child(1){transition-delay:0s;}
.srv-grid.cards-in .srv-card:nth-child(2){transition-delay:.08s;}
.srv-grid.cards-in .srv-card:nth-child(3){transition-delay:.16s;}
.srv-grid.cards-in .srv-card:nth-child(4){transition-delay:.24s;}
.srv-grid.cards-in .srv-card:nth-child(5){transition-delay:.32s;}
.srv-grid.cards-in .srv-card:nth-child(6){transition-delay:.4s;}
.srv-grid.cards-in .srv-card:nth-child(7){transition-delay:.48s;}
.srv-grid.cards-in .srv-card:nth-child(8){transition-delay:.56s;}
.srv-grid.cards-in .srv-card:nth-child(9){transition-delay:.64s;}
.srv-grid.cards-in .srv-card:nth-child(10){transition-delay:.72s;}

/* Idle pulse animation on icon */
.srv-card .srv-ico{
  animation:icoIdle 2.4s ease-in-out infinite;
  animation-play-state:paused;
  transform-origin:center center;
}
.srv-grid.cards-in .srv-card .srv-ico{
  animation-play-state:running;
}
.srv-grid.cards-in .srv-card:nth-child(2n) .srv-ico{animation-delay:.4s;}
.srv-grid.cards-in .srv-card:nth-child(3n) .srv-ico{animation-delay:.8s;}
.srv-grid.cards-in .srv-card:nth-child(4n) .srv-ico{animation-delay:1.2s;}
@keyframes icoIdle{
  0%,100%{
    box-shadow:0 0 0 0 rgba(255,61,0,0);
    transform:scale(1);
    border-color:var(--accent);
  }
  50%{
    box-shadow:0 0 18px 2px rgba(255,61,0,0.45), inset 0 0 8px rgba(255,61,0,0.2);
    transform:scale(1.06);
    border-color:#ff7a3d;
  }
}
.srv-card:hover .srv-ico{animation:none !important;box-shadow:none !important;transform:none !important;}

/* ============ MOBILE ============ */
@media (max-width:920px){
  .menu-toggle{display:block;}
  .nav-center{display:none;position:fixed;top:64px;left:0;right:0;
    flex-direction:column;background:var(--bg);border-bottom:1px solid var(--line);
    padding:16px 0;align-items:stretch;}
  .nav-center.open{display:flex;}
  .nav-center a{padding:12px 32px;border-bottom:1px solid var(--line);}
  .nav-center a.active::after{display:none;}
  nav.topnav{padding:0 16px;}
  .hero{grid-template-columns:1fr;padding:80px 16px 60px;gap:32px;}
  .hero-meta-bar{font-size:12px;left:16px;right:16px;flex-wrap:wrap;gap:8px;}
  .hero-meta-bar .hide-m{display:none;}
  .hero-3d{height:300px;order:-1;}
  .cube{width:160px;height:160px;margin-left:-80px;margin-top:-80px;}
  .face{width:160px;height:160px;}
  .face-label .name{font-size:20px;}
  .front{transform:translateZ(80px);}
  .back{transform:rotateY(180deg) translateZ(80px);}
  .right{transform:rotateY(90deg) translateZ(80px);}
  .left{transform:rotateY(-90deg) translateZ(80px);}
  .top{transform:rotateX(90deg) translateZ(80px);}
  .bottom{transform:rotateX(-90deg) translateZ(80px);}
  .wireframe-cage{width:240px;height:240px;margin-left:-120px;margin-top:-120px;}
  .cage-face{width:240px;height:240px;}
  .cage-face.cf1{transform:translateZ(120px);}
  .cage-face.cf2{transform:rotateY(180deg) translateZ(120px);}
  .cage-face.cf3{transform:rotateY(90deg) translateZ(120px);}
  .cage-face.cf4{transform:rotateY(-90deg) translateZ(120px);}

  .sec{padding:64px 16px;}
  .sec-header{grid-template-columns:1fr;gap:16px;margin-bottom:40px;}
  .p-row{grid-template-columns:50px 1fr 40px;gap:14px;}
  .p-row .p-tag{display:none;}
  .why-grid{grid-template-columns:1fr;}
  .why-cell{border-right:none;border-bottom:1px solid var(--line);}
  .why-cell:last-child{border-bottom:none;}
  .srv-grid{grid-template-columns:1fr;}
  .srv-card{border-right:none !important;border-bottom:1px solid var(--line) !important;}
  .srv-card:last-child{border-bottom:none !important;}
  .price-grid{grid-template-columns:1fr;}
  .price-card{border-right:none;border-bottom:1px solid var(--line);}
  .price-card:last-child{border-bottom:none;}
  .about-grid{grid-template-columns:1fr;gap:40px;}
  .about-ascii-box{font-size:11px;padding:20px;}
  .testi-grid{grid-template-columns:1fr;}
  .testi-card{border-right:none;border-bottom:1px solid var(--line);}
  .testi-card:last-child{border-bottom:none;}
  .contact-grid{grid-template-columns:1fr;gap:32px;}
  .cform-row{grid-template-columns:1fr;}
  .detail-grid{grid-template-columns:1fr;gap:32px;}
  .foot-contact{grid-template-columns:1fr;}
  .foot-btn{border-right:none;border-bottom:1px solid var(--line);}
  .foot-btn:last-child{border-bottom:none;}
  .foot-bottom{flex-direction:column;text-align:center;}
  .sec-3d-row{grid-template-columns:1fr;gap:24px;padding-bottom:32px;margin-bottom:40px;}
  .sec-3d-stage{height:200px;order:-1;}
}
