/* ============================================================
   tentacl.ai – Redesign "Weiß" (17.10.2026)
   Wird auf jeder Seite als LETZTES Stylesheet geladen und überschreibt
   Seiten-Styles. Grundsatz: rein weiß, eine Schrift (DM Sans), keine
   kursiven Serifen, keine Glow-Schatten, Orange nur als Akzent.
   Rückweg: <link … weiss.css> aus den Seiten entfernen.
   ============================================================ */

:root {
  --bg: #ffffff !important;
  --surface: #ffffff !important;
  --font-display: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  --border: #e6e6e6 !important;
  --primary-light: rgba(232, 84, 10, 0.07) !important;
  --shadow-sm: none !important;
  --shadow: none !important;
  --shadow-lg: 0 1px 2px rgba(17, 17, 17, 0.04), 0 8px 24px rgba(17, 17, 17, 0.06) !important;
  --radius: 8px !important;
  --radius-lg: 12px !important;
}

html, body { background: #ffffff !important; }

/* --- Typografie: eine Schrift, gerade, eng --------------------------------- */
h1, h2, h3, h4,
.section-title, .hero-dynamic, .branche-title {
  font-family: var(--font-display) !important;
  font-style: normal !important;
  font-weight: 650 !important;
  letter-spacing: -0.035em !important;
  text-wrap: balance;
}
h1 { line-height: 1.04 !important; }
h2, .section-title { line-height: 1.1 !important; }
h3, h4 { letter-spacing: -0.02em !important; font-weight: 600 !important; }

/* Akzentwörter: keine Schreibschrift mehr, nur Farbe */
h1 em, h2 em, h3 em, h4 em, .section-title em,
.hero-dynamic, .accent {
  font-family: inherit !important;
  font-style: normal !important;
  font-weight: inherit !important;
  color: var(--primary) !important;
}
blockquote, .quote blockquote { font-family: var(--font) !important; font-style: normal !important; }

/* Abschnitts-Labels: nicht mehr orange Versalien, sondern ruhige Zeile */
.section-label, .eyebrow, .hero-meta, .card-tag, .branche-count {
  color: #6b6b6b !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
.section-label::before, .eyebrow::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 2px;
  margin-right: 10px;
  vertical-align: middle;
  background: var(--primary);
}

/* --- Hintergrund: Netzwerk-Punkte raus ------------------------------------- */
#bg-canvas { display: none !important; }

/* --- Knöpfe: flach, klar, kein Glühen -------------------------------------- */
.btn, .btn-nav, .btn-lg, .cta-button, button.primary {
  border-radius: 8px !important;
  box-shadow: none !important;
  transform: none;
}
.btn-primary, .btn-nav { box-shadow: none !important; }
.btn-primary:hover, .btn-nav:hover { box-shadow: none !important; transform: none !important; }
.btn:active, .btn-nav:active { transform: translateY(1px) !important; }
.btn-ghost {
  border: 1px solid #d6d6d6 !important;
  box-shadow: none !important;
}
.btn-ghost:hover { border-color: #1a1a1a !important; color: #1a1a1a !important; box-shadow: none !important; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* --- Karten: Haarlinie statt Schatten und Schweben ------------------------- */
.feature-card, .module-card, .process-step, .example-item, .faq-item,
.info-card, .branche-card, .card {
  box-shadow: none !important;
}
.feature-card:hover, .module-card:hover, .branche-card:hover, .card:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: #c9c9c9 !important;
}
.feature-card::before { display: none !important; }

/* Icon-Kacheln: Symbol ohne Farbfläche */
.feature-icon, .module-icon, .ps-icon {
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  justify-content: flex-start !important;
  margin-bottom: 14px !important;
}

/* Vertrauens-Chips: Text statt Pillen */
.trust-item, .hero-trust span { border-radius: 6px !important; }

/* Abwechselnde Flächen werden zu weiß + Haarlinie */
section { background-color: transparent; }
section + section { border-top: 1px solid #efefef; }

/* Kopfzeile: weiß statt Creme-Glas */
.nav.scrolled, .tn-nav, header.nav { background: rgba(255, 255, 255, 0.94) !important; }

/* "Termin buchen" oben rechts war weiß auf weiß (Hintergrund wurde überschrieben) */
.tn-cta, .tn-nav-links > a.tn-cta {
  background: #e8540a !important; color: #fff !important; box-shadow: none !important;
  padding: 9px 18px !important; font-size: 13px !important; font-weight: 600 !important;
  border-radius: 8px !important; white-space: nowrap;
}
.tn-cta:hover { background: #c94408 !important; transform: none !important; }

/* Wechselndes Hero-Wort in voller Stärke */
.hero-dynamic { font-weight: 650 !important; letter-spacing: -0.035em !important; }

/* Symbole in Tinte, Orange bleibt für Knöpfe und Akzentwörter */
.feature-icon svg, .module-icon svg, .ps-icon svg, .trust-item svg {
  stroke: #1a1a1a !important;
}

/* Nachtrag 17.10.: kein warmer Schimmer, keine Creme-Kästen mehr */
[class*="hero"]::before, [class*="hero"]::after { background-image: none !important; }
.shot { background-color: #f4f4f5 !important; }
.cta-card, .danach-banner, .callout, .cta-box { background: #f4f4f5 !important; }
