/*
Theme Name:   Quint
Theme URI:    https://derbestezugdanach.de/
Description:  Child-Theme fuer „Der beste Zug danach" (Schwarz auf Weiss e.V.) auf Basis von Divi 5. Bringt die Design-Tokens des Buchs, lokal eingebundene Schriften (DSGVO) und den Marken-Grundstil mit.
Author:       3 Plus Solutions GmbH & Co. KG
Author URI:   https://3plus-solutions.de/
Template:     Divi
Version:      1.0.0
Text Domain:  quint
Tags:         divi, child-theme
*/

/* ============================================================
   1 · Schriften – lokal, kein Google-CDN
   ============================================================ */
@font-face{
  font-family:'Baloo 2';
  src:url('fonts/Baloo2-latin.woff2') format('woff2');
  font-weight:400 800; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Caveat';
  src:url('fonts/Caveat-latin.woff2') format('woff2');
  font-weight:400 700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Nunito Sans';
  src:url('fonts/NunitoSans-latin.woff2') format('woff2');
  font-weight:300 800; font-style:normal; font-display:swap;
}

/* ============================================================
   2 · Design-Tokens
   Dieselben Werte wie auf derbestezugdanach.de. Sobald die
   Divi-5-Design-Variables angelegt sind, dort pflegen – diese
   Variablen bleiben als Fallback fuer eigenes CSS bestehen.
   ============================================================ */
:root{
  --quint-creme:      #FAF3E3;
  --quint-papier:     #F4E9D2;
  --quint-navy:       #16323F;
  --quint-tinte:      #22404C;
  --quint-petrol:     #1E4B44;
  --quint-wasser:     #2C6F66;
  --quint-wasser-hell:#4E9A8C;
  --quint-gruen:      #7FA65B;
  --quint-gruen-tief: #5B7F3F;
  --quint-gold:       #D9A441;
  --quint-gold-hell:  #EDBB5E;
  --quint-rose:       #D98A73;

  --quint-display: 'Baloo 2','Nunito Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  --quint-text:    'Nunito Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --quint-hand:    'Caveat',cursive;

  --quint-radius:  16px;
  --quint-schatten:0 18px 40px -30px rgba(22,50,63,.85);
}

/* ============================================================
   3 · Grundstil
   ============================================================ */
body,
body .et_pb_module{
  font-family:var(--quint-text);
  color:var(--quint-navy);
}
body{ background-color:var(--quint-creme); }

h1,h2,h3,h4,h5,h6,
.et_pb_module h1,.et_pb_module h2,.et_pb_module h3,
.et_pb_module h4,.et_pb_module h5,.et_pb_module h6{
  font-family:var(--quint-display);
  font-weight:700;
  color:var(--quint-navy);
  letter-spacing:-.01em;
  text-wrap:balance;
}
h1{ font-weight:800; line-height:1.08; }

a{ color:var(--quint-wasser); }
a:hover{ color:var(--quint-petrol); }

/* Handschrift-Akzent, z. B. fuer Eyebrows und Zitate */
.quint-hand{
  font-family:var(--quint-hand);
  font-size:1.45em;
  line-height:1.3;
  color:var(--quint-gruen-tief);
}

/* ============================================================
   4 · Buttons
   Bewusst ohne Verschiebung beim Hover: ein sich bewegender
   Knopf laesst den Hover an der Kante flackern.
   ============================================================ */
body .et_pb_button,
body .et_pb_button:hover{
  font-family:var(--quint-display);
  font-weight:700;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.28);
  padding:.7em 1.6em;
  transition:background-color .18s ease, box-shadow .18s ease, color .18s ease;
}
body .et_pb_button{
  background-color:var(--quint-gold);
  color:#2A1D06;
  box-shadow:0 14px 28px -18px rgba(0,0,0,.9);
}
body .et_pb_button:hover{
  background-color:var(--quint-gold-hell);
  box-shadow:0 20px 34px -16px rgba(0,0,0,.95);
}
body .et_pb_button.quint-button-gruen{
  background-color:var(--quint-gruen-tief);
  color:#fff;
}
body .et_pb_button.quint-button-gruen:hover{
  background-color:var(--quint-gruen);
}

/* ============================================================
   5 · Kleine Bausteine
   ============================================================ */
.quint-karte{
  background:#fff;
  border:1px solid rgba(30,75,68,.14);
  border-radius:var(--quint-radius);
  box-shadow:var(--quint-schatten);
}

/* Papierkorn wie auf der Baustellenseite: <body class="quint-korn"> */
.quint-korn::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none; z-index:9999;
  opacity:.32;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

/* Divi-Module erben ohne gesetzte Textfarbe #666 – auf Creme zu blass. */
.et_pb_blurb_content p,
.et_pb_toggle_content,
.et_pb_testimonial_description{
  color:var(--quint-tinte);
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

/* Kopf- und Fusszeile liegen in css/g-kopf-fuss.css — siehe Kopf jener Datei. */