/* Seit YOOtheme 5 bekommt jedes Bild das Seitenverhältnis seiner width/height-Attribute
   und wird mit object-fit: cover zugeschnitten. Die Deko-Flecken (SVG) sind als Quadrat
   eingetragen, aber breiter als hoch, und wurden dadurch links und rechts abgeschnitten.
   SVGs nehmen wieder ihr eigenes Seitenverhältnis. */
img.el-image[src$=".svg"] { aspect-ratio: auto; }

/* Startseite, Hero: Unter 960 px liegt der grüne Fleck hinter dem Logo und der orange
   über dem Text bei „Aktuelles“, auch verkleinert. Dort beide ausblenden, bis 1200 px
   den orangen kleiner an den Rand, damit er nicht unter der Überschrift liegt. */
@media (max-width: 959px) {
  .home img.el-image[src*="home-hero-left"],
  .home .uk-position-absolute:not(.uk-visible\@m) > img.el-image[src*="hero-right"] { display: none; }
}
/* Barrierefreiheit: Kontrast nach WCAG AA (4,5:1 für normalen Text). Gleiche Farbtöne,
   nur so weit abgedunkelt, wie nötig. */
html .uk-button-secondary { background-color: #9a6624; }
html .uk-button-secondary:hover, html .uk-button-secondary:focus { background-color: #7f5420; }
html .uk-text-secondary { color: #8e5e22 !important; }
html .uk-card-secondary { background-color: #a95c3d; }
html .uk-card-secondary :is(b, strong, p, li, div, span, dt, dd, h2, h3, h4) { color: #fff; }
html footer .uk-text-meta { color: #5c6a4e; }
html :is(.uk-section-primary, .uk-card-primary, .uk-tile-primary) { color: rgba(255,255,255,.92); }
html :is(.uk-section-primary, .uk-card-primary, .uk-tile-primary) :is(p, li, legend, dd, dt, .uk-card-body, .el-content):not(a *) { color: rgba(255,255,255,.92); }

/* Kontaktformular: Auswahlgruppe ohne Rahmen, sieht aus wie vorher */
.wpcf7 .pe-feldgruppe { border: 0; margin: 0; padding: 0; min-width: 0; }
.wpcf7 .pe-feldgruppe legend { padding: 0; color: inherit; font: inherit; }

@media (min-width: 960px) and (max-width: 1199px) {
  .home .uk-position-absolute:not(.uk-visible\@m):has(> img[src*="hero-right"]) { right: -60px !important; }
  .home .uk-position-absolute:not(.uk-visible\@m) > img.el-image[src*="hero-right"] { width: 170px; }
}