﻿/*
 * ABC Sanierung — Light Mode Override
 * White/light-grey surfaces · Black accents · Clean typography
 */

/* ─── CSS tokens ─────────────────────────────────────────── */
:root {
  --primary-color:      #111111 !important;
  --primary-color-50:   rgba(17,17,17,0.45) !important;
  --primary-color-20:   rgba(17,17,17,0.12) !important;
  --bg-dark:            #f5f5f5 !important;
  --bg-darker:          #efefef !important;
  --bg-darkest:         #e8e8e8 !important;
  --bg-medium:          #f0f0f0 !important;
  --bg-gradient-dark:   linear-gradient(135deg,#f5f5f5 0%,#e8e8e8 100%) !important;
  --bg-gradient-medium: linear-gradient(135deg,#eeeeee 0%,#e0e0e0 100%) !important;
  --bg-light:           #ffffff !important;
  --bg-light-gray:      #f5f5f5 !important;
  --text-white:         #111111 !important;
  --text-light:         #222222 !important;
  --text-gray:          #555555 !important;
  --text-medium-gray:   #666666 !important;
  --text-dark-gray:     #888888 !important;
  --text-light-gray:    #333333 !important;
  --text-black:         #000000 !important;
  --text-dark:          #111111 !important;
  --text-border-gray:   #cccccc !important;
  --text-muted:         #777777 !important;
  --accent-contrast:    #111111 !important;
  --accent-light:       #111111 !important;
  --shadow-dark:        rgba(0,0,0,0.09) !important;
  --shadow-light:       rgba(0,0,0,0.05) !important;
}

/* ─── Base ───────────────────────────────────────────────── */
html {
  background: #ffffff !important;
}

body {
  background: #ffffff !important;
  color: #111111 !important;
}

/* ─── Header / Nav ───────────────────────────────────────── */
.header,
header,
.navbar,
.mobile-header,
.mobile-menu {
  background: #ffffff !important;
  backdrop-filter: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  color: #111111 !important;
}

.nav-menu a,
.navbar a,
.mobile-menu-list a {
  color: #111111 !important;
}

.nav-menu a:hover,
.mobile-menu-list a:hover {
  color: #000000 !important;
}

.hamburger-line,
.burger-line {
  background: #111111 !important;
}

.dropdown-menu {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;
}

.dropdown-menu a {
  color: #111111 !important;
}

.dropdown-menu a:hover {
  background: #f5f5f5 !important;
  border-left-color: #111111 !important;
}

body.page-sanierung-innenausbau .nav-services-dropdown .dropdown-menu {
  min-width: 240px !important;
}

body.page-sanierung-innenausbau .mobile-dropdown.active .mobile-dropdown-menu {
  max-height: 420px !important;
}

/* ─── Hero: keep the photo / overlay intact ─────────────── */
/* Only reset the section background (fallback when image fails) */
section.hero:not(.renovierung-hero):not(.hero-split) {
  background-color: #333333 !important;
}

/* Hero-split has its own light cream background — keep it light */
section.hero.hero-split {
  background-color: #f5ede1 !important;
}

/* Lighten the overlay so photos breathe */
.hero-overlay {
  background: rgba(0,0,0,0.45) !important;
}

/* ─── Sanierung/RENOVATION hero — full white left panel ─── */
.renovierung-hero {
  background: #ffffff !important;
}

.renovierung-hero .hero-overlay {
  display: none !important;
}

.renovierung-hero .hero-content {
  background: #ffffff !important;
}

.renovierung-hero .hero-title {
  color: #111111 !important;
  text-shadow: none !important;
}

.renovierung-hero .hero-description {
  color: #555555 !important;
}

.renovierung-hero .hero-kicker {
  background: #f0f0f0 !important;
  border-color: #e0e0e0 !important;
  color: #555555 !important;
}

.renovierung-hero .hero-btn.primary,
.renovierung-hero .hero-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  border-radius: 999px !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 36px rgba(0, 0, 0, 0.1) !important;
}

.renovierung-hero .hero-btn.primary:hover,
.renovierung-hero .hero-btn:hover {
  transform: translateY(-2px) !important;
  background: #000000 !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 44px rgba(0, 0, 0, 0.14) !important;
}

.renovierung-hero .hero-btn.secondary {
  background: transparent !important;
  color: #111111 !important;
  border: 2px solid #111111 !important;
}

.renovierung-hero .hero-trust-item strong {
  color: #111111 !important;
}

.renovierung-hero .hero-checklist-icon {
  background: #111111 !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18) !important;
}

.renovierung-hero .hero-checklist li,
.renovierung-hero .hero-checklist-text {
  color: #111111 !important;
}

.renovierung-hero .hero-checklist-text em {
  color: #555555 !important;
}

.renovierung-hero .hero-certificate-item {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  height: 104px !important;
  padding: 10px 16px !important;
}

.renovierung-hero .hero-certificate-item img {
  max-height: 84px !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

.renovierung-hero .hero-certificates {
  max-width: 580px !important;
  gap: 12px !important;
}

/* All hero text stays white (on dark photo overlay) */
.hero-title,
.hero-subtitle,
.hero-description,
.hero-left,
.hero-left h1,
.hero-left p,
.hero-left span,
.stat-number,
.stat-text {
  color: #ffffff !important;
}

.hero-arrow svg {
  color: #ffffff !important;
}

/* Hero form card — white on dark photo */
.hero-form {
  background: rgba(255,255,255,0.97) !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25) !important;
  color: #111111 !important;
}

.hero-form * {
  color: #111111 !important;
}

.hero-form .form-submit-btn,
.hero-form a.form-submit-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border: 2px solid #111111 !important;
}

/* Stats block on hero */
.hero-stats {
  background: transparent !important;
  backdrop-filter: none !important;
}

/* Slide controls on hero */
.slide-btn {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.5) !important;
  color: #ffffff !important;
}
.slide-btn:hover {
  background: rgba(255,255,255,0.4) !important;
}
.indicator {
  background: rgba(255,255,255,0.3) !important;
  border-color: rgba(255,255,255,0.6) !important;
}
.indicator.active {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

/* ─── All other sections — light ────────────────────────── */
main > section:not(.hero),
.about-section,
.services-section,
.portfolio-section,
.process-section,
.testimonials-section,
.contact-section,
.team-section,
.pricing-section,
.projects-section,
.partners-section,
.why-us-section,
.dienstleistungen-section,
.property-owners-section,
.process-map-section {
  background: #ffffff !important;
  color: #111111 !important;
}

/* Subtle alternating rows */
main > section:nth-of-type(even):not(.hero):not(footer) {
  background: #f7f7f7 !important;
}

/* ─── Generic surface reset (no more dark divs) ──────────── */
/* Target only known dark-bg classes so we don't break layouts */
.bg-dark, .bg-darker, .bg-medium, .bg-darkest,
[class*="dark-bg"], [class*="dark-section"] {
  background: #f5f5f5 !important;
  color: #111111 !important;
}

/* ─── Cards ──────────────────────────────────────────────── */
.card,
.service-card,
.process-card,
.testimonial-card,
.team-card,
.project-card,
.pricing-card,
.feature-card,
.step-card,
.info-card,
.contact-card,
[class$="-card"] {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06) !important;
}

/* ─── Headings & paragraphs ──────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
  color: #111111 !important;
}

p, li, td, th, blockquote, label {
  color: #333333 !important;
}

/* ─── Expertise section — Admara layout, B&W (gray band in alternation) ─── */
#expertise,
section.expertise-section,
main section.expertise-section,
main > section.expertise-section {
  background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%) !important;
  color: #111111 !important;
}

.expertise-section .section-heading {
  text-align: center !important;
  margin-bottom: clamp(32px, 4vw, 48px) !important;
}

.expertise-section .section-heading h2 {
  color: #111111 !important;
  margin: 0 auto !important;
  max-width: none !important;
  text-align: center !important;
  text-wrap: balance !important;
}

.expertise-section .section-heading span,
.expertise-section .section-subtitle {
  color: #888888 !important;
  display: block !important;
  margin: 0 0 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

.expertise-section .container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.expertise-section .expertise-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 22%),
    linear-gradient(160deg, #f5f5f5 0%, #ececec 100%) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

.expertise-section .expertise-card h3 {
  color: #111111 !important;
}

.expertise-section .expertise-card p {
  color: #555555 !important;
}

.expertise-section .section-promo {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06) !important;
}

.expertise-section .section-promo-title {
  color: #111111 !important;
}

.expertise-section .section-promo-text {
  color: #555555 !important;
}

.expertise-section .benefit-icon,
.expertise-section .benefit-icon--facade,
.expertise-section .benefit-icon--roof,
.expertise-section .benefit-icon--window,
.expertise-section .benefit-icon--hvac,
.expertise-section .benefit-icon--electric,
.expertise-section .benefit-icon--bath,
.expertise-section .benefit-icon--interior,
.expertise-section .benefit-icon--planning {
  background: #ffffff !important;
  color: #111111 !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.page-sanierung-innenausbau .expertise-section .section-heading {
  text-align: center !important;
}

body.page-sanierung-innenausbau .expertise-section .section-heading .section-subtitle::before,
body.page-sanierung-innenausbau .expertise-section .section-heading span::before {
  display: none !important;
  content: none !important;
}

body.page-sanierung-innenausbau .expertise-section .section-heading h2 {
  color: #111111 !important;
  font-size: clamp(28px, 2.8vw, 40px) !important;
  max-width: none !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.section-subtitle,
.services-subtitle,
[class*="-subtitle"],
[class*="-label"] {
  color: #777777 !important;
}

/* ─── Buttons ────────────────────────────────────────────── */
.btn,
.section-btn,
.form-submit-btn,
.cta-btn,
.cta-btn-about,
button[type="submit"],
.mobile-form-submit-btn,
a.section-btn,
a.btn,
a.form-submit-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.4) !important;
  border-radius: 999px !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 32px rgba(0, 0, 0, 0.08) !important;
}

.btn:hover,
.section-btn:hover,
.form-submit-btn:hover,
.cta-btn:hover,
.mobile-form-submit-btn:hover,
a.section-btn:hover,
a.btn:hover,
a.form-submit-btn:hover {
  transform: translateY(-2px) !important;
  background: #000000 !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 40px rgba(0, 0, 0, 0.12) !important;
}

/* Keep mobile menu CTA readable over dark button */
.mobile-menu-list a.mobile-form-submit-btn {
  color: #ffffff !important;
  border-bottom: none !important;
  text-align: center !important;
}

.btn-secondary,
.btn-outline {
  background: transparent !important;
  color: #111111 !important;
  border: 2px solid #111111 !important;
  box-shadow: none !important;
}

.btn-secondary:hover,
.btn-outline:hover {
  background: #111111 !important;
  color: #ffffff !important;
}

/* Nav CTA button */
.nav-right .form-submit-btn,
a.form-submit-btn.nav-cta {
  background: #111111 !important;
  color: #ffffff !important;
}

/* ─── Forms ──────────────────────────────────────────────── */
input:not([type="radio"]):not([type="checkbox"]),
textarea,
select {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid #d0d0d0 !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: #111111 !important;
  box-shadow: 0 0 0 3px rgba(0,0,0,0.07) !important;
  outline: none !important;
}

input::placeholder,
textarea::placeholder {
  color: #999999 !important;
  opacity: 1 !important;
}

/* ─── Footer ─────────────────────────────────────────────── */
footer,
.footer,
.footer-section,
.site-footer {
  background: #111111 !important;
  color: #cccccc !important;
}

footer *,
.footer * {
  color: #cccccc !important;
}

footer h3, footer h4,
.footer h3, .footer h4,
.footer-heading {
  color: #ffffff !important;
}

footer a:hover,
.footer a:hover {
  color: #ffffff !important;
}

/* Footer submit button */
footer .form-submit-btn,
.footer .form-submit-btn {
  background: #ffffff !important;
  color: #111111 !important;
  border: 2px solid #ffffff !important;
}

/* ─── Modals ─────────────────────────────────────────────── */
.modal-backdrop,
.modal-overlay {
  background: rgba(0,0,0,0.45) !important;
}

.modal,
.modal-content,
.modal-body,
.modal-inner {
  background: #ffffff !important;
  color: #111111 !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.16) !important;
}

.modal-header {
  background: #f5f5f5 !important;
  border-bottom: 1px solid #e0e0e0 !important;
  color: #111111 !important;
}

.modal *,
.modal-content *,
.modal-body * {
  color: #111111 !important;
}

.modal .form-submit-btn,
.modal button[type="submit"] {
  background: #111111 !important;
  color: #ffffff !important;
}

/* ─── Scroll bar ─────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f0f0f0; }
::-webkit-scrollbar-thumb { background: #bbbbbb; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #888888; }

/* ─── SVG icons ──────────────────────────────────────────── */
/* On light sections: black icons */
svg:not(.hero svg):not(.footer svg) {
  color: currentColor;
}

/* Preserve stroke-only paths */
svg [fill="none"] {
  fill: none !important;
}

/* Logo SVG on white nav → black */
/* Logo image */
.logo {
  display: flex !important;
  align-items: center !important;
}

/* Скрываем кнопки соц.сетей в футере на всех страницах */
.footer-social,
.social-link {
  display: none !important;
}

.logo-img {
  height: 90px !important;
  width: auto !important;
  display: block !important;
  object-fit: contain !important;
}

@media (max-width: 768px) {
  /* Constrain logo size in mobile header — the global .logo-img: 120px rule
     is meant for the desktop nav and makes the mobile bar absurdly tall. */
  .mobile-header .logo-img {
    height: 56px !important;
  }

  .hero:not(.renovierung-hero) {

  }

  .renovierung-hero .hero-left {
    margin-top: 60px !important;
  }

  .renovierung-hero,
  .renovierung-hero .hero-container {
    min-height: auto !important;
  }

  .mobile-menu {
    top: 110px !important;
  }
}

/* ─── Portfolio Modal ────────────────────────────────────── */
.portfolio-modal {
  background: rgba(0,0,0,0.5) !important;
}

.portfolio-modal .modal-content {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.14) !important;
}

.portfolio-modal .modal-header {
  background: #f5f5f5 !important;
  border-bottom: 1px solid #e8e8e8 !important;
}

.portfolio-modal .modal-header h3,
.modal-title {
  color: #111111 !important;
}

/* Tags: 72m², 3 Monate etc. */
.modal-spec {
  background: #f0f0f0 !important;
  border: 1px solid #cccccc !important;
  color: #333333 !important;
}

/* Gallery nav arrows */
.gallery-nav {
  background: rgba(255,255,255,0.92) !important;
  border: 1px solid #cccccc !important;
  color: #111111 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.10) !important;
}

.gallery-nav:hover {
  background: #111111 !important;
  border-color: #111111 !important;
  color: #ffffff !important;
}

.gallery-nav svg,
.gallery-nav svg * {
  stroke: currentColor !important;
  fill: none !important;
}

/* Thumbnails */
.thumbnail {
  opacity: 0.65 !important;
  border-color: transparent !important;
}

.thumbnail:hover,
.thumbnail.active {
  opacity: 1 !important;
  border-color: #111111 !important;
}

/* Thumbnail strip background */
.gallery-thumbnails {
  background: #f5f5f5 !important;
  border-radius: 8px !important;
  padding: 8px !important;
}

/* Close button */
.portfolio-modal .modal-close {
  background: #f0f0f0 !important;
  border: 1px solid #cccccc !important;
  color: #111111 !important;
}

.portfolio-modal .modal-close:hover {
  background: #111111 !important;
  border-color: #111111 !important;
  color: #ffffff !important;
}

.portfolio-modal .gallery-main img,
.portfolio-modal #mainImage,
.portfolio-modal .modal-img-current,
.portfolio-modal .modal-img-next,
.portfolio-modal .thumbnail img {
  filter: none !important;
  -webkit-filter: none !important;
}

.portfolio-modal .thumbnail.active img,
.portfolio-modal .thumbnail:hover img {
  filter: brightness(1.05) !important;
  -webkit-filter: brightness(1.05) !important;
}

/* ─── Misc ───────────────────────────────────────────────── */
hr, .divider { border-color: #e0e0e0 !important; }

.badge, .tag, .chip {
  background: #111111 !important;
  color: #ffffff !important;
}

tr:nth-child(even) { background: #f8f8f8 !important; }

/* Star ratings → black */
.star, [class*="star"] { color: #111111 !important; }

/* ─── Contact section ───────────────────────────────────── */
.contact-icon {
  background: #111111 !important;
}

.contact-icon svg,
.contact-icon svg * {
  color: #ffffff !important;
  stroke: #ffffff !important;
  fill: none !important;
}

.contact-label {
  color: #888888 !important;
}

.contact-value,
.contact-value p,
.contact-value a {
  color: #111111 !important;
  text-decoration: none !important;
}

.contact-value a:hover {
  color: #333333 !important;
  text-decoration: underline !important;
}

/* ─── Testimonial quote marks only */
blockquote::before,
.quote-icon {
  color: #cccccc !important;
}

/* ─── Funding section ─── */
.funding-badge.highlight {
  background: #111111 !important;
  color: #ffffff !important;
}
.benefit-icon {
  background: #111111 !important;
  color: #ffffff !important;
}
.funding-list li {
  color: #444444 !important;
}
.funding-list li::before {
  color: #111111 !important;
}

/* ─── Form page (form2.css overrides) ─────────────────── */
.form-container,
body.form-page,
html body {
  background: #f5f5f5 !important;
}

body::before {
  display: none !important;
}

.question-form {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
  backdrop-filter: none !important;
}

.question-form::before {
  display: none !important;
}

.step-indicator {
  background: #f0f0f0 !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
}

/* .step-number — do not force text color globally: career timeline uses dark
   circles with light numerals (karriere.css); a global black override hid them. */

.step-total {
  color: #777777 !important;
}

.step-divider {
  background: #cccccc !important;
}



.progress-fill {
  background: #111111 !important;
}

.question-number {
  background: #111111 !important;
  color: #ffffff !important;
}

.question-title {
  color: #111111 !important;
}

.question-description {
  color: #666666 !important;
}

.input-label {
  color: #333333 !important;
}

.option-item {
  background: #f8f8f8 !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  backdrop-filter: none !important;
}

.option-item:hover {
  background: #f0f0f0 !important;
  border-color: #111111 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.10) !important;
}

.option-item.selected,
.option-item.active {
  background: #111111 !important;
  border-color: #111111 !important;
}

.option-item.selected .option-title,
.option-item.active .option-title {
  color: #ffffff !important;
}

.option-item.selected .option-description,
.option-item.active .option-description {
  color: rgba(255,255,255,0.75) !important;
}

.option-title {
  color: #111111 !important;
}

.option-description {
  color: #666666 !important;
}

.next-btn,
.submit-btn,
.form-nav-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border-color: #111111 !important;
}

.next-btn:hover,
.submit-btn:hover {
  background: #333333 !important;
}

.prev-btn {
  background: #f0f0f0 !important;
  color: #555555 !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
}

.form-input,
.form-textarea,
.form-select,
input[type="text"].form-input,
input[type="email"].form-input,
input[type="tel"].form-input,
textarea.form-textarea {
  background: #f8f8f8 !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
  color: #111111 !important;
}

.form-input:focus,
.form-textarea:focus {
  border-color: #111111 !important;
  background: #ffffff !important;
}

.required-field-note {
  color: #555555 !important;
}

.services-subtitle {
  color: #888888 !important;
  text-shadow: none !important;
  animation: none !important;
}

.services-subtitle::before {
  background: #cccccc !important;
  box-shadow: none !important;
}

.services-main-title {
  color: #111111 !important;
}

.form-subtitle {
  color: #666666 !important;
}

/* ─── Renovation wizard header (strict B/W) ─────────────── */
.wizard-header {
  background: #f3f3f3 !important;
  border-bottom: 1px solid #dcdcdc !important;
  color: #111111 !important;
}

.wizard-header h1 {
  color: #111111 !important;
}

.wizard-header p {
  color: #666666 !important;
}

.btn-reset-all {
  background: #ffffff !important;
  border: 1px solid #bfbfbf !important;
  color: #222222 !important;
  box-shadow: none !important;
}

.btn-reset-all:hover {
  background: #f0f0f0 !important;
  border-color: #999999 !important;
  color: #111111 !important;
  transform: none !important;
}

.progress-bar::before {
  background: #d5d5d5 !important;
}

.progress-fill {
  background: #111111 !important;
}

.step-circle {
  background: #f2f2f2 !important;
  border: 2px solid #c7c7c7 !important;
  color: #666666 !important;
}

.step-indicator.active .step-circle,
.step-indicator.completed .step-circle {
  background: #111111 !important;
  border-color: #111111 !important;
  color: #ffffff !important;
}

.step-label {
  color: #555555 !important;
}

.question-search-input {
  background: #ffffff !important;
  border: 1px solid #cfcfcf !important;
  color: #111111 !important;
}

.question-search-input::placeholder {
  color: #8a8a8a !important;
}

.question-search-icon {
  color: #666666 !important;
}

.question-search-results {
  background: #ffffff !important;
  border: 1px solid #d8d8d8 !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.10) !important;
}

.question-search-result-item {
  color: #111111 !important;
  border-bottom: 1px solid #ececec !important;
}

.question-search-result-item:hover {
  background: #f3f3f3 !important;
}

.question-search-result-step {
  color: #777777 !important;
}

.question-search-highlight {
  box-shadow: 0 0 0 1px #111111 !important;
  background: rgba(0,0,0,0.04) !important;
}

/* Wizard header steps: remove square blocks, keep clean timeline */
.wizard-header .progress-bar {
  align-items: flex-start !important;
}

.wizard-header .step-indicator {
  flex: 0 0 auto !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 30px !important;
}

.wizard-header .step-label {
  margin-top: 10px !important;
}

/* Radio / checkbox groups: cleaner cards + clearer markers */
.radio-option,
.checkbox-option {
  background: #f2f2f2 !important;
  border: 1px solid #cfcfcf !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

.radio-option:hover,
.checkbox-option:hover {
  background: #ededed !important;
  border-color: #a9a9a9 !important;
}

.radio-option::before {
  border: 2px solid #7d7d7d !important;
  background: #ffffff !important;
}

.checkbox-option::before {
  border: 2px solid #7d7d7d !important;
  background: #ffffff !important;
}

.radio-option:has(input[type='radio']:checked),
.checkbox-option:has(input[type='checkbox']:checked) {
  background: #ebebeb !important;
  border-color: #111111 !important;
}

.radio-option:has(input[type='radio']:checked)::after {
  background: #111111 !important;
}

.checkbox-option:has(input[type='checkbox']:checked)::before {
  background: #111111 !important;
  border-color: #111111 !important;
}

.checkbox-option:has(input[type='checkbox']:checked)::after {
  color: #ffffff !important;
}

.radio-option span,
.checkbox-option span {
  color: #111111 !important;
}

/* Upload panel cleanup (photo/video block) */
.file-upload-section,
.global-file-upload {
  background: #efefef !important;
  border: 1px solid #d3d3d3 !important;
  box-shadow: none !important;
}

.file-upload-title,
.file-upload-subtitle,
.file-upload-hint-text {
  color: #333333 !important;
}

.global-file-upload .upload-btn,
.upload-btn {
  background: #ffffff !important;
  border: 1px solid #bdbdbd !important;
  color: #111111 !important;
  box-shadow: none !important;
}

.global-file-upload .upload-btn:hover,
.upload-btn:hover {
  background: #f2f2f2 !important;
  border-color: #9f9f9f !important;
}

.global-file-upload .file-list .file-item,
.file-list .file-item {
  background: #ffffff !important;
  border: 1px solid #d8d8d8 !important;
  color: #111111 !important;
}

/* ─── Wizard: submit loading overlay (readable on dark box) ─ */
.wizard-loading-box {
  background: #1f1f1f !important;
  border: 1px solid #555555 !important;
}

.wizard-loading-title {
  color: #ffffff !important;
}

.wizard-loading-text {
  color: #cccccc !important;
}

/* ─── Wizard: section cards (post / sub / conditional) ─── */
.post-section,
.sub-section,
.conditional-group {
  background: #f5f5f5 !important;
  border-color: #d0d0d0 !important;
}

.post-section h3,
.sub-section h4 {
  color: #111111 !important;
}

.post-section label,
.sub-section label,
.conditional-group label {
  color: #222222 !important;
}

.post-section .form-group label,
.sub-section .form-group label {
  color: #222222 !important;
}

/* ─── Form autocomplete dropdown ──────────────────────── */
.autocomplete-dropdown {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
}

.autocomplete-item {
  color: #111111 !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}

.autocomplete-item:hover {
  background: #f0f0f0 !important;
  color: #111111 !important;
}

.autocomplete-item.active {
  background: #f5f5f5 !important;
  color: #111111 !important;
}

.autocomplete-item strong {
  color: #000000 !important;
}

.autocomplete-loading,
.autocomplete-no-results {
  color: #888888 !important;
}

/* ─── Form summary/review step ────────────────────────── */
.summary-item {
  background: #f8f8f8 !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
}

.summary-item:hover {
  background: #f0f0f0 !important;
  border-color: rgba(0,0,0,0.18) !important;
}

.summary-label {
  color: #888888 !important;
}

.summary-value {
  color: #111111 !important;
}

.summary-item.services-breakdown {
  background: #f0f0f0 !important;
  border-color: rgba(0,0,0,0.12) !important;
}

/* ─── Form loading / success screens ──────────────────── */
.success-content {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.10) !important;
  backdrop-filter: none !important;
}

.success-title {
  color: #111111 !important;
}

.success-description {
  color: #666666 !important;
}

.success-icon circle,
.success-icon path,
.loading-spinner circle {
  stroke: #111111 !important;
}

.success-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border: none !important;
}

.success-btn:hover {
  background: #333333 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
}

.success-btn::before {
  display: none !important;
}

/* ─── Address hint box ─────────────────────────────────── */
.address-hint {
  color: #7a5c00 !important;
  background: #fffbe6 !important;
  border-left: 3px solid #e6b800 !important;
}

/* ─── Services section — pure white background ─── */
.services-tabs {
  background: #ffffff !important;
}

/* ─── Services header — centered like Admara screenshot, B&W ─── */
.services-tabs .services-header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: center !important;
  margin-bottom: 48px !important;
  transform: none !important;
  opacity: 1 !important;
}

.services-tabs .section-subtitle.services-subtitle,
.services-tabs .services-subtitle {
  display: block !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  gap: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: #888888 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow: none !important;
  animation: none !important;
}

.services-tabs .section-subtitle.services-subtitle::before,
.services-tabs .services-subtitle::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
}

.services-tabs .services-main-title {
  font-size: clamp(28px, 2.8vw, 40px) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #111111 !important;
  margin: 0 auto !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-wrap: balance !important;
  text-transform: none !important;
  opacity: 1 !important;
  transform: none !important;
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 768px) {
  .services-tabs .services-header {
    margin-bottom: 32px !important;
  }

  .services-tabs .section-subtitle.services-subtitle,
  .services-tabs .services-subtitle {
    font-size: 12px !important;
  }

  .services-tabs .services-main-title {
    font-size: clamp(24px, 7vw, 30px) !important;
  }
}

/* ─── Services cards — keep dark photo overlay readable ─── */
.services-tabs .services-cards {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.services-tabs .service-card-block,
.services-tabs .service-card-link,
.services-tabs .service-card-texts {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.services-tabs .carousel-container {
  background: transparent !important;
}

.services-tabs .service-card-overlay {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.35) 40%,
    rgba(0, 0, 0, 0.75) 100%
  ) !important;
  border: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

.services-tabs .service-card-texts span {
  color: #ffffff !important;
}

.services-tabs .section-actions .hero-btn,
.services-tabs .section-actions .hero-btn.primary {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  border-radius: 999px !important;
  text-transform: none !important;
  text-decoration: none !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 36px rgba(0, 0, 0, 0.1) !important;
}

.services-tabs .section-actions .hero-btn.primary:hover,
.services-tabs .section-actions .hero-btn:hover {
  transform: translateY(-2px) !important;
  background: #000000 !important;
  color: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 44px rgba(0, 0, 0, 0.14) !important;
}

/* ─── Why Us section — B&W ─── */
.why-us-section {
  background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%) !important;
}

.why-us-section .section-heading {
  text-align: center !important;
  margin-bottom: clamp(32px, 4vw, 48px) !important;
}

.why-us-section .section-heading .section-subtitle {
  display: block !important;
  margin: 0 0 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888888 !important;
  text-align: center !important;
}

.why-us-section .section-heading .section-subtitle::before {
  display: none !important;
  content: none !important;
}

.why-us-section .section-heading h2 {
  color: #111111 !important;
  margin: 0 auto !important;
  max-width: none !important;
  font-size: clamp(28px, 2.8vw, 40px) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-wrap: balance !important;
}

.why-us-section .benefit-card {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06) !important;
}

.why-us-section .benefit-card:hover {
  border-color: rgba(17, 17, 17, 0.22) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.1) !important;
}

.why-us-section .benefit-card h3 {
  color: #111111 !important;
}

.why-us-section .benefit-card p {
  color: #555555 !important;
}

.why-us-section .benefit-icon--price,
.why-us-section .benefit-icon--start,
.why-us-section .benefit-icon--contact,
.why-us-section .benefit-icon--manager,
.why-us-section .benefit-icon--quality,
.why-us-section .benefit-icon--funding {
  background: #f0f0f0 !important;
  color: #111111 !important;
}

.why-us-section .section-actions .hero-btn,
.why-us-section .section-actions .hero-btn.primary {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
}

.why-us-section .section-actions .hero-btn.primary:hover,
.why-us-section .section-actions .hero-btn:hover {
  background: #000000 !important;
  color: #ffffff !important;
}

/* ─── Portfolio header — centered like Admara screenshot, B&W ─── */
.portfolio-section .portfolio-header .services-header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  transform: none !important;
  opacity: 1 !important;
}

.portfolio-section .section-subtitle.services-subtitle,
.portfolio-section .services-subtitle {
  display: block !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  gap: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  color: #888888 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow: none !important;
  animation: none !important;
}

.portfolio-section .section-subtitle.services-subtitle::before,
.portfolio-section .services-subtitle::before {
  display: none !important;
  content: none !important;
}

.portfolio-section .services-main-title {
  font-size: clamp(28px, 2.8vw, 40px) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #111111 !important;
  margin: 0 auto !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-wrap: balance !important;
  max-width: none !important;
  transform: none !important;
  opacity: 1 !important;
}

@media (max-width: 768px) {
  .portfolio-section .services-main-title {
    font-size: clamp(24px, 7vw, 30px) !important;
  }
}

/* ─── Portfolio cards — Admara layout, B&W ─── */
#portfolio.portfolio-section {
  background: #ffffff !important;
  padding: 84px 0 !important;
}

#portfolio.portfolio-section::before {
  display: none !important;
}

#portfolio .portfolio-container {
  width: min(1610px, calc(100vw - 300px)) !important;
  padding: 0 !important;
}

#portfolio .portfolio-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin-top: 0 !important;
}

#portfolio .portfolio-card {
  background: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.14) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.08) !important;
  cursor: pointer !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

#portfolio .portfolio-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.18) !important;
  border-color: rgba(17, 17, 17, 0.35) !important;
}

#portfolio .portfolio-card::before {
  display: none !important;
}

#portfolio .portfolio-image {
  position: relative !important;
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #ececec !important;
}

#portfolio .portfolio-image::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, 0.06) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: background 0.25s ease !important;
}

#portfolio .portfolio-card:hover .portfolio-image::before {
  background: rgba(0, 0, 0, 0.04) !important;
}

#portfolio .portfolio-img-current,
#portfolio .portfolio-img-next,
.portfolio-section .portfolio-img-current,
.portfolio-section .portfolio-img-next,
.portfolio-section .portfolio-image img,
#portfolio .portfolio-image img {
  filter: none !important;
  -webkit-filter: none !important;
  transition: opacity 0.4s ease, filter 0.35s ease !important;
}

#portfolio .portfolio-card:hover .portfolio-img-current,
#portfolio .portfolio-card:hover .portfolio-img-next,
.portfolio-section .portfolio-card:hover .portfolio-img-current,
.portfolio-section .portfolio-card:hover .portfolio-img-next,
.portfolio-section .portfolio-card:hover .portfolio-image img,
#portfolio .portfolio-card:hover .portfolio-image img {
  filter: brightness(1.05) saturate(1.05) !important;
  -webkit-filter: brightness(1.05) saturate(1.05) !important;
}

#portfolio .portfolio-info {
  padding: 20px 18px !important;
}

#portfolio .spec-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
}

#portfolio .spec-label {
  color: #666666 !important;
}

#portfolio .spec-value {
  color: #111111 !important;
  font-weight: 600 !important;
}

@media (max-width: 992px) {
  #portfolio .portfolio-grid {
    grid-template-columns: 1fr !important;
  }

  #portfolio .portfolio-container {
    width: calc(100vw - 60px) !important;
  }
}

/* ─── Team showcase — B&W overrides on Admara CSS ─── */
.team-showcase-section {
  background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%) !important;
}

.team-showcase-section .team-showcase__title {
  color: #111111 !important;
}

.team-showcase-section .team-showcase__description-part {
  color: #444444 !important;
}

.team-showcase-section .team-showcase__description-part strong {
  color: #111111 !important;
}

.team-showcase-section .team-showcase__tagline {
  color: #333333 !important;
}

.team-showcase-section .team-showcase__frame {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.8),
    0 16px 48px rgba(0, 0, 0, 0.06) !important;
}

.team-showcase-section .team-showcase__frame::before {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.03) 1px, transparent 1px) !important;
  opacity: 0.5 !important;
}

.team-showcase-section .team-showcase-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.team-showcase-section .team-showcase-card__photo {
  background: #e8e8e8 !important;
}

.team-showcase-section .team-showcase-card__info-panel {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
}

.team-showcase-section .team-showcase-card__name {
  color: #111111 !important;
}

.team-showcase-section .team-showcase-card__line {
  background: #111111 !important;
}

.team-showcase-section .team-showcase-card__role {
  color: #555555 !important;
}

.team-showcase-section .team-showcase__actions .hero-btn,
.team-showcase-section .team-showcase__actions .hero-btn.primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 20px 40px !important;
  min-height: 64px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.team-showcase-section .team-showcase__actions .hero-btn.primary:hover,
.team-showcase-section .team-showcase__actions .hero-btn:hover {
  transform: translateY(-2px) !important;
  background: #000000 !important;
  color: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* ─── Vorher-Nachher / property-owners — B&W ─── */
.property-owners-section {
  background: #ffffff !important;
  color: #111111 !important;
}

.property-owners-section .section-subtitle {
  color: #888888 !important;
}

.property-owners-section .section-header h2 {
  color: #111111 !important;
}

.property-owners-section .property-owners-card {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.08) !important;
}

.property-owners-section .property-owners-card:hover {
  border-color: rgba(17, 17, 17, 0.22) !important;
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.12) !important;
}

.property-owners-section .property-owners-image {
  background: #e8e8e8 !important;
  border-bottom: 1px solid #e8e8e8 !important;
}

.property-owners-section .property-owners-info-title {
  color: #111111 !important;
}

.property-owners-section .property-owners-info-row dt {
  color: #555555 !important;
}

.property-owners-section .property-owners-info-row dd {
  color: #111111 !important;
}

#coverage .property-owners-carousel__nav {
  border: 1px solid rgba(17, 17, 17, 0.25) !important;
  background: #ffffff !important;
  color: #111111 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.1) !important;
}

#coverage .property-owners-carousel__nav:hover {
  background: #111111 !important;
  border-color: #111111 !important;
  color: #ffffff !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18) !important;
}

#coverage .property-owners-carousel__nav:focus-visible {
  outline: 2px solid #111111 !important;
  outline-offset: 3px !important;
}

#coverage .section-cta .section-btn,
#coverage .section-cta .section-btn.primary {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#coverage .section-cta .section-btn.primary:hover,
#coverage .section-cta .section-btn:hover {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* ─── Process map — B&W ─── */
.process-map-section {
  background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%) !important;
  border-top: 1px solid #e8e8e8 !important;
  border-bottom: 1px solid #e8e8e8 !important;
}

.process-map-section .section-subtitle {
  color: #888888 !important;
}

.process-map-section .section-title {
  color: #111111 !important;
}

.process-map-section .process-map {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.8),
    0 16px 48px rgba(0, 0, 0, 0.06) !important;
}

.process-map-section .process-map::before {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.03) 1px, transparent 1px) !important;
  opacity: 0.5 !important;
}

.process-map-section .process-map__route-bg {
  stroke: rgba(17, 17, 17, 0.08) !important;
}

.process-map-section .process-map__route-line {
  stroke: #111111 !important;
}

.process-map-section .process-map__pin::before {
  border-top-color: #111111 !important;
}

.process-map-section .process-map__pin span {
  background: #111111 !important;
  border-color: #ffffff !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18) !important;
  color: #ffffff !important;
}

.process-map-section .process-map__card {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important;
}

.process-map-section .process-map__stop:hover .process-map__card {
  border-color: rgba(17, 17, 17, 0.22) !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.1) !important;
}

.process-map-section .process-map__title {
  color: #111111 !important;
}

.process-map-section .process-map__desc {
  color: #555555 !important;
}

.process-map-section .process-map__photo {
  border: 1px solid #e8e8e8 !important;
}

.process-map-section .section-actions .hero-btn,
.process-map-section .section-actions .hero-btn.primary {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.process-map-section .section-actions .hero-btn.primary:hover,
.process-map-section .section-actions .hero-btn:hover {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* ─── Contact & Standorte (Admara layout) ───────────────── */
#contact.contact-section--with-map .section-subtitle {
  color: #888888 !important;
}

#contact.contact-section--with-map .section-header h2 {
  color: #111111 !important;
}

#contact.contact-section--with-map .contact-form-wrapper {
  background: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.12) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 4px 18px rgba(0, 0, 0, 0.06),
    0 20px 48px rgba(0, 0, 0, 0.08) !important;
}

#contact.contact-section--with-map .contact-form .form-input:focus,
#contact.contact-section--with-map .contact-form .form-textarea:focus {
  border-color: #111111 !important;
  box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.08) !important;
}

#contact.contact-section--with-map .contact-item {
  background: #f5f5f5 !important;
  border-color: rgba(17, 17, 17, 0.1) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 2px 8px rgba(0, 0, 0, 0.04),
    0 8px 22px rgba(0, 0, 0, 0.06) !important;
}

#contact.contact-section--with-map .contact-item:hover {
  background: #eeeeee !important;
  border-color: rgba(17, 17, 17, 0.18) !important;
}

#contact.contact-section--with-map .contact-icon {
  background: #111111 !important;
  border-color: rgba(17, 17, 17, 0.2) !important;
  color: #ffffff !important;
}

#contact.contact-section--with-map .contact-icon svg,
#contact.contact-section--with-map .contact-icon svg * {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

#contact.contact-section--with-map .contact-label {
  color: #888888 !important;
}

#contact.contact-section--with-map .contact-value,
#contact.contact-section--with-map .contact-value p,
#contact.contact-section--with-map .contact-value a {
  color: #111111 !important;
}

#contact.contact-section--with-map .contact-value a:hover {
  color: #333333 !important;
}

#contact.contact-section--with-map .contact-form .form-submit-btn {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
}

#contact.contact-section--with-map .contact-form .form-submit-btn:hover {
  background: #000000 !important;
  color: #ffffff !important;
}

/* ─── sanierung-innenausbau — unified CTA buttons (B&W, Admara sizing) ─── */
body.page-sanierung-innenausbau {
  --primary-color: #111111 !important;
  --primary-color-50: rgba(17, 17, 17, 0.45) !important;
  --primary-color-20: rgba(17, 17, 17, 0.12) !important;
}

body.page-sanierung-innenausbau .hero-btn.primary,
body.page-sanierung-innenausbau .section-btn.primary,
body.page-sanierung-innenausbau .form-submit-btn,
body.page-sanierung-innenausbau #contact .form-submit-btn,
body.page-sanierung-innenausbau #contact.contact-section--with-map .contact-form .form-submit-btn,
body.page-sanierung-innenausbau .mobile-form-submit-btn,
body.page-sanierung-innenausbau .cta-btn-about,
body.page-sanierung-innenausbau .final-cta-form button,
body.page-sanierung-innenausbau .mobile-sticky-cta__btn,
body.page-sanierung-innenausbau .funding-cta,
body.page-sanierung-innenausbau .renovierung-hero .hero-btn.primary,
body.page-sanierung-innenausbau .renovierung-hero .hero-btn,
body.page-sanierung-innenausbau .expertise-section .section-actions .hero-btn.primary,
body.page-sanierung-innenausbau .portfolio-section .section-actions .hero-btn.primary,
body.page-sanierung-innenausbau .why-us-section .section-actions .hero-btn.primary,
body.page-sanierung-innenausbau .team-showcase-section .section-actions .hero-btn.primary,
body.page-sanierung-innenausbau .team-showcase__actions .hero-btn.primary,
body.page-sanierung-innenausbau .process-map-section .section-actions .hero-btn.primary,
body.page-sanierung-innenausbau #coverage .section-cta .section-btn.primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 18px 40px !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(17, 17, 17, 0.5) !important;
  background: #111111 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 28px rgba(0, 0, 0, 0.08) !important;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease,
    border-color 0.25s ease !important;
}

body.page-sanierung-innenausbau .renovierung-hero .hero-btn.primary,
body.page-sanierung-innenausbau .renovierung-hero .hero-cta .hero-btn.primary {
  padding: 20px 40px !important;
  font-size: 20px !important;
  background: #111111 !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 36px rgba(0, 0, 0, 0.1) !important;
}

body.page-sanierung-innenausbau .hero-btn.primary:hover,
body.page-sanierung-innenausbau .section-btn.primary:hover,
body.page-sanierung-innenausbau .form-submit-btn:hover,
body.page-sanierung-innenausbau #contact .form-submit-btn:hover,
body.page-sanierung-innenausbau #contact.contact-section--with-map .contact-form .form-submit-btn:hover,
body.page-sanierung-innenausbau .mobile-form-submit-btn:hover,
body.page-sanierung-innenausbau .cta-btn-about:hover,
body.page-sanierung-innenausbau .final-cta-form button:hover,
body.page-sanierung-innenausbau .mobile-sticky-cta__btn:hover,
body.page-sanierung-innenausbau .mobile-sticky-cta__btn:focus,
body.page-sanierung-innenausbau .funding-cta:hover,
body.page-sanierung-innenausbau .renovierung-hero .hero-btn.primary:hover,
body.page-sanierung-innenausbau .renovierung-hero .hero-btn:hover,
body.page-sanierung-innenausbau .expertise-section .section-actions .hero-btn.primary:hover,
body.page-sanierung-innenausbau .portfolio-section .section-actions .hero-btn.primary:hover,
body.page-sanierung-innenausbau .why-us-section .section-actions .hero-btn.primary:hover,
body.page-sanierung-innenausbau .team-showcase__actions .hero-btn.primary:hover,
body.page-sanierung-innenausbau .process-map-section .section-actions .hero-btn.primary:hover,
body.page-sanierung-innenausbau #coverage .section-cta .section-btn.primary:hover {
  transform: translateY(-2px) !important;
  background: #000000 !important;
  border-color: rgba(17, 17, 17, 0.7) !important;
  color: #ffffff !important;
  box-shadow:
    0 12px 22px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 36px rgba(0, 0, 0, 0.12) !important;
}

body.page-sanierung-innenausbau .hero-btn.primary:active,
body.page-sanierung-innenausbau .section-btn.primary:active,
body.page-sanierung-innenausbau .form-submit-btn:active,
body.page-sanierung-innenausbau .mobile-form-submit-btn:active,
body.page-sanierung-innenausbau .mobile-sticky-cta__btn:active {
  transform: translateY(0) !important;
}

body.page-sanierung-innenausbau .mobile-sticky-cta__btn {
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 0 !important;
  gap: 0 !important;
}

/* ─── sanierung-innenausbau — gray / white section alternation ─── */
body.page-sanierung-innenausbau main > section:nth-of-type(even):not(.hero):not(footer) {
  background: transparent !important;
}

body.page-sanierung-innenausbau #why-us.why-us-section,
body.page-sanierung-innenausbau #expertise.expertise-section,
body.page-sanierung-innenausbau #foerderung.funding-section,
body.page-sanierung-innenausbau #process.process-map-section,
body.page-sanierung-innenausbau #contact.contact-section {
  background: linear-gradient(135deg, #fafafa 0%, #f0f0f0 100%) !important;
}

body.page-sanierung-innenausbau #portfolio.portfolio-section,
body.page-sanierung-innenausbau #coverage.property-owners-section,
body.page-sanierung-innenausbau #team.team-showcase-section,
body.page-sanierung-innenausbau #testimonials.testimonials-section {
  background: #ffffff !important;
}

/* ─── Unified centered section headers — sanierung-innenausbau ─── */
body.page-sanierung-innenausbau .section-heading,
body.page-sanierung-innenausbau .section-header,
body.page-sanierung-innenausbau .process-map-section__header,
body.page-sanierung-innenausbau .testimonials-header,
body.page-sanierung-innenausbau .portfolio-header .services-header,
body.page-sanierung-innenausbau .team-showcase__header {
  text-align: center !important;
  margin-bottom: clamp(32px, 4vw, 48px) !important;
}

body.page-sanierung-innenausbau .section-heading .section-subtitle,
body.page-sanierung-innenausbau .section-header .section-subtitle,
body.page-sanierung-innenausbau .process-map-section__header .section-subtitle,
body.page-sanierung-innenausbau .testimonials-header .section-label,
body.page-sanierung-innenausbau .portfolio-section .section-subtitle.services-subtitle {
  display: block !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888888 !important;
  text-align: center !important;
}

body.page-sanierung-innenausbau .section-heading .section-subtitle::before,
body.page-sanierung-innenausbau .section-header .section-subtitle::before,
body.page-sanierung-innenausbau .expertise-section .section-heading span::before {
  display: none !important;
  content: none !important;
}

body.page-sanierung-innenausbau .section-heading h2,
body.page-sanierung-innenausbau .section-header h2,
body.page-sanierung-innenausbau .section-header .section-title,
body.page-sanierung-innenausbau .process-map-section__header .section-title,
body.page-sanierung-innenausbau .testimonials-header .testimonials-title,
body.page-sanierung-innenausbau .portfolio-section .services-main-title,
body.page-sanierung-innenausbau .team-showcase__title {
  margin: 0 auto !important;
  max-width: none !important;
  font-size: clamp(28px, 2.8vw, 40px) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #111111 !important;
  text-align: center !important;
  text-wrap: balance !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

body.page-sanierung-innenausbau .funding-section .section-subtitle[data-funding-kicker] {
  font-size: clamp(11px, 0.9vw, 13px) !important;
  letter-spacing: 0.1em !important;
  line-height: 1.35 !important;
}

body.page-sanierung-innenausbau .funding-section .section-description {
  text-align: center !important;
  margin-inline: auto !important;
}

body.page-sanierung-innenausbau .team-showcase__description {
  align-items: flex-start !important;
  text-align: left !important;
  margin-inline: auto !important;
}

body.page-sanierung-innenausbau .team-showcase__description-part,
body.page-sanierung-innenausbau .team-showcase__tagline {
  text-align: left !important;
  align-self: flex-start !important;
}
