/*
Theme Name:   Kadence Child – Wenn das Ich am Limit ist
Theme URI:    https://wenndasichamlimit-ist.de
Description:  Child Theme von Kadence für die Webseite "Wenn das Ich am Limit ist" mit Manuel Suhre. Enthält individuelles Design (Farben, Schriften, Sektion-Styling).
Author:       Manuel Suhre
Author URI:   https://wenndasichamlimit-ist.de
Template:     kadence
Version:      1.0.0
Text Domain:  kadence-child-wennichamlimit
*/

/* =========================================================
   DESIGN-TOKENS — gleiche Werte wie im HTML-Entwurf
   ========================================================= */
:root {
  --violet:    #4c4572;
  --violet-dk: #2e1c2b;
  --violet-lt: #6a6098;
  --rose:      #e48e88;
  --mauve:     #d198c1;
  --offwhite:  #f7f4f9;
  --wlt-text:  #2e1c2b;
}

/* =========================================================
   GLOBALE TYPOGRAFIE-FEINANPASSUNG
   (Schriftarten selbst werden im Kadence-Customizer gesetzt)
   ========================================================= */
.wlt-eyebrow {
  font-family: 'Montserrat', sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--rose);
  margin-bottom: .8rem;
  display: block;
}
.wlt-accent { color: var(--rose); }

/* =========================================================
   HERO-SEKTION
   Klasse auf Row Layout: .wlt-hero
   ========================================================= */
.wlt-hero {
  position: relative;
  overflow: hidden;
}
.wlt-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(228,142,136,.18) 0%, transparent 60%),
    radial-gradient(ellipse at 10% 90%, rgba(209,152,193,.15) 0%, transparent 55%);
  pointer-events: none;
  z-index: 0;
}
.wlt-hero > .kt-row-column-wrap { position: relative; z-index: 1; }

/* Hero-Card (das schwebende Zitat-Kästchen) */
.wlt-hero-card {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 16px;
  padding: 2.5rem 2rem;
  max-width: 360px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
}
.wlt-hero-card .wlt-quote {
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 1.2rem;
}
.wlt-hero-card .wlt-quote em {
  color: var(--rose);
  font-style: normal;
}
.wlt-hero-card .wlt-author {
  font-size: .85rem;
  color: rgba(255,255,255,.65);
  border-top: 1px solid rgba(255,255,255,.15);
  padding-top: 1rem;
  margin-top: 1rem;
}
.wlt-stats {
  display: flex;
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.wlt-stat { text-align: center; flex: 1; }
.wlt-stat .num {
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 1.8rem;
  color: var(--rose);
  line-height: 1;
}
.wlt-stat .lbl {
  font-size: .72rem;
  color: rgba(255,255,255,.6);
  margin-top: .25rem;
}

/* =========================================================
   STORY-SEKTION
   ========================================================= */
.wlt-story-badge {
  display: inline-block;
  background: var(--rose);
  color: #fff;
  border-radius: 12px;
  padding: 1rem 1.4rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  text-align: center;
  box-shadow: 0 8px 24px rgba(228,142,136,.4);
  position: relative;
  margin-top: -2.5rem;
  margin-left: auto;
  z-index: 2;
}
.wlt-story-badge .big  { display: block; font-size: 2rem; line-height: 1; }
.wlt-story-badge .small{ display: block; font-size: .7rem; letter-spacing: .08em; margin-top: .2rem; opacity: .9; }

.wlt-highlight-box {
  background: var(--offwhite);
  border-left: 4px solid var(--rose);
  border-radius: 0 8px 8px 0;
  padding: 1.2rem 1.5rem;
  margin: 1.5rem 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--violet-dk);
  line-height: 1.6;
}

/* =========================================================
   "FÜR WEN"-KARTEN
   ========================================================= */
.wlt-card {
  background: #fff;
  border-radius: 12px;
  padding: 2rem;
  border: 1px solid rgba(76,69,114,.1);
  transition: transform .25s, box-shadow .25s;
  height: 100%;
}
.wlt-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(76,69,114,.12);
}
.wlt-card-icon {
  width: 48px; height: 48px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--violet), var(--violet-lt));
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.2rem;
  font-size: 1.4rem;
}

/* =========================================================
   ANGEBOTS-KARTEN
   ========================================================= */
.wlt-offer {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 16px;
  padding: 2.5rem 2rem;
  position: relative;
  transition: transform .25s;
  color: #fff;
  height: 100%;
}
.wlt-offer:hover { transform: translateY(-4px); }
.wlt-offer-featured {
  background: var(--rose);
  border-color: var(--rose);
}
.wlt-offer-badge {
  position: absolute;
  top: -1rem; left: 50%;
  transform: translateX(-50%);
  background: var(--mauve);
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .3rem 1rem;
  border-radius: 20px;
}
.wlt-offer-name {
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 1.1rem;
  margin-bottom: .5rem;
}
.wlt-offer-desc {
  font-size: .9rem;
  color: rgba(255,255,255,.7);
  line-height: 1.6;
  margin-bottom: 1.5rem;
}
.wlt-offer-featured .wlt-offer-desc { color: rgba(255,255,255,.9); }
.wlt-offer-price {
  font-family: 'Montserrat', sans-serif;
  font-weight: 900;
  font-size: 2.4rem;
  line-height: 1;
}
.wlt-offer-price span { font-size: 1rem; font-weight: 400; opacity: .7; }
.wlt-offer-original {
  font-size: .85rem;
  color: rgba(255,255,255,.55);
  text-decoration: line-through;
  margin-top: .2rem;
}
.wlt-offer-features { list-style: none; margin: 1.5rem 0 2rem; padding: 0; }
.wlt-offer-features li {
  font-size: .9rem;
  color: rgba(255,255,255,.85);
  padding: .4rem 0;
  display: flex; gap: .6rem;
  align-items: flex-start;
}
.wlt-offer-features li::before {
  content: '✓';
  color: var(--mauve);
  font-weight: 700;
  flex-shrink: 0;
}
.wlt-offer-featured .wlt-offer-features li::before { color: rgba(255,255,255,.95); }

/* Buttons in den Karten */
.wlt-btn-offer {
  display: block;
  text-align: center;
  padding: .85rem;
  border-radius: 8px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .9rem;
  text-decoration: none;
  transition: all .2s;
}
.wlt-btn-outline {
  border: 2px solid rgba(255,255,255,.35);
  color: #fff;
}
.wlt-btn-outline:hover {
  border-color: #fff;
  background: rgba(255,255,255,.08);
  color: #fff;
}
.wlt-btn-solid {
  background: #fff;
  color: var(--rose);
}
.wlt-btn-solid:hover {
  background: var(--offwhite);
  color: var(--rose);
  transform: translateY(-1px);
}

/* =========================================================
   BUCH-SEKTION
   ========================================================= */
.wlt-book-bg {
  background: linear-gradient(135deg, var(--violet-dk) 0%, var(--violet) 100%);
}

/* =========================================================
   CALENDLY-EINBETTUNG
   ========================================================= */
.wlt-calendly {
  min-height: 600px;
}

/* =========================================================
   ANIMATIONEN
   ========================================================= */
@keyframes wltFadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.wlt-fade-up { animation: wltFadeUp .6s ease both; }

/* =========================================================
   RESPONSIVE FEIN-FIXES
   ========================================================= */
@media (max-width: 768px) {
  .wlt-hero-card { max-width: 100%; }
  .wlt-story-badge {
    margin: 1rem 0 0 0;
    display: inline-block;
  }
}