/* Vita Cordis — design-vars.css — Generated 15.06.2026 21:31 */
/* Wird NACH design.css geladen — überschreibt nur editierbare Werte. */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Lato:wght@300;400;700&display=swap');

:root {
  --primary:          #A65073;
  --primary-light:    #C4768F;
  --primary-hover:    #C4768F;
  --primary-xlight:   #F4EAEE;
  --secondary:        #6E354C;
  --primary-dark:     #6E354C;
  --secondary-light:  #EBD9E0;
  --bg:               #c3a6ad;
  --grey:             #E8D8E0;
  --slate:            #3D3540;
  --ink:              #3D3540;
  --slate-light:      #7A6E80;
  --slate-mid:        #7A6E80;
  --muted:            #7A6E80;
  --card:             #f3f3f3;
  --border:           rgba(61,53,64,0.12);
  --border-color:     #E8D8E0;
  --footer-bg:        #6E354C;
  --nav-bg:           rgba(247,243,238,0.97);
  --teal:             #7aa7ad;
  --teal-mid:         #9BBDC2;
  --teal-lt:          #EBF2F3;
  --teal-xlt:         #F4F8F8;
  --vc-teal:          var(--teal);
  --vc-teal-lt:       var(--teal-lt);
  --vc-teal-mid:      var(--teal-mid);
  --serif:            'Playfair Display', Georgia, serif;
  --sans:             'Lato', system-ui, sans-serif;
  --radius:           2px;
  --nav-height:       68px;
  --font-base:        16px;
  --font-hero-max:    5rem;
  --font-section-max: 2.8rem;
  --font-weight-body: 300;
}

body { background:var(--bg) !important; color:var(--slate) !important; font-family:var(--sans) !important; font-weight:var(--font-weight-body) !important; font-size:var(--font-base) !important; }
footer { background: var(--footer-bg) !important; color: rgba(255,255,255,0.7) !important; }
nav.scrolled { background: var(--nav-bg) !important; }
.hero-title { font-size: clamp(2.4rem, 6vw, var(--font-hero-max)); }
.section-title { font-size: clamp(1.6rem, 3.5vw, var(--font-section-max)); }
.btn { border-color: var(--primary) !important; color: var(--primary) !important; }
.btn:hover { background: var(--primary) !important; color: #fff !important; }
.btn-solid,.btn-primary { background: var(--primary) !important; color: #fff !important; }
.section-label { color: var(--primary) !important; }
.section-title { color: var(--slate) !important; }
.post-card { background: var(--card) !important; }
#newsletter { background: linear-gradient(135deg, var(--secondary-light) 0%, var(--primary-xlight) 100%) !important; }
.scroll-top { background: var(--secondary) !important; }
#podcast { background: var(--card) !important; color: var(--slate) !important; }
::selection { background: var(--primary); color: #fff; }

.vc-tab,.vc-nb,.tab-btn { padding: 5px 12px !important; border-radius: 20px !important; font-size: 12px !important; }
.vc-tab.active,.vc-nb.active,.tab-btn.active { background: var(--teal) !important; border-color: var(--teal) !important; }
.vc-tab:hover,.vc-nb:hover,.tab-btn:hover { background: var(--teal-lt) !important; border-color: var(--teal-mid) !important; color: var(--teal) !important; }
.nav-center a,.nav-links a,.nav-main a,.nav-link { color: #5a4f60 !important; }
.nav-center a:hover,.nav-center a.active,.nav-links a:hover,.nav-links a.active,.nav-main a:hover,.nav-main a.active { color: var(--primary) !important; }

/* Sektions-Farben, Buttons, Bild-Overlays */
.btn-solid, .btn-primary { background: #c3758e !important; border-color: #c3758e !important; }
.btn { border-color: #c3758e !important; color: #c3758e !important; }
.btn:hover { background: #c3758e !important; }
.btn-solid, .btn-primary { color: #59223f !important; }
.btn:hover { color: #59223f !important; }
#about { background: #f7f4f2 !important; }
.about-image-wrap::after { background: linear-gradient(to right, rgba(0,0,0,0) 40%, #f7f4f2 100%) !important; }
.about-image-wrap .about-pen-img { filter: brightness(0.76); }
.quotes { background: #eaeaea !important; }
.quote-text { color: #797979 !important; }
#newsletter { background: linear-gradient(135deg, #f7f4f2 0%, #eaeaea 100%) !important; }
#newsletter .section-title, #newsletter .nl-text p, #newsletter .section-label { color: #929292 !important; }
#contact .section-title { color: #424242 !important; }
#contact .section-label, #contact p, #contact .contact-text { color: #424242 !important; }

.sidebar,.sidebar-logo,.sidebar-nav,.sidebar-nav a,.sidebar-nav a:visited,.sidebar-nav .nav-group,.sidebar-footer,.sidebar-footer a,.sidebar-user { background-color: transparent !important; background-image: none !important; }
.sidebar { background-color: #6E354C !important; }
.sidebar-logo { background-color: rgba(0,0,0,0.15) !important; border-bottom: 1px solid rgba(0,0,0,0.2) !important; }
.sidebar * { color: #fff !important; }
.sidebar-nav a { opacity: 1 !important; font-size: 0.82rem !important; }
.sidebar-nav a:hover { background-color: rgba(0,0,0,0.18) !important; }
.sidebar-nav a.active { background-color: rgba(0,0,0,0.25) !important; border-left: 3px solid #fff !important; }
.sidebar-nav .nav-group { opacity: 0.7 !important; font-size: 0.6rem !important; }
.sidebar-footer { border-top: 1px solid rgba(0,0,0,0.2) !important; }
.sidebar-footer a { opacity: 0.8 !important; }
.sidebar-user { opacity: 0.9 !important; }
.vc-tab,.vc-nb,.tab-btn { padding: 5px 12px !important; border-radius: 20px !important; font-size: 12px !important; }
.vc-tab.active,.vc-nb.active,.tab-btn.active { background: var(--teal) !important; border-color: var(--teal) !important; }
.vc-tab:hover,.vc-nb:hover,.tab-btn:hover { background: var(--teal-lt) !important; border-color: var(--teal-mid) !important; color: var(--teal) !important; }
.nav-center a,.nav-links a,.nav-main a,.nav-link { color: #5a4f60 !important; }
.nav-center a:hover,.nav-center a.active,.nav-links a:hover,.nav-links a.active,.nav-main a:hover,.nav-main a.active { color: var(--primary) !important; }
