/*
Theme Name: Claudia Wessling Theme
Theme URI: https://claudiawessling.de
Description: Individuelles Child-Theme auf Basis von Hello Elementor, gestaltet nach dem Corporate-Design-Mockup (Unternehmensentwicklung & Arbeitskultur). Enthält Farb- und Schrift-Grundlagen sowie Feintuning-CSS zur Nutzung mit Elementor.
Author: Claudia Wessling
Template: hello-elementor
Version: 1.0.0
Text Domain: claudia-wessling-theme
*/

/* -----------------------------------------
   Design-Tokens (aus dem Mockup übernommen)
------------------------------------------ */
:root{
  --cw-cream: #F8F6F1;
  --cw-ink: #33312F;
  --cw-ink-soft: #5B5854;
  --cw-gold: #F8C141;
  --cw-gold-dark: #E8AC1E;
  --cw-pill: #39362F;
  --cw-red: #FF4B4B;
  --cw-footer-dark: #3B4349;
  --cw-radius-lg: 28px;
  --cw-radius-pill: 999px;
}

body{
  background-color: var(--cw-cream);
  color: var(--cw-ink);
  font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4,
.elementor-heading-title,
.elementor-button{
  font-family: 'Poppins', sans-serif;
}

/* Goldene Buttons wie im Mockup */
.btn-gold,
.elementor-button.cw-gold{
  background-color: var(--cw-gold) !important;
  color: var(--cw-ink) !important;
  border-radius: var(--cw-radius-pill) !important;
  font-weight: 600;
  padding: 16px 30px !important;
  transition: all .18s ease;
}
.btn-gold:hover,
.elementor-button.cw-gold:hover{
  background-color: var(--cw-gold-dark) !important;
  transform: translateY(-2px);
}

/* Dunkle Pill-Labels (z. B. unter den Leistungs-Fotos) */
.cw-pill-dark{
  background-color: var(--cw-pill);
  color: #fff;
  border-radius: var(--cw-radius-pill);
  text-align: center;
  font-weight: 600;
  padding: 18px 14px;
}

/* Runde Förder-Badges */
.cw-badge{
  width: 104px;
  height: 104px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}
.cw-badge.red{ background-color: var(--cw-red); }
.cw-badge.gold{ background-color: var(--cw-gold); color: var(--cw-ink); }

/* Runde Bild-Ecken wie im Mockup */
.cw-rounded-img img{
  border-radius: var(--cw-radius-lg) !important;
}

/* Footer dunkel */
.cw-footer{
  background-color: var(--cw-footer-dark) !important;
  color: #e9e9e6 !important;
}
.cw-footer a{ color: #cfd2d3; }
