:root {
  --bg: #050509;
  --bg-soft: #0b0b12;
  --panel: rgba(255,255,255,.045);
  --panel-border: rgba(255,255,255,.09);
  --text: #f7f7fb;
  --muted: #aaaabd;
  --cyan: #00c8ff;
  --blue: #1768ff;
  --violet: #7a2cff;
  --pink: #f000b8;
  --orange: #ff7a00;
  --max: 1180px;
  --radius: 26px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }

.ambient {
  position: fixed; width: 420px; height: 420px; border-radius: 50%;
  filter: blur(130px); opacity: .12; pointer-events: none; z-index: -1;
}
.ambient-a { top: 18%; left: -180px; background: var(--blue); }
.ambient-b { bottom: 5%; right: -180px; background: var(--pink); }

.nav-wrap {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: linear-gradient(to bottom, rgba(5,5,9,.92), rgba(5,5,9,.5), transparent);
  backdrop-filter: blur(8px);
}
.nav { height: 92px; display: flex; align-items: center; justify-content: space-between; }
.brand img { width: 190px; height: 72px; object-fit: contain; object-position: left center; }
.nav-links { display: flex; align-items: center; gap: 32px; font-size: 14px; font-weight: 600; }
.nav-links a { color: #d8d8e3; transition: .2s; }
.nav-links a:hover { color: white; }
.nav-cta {
  padding: 12px 18px; border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px; background: rgba(255,255,255,.05);
}
.menu-toggle { display: none; background: none; border: 0; padding: 8px; }
.menu-toggle span { display:block; width:26px; height:2px; background:#fff; margin:5px 0; }

.hero {
  min-height: 100svh; position: relative; display: grid; place-items: center;
  overflow: hidden; isolation: isolate;
}
.hero-bg {
  position: absolute; inset: 0;
  background:
    linear-gradient(120deg, rgba(0,0,0,.15), rgba(0,0,0,.7)),
    url("assets/mixer-blue.jpg") center/cover no-repeat;
  filter: saturate(1.15) contrast(1.05);
  z-index: -3;
}
.hero-overlay {
  position: absolute; inset:0;
  background:
    radial-gradient(circle at 72% 42%, rgba(0,199,255,.15), transparent 24%),
    radial-gradient(circle at 68% 56%, rgba(241,0,184,.16), transparent 28%),
    linear-gradient(to right, rgba(5,5,9,.96) 0%, rgba(5,5,9,.75) 48%, rgba(5,5,9,.35) 100%),
    linear-gradient(to top, #050509 0%, transparent 23%);
  z-index: -2;
}
.hero-content { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items:center; padding-top: 80px; }
.eyebrow {
  text-transform: uppercase; letter-spacing: .22em; font-size: 12px; font-weight: 700;
  color: #a7dbff; margin: 0 0 18px;
}
.hero h1, .section h2, .showcase h2 {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: -.045em; line-height: 1.02;
}
.hero h1 { font-size: clamp(48px, 7vw, 88px); margin: 0 0 26px; max-width: 800px; }
.hero h1 span {
  background: linear-gradient(90deg, #6fdcff, #7b5cff, #f547c7, #ffb04a);
  background-clip: text; -webkit-background-clip: text; color: transparent;
}
.hero-text { max-width: 690px; font-size: 18px; color: #c5c5d2; }
.hero-actions { display: flex; gap: 14px; margin: 34px 0 28px; flex-wrap: wrap; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; min-height: 52px;
  padding: 0 22px; border-radius: 999px; font-weight:700; font-size:14px; transition: .25s;
  border: 1px solid transparent;
}
.btn-primary {
  color:#fff; background: linear-gradient(90deg, #078cff, #6d3cff 48%, #d419c0);
  box-shadow: 0 12px 36px rgba(68,67,255,.28);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 46px rgba(108,61,255,.38); }
.btn-ghost { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.04); }
.btn-ghost:hover { background: rgba(255,255,255,.09); }
.hero-trust { display: flex; gap: 22px; flex-wrap: wrap; color:#9292a6; font-size:12px; }
.hero-trust span::before { content:"•"; color:#66d9ff; margin-right:8px; }

.hero-logo { position: relative; display:flex; justify-content:center; }
.hero-logo img { width: min(620px, 100%); position:relative; z-index:2; filter: drop-shadow(0 20px 50px rgba(0,0,0,.65)); }
.logo-glow {
  position:absolute; width:62%; aspect-ratio:1; border-radius:50%;
  background: conic-gradient(from 60deg, #ff6a00, #ff009d, #5f2bff, #00b7ff, #ff6a00);
  filter: blur(90px); opacity:.23;
}
.scroll-hint {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  font-size:10px; letter-spacing:.25em; text-transform:uppercase; color:#78788a;
}

.section { padding: 120px 0; }
.section-kicker { color:#76768c; font-size:12px; letter-spacing:.25em; text-transform:uppercase; margin-bottom:24px; }
.intro-grid { display:grid; grid-template-columns: 1.2fr .8fr; gap:80px; align-items:start; }
.intro h2 { font-size: clamp(40px, 5vw, 68px); margin:0; }
.intro h2 span { color:#6db8ff; }
.intro-copy { color:#b9b9c7; font-size:17px; }
.intro-copy p:first-child { margin-top:0; }

.services { background: linear-gradient(180deg, #07070d, #050509); }
.section-head { display:flex; justify-content:space-between; gap:50px; align-items:end; margin-bottom:50px; }
.section-head h2 { font-size: clamp(36px, 4vw, 56px); margin:0; max-width:760px; }
.section-head > p { max-width:440px; color:#9f9faf; margin:0; }

.service-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
.service-card {
  min-height:330px; padding:28px; border-radius:var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  border:1px solid var(--panel-border); position:relative; overflow:hidden;
  transition:.3s;
}
.service-card::after {
  content:""; position:absolute; inset:auto -20% -45% -20%; height:60%;
  background: radial-gradient(circle, rgba(48,128,255,.17), transparent 60%);
}
.service-card:nth-child(2)::after { background:radial-gradient(circle, rgba(195,42,255,.18), transparent 60%); }
.service-card:nth-child(3)::after { background:radial-gradient(circle, rgba(255,55,172,.16), transparent 60%); }
.service-card:nth-child(4)::after { background:radial-gradient(circle, rgba(255,149,34,.14), transparent 60%); }
.service-card:hover { transform: translateY(-5px); border-color:rgba(255,255,255,.18); }
.service-number { color:#6e6e83; font-size:12px; margin-bottom:72px; }
.service-card h3 { font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:25px; margin:0 0 14px; }
.service-card p { color:#a8a8b7; font-size:14px; }
.service-card span { display:block; margin-top:24px; color:#d1d1dc; font-size:12px; }

.showcase { display:grid; grid-template-columns: 1.15fr .85fr; min-height:720px; background:#090910; }
.showcase-image { overflow:hidden; position:relative; }
.showcase-image::after { content:""; position:absolute; inset:0; background:linear-gradient(to right, transparent 70%, #090910 100%); }
.showcase-image img { width:100%; height:100%; object-fit:cover; }
.showcase-copy { padding:90px max(50px, calc((100vw - var(--max))/2)); padding-left:70px; display:flex; flex-direction:column; justify-content:center; }
.showcase h2 { font-size:clamp(42px,5vw,68px); margin:0 0 26px; }
.showcase-copy > p:last-child { color:#adadbc; font-size:17px; max-width:560px; }

.tech-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tech-card { border-radius:var(--radius); overflow:hidden; border:1px solid var(--panel-border); background:#0a0a11; }
.tech-image { aspect-ratio: 4 / 3; overflow:hidden; }
.tech-image img { width:100%; height:100%; object-fit:cover; transition:.45s; }
.tech-card:hover .tech-image img { transform:scale(1.04); }
.tech-body { padding:26px; }
.tech-label { color:#60cfff; font-size:11px; text-transform:uppercase; letter-spacing:.2em; font-weight:700; }
.tech-body h3, .stat-card h3 { font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:27px; margin:8px 0 10px; }
.tech-body p:last-child, .stat-card p { color:#9f9faf; font-size:14px; }
.stat-card { padding:30px; min-height:100%; position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; }
.stat-glow { position:absolute; inset:auto -30% -25% 15%; height:65%; background:radial-gradient(circle, rgba(108,45,255,.24), transparent 64%); }
.mini-stats { display:grid; gap:10px; margin-top:36px; }
.mini-stats div { display:flex; align-items:center; justify-content:space-between; padding:14px 0; border-top:1px solid rgba(255,255,255,.08); }
.mini-stats strong { font-size:14px; }
.mini-stats span { color:#858598; font-size:12px; }
.tech-note {
  margin-top:18px; padding:24px 28px; border:1px solid var(--panel-border); border-radius:20px;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:28px; background:rgba(255,255,255,.025);
}
.tech-note span { font-weight:700; }
.tech-note p { color:#9494a5; margin:0; font-size:14px; }
.tech-note a { color:#71d5ff; font-weight:600; font-size:13px; }

.about { background:linear-gradient(180deg,#050509,#090910); }
.about-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:center; }
.about-visual { min-height:500px; display:grid; place-items:center; position:relative; }
.about-visual::before {
  content:""; position:absolute; width:70%; aspect-ratio:1; border-radius:50%;
  background:conic-gradient(#11c9ff,#7632ff,#ff2aac,#ff9d00,#11c9ff); filter:blur(90px); opacity:.15;
}
.about-frame {
  width:100%; min-height:410px; display:grid; place-items:center; border-radius:34px;
  border:1px solid rgba(255,255,255,.09); background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  position:relative; z-index:1;
}
.about-frame img { width:86%; }
.about-copy h2 { font-size:clamp(40px,5vw,66px); margin:0 0 24px; font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.03; letter-spacing:-.04em; }
.about-copy > p { color:#acacbb; font-size:16px; }
.values { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:30px; }
.values div { padding:18px; border-radius:16px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07); }
.values strong, .values span { display:block; }
.values span { color:#818193; font-size:11px; margin-top:4px; }

.contact { background:
  radial-gradient(circle at 15% 50%, rgba(0,174,255,.10), transparent 28%),
  radial-gradient(circle at 86% 45%, rgba(225,0,170,.10), transparent 30%),
  #06060b;
}
.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; }
.contact-copy h2 { font-size:clamp(44px,5vw,68px); margin:0 0 24px; font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.02; letter-spacing:-.04em; }
.contact-copy > p { color:#a8a8b8; }
.contact-points { display:grid; gap:10px; margin-top:30px; color:#d7d7e0; font-size:14px; }
.contact-points span::first-letter { color:#63d7ff; }

.contact-form { padding:34px; border-radius:30px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); backdrop-filter: blur(12px); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.contact-form label { display:block; margin-bottom:14px; }
.contact-form label span { display:block; font-size:11px; text-transform:uppercase; letter-spacing:.16em; color:#8f8fa0; margin-bottom:8px; font-weight:700; }
.contact-form input, .contact-form textarea, .contact-form select {
  width:100%; border:1px solid rgba(255,255,255,.09); background:#0c0c13; color:#fff;
  border-radius:14px; padding:14px 15px; outline:none; transition:.2s;
}
.contact-form textarea { resize:vertical; }
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus {
  border-color:rgba(87,195,255,.55); box-shadow:0 0 0 3px rgba(0,168,255,.08);
}
.form-btn { width:100%; border:0; cursor:pointer; margin-top:6px; }
.form-note { color:#6e6e80; font-size:10px; text-align:center; margin:14px 0 0; }

footer { border-top:1px solid rgba(255,255,255,.07); background:#050509; padding:50px 0 24px; }
.footer-grid { display:grid; grid-template-columns:1fr auto auto; gap:60px; align-items:start; }
.footer-brand img { width:210px; }
.footer-brand p { color:#69697c; font-size:12px; margin:6px 0 0; letter-spacing:.18em; text-transform:uppercase; }
.footer-links, .footer-legal { display:grid; gap:10px; font-size:13px; color:#9494a5; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.06); margin-top:34px; padding-top:20px; display:flex; justify-content:space-between; color:#5f5f72; font-size:11px; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity:1; transform:none; }
.delay-1 { transition-delay:.12s; }
.delay-2 { transition-delay:.22s; }

@media (max-width: 1000px) {
  .hero-content { grid-template-columns:1fr; text-align:left; padding-top:130px; padding-bottom:80px; }
  .hero-logo { order:-1; justify-content:flex-start; }
  .hero-logo img { width:420px; }
  .hero h1 { font-size:clamp(48px,10vw,76px); }
  .service-grid { grid-template-columns:repeat(2,1fr); }
  .tech-grid { grid-template-columns:1fr 1fr; }
  .stat-card { grid-column:1 / -1; }
  .showcase { grid-template-columns:1fr; }
  .showcase-image { min-height:480px; }
  .showcase-image::after { background:linear-gradient(to bottom,transparent 70%,#090910 100%); }
  .showcase-copy { padding:70px 40px 90px; }
  .about-grid, .contact-grid { grid-template-columns:1fr; }
  .about-visual { min-height:360px; }
  .about-frame { min-height:330px; }
}

@media (max-width: 760px) {
  .container { width:min(100% - 28px, var(--max)); }
  .nav { height:76px; }
  .brand img { width:150px; height:56px; }
  .menu-toggle { display:block; z-index:3; }
  .nav-links {
    position:absolute; top:70px; left:14px; right:14px; padding:20px;
    flex-direction:column; align-items:stretch; gap:8px;
    background:rgba(10,10,17,.97); border:1px solid rgba(255,255,255,.08); border-radius:20px;
    opacity:0; visibility:hidden; transform:translateY(-10px); transition:.2s;
  }
  .nav-links.open { opacity:1; visibility:visible; transform:none; }
  .nav-links a { padding:12px; }
  .hero-content { padding-top:110px; gap:18px; }
  .hero-logo img { width:300px; }
  .hero h1 { font-size:clamp(42px,14vw,62px); }
  .hero-text { font-size:16px; }
  .hero-trust { gap:10px; }
  .section { padding:84px 0; }
  .intro-grid, .section-head { display:grid; grid-template-columns:1fr; gap:26px; }
  .intro h2, .section-head h2 { font-size:42px; }
  .service-grid, .tech-grid { grid-template-columns:1fr; }
  .service-card { min-height:260px; }
  .service-number { margin-bottom:46px; }
  .showcase-image { min-height:360px; }
  .showcase-copy { padding:60px 22px 80px; }
  .showcase h2 { font-size:44px; }
  .tech-note { grid-template-columns:1fr; gap:8px; }
  .about-grid { gap:46px; }
  .about-frame { min-height:280px; }
  .values { grid-template-columns:1fr; }
  .contact-grid { gap:45px; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .contact-form { padding:22px; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
  .footer-bottom { gap:20px; flex-direction:column; }
}

.contact-form .consent{display:flex;align-items:flex-start;gap:10px;margin:4px 0 14px}
.contact-form .consent input{width:auto;margin-top:3px;flex:0 0 auto}
.contact-form .consent span{margin:0;text-transform:none;letter-spacing:0;line-height:1.5;font-size:11px;font-weight:500}

/* Unterseiten */
.subpage-main{padding-top:78px}.request-page{min-height:calc(100vh - 78px)}
.request-page .contact-copy h1{font-size:clamp(44px,5vw,68px);margin:0 0 24px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.02;letter-spacing:-.04em}
.compact-cta h3{font-size:28px;margin:0 0 12px}.compact-cta p{color:#a4a4b4;line-height:1.7;margin:0 0 24px}
.bot-field{position:absolute!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;height:1px!important;width:1px!important;margin:-1px!important;padding:0!important;border:0!important}
.consent a{text-decoration:underline;text-underline-offset:3px;color:#a8e7ff}
.legal-page{max-width:900px;margin:0 auto;padding:120px 24px 100px;position:relative;z-index:1}.legal-page h1{font:700 clamp(42px,6vw,64px)/1.05 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.04em;margin:0 0 35px}.legal-page h2{margin-top:38px;font-size:23px}.legal-page p{color:#b1b1bf;line-height:1.75}.legal-page a{color:#8bdfff;text-decoration:underline;text-underline-offset:3px}.legal-back{display:inline-block;margin-bottom:30px!important;color:#6dd6ff!important}.legal-updated{margin-top:48px;font-size:12px;color:#707082!important}

/* V4 Unterseiten & Technikbestand */
.subpage-section{min-height:calc(100vh - 78px);padding-top:120px}.page-title{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:clamp(42px,5vw,68px);line-height:1.03;letter-spacing:-.04em;margin:0}.inventory-stats div{align-items:flex-start;gap:18px}.inventory-stats strong{max-width:52%}.inventory-stats span{text-align:right;max-width:46%}.inventory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.inventory-card{padding:28px;border-radius:20px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);display:grid;gap:9px}.inventory-card strong{font-size:18px}.inventory-card span{color:#9191a3;font-size:13px;line-height:1.55}.inventory-link{margin-top:28px;padding:30px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025);display:flex;align-items:center;justify-content:space-between;gap:24px}.inventory-link p{margin:0;color:#aaaaba}@media(max-width:900px){.inventory-grid{grid-template-columns:1fr 1fr}.inventory-link{align-items:flex-start;flex-direction:column}}@media(max-width:600px){.inventory-grid{grid-template-columns:1fr}.inventory-stats div{display:grid}.inventory-stats strong,.inventory-stats span{max-width:none;text-align:left}}