/* Approved homepage design: dark blue and warm cream. */
:root{--grund:#f0ebe4;--flaeche:#f0ebe4;--vorschau-akzent:#d9824b;--vorschau-akzent-hover:#cc7845;--vorschau-karte:#e5dfd5;}
body{background:#f0ebe4;}
.farbflaechen{display:none;}
main>section:where(:not(.einstieg):not(#kontakt)){background:#f0ebe4;}
main>section#lokal,main>section#ueber,main>section#it{background:#1c2532;color:#e1e5e9;--tinte:#f8eed8;--text:#e1e5e9;--leise:#c5ced7;--linie:#465361;--linie-stark:#53606e;--karte:#263342;--gruen-tief:#eb7636;}
:is(#lokal,#ueber,#it) h2,:is(#lokal,#ueber,#it) h3{color:#f8eed8;}
:is(#lokal,#ueber,#it) h2 em{color:#eb7636;}
:is(#lokal,#ueber,#it) .plakette{background:#263342;border-color:#53606e;color:#f8eed8;}
#ueber .ueber-text>p{color:#d9dfe6;}
/* The illustrative Google interface remains a light, readable mockup. */
#lokal .g-fenster{--tinte:#1c2532;--text:#384861;--leise:#5d6c7b;--linie:#dedbd6;--linie-stark:#c2c2c2;--karte:#fff;--gruen-tief:#ab4616;color:#384861;background:#fff;}
#lokal .google figcaption{color:#c5ced7;}
#ueber .ueber-punkte li{color:#c5ced7;}
/* Contrast and section anchors for the dark preview panels. */
#lokal .gefunden-punkte svg{color:#eb7636;}
html{scroll-padding-top:3.6rem;}
/* Lighter personal introduction: one warm profile card, open benefits. */
#ueber .team-karte{background:#f0ebe4;border-color:#e1d9ce;color:#384861;--tinte:#1c2532;--text:#384861;--leise:#5d6c7b;box-shadow:0 16px 38px #00000012;}
#ueber .team-karte-name b{color:#1c2532;}
#ueber .team-karte-name span{background:var(--vorschau-karte);color:#384861;}
#ueber .team-karte .team-karte-aufgabe{color:#5d6c7b;}
#ueber .team-karte .team-karte-satz{color:#384861;}
#ueber .ueber-fakten{gap:1.3rem 2rem;padding:0;margin:1.8rem 0 2rem;}
#ueber .ueber-fakten li{background:none;border:0;border-radius:0;box-shadow:none;padding:0;color:#c5ced7;}
#ueber .ueber-fakten b{display:block;margin-bottom:.25rem;color:#f8eed8;}
#ueber .ueber-thema{color:#c5ced7;}
/* A distinct compact facts band separates the hero from the industry section. */
.startseite main>section.fakten{background:var(--vorschau-karte);border-top:1px solid #d9d1c5;border-bottom:1px solid #d9d1c5;}
#zusagen .kopfzeile h2 em{display:block;white-space:nowrap;text-wrap:nowrap;}
@media(max-width:35.99rem){#zusagen .kopfzeile h2 em{font-size:clamp(1rem,5.3vw,1.9rem);}}
/* Solid section colors replace the original soft light overlays. */
.startseite main>.abschnitt::before{display:none;content:none;}
/* Keep the four process illustrations distinct from the cream section. */
/* Quieter action hierarchy for this preview only. */
.startseite .pille{background:var(--vorschau-akzent);color:#1c2532;border:1px solid transparent;box-shadow:none;transition:background-color .2s ease,border-color .2s ease,color .2s ease;}
.startseite .pille:hover{background:var(--vorschau-akzent-hover);color:#1c2532;}
.startseite :is(#ablauf,#leistungen,#zusagen) .cta-zeile>.pille,.startseite .fuss .pille{background:transparent;border-color:#918679;color:#1c2532;}
.startseite :is(#ablauf,#leistungen,#zusagen) .cta-zeile>.pille:hover,.startseite .fuss .pille:hover{background:var(--vorschau-karte);border-color:#655d53;color:#1c2532;}
.startseite :is(#lokal,#ueber,#it) .pille,.startseite .beispiele .ihre .pille{background:transparent;border-color:#7d8996;color:#f8eed8;}
.startseite :is(#lokal,#ueber,#it) .pille:hover,.startseite .beispiele .ihre .pille:hover{background:#2a3746;border-color:#c0c8d0;color:#f8eed8;}
@media(prefers-reduced-motion:reduce){.startseite .pille{transition:none;}}
/* Give each accent phrase its own line rather than leaving a lone orange word. */
.startseite main .kopfzeile h2{max-width:30ch;}
.startseite main .kopfzeile h2>em,.startseite #ueber .ueber-text h2>em,.startseite #kontakt h2>em{display:block;text-wrap:balance;}
.startseite #kontakt h2{max-width:28ch;text-wrap:balance;}
/* Process diagrams: equal frames with enough room for the first conversation. */
#ablauf .szene{height:10rem;padding:1rem;background:var(--vorschau-karte);border:1px solid #d6cdbf;}
#ablauf .sz-anruf{min-width:0;gap:.5rem;}
#ablauf .sz-anruf>div{min-width:0;}
#ablauf .sz-anruf b{font-size:.75rem;line-height:1.35;}
#ablauf .sz-blase{line-height:1.4;}
/* Text links retain a visible hover and keyboard focus treatment. */
#leistungen .kopfzeile p a,#leistungen .leistungs-artikel{transition:color .16s ease,text-decoration-color .16s ease;}
#leistungen .kopfzeile p a:hover,#leistungen .leistungs-artikel:hover{color:#9b4f25;background:transparent;text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:currentColor;}
#leistungen .kopfzeile p a:focus-visible,#leistungen .leistungs-artikel:focus-visible{outline:2px solid #9b4f25;outline-offset:3px;}
/* Quiet, unframed promise checks aligned with the first heading line. */
#zusagen .zusagen-raster>div{--versprechen-abstand:1.4rem;padding-left:1.8rem;}
#zusagen .zusagen-raster>div::before{display:none;}
#zusagen .zusagen-raster>div::after{left:.12rem;top:calc(var(--versprechen-abstand) + .45em);width:.58rem;height:.3rem;border-left:1.5px solid #59616b;border-bottom:1.5px solid #59616b;}
@media(max-width:35.99rem){#zusagen .zusagen-raster>div{--versprechen-abstand:.95rem;}}
@media(prefers-reduced-motion:reduce){#leistungen .kopfzeile p a,#leistungen .leistungs-artikel{transition:none;}}

/* IT joins the dark sections, with restrained lighter cards. */
#it{border-color:#465361;}
#it .kopfzeile>p{color:#d9dfe6;}
#it .it-home-karten article{background:#263342;border-color:#465361;}
#it .it-home-karten h3 a{color:#f8eed8;}
#it .it-home-karten p,#it .it-markennamen{color:#c5ced7;}
#it .it-symbol{background:#1c2532;border-color:#53606e;color:#f8eed8;}
#it .it-mehr{color:#f8eed8;border-color:#7d8996;}
#it .it-mehr:hover,#it .it-home-karten h3 a:hover{color:#e7a477;border-color:currentColor;}

/* Related guides within the personal introduction. */
#ueber .ueber-punkte a{color:inherit;text-decoration:underline;text-decoration-color:#7d8996;text-underline-offset:.22em;text-decoration-thickness:1px;transition:color .16s ease,text-decoration-color .16s ease;}
#ueber .ueber-punkte a:hover{color:#e7a477;text-decoration-color:currentColor;}
#ueber .ueber-punkte a:focus-visible{outline:2px solid #e7a477;outline-offset:4px;}
@media(prefers-reduced-motion:reduce){#ueber .ueber-punkte a{transition:none;}}