/* Seite in hellem Olivton (#eef1e1), Footer in dunklem Grün. Wird nach style.css geladen. */
:root { --bg-page: #eef1e1; --bg-alt: #e4e9d0; --bg-dark: #3f4a28; --cream: #f8f6ea; }

body { background: var(--bg-page); color: var(--ink); }
.section-tint { background: var(--bg-alt); }

/* Kopfzeile weiß */
.site-header { background: rgba(255, 255, 255, 0.97); border-bottom: 1px solid var(--line); }

/* Karten weiß */
.offer { background: #f7f9ee; }
.offer.is-main { background: #f7f9ee; }
.portrait { background: #fff; }
.hero-logo, .contact-logo { background: transparent; padding: 0; mix-blend-mode: normal; }

/* Footer dunkelgrün */
.site-footer { background: var(--bg-dark); color: var(--cream); border-top: 0; }
.site-footer a { color: var(--cream); }
.site-footer .brand-text { color: #fff; }

/* Kopfzeile: nur das Bild-Logo */
.site-header .brand img { height: 64px; }
@media (max-width: 760px) { .site-header .brand img { height: 50px; } }

/* Wechselnde Seiten: Logo links / Text rechts, Fragen links / Überschrift rechts, Foto rechts / Text links */
@media (min-width: 821px) {
  .kd { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 56px; align-items: center; }
  .kd .kd-head { order: 1; margin-bottom: 0; }
  .kd .pain { order: 2; grid-template-columns: 1fr; gap: 26px; }
  .about { grid-template-columns: 1.2fr 0.8fr; }
  .about .portrait-wrap { order: 2; }
}
@media (max-width: 820px) { .kd .pain { margin-top: 8px; } }

/* Startbereich: Wortmarke links, Logo-Symbol rechts */
.hero h1 { margin: 0 0 24px; line-height: 0; }
.hero-wordmark { display: block; width: min(100%, 520px); height: auto; }
.hero-logo { width: min(100%, 380px); justify-self: center; }
@media (max-width: 820px) { .hero-logo { width: min(70%, 300px); } }

/* Fußzeile: weiße Wortmarke, transparenter Hintergrund */
.footer-row { align-items: center; }
.footer-brand { display: inline-block; }
.footer-brand img { display: block; width: 230px; max-width: 100%; height: auto; }

/* Beide Angebotskarten identisch */
.offer.is-main .tag, .offer .tag { background: var(--tint-deep); }

/* Startbereich: Logo links, Text rechts (nur Desktop) */
@media (min-width: 821px) { .hero-logo { order: -1; } }

/* Angebotskarten: gleiche Zeilen links und rechts (Subgrid), Listenpunkte als eigene Zeilen */
@media (min-width: 821px) {
  .offers { grid-template-rows: repeat(9, auto); column-gap: 28px; row-gap: 0; }
  .offer { display: grid; grid-row: span 9; grid-template-rows: subgrid; align-content: start; }
  .offer .tag { justify-self: start; align-self: start; }
  .offer .facts { display: contents; }
  .offer .facts li:first-child { margin-top: 4px; }
  .offer .facts li:last-child { margin-bottom: 22px; }
  .offer .actions { align-self: end; margin-top: 0; }
}