/*
Theme Name: Divi 5 Child
Theme URI: https://weito-webdesign.de
Description: Barrierefreies Child Theme für Divi 5 (WCAG-orientiert)
Author: Thomas – Weito Webdesign
Author URI: https://weito-webdesign.de
Template: Divi
Version: 1.0.0
Text Domain: divi-5-child
*/

/* ===============================
   BASIS-FARBEN (WCAG-freundlich)
   =============================== */

:root {
  --color-bg-main: #F7F7F5;
  --color-bg-section: #FFFFFF;
  --color-text-main: #1F2937;
  --color-text-muted: #4B5563;
  --color-accent: #2563EB;
  --color-accent-hover: #1E40AF;
  --color-border-light: #E5E7EB;
}

/* ===============================
   GRUNDLAYOUT & LESBARKEIT
   =============================== */

body {
  background-color: var(--color-bg-main);
  color: var(--color-text-main);
  line-height: 1.6;
}

a {
  color: var(--color-accent);
  text-decoration: underline;
}

a:hover,
a:focus {
  color: var(--color-accent-hover);
}

/* ===============================
   SEKTIONEN (abgesetzt)
   =============================== */

.section-card {
  background-color: var(--color-bg-section);
  padding: 4rem 2rem;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.04);
}

/* ===============================
   BUTTONS (kontrastreich & sichtbar)
   =============================== */

.button,
.et_pb_button {
  background-color: var(--color-accent);
  color: #FFFFFF;
}

.button:hover,
.button:focus,
.et_pb_button:hover,
.et_pb_button:focus {
  background-color: var(--color-accent-hover);
  color: #FFFFFF;
}

/* ===============================
   FOKUS-STILE (Barrierefreiheit)
   =============================== */

:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 3px;
}

/* ===============================
   TYPOGRAFIE
   =============================== */

h1, h2, h3, h4, h5, h6 {
  color: var(--color-text-main);
  line-height: 1.3;
}

p {
  color: var(--color-text-main);
}

small,
.text-muted {
  color: var(--color-text-muted);
}