/*
 * WiM Schnell-Tuning
 * ==================
 * Für schnelle Gestaltungsvarianten nur die Werte im :root-Block ändern.
 * Die Regeln unterhalb des Blocks sollten unverändert bleiben.
 *
 * Wichtig: Schrift, Linien und Logo innerhalb des Hero-Bildes sind Bestandteile
 * der PNG-Datei. Hier lassen sich nur Höhe, Skalierung und Ausschnitt des
 * gesamten Bildes verändern.
 */

:root {
  /* Farben */
  --tuning-heading-color: #30383d;
  --tuning-text-color: #485158;
  --tuning-muted-color: #626b70;
  --tuning-page-background: #fafafa;
  --tuning-activity-background: #eeeeec;
  --tuning-footer-background: #dfdfdf;
  --tuning-footer-light: #e9e9e9;
  --tuning-footer-dark: #d6d6d6;
  --tuning-footer-divider: #d71832;
  --tuning-footer-link: #37434a;
  --tuning-button-background: #3b454b;
  --tuning-button-hover: #59636a;
  --tuning-button-text: #fff;
  --tuning-hero-band-start: #2f3438;
  --tuning-hero-band-end: #59636a;
  --tuning-hero-band-text: #fff;

  /* Schriften – DINish wird lokal aus diesem Theme bereitgestellt */
  --tuning-font-body: "DINish", Arial, sans-serif;
  --tuning-font-heading: "DINish", Arial, sans-serif;
  --tuning-body-size: 1.25rem;
  --tuning-body-line-height: 1.45;
  --tuning-navigation-size: 1.05rem;
  --tuning-navigation-weight: 600;
  --tuning-section-title-min: 1.7rem;
  --tuning-section-title-max: 2.5rem;
  --tuning-page-title-min: 2rem;
  --tuning-page-title-max: 3.2rem;

  /* Abstände */
  --tuning-section-space: .25rem;
  --tuning-card-space: 1.4rem;
  --tuning-heading-follow-gap: .35rem;

  /* Gemeinsame Breite für Hero, Navigation, Inhalt und Footer */
  --tuning-shell-width: 82vw;
  --tuning-shell-max: 1680px;

  /* Hero-Bildausschnitt; bei widersprüchlichen Grenzen hat max Vorrang. */
  --tuning-hero-min-height: 300px;
  --tuning-hero-fluid-height: 30vw;
  --tuning-hero-max-height: 420px;
  --tuning-hero-fit: cover;       /* Alternative: contain */
  --tuning-hero-position-x: 50%;
  --tuning-hero-position-y: 48%;
}

/* Ab hier werden die Werte nur auf das Theme übertragen. */
:root {
  --wim-blue: var(--tuning-heading-color);
  --wim-blue-hover: var(--tuning-button-hover);
  --wim-red: var(--tuning-footer-divider);
  --wim-ink: var(--tuning-text-color);
  --wim-muted: var(--tuning-muted-color);
  --wim-paper: var(--tuning-page-background);
  --wim-soft: var(--tuning-activity-background);
  --wim-footer: var(--tuning-footer-background);
  --wim-footer-light: var(--tuning-footer-light);
  --wim-footer-dark: var(--tuning-footer-dark);
  --wim-footer-link: var(--tuning-footer-link);
  --wim-button: var(--tuning-button-background);
  --wim-nav-start: var(--tuning-hero-band-start);
  --wim-nav-end: var(--tuning-hero-band-end);
  --wim-shell-width: var(--tuning-shell-width);
  --wim-content: var(--tuning-shell-max);
}

body {
  color: var(--tuning-text-color);
  background: var(--tuning-page-background);
  font-family: var(--tuning-font-body);
  font-size: var(--tuning-body-size);
  line-height: var(--tuning-body-line-height);
}

.wim-brand-text,
.wim-section-title,
.wim-page-title,
.wim-card h2,
.wim-card h3,
.wim-activity-card h2 {
  font-family: var(--tuning-font-heading);
  color: var(--tuning-heading-color);
}

.wim-site-header { background: var(--tuning-page-background); }
.wim-hero-nav-band,
.wim-hero-nav {
  background: linear-gradient(90deg, var(--tuning-hero-band-start) 0%, var(--tuning-hero-band-end) 100%);
}
.wim-hero-nav a {
  color: var(--tuning-hero-band-text);
  font-size: var(--tuning-navigation-size);
  font-weight: var(--tuning-navigation-weight);
}

.wim-button,
.wp-block-button__link,
.wim-year-link {
  border-color: var(--tuning-button-background);
  background: var(--tuning-button-background);
  color: var(--tuning-button-text);
}
.wim-button:hover,
.wim-button:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.wim-year-link:hover,
.wim-year-link:focus-visible {
  border-color: var(--tuning-button-hover);
  background: var(--tuning-button-hover);
  color: var(--tuning-button-text);
}

.wim-activity-card { background: var(--tuning-activity-background); }
.wim-site-footer {
  background-color: var(--tuning-footer-background);
  background-image:
    radial-gradient(circle at 15% 30%, rgba(233,233,233,.82) 0, rgba(233,233,233,0) 38%),
    radial-gradient(circle at 82% 72%, rgba(214,214,214,.58) 0, rgba(214,214,214,0) 42%),
    linear-gradient(115deg, var(--tuning-footer-dark) 0%, var(--tuning-footer-background) 42%, var(--tuning-footer-light) 68%, var(--tuning-footer-background) 100%);
  color: var(--tuning-text-color);
  border-top-color: var(--tuning-footer-divider);
}
.wim-footer-nav a { color: var(--tuning-footer-link); }
.wim-footer-nav a:hover,
.wim-footer-nav a:focus-visible { color: var(--tuning-button-hover); }

.wim-section { padding-block: var(--tuning-section-space); }
.wim-card-body { padding: var(--tuning-card-space); }
.wim-section-title { font-size: clamp(var(--tuning-section-title-min), 3vw, var(--tuning-section-title-max)); }
.wim-page-title { font-size: clamp(var(--tuning-page-title-min), 4vw, var(--tuning-page-title-max)); }

.wim-section-title,
.wim-page-title,
.wim-card h2,
.wim-card h3,
.wim-activity-card h2,
.wim-content h1,
.wim-content h2,
.wim-content h3,
.wim-content h4,
.wim-content h5,
.wim-content h6 {
  margin-bottom: var(--tuning-heading-follow-gap);
}

.wim-section-title + p,
.wim-page-title + p,
.wim-card h2 + p,
.wim-card h3 + p,
.wim-content h1 + p,
.wim-content h2 + p,
.wim-content h3 + p,
.wim-content h4 + p,
.wim-content h5 + p,
.wim-content h6 + p {
  margin-top: 0;
}

.wim-hero-visual {
  min-height: 0;
  height: clamp(
    min(var(--tuning-hero-min-height), var(--tuning-hero-max-height)),
    var(--tuning-hero-fluid-height),
    var(--tuning-hero-max-height)
  );
  background-size: var(--tuning-hero-fit);
  background-position: var(--tuning-hero-position-x) var(--tuning-hero-position-y);
  background-color: var(--tuning-page-background);
}

@media (max-width: 900px) {
  .wim-hero-visual {
    background-position: var(--tuning-hero-position-x) var(--tuning-hero-position-y);
  }
}
