:root{
  --dark:#17202c;
  --dark2:#243244;
  --gold:#caa86a;
  --gold-dark:#8a682f;
  --bg:#d9dee4;
  --section:#e4e8ed;
  --section2:#dfe4ea;
  --card:#f4f6f8;
  --card2:#eef2f5;
  --text:#1d2733;
  --muted:#4d5a69;
  --line:#c1cad4;
  --radius:24px;
  --shadow:0 18px 42px rgba(23,32,44,.13)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.6}
a{color:inherit}.topbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:18px 6vw;background:rgba(23,32,44,.97);backdrop-filter:blur(10px);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.brand{text-decoration:none;font-weight:800;letter-spacing:.2px}.brand span{display:inline-grid;place-items:center;width:40px;height:40px;margin-right:10px;border-radius:14px;background:var(--gold);color:#111827}.nav{display:flex;gap:24px}.nav a{text-decoration:none;color:#e9edf3;font-size:.96rem}.nav a:hover,.nav a:focus{color:#fff;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:6px}
.hero{min-height:650px;padding:105px 6vw;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:56px;align-items:center;color:#fff;background:radial-gradient(circle at 16% 12%,rgba(202,168,106,.30),transparent 31%),linear-gradient(135deg,#17202c 0%,#2b394b 58%,#1b2634 100%)}
.hero h1{font-size:clamp(2.5rem,5.4vw,5.4rem);line-height:.98;margin:12px 0 24px;letter-spacing:-.055em}.lead{max-width:780px;font-size:1.2rem;color:#edf1f6}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-weight:800;font-size:.78rem;color:#f3d392}.eyebrow.dark{color:var(--gold-dark)}.hero__actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:999px;text-decoration:none;border:0;font-weight:800;cursor:pointer}.btn--primary{background:var(--gold);color:#111827}.btn--primary:hover,.btn--primary:focus{background:#dbbc7e}.btn--ghost{border:1px solid rgba(255,255,255,.48);color:#fff}.btn--ghost:hover,.btn--ghost:focus{background:rgba(255,255,255,.09)}
.hero__card,.panel,.form,.cards article{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.hero__card{padding:34px;background:#eef2f5}.hero__card strong{font-size:1.2rem;color:#111827}.hero__card li{margin:14px 0;color:#344152}.section{padding:88px 6vw;background:var(--section)}.section:nth-of-type(even){background:var(--section2)}.intro,.split,.contact{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:start}.section h2{font-size:clamp(2rem,3.5vw,3.5rem);line-height:1.05;margin:10px 0 22px;letter-spacing:-.04em;color:#182231}.section__head{max-width:860px;margin-bottom:34px}.cards{display:grid;gap:24px}.cards--3{grid-template-columns:repeat(3,1fr)}.cards article{padding:30px}.cards h3,.panel h3{margin-top:0;color:#182231}.cards p,.section p{color:var(--muted)}.panel{padding:34px;background:var(--card2)}.checklist{list-style:none;padding:0;margin:0}.checklist li{padding:10px 0 10px 30px;position:relative;color:#334052}.checklist li:before{content:'✓';position:absolute;left:0;color:var(--gold-dark);font-weight:900}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:step;list-style:none;padding:0;margin:0}.steps li{counter-increment:step;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 12px 30px rgba(23,32,44,.08)}.steps li:before{content:'0' counter(step);display:block;color:var(--gold-dark);font-weight:900;margin-bottom:22px}.steps b{display:block;color:#182231;font-size:1.12rem;margin-bottom:8px}.steps span{color:var(--muted)}.contactbox{margin-top:28px;padding:22px;background:var(--card);border-radius:20px;border:1px solid var(--line)}.form{padding:30px;display:grid;gap:16px;background:var(--card)}.form label{display:grid;gap:8px;font-weight:700;color:#182231}.form input,.form textarea,.form select{width:100%;border:1px solid #aeb9c5;border-radius:14px;padding:14px 15px;font:inherit;background:#fff;color:#182231}.form input:focus,.form textarea:focus,.form select:focus{outline:3px solid rgba(202,168,106,.45);border-color:var(--gold-dark)}.privacy{grid-template-columns:auto 1fr!important;align-items:start;font-weight:500}.privacy input{width:auto;margin-top:6px}.honeypot{display:none}.footer{display:flex;justify-content:space-between;gap:20px;padding:28px 6vw;background:#17202c;color:#dfe5ed}.footer a{color:#fff}
@media(max-width:900px){.nav{display:none}.hero,.intro,.split,.contact{grid-template-columns:1fr}.hero{padding-top:82px;min-height:auto}.cards--3,.steps{grid-template-columns:1fr}.footer{display:block}.section{padding:64px 6vw}}


/* =========================================================
   V2 Kontrast-Update: Hauptseite mit stärkerem Kontrast
   Akzentfarbe exakt wie Button "Bewertung anfragen": #caa86a
   ========================================================= */

:root {
  --accent: #caa86a;
  --ocker: #caa86a;
  --contrast-dark: #2f3742;
  --contrast-dark-2: #424d5a;
  --contrast-mid: #bfc5cc;
  --contrast-light: #f4f1ea;
  --contrast-card: #fffaf0;
  --contrast-text: #26313b;
}

/* Menüleiste bleibt hochwertig dunkel */
.site-header,
header.site-header,
.navbar,
.header,
.main-header {
  background: #2f3742 !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(202,168,106,.55) !important;
}

.topbar {
  background: #2a323b !important;
  color: #f7f1e4 !important;
}

/* Buttonfarbe exakt als Ocker-Akzent */
.btn,
.button,
.cta-button,
a.btn,
button,
input[type="submit"] {
  background: #caa86a !important;
  color: #20262d !important;
  border-color: #caa86a !important;
}

/* Hauptseite: deutlich kontrastreichere Hintergrundflächen */
body {
  background:
    linear-gradient(180deg,
      #2f3742 0%,
      #4b5664 23%,
      #caa86a 23%,
      #d9bf86 42%,
      #c4cad1 42%,
      #e9ecef 72%,
      #caa86a 72%,
      #b58f47 100%
    ) !important;
  color: #26313b !important;
}

/* Hero etwas heller als vorher, aber weiterhin mit starkem Kontrast */
.hero,
.hero-section,
.start-hero {
  background:
    radial-gradient(circle at 78% 18%, rgba(202,168,106,.55), transparent 31%),
    linear-gradient(135deg, #3f4954 0%, #566270 50%, #7d6b4d 100%) !important;
  color: #ffffff !important;
}

/* Inhaltsbereiche auf der Hauptseite kontrastreich abwechseln */
main > section:nth-of-type(2n),
.section:nth-of-type(2n) {
  background: rgba(202,168,106,.24) !important;
}

main > section:nth-of-type(2n+1):not(.hero),
.section:nth-of-type(2n+1):not(.hero) {
  background: rgba(244,241,234,.88) !important;
}

.section.alt,
.alt,
.bg-alt {
  background: rgba(202,168,106,.32) !important;
}

.section.light,
.light,
.bg-light {
  background: rgba(233,236,239,.9) !important;
}

/* Karten heben sich klar vom Hintergrund ab */
.card,
.cards article,
.panel,
.box,
.service-card,
.object,
.feature {
  background: #fffaf0 !important;
  color: #26313b !important;
  border: 1px solid rgba(139,106,46,.42) !important;
  box-shadow: 0 18px 42px rgba(38,49,59,.16) !important;
}

.card h3,
.cards article h3,
.panel h3,
.box h3 {
  color: #26313b !important;
}

.card p,
.cards article p,
.panel p,
.box p {
  color: #4f5964 !important;
}

/* CTA-Flächen mit dunklem Kontrast und Ocker-Akzent */
.cta,
.callout,
.contact-cta {
  background:
    linear-gradient(135deg, #2f3742 0%, #454f5d 58%, #7c6742 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(202,168,106,.65) !important;
}

.cta h2,
.cta h3,
.callout h2,
.contact-cta h2 {
  color: #ffffff !important;
}

.cta p,
.callout p,
.contact-cta p {
  color: #f4eddf !important;
}

/* Ablauf / Steps mit besserem Kontrast */
.steps li,
.step,
.process-step {
  background: #fffaf0 !important;
  border: 1px solid rgba(139,106,46,.46) !important;
  color: #26313b !important;
}

.steps li::before,
.step-number,
.number {
  background: #caa86a !important;
  color: #1f252b !important;
}

/* Links und Highlights */
a:hover,
.highlight,
.kicker,
.eyebrow {
  color: #8b6a2e !important;
}

footer,
.footer {
  background: #2f3742 !important;
  color: #f7f1e4 !important;
}


/* Update: Textblock auf gleiche Höhe + größere Schrift */
.split{
    align-items:flex-start !important;
}

.bewertungstext{
    font-size:1.35rem !important;
    line-height:1.85 !important;
    font-weight:400 !important;
    color:#3f4954 !important;
}


/* EXAKTER FIX NACH SCREENSHOT
   Die sichtbare Überlagerung stammt vom body-Gradienten hinter transparenten Sections.
   Farben bleiben erhalten, aber die Sections bekommen deckende Hintergründe.
*/
body{
  background:#d9dee4 !important;
}

.hero{
  margin-bottom:0 !important;
}

.section{
  background:#d4b56f !important;
  position:relative;
  z-index:2;
}

/* erster Inhaltsbereich komplett deckend */
.hero + .section{
  background:#d4b56f !important;
}

/* Normaltext überall gleich groß */
p,li,label,input,textarea,select,small{
  font-size:1.15rem !important;
  line-height:1.75 !important;
}

.bewertungstext{
  font-size:1.15rem !important;
}


/* Funktionale Ergänzungen ohne Änderung des Original-Farblayouts */
html{font-size:18px!important;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body,p,li,label,input,textarea,select,button{font-size:1.08rem!important;line-height:1.72!important}
small{font-size:1rem!important;line-height:1.55!important}
img{max-width:100%;height:auto}
section{scroll-margin-top:96px}
.bewertungstext,p.bewertungstext{font-size:1.08rem!important;line-height:1.72!important}

.leistungsarten-links{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:30px 0}
.leistungsart-link{display:block;padding:28px;border-radius:24px;text-decoration:none;box-shadow:0 18px 42px rgba(38,49,59,.16)}
.leistungsart-link span{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;margin-bottom:18px;font-size:1.6rem}
.leistungsart-link strong{display:block;font-size:1.2rem;margin-bottom:8px}
.honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}

.cookie-banner{position:fixed;left:24px;right:24px;bottom:24px;z-index:9999;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;border-radius:22px;box-shadow:0 22px 60px rgba(0,0,0,.22)}
.cookie-actions{display:flex;gap:12px;flex:0 0 auto}

label:has(input[type="checkbox"]),.form-check,.checkbox-row,.datenschutz-zeile{display:flex!important;align-items:center!important;gap:10px!important;white-space:normal!important;flex-wrap:nowrap!important}
label:has(input[type="checkbox"]) input[type="checkbox"]{flex:0 0 auto!important;width:18px;height:18px}

@media(max-width:900px){
  html,body{font-size:17px!important}
  .leistungsarten-links{grid-template-columns:1fr}
  .cookie-banner{left:12px;right:12px;bottom:12px;flex-direction:column;align-items:stretch}
  .cookie-actions{flex-direction:column}
  .btn,button,input[type="submit"]{width:100%;text-align:center}
}


/* Gezielt gewünschte Anpassungen: Layout und restliche Farben unverändert */
.contact{background:#caa86a!important}
.cookie-banner{background:#e9ecef!important;color:#26313b!important;border:1px solid #c1cad4!important}
.cookie-banner p,.cookie-banner span,.cookie-banner div{color:#26313b!important}


/* Finaler Wunsch */
.contact{
  background:#CCB266 !important;
}
.privacy-consent,
.datenschutz-zeile{
  max-width:700px;
  margin:20px auto 0 auto;
}
.privacy-consent label,
.datenschutz-zeile{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  text-align:left !important;
}
.privacy-consent input[type=checkbox],
.datenschutz-zeile input[type=checkbox]{
  margin-top:4px;
  flex-shrink:0;
}


/* Finale Korrektur: Datenschutzhinweis als zusammenhängender Satz und Kontakt-Ocker */
.contact{background:#D2B56C!important}
.form label.privacy{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:flex-start!important;
  gap:12px!important;
  max-width:100%!important;
  margin:8px 0 2px 0!important;
  font-weight:400!important;
  font-size:1rem!important;
  line-height:1.55!important;
  color:#182231!important;
  text-align:left!important;
}
.form label.privacy input[type=checkbox]{
  flex:0 0 auto!important;
  width:18px!important;
  height:18px!important;
  margin:4px 0 0 0!important;
}
.form label.privacy span{
  display:block!important;
  flex:1 1 auto!important;
  min-width:0!important;
  font-weight:400!important;
  line-height:1.55!important;
}
.form label.privacy a{
  font-weight:500!important;
  text-decoration:underline!important;
}
@media(max-width:900px){
  .form label.privacy{font-size:0.98rem!important;line-height:1.55!important}
}


/* Mobile-Optimierung: nur Darstellung und Bedienbarkeit auf Handys */
@media (max-width: 700px) {
  html, body {
    width: 100% !important;
    overflow-x: hidden !important;
    font-size: 16px !important;
  }

  .topbar {
    position: sticky !important;
    top: 0 !important;
    display: block !important;
    padding: 12px 4vw !important;
  }

  .brand {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 1rem !important;
    line-height: 1.25 !important;
    white-space: normal !important;
  }

  .brand span {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    margin-right: 0 !important;
    border-radius: 12px !important;
  }

  .nav {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-top: 10px !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
  }

  .nav::-webkit-scrollbar {
    display: none !important;
  }

  .nav a {
    flex: 0 0 auto !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    font-size: .95rem !important;
    line-height: 1.2 !important;
  }

  .hero {
    min-height: auto !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 42px 5vw 46px !important;
  }

  .hero h1 {
    font-size: clamp(2rem, 10vw, 3.1rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
    margin: 10px 0 18px !important;
  }

  .hero__card,
  .panel,
  .form,
  .cards article,
  .contactbox,
  .leistungsart-link,
  .steps li {
    border-radius: 18px !important;
    padding: 20px !important;
  }

  .hero__actions {
    gap: 10px !important;
    margin-top: 24px !important;
  }

  .btn,
  button,
  input[type="submit"] {
    min-height: 48px !important;
    width: 100% !important;
    padding: 12px 18px !important;
    white-space: normal !important;
  }

  .section {
    padding: 44px 5vw !important;
  }

  .intro,
  .split,
  .contact,
  .cards--3,
  .steps,
  .leistungsarten-links {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .section h2 {
    font-size: clamp(1.75rem, 8vw, 2.35rem) !important;
    line-height: 1.12 !important;
  }

  p, li, label, input, textarea, select, small {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }

  input,
  textarea,
  select {
    min-height: 48px !important;
    font-size: 16px !important;
  }

  textarea {
    min-height: 150px !important;
  }

  .form {
    gap: 14px !important;
  }

  .form label.privacy {
    gap: 10px !important;
    font-size: .95rem !important;
    line-height: 1.45 !important;
  }

  .form label.privacy input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    margin-top: 2px !important;
  }

  .contact img {
    width: 100% !important;
    max-width: 342px !important;
    height: auto !important;
    display: block !important;
  }

  .footer {
    display: block !important;
    padding: 22px 5vw !important;
    text-align: left !important;
  }

  .footer p {
    margin: 8px 0 !important;
  }
}

@media (max-width: 380px) {
  .hero h1 {
    font-size: 1.9rem !important;
  }

  .brand {
    font-size: .95rem !important;
  }

  .nav a {
    font-size: .9rem !important;
    padding: 7px 10px !important;
  }
}


/* V2 Unternehmen bewerten: Hero wieder luftiger, rechter Kasten im Stil der Panel-Box */
.hero-grid{align-items:center!important;gap:clamp(32px,5vw,72px)!important}
.hero .trust.hero-trust-clean{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px!important;margin-top:32px!important}
.hero .trust.hero-trust-clean div{padding:16px!important}
.hero .trust.hero-trust-clean strong{display:block!important;margin-bottom:4px!important}
.sinnvoll-card{align-self:center!important}
.sinnvoll-card h3{margin-bottom:18px!important}
.sinnvoll-card .checklist li{margin-bottom:10px!important}
.leistungsarten-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:30px 0 34px}
.leistungsart-link{display:block;padding:28px;border-radius:24px;text-decoration:none;box-shadow:0 18px 42px rgba(38,49,59,.16)}
.leistungsart-link span{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;margin-bottom:18px;font-size:1.6rem}
.leistungsart-link strong{display:block;font-size:1.2rem;margin-bottom:8px}
.datenschutz-zeile{display:flex!important;align-items:center!important;gap:10px!important}
.datenschutz-zeile input[type="checkbox"]{flex:0 0 auto}
@media(max-width:900px){
  .hero .trust.hero-trust-clean,.leistungsarten-links{grid-template-columns:1fr!important}
}

.hero-image-panel{padding:0;overflow:hidden;border-radius:24px}
.hero-image-panel img{display:block;width:100%;height:100%;object-fit:cover}

/* V3-Final: gezielte Korrekturen ohne weitere Layout-/Farbänderungen */
.hero-image-panel{
  overflow:hidden !important;
  align-self:center !important;
  padding:0 !important;
}
.hero-image-panel img{
  width:100% !important;
  height:100% !important;
  min-height:320px !important;
  object-fit:cover !important;
  display:block !important;
}
.contact-photo-wrap{
  overflow:hidden;
  border-radius:18px;
}
.contact-photo-final{
  width:100% !important;
  max-width:100% !important;
  min-height:260px;
  object-fit:cover !important;
  display:block !important;
}
