/* ============================================================
   PIESCO Editorial-Override für SEO-Landingpages
   Additiv: liegt NACH dem seiten-eigenen <style> im <head> und
   hebt das alte Mint/Inter-900-Template auf das „Editorial
   Engineering"-Design der Startseite. Struktur/HTML unberührt.
   Eingebunden 03.07.2026.
   ============================================================ */

:root{
  --brass:#A8854A; --brass-d:#8a6c39; --brass-lt:#C9A86A;
  --paper:#F5F1E8; --paper-2:#EFE9DB; --line:#DCD3C0;
  /* alte Tokens umbiegen — greift ueberall wo var(--bg/--bd/...) genutzt wird */
  --bg:#F5F1E8; --bd:#DCD3C0; --tx:#1C2620; --tx2:#5B6760;
  --r:4px; --shadow:none; --shadow-lg:0 24px 60px -40px rgba(14,59,46,.30);
  --serif:'Source Serif 4',Georgia,serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}

body{background:var(--paper);color:var(--tx);
  font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased}

/* ---- Headlines: ruhige Source-Serif statt Inter-900 ---- */
h1,h2,h3{font-family:var(--serif);font-optical-sizing:auto;letter-spacing:-.015em;font-style:normal !important}
h1{font-weight:600}
h2{font-weight:600;color:var(--g)}
h3{font-weight:600;color:var(--g)}
h1 em,h2 em,h3 em,.hero-lp h1 em{font-style:normal !important;color:var(--brass-d)}

/* ---- Header / Nav ---- */
header{background:var(--paper) !important;border-bottom:1px solid var(--line);
  box-shadow:none !important}
header .logo-img{height:30px !important;background:transparent !important;
  border-radius:0 !important;padding:0 !important}
header .logo-text{font-family:var(--mono);letter-spacing:.28em;color:var(--g)}
.nav a{color:var(--tx2) !important;font-weight:500}
.nav a:hover{color:var(--g) !important}
.nav-cta{background:transparent !important;color:var(--g) !important;
  border:1px solid var(--g);border-radius:2px !important;font-weight:600 !important}
.nav-cta:hover{background:var(--g) !important;color:#fff !important}

/* ---- Hero ---- */
.hero-lp{background:var(--gd) !important;border-bottom:1px solid var(--brass)}
.hero-lp h1{font-family:var(--serif);font-weight:600;letter-spacing:-.02em}
.hero-lp .sub,.hero-lp p{color:rgba(255,255,255,.72) !important}
.hero-cta,.hero-lp .btn,.hero-lp a[class*="cta"]{
  border-radius:2px !important;box-shadow:none !important;
  background:#fff !important;color:var(--g) !important;font-weight:600}
.hero-cta:hover{background:var(--brass-lt) !important;color:var(--gd) !important;
  transform:none !important}

/* ---- Hero-Badges/Chips: transparent + Brass-Kontur auf dunklem Hero ---- */
.hero-badge,.hero-lp [class*="badge"],.hero-lp [class*="chip"]{
  background:rgba(255,255,255,.06) !important;color:rgba(255,255,255,.9) !important;
  border:1px solid var(--brass) !important;border-radius:3px !important;font-weight:500}

/* ---- Fliesstext-Bereich ---- */
.wrap p,.content p{color:var(--tx2)}
strong{color:var(--tx);font-weight:600}
a{color:var(--g)}

/* ---- Karten / Boxen ---- */
.box{background:#fff;border:1px solid var(--line) !important;border-radius:4px !important;
  box-shadow:none !important}
.box-tip{background:var(--gs);border-color:var(--gl) !important;
  border-left:2px solid var(--brass) !important}
.box-h{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--brass-d)}

/* ---- Tabellen: Datenblatt-Optik ---- */
table{background:#fff;border-radius:4px !important;box-shadow:none !important;
  border:1px solid var(--line)}
th{background:var(--g) !important;font-family:var(--mono);font-weight:500;
  font-size:11px;letter-spacing:.06em;text-transform:uppercase}
td{border-bottom:1px solid var(--line) !important;color:var(--tx2)}
tr:hover td{background:var(--gs) !important}

/* ---- FAQ ---- */
.faq-item{background:#fff;border:1px solid var(--line) !important;border-radius:4px !important;
  box-shadow:none !important}
.faq-q{color:var(--g);font-weight:600}

/* ---- CTA-Baender / Buttons ---- */
.cta-block{background:var(--gd) !important;border:1px solid var(--brass);
  border-radius:4px !important}
.cta-block h2{color:#fff !important}
.cta-block p{color:rgba(255,255,255,.72) !important}
.cta-btn{background:transparent !important;color:#fff !important;
  border:1px solid var(--brass);border-radius:2px !important;font-weight:600}
.cta-btn:hover{background:var(--brass) !important;color:var(--gd) !important}
.cta-btn-outline{border-radius:2px !important}

/* ---- Footer ---- */
footer{background:var(--gd) !important}

/* ---- Runde Deko-Elemente entschaerfen (Pills/Badges/Icon-Quadrate) ---- */
[class*="badge"],[class*="pill"],[class*="tag"]{border-radius:3px !important}
