/* Solarvisory: Navy + Weiß + gezielte rote Akzente aus dem Flyer.
   Alle Regeln greifen ausschließlich auf bestehende Solarvisory-Komponenten. */
body.sv-flyer-design {
  --sv-navy: #07172f;
  --sv-navy-soft: #13223a;
  --sv-soft: #f7f8fa;
  --sv-red: #d92d35;
  --sv-red-dark: #b72129;
  --sv-radius: 12px;
  --sv-shadow: 0 12px 32px rgb(7 23 47 / 5%);
  --sv-serif: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #172033;
}
.sv-flyer-design .sv-header { background: #fff; border-bottom: 1px solid #e6e9ee; }
.sv-flyer-design .sv-header__inner { min-height: 88px; }
.sv-flyer-design .sv-title {
  font-family: var(--sv-sans);
  font-weight: 750;
  letter-spacing: -.035em;
  line-height: 1.12;
  text-wrap: balance;
}
.sv-flyer-design .sv-card h3,
.sv-flyer-design .sv-project h3,
.sv-flyer-design .sv-reference-card h3 {
  font-family: var(--sv-sans);
  font-weight: 750;
}
.sv-flyer-design .sv-eyebrow { color: #b72129; letter-spacing: .13em; font-weight: 750; }
.sv-flyer-design .sv-nav a::after { background: var(--sv-red); }
.sv-flyer-design .sv-button,
.sv-flyer-design .sv-button--yellow {
  background: var(--sv-red);
  border-color: var(--sv-red);
  color: #fff;
  border-radius: 9px;
  min-height: 52px;
  box-shadow: 0 5px 16px rgb(217 45 53 / 12%);
}
.sv-flyer-design .sv-button:hover,
.sv-flyer-design .sv-button:focus-visible,
.sv-flyer-design .sv-button--yellow:hover {
  background: var(--sv-red-dark);
  border-color: var(--sv-red-dark);
  color: #fff;
}
.sv-flyer-design a:focus-visible,
.sv-flyer-design button:focus-visible,
.sv-flyer-design summary:focus-visible {
  outline: 3px solid #d92d35;
  outline-offset: 4px;
}
/* Bestehendes Hero-Widget: Text und Bild bleiben editierbar. */
.sv-flyer-design .sv-hero { background: #fff; min-height: 610px; }
.sv-flyer-design .sv-hero::before {
  background: linear-gradient(90deg,#fff 0%,#fff 36%,rgb(255 255 255 / 95%) 45%,rgb(255 255 255 / 15%) 76%);
}
.sv-flyer-design .sv-hero__media { left: 43%; background-position: center; }
.sv-flyer-design .sv-hero__inner { min-height: 610px; }
.sv-flyer-design .sv-hero__content { max-width: 640px; padding: 90px 0; }
.sv-flyer-design .sv-hero__content .sv-title { font-size: clamp(36px,4.7vw,66px); }
.sv-flyer-design .sv-hero__accent { background: var(--sv-red); width: 88px; height: 5px; margin-block: 26px; }
.sv-flyer-design .sv-hero__text { font-size: 18px; line-height: 1.65; }
/* Die drei vorhandenen Leistungs-Widgets erhalten die originalen Flyer-Motive. */
.sv-flyer-design #leistungen { background: #fff; padding-top: 68px; }
.sv-flyer-design #leistungen .sv-heading-row { max-width: 900px; margin: 0 auto 48px; display: block; text-align: center; }
.sv-flyer-design #leistungen .sv-copy { max-width: 680px; margin: 20px auto 0; }
.sv-flyer-design #leistungen .sv-card-grid { gap: 38px; }
.sv-flyer-design #leistungen .sv-card { padding: 0 12px 30px; border: 0; box-shadow: none; text-align: center; background: #fff; }
.sv-flyer-design #leistungen .sv-icon {
  width: 100%; height: 230px; margin: 0 0 25px;
  background-size: contain; background-position: center; background-repeat: no-repeat;
}
.sv-flyer-design #leistungen .sv-card:nth-child(1) .sv-icon { background-image: url('investment.png'); }
.sv-flyer-design #leistungen .sv-card:nth-child(2) .sv-icon { background-image: url('mieterstrom.png'); }
.sv-flyer-design #leistungen .sv-card:nth-child(3) .sv-icon { background-image: url('finanzierung.png'); }
.sv-flyer-design #leistungen .sv-icon svg { visibility: hidden; }
.sv-flyer-design #leistungen .sv-card h3 { font-size: 21px; }
.sv-flyer-design #leistungen .sv-card p { min-height: 76px; line-height: 1.6; }
.sv-flyer-design .sv-text-link { color: #b72129; }
.sv-flyer-design .sv-text-link__icon { border-color: #f0c2c5; color: #b72129; }
.sv-flyer-design .sv-process__number { background: var(--sv-red); }
.sv-flyer-design .sv-project,
.sv-flyer-design .sv-reference-card { box-shadow: var(--sv-shadow); border-radius: 12px; }
.sv-flyer-design .sv-project-benefit { color: #b72129; font-weight: 700; }
.sv-flyer-design .sv-final-cta { background: var(--sv-navy); }
.sv-flyer-design .sv-final-cta .sv-eyebrow { color: #ffb7bc; }
.sv-flyer-design .sv-final-cta .sv-button { background: #fff; color: var(--sv-navy); border-color: #fff; box-shadow: none; }
.sv-flyer-design .sv-final-cta .sv-button:hover { background: #fcebec; border-color: #fcebec; }
.sv-flyer-design .sv-final-cta__benefit span:first-child { color: #ffb7bc; }
.sv-flyer-design .sv-faq-item { border-color: #e4e8ef; }
.sv-flyer-design .sv-footer { background: #07172f; }
@media (max-width: 900px) {
  .sv-flyer-design #leistungen .sv-card-grid { gap: 16px; }
  .sv-flyer-design #leistungen .sv-icon { height: 180px; }
  .sv-flyer-design .sv-hero__media { left: 25%; opacity: .55; }
}
@media (max-width: 640px) {
  .sv-flyer-design .sv-section { padding-block: 56px; }
  .sv-flyer-design .sv-container { width: min(calc(100% - 36px),1180px); }
  .sv-flyer-design .sv-hero,
  .sv-flyer-design .sv-hero__inner { min-height: 560px; }
  .sv-flyer-design .sv-hero__content { padding: 62px 0; }
  .sv-flyer-design .sv-hero__media { inset: 0; opacity: .2; }
  .sv-flyer-design .sv-hero::before { background: linear-gradient(90deg,#fff 0%,rgb(255 255 255 / 85%) 65%,rgb(255 255 255 / 60%) 100%); }
  .sv-flyer-design #leistungen .sv-card-grid { grid-template-columns: 1fr; gap: 35px; }
  .sv-flyer-design #leistungen .sv-icon { height: 215px; max-width: 340px; margin-inline: auto; }
  .sv-flyer-design #leistungen .sv-card p { min-height: 0; max-width: 380px; margin-inline: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .sv-flyer-design * { scroll-behavior: auto; transition: none; }
}