/*
Theme Name: Divi Child
Template: Divi
 Description: Child theme mit lokaler Poppins-Einbindung, globaler Typografie & Button-Styles.
 Version: 1.0.0
 Author: Andre Thiemann
*/

/* ===========================
   Farb-Variablen
   =========================== */
:root{
  --brand-blue: #123D5B;   /* Nachtblau */
  --brand-orange: #FF6B35; /* CTA / Akzent */
  --brand-sand: #F4F4F4;   /* helle Flächen/Karten */
  --brand-sky: #88B8E8;    /* dezente Akzente */
  --text-dark: #0F172A;    /* Standard-Text */
  --white: #FFFFFF;
  --line: #E2E8F0;         /* zarte Trennlinien */
  --hover-cyan: #22D3EE;   /* alternative Hover-Farbe */

  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2rem; --space-6:3rem;
}

/* ===========================
   Lokale Fonts (Poppins)
   Lege die Dateien in /assets/fonts/poppins/
   Dateinamen: Poppins-Regular.woff2, Poppins-Bold.woff2
   =========================== */
@font-face {
  font-family: 'Poppins';
  src: url('/wp-content/themes/divi-child/assets/fonts/poppins/Poppins-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('/wp-content/themes/divi-child/assets/fonts/poppins/Poppins-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ===========================
   Basis-Typografie
   =========================== */
html { -webkit-text-size-adjust: 100%; }
body{
  font-family: 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, Arial, sans-serif;
  font-weight: 400;
  font-size: 18px;          /* Vorgabe */
  line-height: 1.6;         /* Vorgabe */
  color: var(--text-dark);  /* Vorgabe */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}	
strong, b { font-weight: 600; }

h1, h2, h3, h4, h5, h6{
  font-family: 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, Arial, sans-serif;
  color: var(--text-dark);
  line-height: 1.2;
  margin-top: 0;
}
/* H1: 52 / 34 / 28 */
h1{ font-weight: 700; font-size: 52px; }
@media (max-width: 980px){ h1{ font-size: 34px; } }
@media (max-width: 767px){ h1{ font-size: 28px; } }
/* H2: 36 / 32 / 28 */
h2{ font-weight: 700; font-size: 36px; }
@media (max-width: 980px){ h2{ font-size: 32px; } }
@media (max-width: 767px){ h2{ font-size: 28px; } }
/* H3: 26 / 24 / 24 */
h3{ font-weight: 600; font-size: 26px; }
@media (max-width: 980px){ h3{ font-size: 24px; } }
@media (max-width: 767px){ h3{ font-size: 24px; } }

/* ===========================
   Hero-Sonderfall: weiße H1 nur im Hero
   → CSS-Klasse der Sektion: home-hero
   =========================== */
.home-hero { background: var(--brand-blue); color: var(--white); }
.home-hero h1{ color: var(--white); }
.home-hero p, .home-hero .et_pb_text { color: rgba(255,255,255,0.92); }

/* ===========================
   Buttons – global (Divi Buttons)
   =========================== */
.et_pb_button{
  background: var(--brand-orange) !important;
  color: var(--white) !important;
  font-weight: 600;
  border-radius: 8px;
  padding: 14px 26px; /* 12–16 / 24–28 */
  border: none;
  box-shadow: 0 4px 14px rgba(0,0,0,.06);
  transition: all .2s ease-in-out;
  text-decoration: none;
}
@media (max-width: 980px){ .et_pb_button{ padding: 14px 24px; } }
@media (max-width: 767px){ .et_pb_button{ padding: 12px 20px; } }
.et_pb_button:after{ color: currentColor; }
.et_pb_button:hover{
  background: linear-gradient(135deg, var(--brand-orange) 0%, var(--brand-blue) 100%) !important;
  transform: translateY(-1px) scale(1.02);
  box-shadow: 0 8px 20px rgba(0,0,0,.10);
  color: var(--white) !important;
}
/* Alternative Hover-Variante in Cyan: Button-Klasse "is-alt" vergeben */
.et_pb_button.is-alt:hover{
  background: var(--hover-cyan) !important;
  color: var(--text-dark) !important;
}
.et_pb_button:focus{
  outline: 2px solid var(--hover-cyan);
  outline-offset: 2px;
}

/* ===========================
   Karten & Abstände (optional)
   =========================== */
.et_pb_section{ padding: var(--space-6) 0; }
.card{
  background: var(--white);
  border-radius: 8px;
  padding: var(--space-3);
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
}

/* ===========================
   Reduced Motion
   =========================== */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important;
     transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* Globale Stacks */
:root {
  --font-heading: 'Poppins', 'Segoe UI', Roboto, Arial, sans-serif;
  --font-body: 'Poppins', 'Segoe UI', Roboto, Arial, sans-serif;
}
body { font-family: var(--font-body); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }