/*
Theme Name: Themify Ultra Child
Description: A child theme of Themify Ultra
Template: themify-ultra
Author: admin (christoph@kreiterling.com)
*/

/* ==========================================================================
   NATASCHA KREITERLING — Wachstumsbeschleuniger
   Marken-Stylesheet für WordPress + Themify Ultra
   --------------------------------------------------------------------------
   Einbau:  Themify > Settings > Custom CSS  (oder Child-Theme style.css)
   Basis:   Markenhandbuch v1.0 (2026) · Smaragd/Tanne · Jost + Inter
   Logik:   Globale Marken-Optik (Header, Typo, Footer, Buttons, Module)
            + Marken-Hilfsklassen .nk-* für den Themify-Builder.
   ========================================================================== */

/* ---------- 0 · Schriften ------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600&family=Inter:wght@400;500;600&display=swap');

/* ---------- 1 · Marken-Token --------------------------------------------- */
:root{
  --nk-smaragd:#33A86C;        /* Primärakzent  */
  --nk-smaragd-dark:#2D8B57;   /* Hover / aktiv */
  --nk-tanne:#2D6A4F;          /* Headlines, dunkle Flächen */
  --nk-salbei:#A7CDAD;         /* sekundär, Linien-Akzent */
  --nk-mint:#E9F2EB;           /* Flächen hell */
  --nk-mint-2:#F1F7F2;         /* Flächen sehr hell */
  --nk-anthrazit:#1F2A24;      /* Fließtext / Überschrift dunkel */
  --nk-grau:#5E6B63;           /* Sekundärtext */
  --nk-papier:#F8FAF7;         /* Seitenhintergrund */
  --nk-weiss:#FFFFFF;
  --nk-linie:rgba(45,106,79,.18);

  --nk-display:'Jost',system-ui,-apple-system,sans-serif;
  --nk-body:'Inter',system-ui,-apple-system,sans-serif;

  --nk-radius:6px;
  --nk-maxw:1140px;
  --nk-shadow:0 18px 50px -28px rgba(31,42,36,.45);
}

/* ---------- 2 · Grundlagen ----------------------------------------------- */
body{
  background:var(--nk-papier);
  color:var(--nk-anthrazit);
  font-family:var(--nk-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.tf_w body, body.tf_w{ background:var(--nk-papier); }

h1,h2,h3,h4,h5,h6{
  font-family:var(--nk-display);
  color:var(--nk-anthrazit);
  letter-spacing:-.01em;
  line-height:1.12;
  font-weight:400;
}
h1{ font-size:clamp(2.3rem,5vw,3.8rem); font-weight:300; }
h2{ font-size:clamp(1.8rem,3.6vw,2.7rem); }
h3{ font-size:1.3rem; font-weight:500; color:var(--nk-tanne); }
h4{ font-size:1.08rem; font-weight:500; color:var(--nk-tanne); }
h1 b,h2 b,h3 b{ font-weight:600; color:var(--nk-tanne); }

p{ margin:0 0 1.1rem; color:#34423b; }
a{ color:var(--nk-smaragd); text-decoration:none; transition:color .2s; }
a:hover{ color:var(--nk-smaragd-dark); }
strong{ color:var(--nk-anthrazit); font-weight:600; }
::selection{ background:var(--nk-salbei); color:var(--nk-tanne); }

/* ---------- 3 · Header / Logo / Navigation (Themify Ultra) --------------- */
#headerwrap,
.header-widget-bar,
.pagewrap > #header{
  background:var(--nk-papier);
  border-bottom:1px solid var(--nk-linie);
}
#header{ padding-top:18px; padding-bottom:18px; }
.site-logo img,
#site-logo img{ max-height:56px; width:auto; }
.site-logo a,
.site-title a{
  font-family:var(--nk-display);
  font-weight:500;
  letter-spacing:.02em;
  color:var(--nk-tanne);
}
.site-description,
.site-tagline{
  font-family:var(--nk-display);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.62rem;
  color:var(--nk-smaragd);
}

/* Hauptmenü */
#main-nav,
.main-nav{ font-family:var(--nk-display); }
#main-nav > li > a,
.main-nav > li > a{
  font-weight:400;
  font-size:.92rem;
  letter-spacing:.02em;
  color:var(--nk-anthrazit);
  padding:10px 16px;
}
#main-nav > li > a:hover,
#main-nav > li.current-menu-item > a,
#main-nav > li.current_page_item > a,
.main-nav > li > a:hover,
.main-nav > li.current-menu-item > a{
  color:var(--nk-smaragd);
}
/* dezente Unterstreichung des aktiven Punkts */
#main-nav > li.current-menu-item > a:after,
.main-nav > li.current-menu-item > a:after{
  content:"";display:block;height:2px;background:var(--nk-smaragd);
  margin-top:6px;border-radius:2px;
}
/* Menü-Button-Punkt (optionale Klasse "nk-nav-cta" am Menüpunkt setzen) */
#main-nav li.nk-nav-cta > a{
  background:var(--nk-smaragd);color:#fff !important;border-radius:999px;
  padding:9px 20px;margin-left:8px;
}
#main-nav li.nk-nav-cta > a:hover{ background:var(--nk-smaragd-dark); }
#main-nav li.nk-nav-cta > a:after{ display:none; }

/* ---------- 4 · Builder-Grundabstände ------------------------------------ */
.themify_builder_content .module{ margin-bottom:0; }
.themify_builder_content .themify_builder_row{ }
.tb_section{ }
/* einheitlicher Innen-Container für Lesbarkeit */
.nk-prose p,.nk-prose li{ max-width:64ch; }

/* ---------- 4b · Spaltenabstände · FAILSAFE ------------------------------ */
/* !important schlägt die Themify-Gutter-Defaults; greift NUR auf echte
   Mehrspalter (col-1-2/1-3/1-4) — Vollbreiten-Bänder bleiben unberührt. */
.themify_builder_content .col-1-2,
.themify_builder_content .col-1-3,
.themify_builder_content .col-1-4,
.themify_builder_content [class*="col-1-2"],
.themify_builder_content [class*="col-1-3"],
.themify_builder_content [class*="col-1-4"]{
  box-sizing:border-box !important;
  padding-left:18px !important;
  padding-right:18px !important;
}
.themify_builder_content [class*="col-1-"].first{ padding-left:0 !important; }
.themify_builder_content [class*="col-1-"]:last-child{ padding-right:0 !important; }
/* zweite Schicht direkt an den Komponenten — wirkt unabhängig von der Spaltenklasse */
.nk-stats-wrap{ margin:0 8px 16px !important; }
.nk-card{ margin:0 8px 16px !important; }
.nk-band{ margin:0 8px 16px !important; }          /* gleicht Karte↔Band an Karte↔Karte an */
.module-image.nk-figure,
.nk-figure{ margin-right:24px !important; }          /* Luft zwischen Foto und Text */
@media (max-width:880px){
  .themify_builder_content [class*="col-1-2"],
  .themify_builder_content [class*="col-1-3"],
  .themify_builder_content [class*="col-1-4"]{
    padding-left:0 !important;padding-right:0 !important;margin-bottom:22px !important;
  }
  .themify_builder_content [class*="col-1-"]:last-child{ margin-bottom:0 !important; }
  .nk-stats-wrap,.nk-card,.nk-band{ margin:0 0 18px !important; }
  .module-image.nk-figure,.nk-figure{ margin-right:0 !important; }  /* gestapelt: volle Breite */
}

/* ---------- 5 · Buttons (Marke) ------------------------------------------ */
/* als <a class="nk-btn"> in Text-Modulen ODER auf Themify-Buttons (.ui) */
.nk-btn,
a.nk-btn,
.module-buttons .ui.nk-btn{
  display:inline-block;
  font-family:var(--nk-display);
  font-weight:500;
  font-size:.95rem;
  letter-spacing:.02em;
  line-height:1;
  padding:15px 30px;
  border-radius:999px;
  background:var(--nk-smaragd);
  color:#fff !important;
  border:1px solid var(--nk-smaragd);
  transition:background .2s,border-color .2s,transform .2s;
  cursor:pointer;
}
.nk-btn:hover,a.nk-btn:hover{
  background:var(--nk-smaragd-dark);
  border-color:var(--nk-smaragd-dark);
  color:#fff !important;
  transform:translateY(-1px);
}
.nk-btn-ghost,
a.nk-btn-ghost{
  display:inline-block;
  font-family:var(--nk-display);font-weight:500;font-size:.95rem;letter-spacing:.02em;line-height:1;
  padding:14px 28px;border-radius:999px;
  background:transparent;color:var(--nk-tanne) !important;
  border:1px solid var(--nk-linie);
  transition:border-color .2s,color .2s;
}
.nk-btn-ghost:hover,a.nk-btn-ghost:hover{
  border-color:var(--nk-smaragd);color:var(--nk-smaragd) !important;
}
.nk-btn + .nk-btn,.nk-btn + .nk-btn-ghost,.nk-btn-ghost + .nk-btn{ margin-left:12px; }
.nk-btn-row{ margin-top:26px; }
.nk-btn-row .nk-btn,.nk-btn-row .nk-btn-ghost{ margin:8px 12px 8px 0; }

/* Themify-eigene Buttons an die Marke angleichen */
.module-buttons .ui.tb_default_color,
.module-buttons a.ui{
  border-radius:999px;font-family:var(--nk-display);font-weight:500;
}

/* ---------- 6 · Marken-Bausteine (.nk-*) --------------------------------- */

/* Kapitel-/Abschnitts-Label */
.nk-eyebrow{
  font-family:var(--nk-display);
  text-transform:uppercase;
  letter-spacing:.28em;
  font-size:.66rem;
  font-weight:600;
  color:var(--nk-smaragd);
  margin:0 0 14px;
  display:block;
}
.nk-eyebrow .num{ color:var(--nk-salbei);margin-right:10px; }

/* Lead-Absatz */
.nk-lead{
  font-family:var(--nk-display);
  font-weight:300;
  font-size:clamp(1.15rem,2vw,1.4rem);
  line-height:1.5;
  color:var(--nk-anthrazit);
  max-width:34ch;
}
.nk-lead.wide{ max-width:52ch; }

/* HERO */
.nk-hero{
  background:linear-gradient(180deg,var(--nk-mint-2),var(--nk-papier));
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  padding:clamp(48px,7vw,92px) clamp(28px,5vw,72px);
  position:relative;
  overflow:hidden;
}
.nk-hero h1{ margin:0 0 .4em;max-width:18ch; }
.nk-hero .nk-sub{
  font-family:var(--nk-display);font-weight:300;
  font-size:clamp(1.05rem,2vw,1.4rem);
  color:var(--nk-grau);max-width:46ch;margin:0 0 1.4em;
}
.nk-hero-sm{
  background:var(--nk-mint);
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  padding:clamp(38px,5vw,64px) clamp(28px,5vw,60px);
}
.nk-hero-sm h1{ margin:0; }

/* Kennzahlen-Band */
.nk-stat{
  text-align:center;
  padding:30px 18px;
}
.nk-stat .v{
  font-family:var(--nk-display);font-weight:500;
  font-size:clamp(1.9rem,4vw,2.7rem);
  color:var(--nk-tanne);line-height:1;display:block;
}
.nk-stat .l{
  font-family:var(--nk-display);text-transform:uppercase;
  letter-spacing:.16em;font-size:.66rem;color:var(--nk-grau);
  margin-top:12px;display:block;
}
.nk-stats-wrap{
  background:var(--nk-weiss);border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
}
/* Trennlinien zwischen Spalten der Kennzahlen-Reihe */
.nk-stats .themify_builder_col + .themify_builder_col .nk-stat,
.nk-stats .col + .col .nk-stat{ border-left:1px solid var(--nk-linie); }

/* Zitat / Kernbotschaft (dunkles Tannen-Band) */
.nk-claim{
  background:var(--nk-tanne);
  color:#fff;
  border-radius:var(--nk-radius);
  padding:clamp(38px,5vw,56px) clamp(30px,5vw,60px);
  position:relative;overflow:hidden;
}
.nk-claim .k{
  font-family:var(--nk-display);text-transform:uppercase;
  letter-spacing:.28em;font-size:.62rem;color:var(--nk-salbei);
  font-weight:500;margin-bottom:16px;display:block;
}
.nk-claim blockquote,
.nk-claim p.q{
  font-family:var(--nk-display);font-weight:300;
  font-size:clamp(1.3rem,2.6vw,1.95rem);line-height:1.32;
  max-width:26ch;margin:0;color:#fff;border:0;padding:0;
}
.nk-claim .big{ font-weight:500; }
.nk-claim cite{
  display:block;margin-top:18px;font-style:normal;
  font-family:var(--nk-display);font-size:.8rem;letter-spacing:.04em;color:var(--nk-salbei);
}

/* Motivations-Band hell (du-Ebene) */
.nk-motto{
  text-align:center;
  background:var(--nk-mint);
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  padding:clamp(40px,6vw,72px) 24px;
}
.nk-motto p{
  font-family:var(--nk-display);font-weight:300;
  font-size:clamp(1.6rem,4vw,2.6rem);color:var(--nk-tanne);
  margin:0;max-width:none;
}

/* Karten (Leistungen / Vorteile) */
.nk-card{
  background:var(--nk-weiss);
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  padding:34px 30px;
  height:100%;
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.nk-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--nk-shadow);
  border-color:var(--nk-salbei);
}
.nk-card .nk-no{
  font-family:var(--nk-display);font-weight:600;font-size:.8rem;
  color:var(--nk-smaragd);letter-spacing:.1em;display:block;margin-bottom:10px;
}
.nk-card h3{ margin:0 0 12px; }
.nk-card p{ font-size:.96rem;color:var(--nk-grau);margin-bottom:14px; }
.nk-card .nk-price{
  font-family:var(--nk-display);font-weight:500;font-size:.92rem;
  color:var(--nk-tanne);border-top:1px solid var(--nk-linie);
  padding-top:14px;margin-top:auto;display:block;
}
.nk-card .nk-price span{ color:var(--nk-grau);font-weight:400; }

/* Listen mit Punkt-Markern */
.nk-list{ list-style:none;margin:0 0 1.1rem;padding:0; }
.nk-list li{
  position:relative;padding-left:22px;margin-bottom:10px;color:#34423b;font-size:.98rem;
}
.nk-list li:before{
  content:"";position:absolute;left:0;top:.62em;
  width:7px;height:7px;border-radius:50%;background:var(--nk-smaragd);
}

/* Voice / Stimme der Marke (optional, So/So-nicht) */
.nk-voice .yes{ border-top:3px solid var(--nk-smaragd); }
.nk-voice .no{ border-top:3px solid #C0392B; }

/* helle Mint-Fläche als Sektions-Hintergrund */
.nk-band{
  background:var(--nk-mint-2);
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  padding:clamp(34px,5vw,60px) clamp(28px,5vw,54px);
}

/* feine Trennlinie */
.nk-rule{ height:1px;background:var(--nk-linie);border:0;margin:8px 0; }

/* Kontakt-Block */
.nk-contact-info{ list-style:none;margin:0;padding:0; }
.nk-contact-info li{
  display:flex;gap:14px;align-items:baseline;
  padding:14px 0;border-bottom:1px solid var(--nk-linie);
  font-size:1rem;
}
.nk-contact-info li:last-child{ border-bottom:0; }
.nk-contact-info .lbl{
  font-family:var(--nk-display);text-transform:uppercase;letter-spacing:.16em;
  font-size:.62rem;color:var(--nk-salbei);min-width:96px;flex:none;
}
.nk-contact-info a{ color:var(--nk-tanne); }
.nk-contact-info a:hover{ color:var(--nk-smaragd); }

/* CTA-Schlussband */
.nk-cta{
  text-align:center;
  background:var(--nk-tanne);
  border-radius:var(--nk-radius);
  padding:clamp(44px,6vw,72px) 28px;
}
.nk-cta h2{ color:#fff;margin:0 0 .4em;max-width:none; }
.nk-cta h2 b{ color:var(--nk-salbei); }
.nk-cta p{ color:var(--nk-salbei);max-width:48ch;margin:0 auto 26px; }
.nk-cta .nk-btn{ background:var(--nk-smaragd);border-color:var(--nk-smaragd); }
.nk-cta .nk-btn-ghost{ color:#fff !important;border-color:rgba(255,255,255,.4); }
.nk-cta .nk-btn-ghost:hover{ border-color:#fff;color:#fff !important; }

/* ---------- Foto / Bild-Modul · FAILSAFE -------------------------------- */
/* Klasse "nk-figure" im Bild-Modul (Additional CSS Class) setzen.
   Die Maße liegen auf dem <img> selbst -> unabhängig von Quellgröße,
   Seitenverhältnis, Themify-Wrappern und Spaltenhöhe.                      */
.nk-figure img,
.module-image.nk-figure img,
.nk-figure-empty img{
  width:100%;
  aspect-ratio:4 / 5;              /* fester, schöner Hochformat-Rahmen      */
  max-height:560px;
  object-fit:cover;                /* schneidet jede Quellgröße sauber zu    */
  object-position:center 22%;      /* bevorzugt obere Bildhälfte (Gesicht)   */
  display:block;
  margin:0;
  border-radius:var(--nk-radius);
}
/* Rahmen/Hintergrund am Modul-Wrapper -> Fallback, falls Bild fehlt/lädt   */
.nk-figure,
.module-image.nk-figure{
  background:var(--nk-mint);
  border:1px solid var(--nk-linie);
  border-radius:var(--nk-radius);
  overflow:hidden;
}
.nk-figure a,
.module-image.nk-figure a{ display:block; }

/* Foto-Platzhalter (bis Bild-Modul gesetzt ist) — gleiche Maße wie .nk-figure */
.nk-figure-empty{
  background:var(--nk-mint);
  border:1px dashed var(--nk-salbei);
  border-radius:var(--nk-radius);
  padding:34px 30px;
  width:100%;
  aspect-ratio:4 / 5;
  max-height:560px;
  min-height:300px;
  display:flex;flex-direction:column;justify-content:center;
}
.nk-figure-empty p{ color:var(--nk-grau);font-size:.92rem;margin:0; }
.nk-figure-empty code,
.nk-band code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--nk-weiss);border:1px solid var(--nk-linie);
  border-radius:4px;padding:1px 6px;font-size:.85em;color:var(--nk-tanne);
}
/* Mobil: festes Verhältnis lösen, natürliche Höhe (kein Beschnitt nötig) */
@media (max-width:880px){
  .nk-figure img,.module-image.nk-figure img{ aspect-ratio:3 / 4; max-height:520px; }
  .nk-figure-empty{ aspect-ratio:auto;min-height:200px;max-height:none; }
}

/* zentrierte Inhalte */
.nk-center{ text-align:center; }
.nk-center .nk-lead,.nk-center p{ margin-left:auto;margin-right:auto; }

/* ---------- 6b · Gleiche Boxhöhe je Zeile (Flex-basiert) ----------------- */
/* Spalten stehen nativ auf „Column Height = Full Height" (= gleich hoch).
   Hier wird die sichtbare Box per FLEX auf volle Spaltenhöhe gedehnt. Flex
   verteilt nur vorhandene Höhe -> kann KEINEN Leerraum aufblähen, und es
   überbrückt einen evtl. Wrapper zwischen Modul und Karte. */
.themify_builder_content .module:has(.nk-card),
.themify_builder_content .module:has(.nk-band){
  height:100%;
  display:flex;
  flex-direction:column;
}
.themify_builder_content .module:has(.nk-card) > *,
.themify_builder_content .module:has(.nk-band) > *{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.nk-card,.nk-band{ flex:1 1 auto; display:flex; flex-direction:column; }
/* gestapelt (mobil): natürliche Höhe, kein Flex-Stretch */
@media (max-width:880px){
  .themify_builder_content .module:has(.nk-card),
  .themify_builder_content .module:has(.nk-band){ height:auto; display:block; }
  .themify_builder_content .module:has(.nk-card) > *,
  .themify_builder_content .module:has(.nk-band) > *{ flex:none; display:block; }
  .nk-card,.nk-band{ flex:none; display:block; }
}

/* ---------- 7 · Footer ---------------------------------------------------- */
#footerwrap,
.footerwrap,
#footer{
  background:var(--nk-tanne);
  color:var(--nk-salbei);
}
#footer a,.footerwrap a{ color:#fff; }
#footer a:hover,.footerwrap a:hover{ color:var(--nk-salbei); }
#footer .footer-text,
.footerwrap .footer-text{
  font-family:var(--nk-display);font-size:.82rem;letter-spacing:.03em;
}

/* ---------- 8 · Responsive ----------------------------------------------- */
@media (max-width:880px){
  body{ font-size:16px; }
  .nk-stats .themify_builder_col + .themify_builder_col .nk-stat,
  .nk-stats .col + .col .nk-stat{ border-left:0;border-top:1px solid var(--nk-linie); }
  .nk-btn,.nk-btn-ghost{ display:block;text-align:center; }
  .nk-btn + .nk-btn,.nk-btn + .nk-btn-ghost,.nk-btn-ghost + .nk-btn{ margin-left:0;margin-top:10px; }
}
@media (max-width:600px){
  .nk-hero,.nk-claim,.nk-cta,.nk-band,.nk-motto{ border-radius:4px; }
}

/* ---------- 9 · Feinschliff ---------------------------------------------- */
img{ max-width:100%;height:auto; }
.themify_builder_content a:focus-visible,
.nk-btn:focus-visible{ outline:2px solid var(--nk-smaragd);outline-offset:3px; }
/* großzügiger vertikaler Rhythmus zwischen Builder-Reihen */
.themify_builder_content > .themify_builder_row{ margin-bottom:clamp(36px,5vw,64px); }
.themify_builder_content > .themify_builder_row:last-child{ margin-bottom:0; }