/* StAnTec Drives GmbH — Dunkles Design („Power Dunkel“)
   Wird nach stil.css geladen und überschreibt nur Farben/Flächen. Aufbau, Abstände und Verhalten bleiben gleich. */

:root {
  --bg: #131317;
  --surface: #1B1B21;
  --text: #F5F4F8;
  --text-2: #B9B7C4;
  --text-3: #8E8B9A;
  --muted: #A6A3B1;
  --line: rgba(255, 255, 255, .09);
  --chip-bg: rgba(255, 255, 255, .04);
  --chip-line: rgba(255, 255, 255, .12);
  --shadow-card: 0 20px 50px rgba(0, 0, 0, .35);
  --shadow-img: 0 40px 90px rgba(0, 0, 0, .55);
  --link: #D59BF0;
  --link-hover: #F0A6D0;
  --label-d: #D5A8F5;
}

a { color: var(--link); }
a:hover { color: var(--link-hover); }
.label.d, .triple { color: var(--label-d); }
.card-more, .mini-more, .form-foot .direct a { color: var(--link); }

/* Navigation */
.nav { background: rgba(22, 22, 28, .9); border-color: rgba(255, 255, 255, .1); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.burger { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); }
.menu-pill li > a:hover, .menu-pill li > a[aria-current="page"], .has-mega:hover, .has-mega.open, .has-mega.aktiv { background: linear-gradient(90deg, rgba(146, 54, 207, .28), rgba(201, 78, 142, .28)); color: var(--label-d); }
.has-mega:hover > a, .has-mega.open > a, .has-mega.aktiv > a, .has-mega:hover .mega-toggle, .has-mega.open .mega-toggle, .has-mega.aktiv .mega-toggle { color: var(--label-d); }
.hot b { color: #fff; }
.hot:hover b { color: var(--label-d); }
.mega { background: rgba(27, 27, 33, .97); border-color: rgba(255, 255, 255, .1); box-shadow: 0 30px 70px rgba(0, 0, 0, .6); }
.mg-item:hover { background: rgba(255, 255, 255, .06); }
.burger span, .burger span::before, .burger span::after { background: var(--text); }
.nav.open .burger span { background: transparent; }
@media (max-width: 960px) { .menu-pill ul { border-color: var(--line); } .mega { background: transparent; } .menu-pill .has-mega, .menu-pill .has-mega:hover, .menu-pill .has-mega.open { background: transparent; } .menu-pill .has-mega.open > a, .menu-pill .has-mega.aktiv > a { background: linear-gradient(90deg, rgba(146, 54, 207, .28), rgba(201, 78, 142, .28)); } }

/* Hero */
.hero-bg img { object-position: center 55%; }
.hero-ov { background: linear-gradient(90deg, rgba(19, 19, 23, .94) 0%, rgba(19, 19, 23, .72) 38%, rgba(19, 19, 23, .15) 75%, rgba(19, 19, 23, .05) 100%); }
.hero-ov2 { background: linear-gradient(180deg, rgba(19, 19, 23, .2) 0%, rgba(19, 19, 23, 0) 30%, rgba(19, 19, 23, .9) 100%); }
.ring { border-color: rgba(255, 255, 255, .07); }
.badge { border-color: rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .05); }
.btn-ghost { border-color: rgba(255, 255, 255, .22); background: rgba(19, 19, 23, .35); color: var(--text); }
.btn-ghost:hover { border-color: #C94E8E; color: var(--text); }
@media (max-width: 720px) { .hero-ov { background: linear-gradient(180deg, rgba(19,19,23,.92) 0%, rgba(19,19,23,.85) 60%, rgba(19,19,23,.6) 100%); } }

/* Karten und Flächen */
.card-img::after { background: linear-gradient(180deg, rgba(18, 18, 22, 0) 45%, rgba(27, 27, 33, .98) 100%); }
.row:hover { background: rgba(146, 54, 207, .12); }
.side-box ul a[aria-current="page"] { background: rgba(146, 54, 207, .2); color: var(--label-d); }
.table-wrap { background: var(--surface); }
.hotline { background: #0C0C0F; border: 1px solid rgba(255, 255, 255, .08); }
.sub-hero .ov { background: linear-gradient(180deg, rgba(14, 10, 20, .45) 0%, rgba(14, 10, 20, .6) 45%, rgba(19, 19, 23, 1) 100%); }
.tick li { box-shadow: 0 6px 18px rgba(0, 0, 0, .25); }
footer { background: #0C0C0F; }

/* Formulare */
.f input, .f textarea, .f select { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .12); color: var(--text); }
.f input::placeholder, .f textarea::placeholder { color: #77747F; }
.f select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238E8B9A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-color: rgba(255, 255, 255, .04); background-repeat: no-repeat; background-position: right 16px center; }
.f select option { background: #1B1B21; color: var(--text); }
.f input:focus, .f textarea:focus, .f select:focus { border-color: #C94E8E; box-shadow: 0 0 0 4px rgba(201, 78, 142, .2); }
.alert.ok { background: rgba(46, 204, 138, .12); border-color: rgba(46, 204, 138, .35); color: #9FE8C7; }
.alert.err { background: rgba(201, 78, 142, .14); border-color: rgba(201, 78, 142, .4); color: #F3B8D4; }
.skip { background: var(--surface); color: var(--text); }

/* Ansprechpartner */
.pers-bild { background: #202027; }
.pers-kontakt a { color: var(--link); }