
:root{
  /* --- CI. Soft Charcoal wird nicht als Flaeche verwendet;
     seine Rollen uebernimmt Olive Green. --- */
  --rosegold:#D4A28A;
  --olive:#3D3D2F;
  --beige:#F3E8DC;
  --dustyrose:#C98F87;

  /* --- kontextuelle Zuweisung, Standard = Olivgrund ---
     Rose Gold erreicht auf Beige nur 1.86:1 und ist dort als Text
     unbrauchbar. Es bleibt deshalb den dunklen Flaechen vorbehalten;
     auf Beige uebernimmt Olive die Akzentrolle (9.12:1). */
  --ink:#F3E8DC;                        /* 9.12:1 auf Olive */
  --body:rgba(243,232,220,.78);         /* 6.27:1 */
  --stone:rgba(243,232,220,.66);        /* 5.14:1 */
  --stone-soft:rgba(243,232,220,.68);
  --cream:#F3E8DC;
  --cream-line:rgba(212,162,138,.34);
  --surface:transparent;                /* Karten trennen ueber Haarlinie */
  --soft:#3D3D2F;
  --terra:#D4A28A;                      /* 4.89:1 auf Olive */
  --terra-bright:#D4A28A;
  --terra-light:#D4A28A;
  --btn-bg:#D4A28A;
  --btn-fg:#3D3D2F;                     /* 7.50:1 */
}

/* Beige Sektionen */
section.cream{
  background:var(--beige);
  color:var(--olive);
  --ink:#3D3D2F;                        /* 13.98:1 */
  --body:rgba(61,61,47,.82);            /* 7.35:1 */
  --stone:rgba(61,61,47,.70);
  --stone-soft:rgba(61,61,47,.56);
  --cream-line:rgba(61,61,47,.26);
  --surface:transparent;
  --soft:#F3E8DC;
  --terra:#3D3D2F;                      /* 9.12:1 — Olive statt Rose Gold */
  --terra-bright:#3D3D2F;
  --terra-light:#3D3D2F;
  --btn-bg:#3D3D2F;
  --btn-fg:#F3E8DC;
}

/* Dunkle Sektionen als Wechsel zum Olivgrund */
section.dark,#quiz{
  background:var(--olive);
  --ink:#F3E8DC;                        /* 13.98:1 */
  --body:rgba(243,232,220,.72);
  --stone:rgba(243,232,220,.60);
  --cream-line:rgba(212,162,138,.30);
  --terra:#D4A28A;                      /* 7.50:1 */
  --terra-bright:#D4A28A;
  --terra-light:#D4A28A;
  --btn-bg:#D4A28A;
  --btn-fg:#3D3D2F;
}

/* Hervorgehobene Karten: Fuellung statt Haarlinie */
section.cream .pkg.featured,
section.cream .gi-dark,
section.cream .gi-reiter-block{
  background:var(--olive);
  --ink:#F3E8DC; --body:rgba(243,232,220,.72); --stone:rgba(243,232,220,.60);
  --cream-line:rgba(212,162,138,.30); --surface:transparent;
  --terra:#D4A28A; --terra-bright:#D4A28A; --terra-light:#D4A28A;
  --btn-bg:#D4A28A; --btn-fg:#3D3D2F;
}
.pkg.featured{
  background:var(--beige);
  --ink:#3D3D2F; --body:rgba(61,61,47,.82); --stone:rgba(61,61,47,.70);
  --cream-line:rgba(61,61,47,.26);
  --terra:#3D3D2F; --terra-bright:#3D3D2F; --terra-light:#3D3D2F;
  --btn-bg:#3D3D2F; --btn-fg:#F3E8DC;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'Lato',system-ui,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.serif{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:.005em}
.serif em,em.s{font-style:italic;color:var(--terra);font-weight:400}
.mono{font-family:'Lato',sans-serif;font-weight:400}

.eyebrow{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--terra);display:inline-block}
.eyebrow.muted{color:var(--stone)}
.eyebrow::before{content:'— ';color:var(--terra);margin-right:6px}

.hr{height:1px;background:var(--cream-line);border:0;margin:0}
.container{max-width:1200px;margin:0 auto;padding:0 32px}
@media(max-width:720px){.container{padding:0 22px}}

/* ============ NAV ============ */
.nav{position:sticky;top:0;z-index:50;background:rgba(243,232,220,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--cream-line)}
.nav-utility{border-bottom:1px solid var(--cream-line);background:rgba(255,255,255,.5)}
.nav-utility-inner{display:flex;align-items:center;justify-content:flex-end;gap:18px;padding:7px 0;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--stone)}
.nav-utility-inner a{transition:color .25s;display:inline-flex;align-items:center;gap:6px}
.nav-utility-inner a:hover{color:var(--terra)}
.nav-utility-inner .sep{opacity:.35}
.nav-utility-inner svg{width:12px;height:12px}
.nav-inner{display:flex;align-items:center;gap:32px;padding:14px 0}
.nav-links{margin-left:auto;display:flex;gap:26px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--stone);font-weight:400}
.nav-links a{transition:color .25s,border-color .25s;padding-bottom:4px;border-bottom:1px solid transparent}
.nav-links a:hover{color:var(--ink);border-color:var(--terra)}
.contact-icons{display:flex;align-items:center;gap:8px;margin-left:auto}
.contact-icons a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--cream-line);color:var(--ink);transition:color .25s,border-color .25s,background .25s,transform .2s;background:rgba(255,255,255,.7)}
.contact-icons a:hover{color:var(--terra-bright);border-color:var(--ink);background:var(--btn-bg);transform:translateY(-1px)}
.contact-icons svg{width:16px;height:16px}
.contact-icons a[aria-label]{position:relative}
.contact-icons a[aria-label]:hover::after{content:attr(aria-label);position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--btn-bg);color:var(--btn-fg);font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.16em;text-transform:uppercase;padding:5px 9px;border-radius:4px;white-space:nowrap;pointer-events:none;z-index:60}
.contact-icons a.whatsapp:hover{color:var(--olive);background:var(--rosegold);border-color:var(--rosegold);box-shadow:0 6px 18px -6px rgba(212,162,138,.5)}
.contact-icons a.cta-book{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-fg);box-shadow:0 6px 18px -6px rgba(61,61,47,.5)}
.contact-icons a.cta-book:hover{background:var(--terra);border-color:var(--terra);color:var(--ink);box-shadow:0 8px 22px -6px rgba(168,113,89,.55)}
.lang-switch{display:inline-flex;align-items:center;gap:6px;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--stone)}
.lang-switch button{background:transparent;border:0;color:var(--stone);cursor:pointer;padding:0 2px;font-family:inherit;font-size:inherit;letter-spacing:inherit;text-transform:inherit;transition:color .25s}
.lang-switch button.active{color:var(--ink);border-bottom:1px solid var(--terra)}
.lang-switch button:hover{color:var(--terra)}
.lang-switch span{opacity:.4}
.nav-cta{display:inline-flex;align-items:center;gap:8px;margin-left:14px;font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;background:var(--terra);color:var(--ink);padding:12px 22px;border-radius:999px;transition:background .25s,transform .25s,box-shadow .25s;box-shadow:0 6px 20px -8px rgba(194,136,118,.5);font-weight:400}
.nav-cta:hover{background:var(--btn-bg);color:var(--btn-fg);transform:translateY(-1px);box-shadow:0 10px 24px -8px rgba(61,61,47,.4)}
.nav-toggle{display:none;background:none;border:0;color:var(--ink);padding:8px;cursor:pointer}
@media(max-width:1080px){.nav-utility{display:none}}
@media(max-width:980px){
  .contact-icons{margin-left:14px;gap:6px}
  .contact-icons a{width:34px;height:34px}
  .nav-cta{padding:10px 16px;margin-left:8px;font-size:10px}
  .nav-links{gap:18px;font-size:10px}
}

/* ============ LOVE LIFE LOGO ============ */
.ll-logo{display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1}
.ll-word{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:18px;letter-spacing:.30em;text-transform:uppercase;color:var(--terra);padding-left:.30em;margin-top:3px}
.ll-sub{display:flex;align-items:center;gap:7px;margin-top:4px;font-family:'Lato',sans-serif;font-size:8px;font-weight:400;letter-spacing:.30em;text-transform:uppercase;color:var(--terra);opacity:1}
.ll-sub::before,.ll-sub::after{content:'';width:14px;height:1px;background:currentColor;opacity:.55}
.ll-logo.lg .ll-logo.lg .ll-word{font-size:38px;letter-spacing:.34em;margin-top:8px}
.ll-logo.lg .ll-sub{font-size:11px;letter-spacing:.34em;margin-top:9px}
.ll-logo.lg .ll-sub::before,.ll-logo.lg .ll-sub::after{width:26px}
.ll-logo.dark .ll-mono,.ll-logo.dark .ll-word,.ll-logo.dark .ll-sub{color:var(--terra-bright)}
.ll-logo.dark @media(max-width:760px){.ll-word{font-size:13px;letter-spacing:.26em}.ll-sub{font-size:6.5px;letter-spacing:.24em}.ll-sub::before,.ll-sub::after{width:9px}}
/* Draft-Hinweis */
.draft-flag{position:fixed;bottom:14px;left:14px;z-index:999;background:var(--olive);color:var(--terra-bright);font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;padding:8px 14px;border-radius:999px;border:1px solid var(--terra-bright);box-shadow:0 8px 22px -10px rgba(61,61,47,.6);pointer-events:none}

/* ============ LOCKUP ============ */
.lockup{display:flex;align-items:center;gap:19px}
.lockup .text{border-left:1px solid var(--terra);padding-left:19px}
.lockup .l1{font-family:'Cormorant Garamond',serif;font-weight:400;color:var(--ink);line-height:1.18;font-size:19px;white-space:nowrap}
.lockup .l1 em{font-style:italic;color:var(--terra);font-weight:400}
.lockup .sub{font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--stone);margin-top:5px}
.lockup.lg .l1{font-size:32px;line-height:1.15}
.lockup.lg .sub{font-size:11px;letter-spacing:.32em;margin-top:8px}
.lockup.lg .text{padding-left:26px}
.lockup.lg{gap:26px}
/* Mobile-Break im Lockup — auf Desktop versteckt, auf Mobile aktiv */
.brk-mobile{display:none}
/* Mobile Lang-Switch + Kontakt-Icon im nav-inner — auf Desktop versteckt */
.lang-switch-mobile{display:none}
.nav-contact-mobile{display:none}
@media(max-width:880px){
  .nav-links{display:none}
  .contact-icons{display:none}
  .nav-toggle{display:block;flex-shrink:0;z-index:60;position:relative}
  .nav-inner{gap:0;padding:10px 6px;position:relative;align-items:center}
  /* Mobile-Lockup: 2-Zeiler "Dr. Gwen Elprana &" / "Oliver Herrmann" — Tagline weg */
  .lockup{min-width:0;flex-shrink:1;gap:11px;margin-right:auto}
  .lockup svg{flex-shrink:0;width:36px;height:25px}
  .lockup .text{padding-left:11px;min-width:0;border-left:1px solid var(--terra)}
  .lockup .l1{display:block;font-size:13px;line-height:1.2;white-space:normal}
  .lockup .l1 em{font-style:italic;color:var(--terra)}
  .lockup .sub{display:none}
  .brk-mobile{display:inline}
  .nav.open .nav-links{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--cream);flex-direction:column;gap:14px;padding:22px 32px;border-bottom:1px solid var(--cream-line);z-index:55}
  .nav.open .nav-links a{padding-bottom:0}
  .nav-utility{display:none}
  /* DE/EN Switch auf Mobile */
  .lang-switch-mobile{display:inline-flex;align-items:center;gap:4px;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--stone);flex-shrink:0;padding:0 12px}
  .lang-switch-mobile button{background:transparent;border:0;color:var(--stone);cursor:pointer;padding:0 3px;font-family:inherit;font-size:inherit;letter-spacing:inherit;text-transform:inherit;transition:color .25s}
  .lang-switch-mobile button.active{color:var(--ink);border-bottom:1px solid var(--terra)}
  .lang-switch-mobile button:hover{color:var(--terra)}
  .lang-switch-mobile span{opacity:.4}
  /* Kontakt-Icon Mobile */
  .nav-contact-mobile{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--btn-bg);color:var(--btn-fg);transition:background .2s,transform .2s}
  .nav-contact-mobile:hover{background:var(--terra);transform:translateY(-1px)}
  .nav-contact-mobile svg{width:18px;height:18px}
}
/* Sehr schmale iPhones (≤380px) */
@media(max-width:380px){
  .lockup svg{width:30px;height:21px}
  .lockup .l1{font-size:12px}
  .lockup .text{padding-left:9px}
}

/* ============ HERO ============ */
.hero{padding:120px 0 90px;position:relative;overflow:hidden}
.hero-grid{position:relative;z-index:1}
.hero::before{content:'';position:absolute;top:-120px;right:-150px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(194,136,118,.18),transparent 70%);filter:blur(40px);pointer-events:none;z-index:0}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center;position:relative}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr;gap:48px}}
.hero h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(46px,7vw,84px);line-height:1.02;margin:18px 0 28px;color:var(--ink);letter-spacing:-.005em}
.hero h1 em{font-style:italic;color:var(--terra);font-weight:400}
.hero p.lead{font-size:17px;line-height:1.75;color:var(--body);max-width:520px;margin:0 0 32px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
/* Drei Schaltflaechen brauchen mehr als die 620px, auf die
   .hero-inner>* alle Kinder begrenzt. Nur die Knopfreihe
   ausnehmen — die Textbreite daneben bleibt unveraendert. */
.hero-inner>.hero-actions{max-width:760px}

.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 28px;border-radius:999px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:400;font-family:'Lato',sans-serif;transition:all .3s;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--btn-bg);color:var(--btn-fg)}
.btn-primary:hover{background:var(--terra);transform:translateY(-2px);box-shadow:0 12px 28px -10px rgba(194,136,118,.5)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-ghost:hover{background:var(--btn-bg);color:var(--btn-fg)}
.btn .arr{transition:transform .3s}
.btn:hover .arr{transform:translateX(4px)}

.hero-card{background:var(--surface);border:1px solid var(--cream-line);border-radius:24px;padding:36px;box-shadow:0 30px 60px -30px rgba(61,61,47,.12)}
.hero-card .row{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--cream-line);font-size:13px}
.hero-card .row:last-child{border:0}
.hero-card .row .num{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--terra);font-size:22px;font-weight:400;min-width:36px}
.hero-card .row strong{font-weight:400;color:var(--ink);display:block;margin-bottom:2px}
.hero-card .row span{color:var(--stone);font-size:12px}

.locator{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.locator span{font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.16em;color:var(--ink);text-transform:uppercase;padding:8px 14px;background:rgba(168,113,89,.10);border-radius:999px;border:1px solid rgba(168,113,89,.28);font-weight:400}

/* ============ SECTION BASE ============ */
section{padding:96px 0;position:relative}
section.tight{padding:64px 0}
section h2,section h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(36px,5vw,56px);line-height:1.08;margin:14px 0 0;color:var(--ink);letter-spacing:-.005em}
section h2 em,section h1 em{font-style:italic;color:var(--terra);font-weight:400}
.section-head{margin-bottom:56px;max-width:760px}
.section-head p{color:var(--body);font-size:16px;line-height:1.75;margin:18px 0 0;max-width:620px}
section.dark{background:var(--olive);color:var(--cream)}
section.dark h2,section.dark h1{color:var(--cream)}
section.dark .eyebrow{color:var(--terra-light)}
section.dark p,section.dark .body-text{color:rgba(243,232,220,.72)}
section.cream{background:var(--soft)}

/* ============ DIFFERENTIATORS ============ */
.diff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:880px){.diff-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.diff-grid{grid-template-columns:1fr}}
.diff{background:var(--surface);border:1px solid var(--cream-line);border-radius:18px;padding:30px;transition:transform .35s,border-color .35s,box-shadow .35s}
.diff:hover{transform:translateY(-4px);border-color:var(--terra);box-shadow:0 20px 40px -20px rgba(194,136,118,.25)}
.diff .label{font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--terra);margin-bottom:14px}
.diff h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:24px;line-height:1.2;margin:0 0 8px;color:var(--ink)}
.diff h3 em{font-style:italic;color:var(--terra);font-weight:400}
.diff p{margin:0;color:var(--body);font-size:14px;line-height:1.65}

/* ============ COMPARISON ============ */
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media(max-width:880px){.cmp{grid-template-columns:1fr}}

/* ============ STATS ============ */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:720px){.stats{grid-template-columns:1fr}}
.stat{padding:36px;border:1px solid var(--cream-line);border-radius:20px;background:var(--surface);text-align:center}
.stat .num{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:72px;line-height:1;color:var(--terra);font-style:italic}
.stat .lbl{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);margin:14px 0 6px}
.stat p{margin:0;color:var(--body);font-size:13px;line-height:1.6}

/* ============ HOUSE LEVELS ============ */
.house{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:lvl}
@media(max-width:880px){.house{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.house{grid-template-columns:1fr}}
.lvl{padding:28px;background:var(--surface);border:1px solid var(--cream-line);border-radius:16px;position:relative;counter-increment:lvl;transition:border-color .3s,transform .3s}
.lvl:hover{border-color:var(--terra);transform:translateY(-3px)}
.lvl::before{content:counter(lvl,upper-roman);font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--terra);font-size:24px;position:absolute;top:24px;right:24px;opacity:.45}
.lvl h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:21px;margin:0 0 8px;color:var(--ink);padding-right:36px}
.lvl p{margin:0;font-size:13px;line-height:1.65;color:var(--body)}
@media(max-width:880px){}

/* ============ PROCESS ============ */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:880px){.process{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.process{grid-template-columns:1fr}}
.step{padding:28px;background:var(--surface);border:1px solid var(--cream-line);border-radius:16px;position:relative}
.step .n{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;color:var(--terra);font-size:36px;line-height:1;margin-bottom:12px}
.step h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:18px;margin:0 0 6px;color:var(--ink)}
.step p{margin:0;font-size:13px;line-height:1.6;color:var(--body)}

/* ============ PACKAGES ============ */
.pkgs{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:48px}
@media(max-width:1200px){.pkgs{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.pkgs{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}}
.pkg{background:var(--surface);border:1px solid var(--cream-line);border-radius:24px;padding:40px;display:flex;flex-direction:column;position:relative;transition:transform .35s,box-shadow .35s,border-color .35s}
.pkg:hover{transform:translateY(-4px);border-color:var(--terra);box-shadow:0 30px 60px -30px rgba(194,136,118,.3)}
.pkg.featured{background:var(--olive);color:var(--cream);border-color:var(--olive)}
.pkg.featured:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 36px 70px -20px rgba(61,61,47,.55)}
.pkg .badge{position:absolute;top:24px;right:24px;font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.2em;color:var(--terra);text-transform:uppercase;border:1px solid var(--terra);padding:5px 10px;border-radius:999px}
.pkg .label{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--terra);margin-bottom:14px}
.pkg.featured .label{color:var(--terra-light)}
.pkg h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:34px;margin:0 0 10px;line-height:1.1}
.pkg h3 em{font-style:italic;color:var(--terra);font-weight:400}
.pkg .desc{font-size:13.5px;line-height:1.65;color:var(--body);margin:0 0 28px}
.pkg.featured .desc{color:rgba(243,232,220,.7)}
.pkg .price{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:46px;color:var(--ink);line-height:1;margin:auto 0 6px}
.pkg.featured .price{color:var(--cream)}
.pkg .price-sub{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.16em;color:var(--stone);text-transform:uppercase;margin-bottom:24px}
.pkg.featured .price-sub{color:var(--terra-light)}
.pkg ul{list-style:none;margin:0 0 28px;padding:0}
.pkg li{padding:8px 0;font-size:13px;line-height:1.55;display:flex;gap:10px;color:var(--body)}
.pkg.featured li{color:rgba(243,232,220,.85)}
.pkg li::before{content:'•';color:var(--terra);font-weight:400;flex-shrink:0}
.pkg .pkg-cta{margin-top:auto;display:inline-flex;align-items:center;gap:10px;padding:13px 24px;border-radius:999px;background:var(--btn-bg);color:var(--btn-fg);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;justify-content:center;transition:background .25s}
.pkg .pkg-cta:hover{background:var(--terra)}
.pkg.featured .pkg-cta{background:var(--terra);color:var(--ink)}
.pkg.featured .pkg-cta:hover{background:var(--cream)}

/* ============ FINANCE NOTE ============ */
.finance-note{margin:64px auto 0;max-width:880px}
.finance-note-inner{background:var(--surface);border:1px solid var(--cream-line);border-left:3px solid var(--terra);border-radius:18px;padding:36px 40px;position:relative;overflow:hidden}
.finance-note-inner::after{content:'i';position:absolute;top:24px;right:32px;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;font-size:64px;line-height:1;color:rgba(194,136,118,.18)}
.finance-note-inner h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:30px;line-height:1.1;margin:14px 0 14px;color:var(--ink)}
.finance-note-inner h3 em{font-style:italic;color:var(--terra);font-weight:400}
.finance-note-inner p{margin:0;font-size:14.5px;line-height:1.7;color:var(--body);max-width:640px}
@media(max-width:560px){.finance-note-inner{padding:28px 24px}.finance-note-inner h3{font-size:24px}}

/* ============ TEAM ============ */
.team{display:grid;grid-template-columns:1fr 1fr;gap:36px}
@media(max-width:880px){.team{grid-template-columns:1fr}}
.bio{background:var(--surface);border:1px solid var(--cream-line);border-radius:24px;padding:44px}
.bio .role{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;color:var(--terra);text-transform:uppercase;margin-bottom:14px}
.bio h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:36px;margin:0 0 6px;color:var(--ink)}
.bio h3 em{font-style:italic;color:var(--terra);font-weight:400}
.bio .creds{font-size:12px;color:var(--stone);margin-bottom:22px;letter-spacing:.02em}
.bio p{font-size:14px;line-height:1.75;color:var(--body);margin:0 0 16px}
.bio blockquote{border-left:2px solid var(--terra);padding:6px 0 6px 20px;margin:24px 0;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--ink);font-size:18px;line-height:1.5}
.bio .qual{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.16em;color:var(--stone);text-transform:uppercase;margin-bottom:6px;margin-top:20px}
.bio ul.list{list-style:none;padding:0;margin:0;font-size:13px;line-height:1.7;color:var(--body)}
.bio ul.list li{padding-left:14px;position:relative;margin-bottom:4px}
.bio ul.list li::before{content:'·';color:var(--terra);font-weight:400;position:absolute;left:0;top:-2px}
.gottman-hero-section{background:var(--olive);padding:clamp(96px,11vw,150px) 8vw;text-align:center;position:relative;overflow:hidden}.gottman-hero-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 52% at 50% 100%,rgba(233,150,88,.16) 0%,transparent 62%);pointer-events:none}.gottman-hero-inner{position:relative;max-width:860px;margin:0 auto}.gottman-hero-eyebrow{font-family:'Lato',sans-serif;font-size:10px;font-weight:400;letter-spacing:.30em;text-transform:uppercase;color:var(--rosegold);margin-bottom:28px;display:flex;align-items:center;justify-content:center;gap:16px}.gottman-hero-eyebrow::before,.gottman-hero-eyebrow::after{content:'';display:block;width:28px;height:1px;background:rgba(212,162,138,.5)}.gottman-hero-title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(2.4rem,4.4vw,4rem);line-height:1.08;color:#F3E8DC;margin-bottom:26px;letter-spacing:-.02em}.gottman-hero-title em{font-style:italic;font-weight:300;color:var(--rosegold)}.gottman-hero-sub{font-size:16.5px;font-weight:300;line-height:1.82;color:rgba(243,232,220,.70);max-width:580px;margin:0 auto}
@media(max-width:880px){}
.einzel-text .eyebrow{margin-bottom:20px}
.bio-photo{width:calc(100% + 88px);margin:-44px -44px 32px -44px;border-radius:22px 22px 0 0;display:block;object-fit:cover;object-position:top center;height:340px}
@media(max-width:880px){}
@media(max-width:880px){}
@media(max-width:960px){}
@media(max-width:960px){}
/* Research Highlights */
.rh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(243,232,220,.08);margin-top:3rem}
@media(max-width:960px){.rh-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.rh-grid{grid-template-columns:1fr}}
.rh-item{background:rgba(243,232,220,.04);padding:32px;transition:background .3s}
.rh-item:hover{background:rgba(243,232,220,.08)}
.rh-icon{font-size:1.4rem;margin-bottom:14px;opacity:.65}
.rh-title{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:20px;color:var(--cream);margin-bottom:10px}
.rh-text{font-size:13px;line-height:1.8;color:rgba(243,232,220,.65);margin-bottom:18px}
.rh-stat{font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:400;color:var(--terra);border-top:1px solid rgba(243,232,220,.1);padding-top:14px}
.rh-stat small{font-family:'Lato',sans-serif;font-size:11px;font-weight:400;color:rgba(243,232,220,.45);display:block;margin-top:4px;letter-spacing:.02em;line-height:1.5}

/* ============ TESTIMONIALS ============ */
.testi{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:880px){.testi{grid-template-columns:1fr}}
.t-card{padding:32px;background:var(--surface);border:1px solid var(--cream-line);border-radius:18px}
.t-card .stars{color:var(--terra);font-size:12px;letter-spacing:.3em;margin-bottom:16px}
.t-card p{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--ink);font-size:18px;line-height:1.5;margin:0 0 18px;font-weight:400}
.t-card .who{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.16em;color:var(--stone);text-transform:uppercase}
.t-card .who strong{color:var(--ink);font-weight:400;display:block;margin-bottom:3px;letter-spacing:.16em}

/* ============ FAQ ============ */
.faqs{max-width:820px;margin:0 auto}
.faq{border-top:1px solid var(--cream-line);padding:0}
.faq:last-child{border-bottom:1px solid var(--cream-line)}
.faq summary{padding:24px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:21px;color:var(--ink);transition:color .25s}
.faq summary:hover{color:var(--terra)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;color:var(--terra);font-size:28px;transition:transform .3s}
.faq[open] summary::after{content:'−'}
.faq .ans{padding:0 0 24px;font-size:14.5px;line-height:1.75;color:var(--body);max-width:680px}

/* ============ STANDORTE ============ */
.locs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:880px){.locs{grid-template-columns:1fr}}
.loc{padding:32px;background:var(--surface);border:1px solid var(--cream-line);border-radius:20px}
.loc .pin{font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.28em;color:var(--terra);text-transform:uppercase;margin-bottom:12px}
.loc h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:30px;margin:0 0 4px;color:var(--ink)}
.loc h3 em{font-style:italic;color:var(--terra);font-weight:400}
.loc .addr{font-size:13.5px;color:var(--body);margin:14px 0 18px;line-height:1.65}
.loc .addr strong{color:var(--ink);font-weight:400;display:block;margin-bottom:4px}
.loc .feats{list-style:none;padding:0;margin:0;border-top:1px solid var(--cream-line);padding-top:16px}
.loc .feats li{font-size:12.5px;color:var(--body);padding:5px 0;display:flex;gap:10px}
.loc .feats li::before{content:'·';color:var(--terra);font-weight:400}

/* ============ CONTACT ============ */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
@media(max-width:880px){.ct-grid{grid-template-columns:1fr}}
.ct-row{display:flex;align-items:flex-start;gap:18px;padding:18px 0;border-bottom:1px solid rgba(243,232,220,.08)}
.ct-row:last-child{border-bottom:0}
.ct-row .icn{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--terra);font-size:24px;min-width:32px}
.ct-row strong{display:block;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--terra-light);font-weight:400;margin-bottom:5px}
.ct-row a,.ct-row span{font-size:16px;color:var(--cream);font-family:'Lato',sans-serif;font-weight:400}
.ct-row a:hover{color:var(--terra-light)}

/* ============ CONTACT FORM ============ */
.ct-wrap{max-width:760px;margin:0 auto;text-align:center}
.ct-wrap .eyebrow{color:var(--terra-light)}
.ct-wrap h2,.ct-wrap h1{color:var(--cream);margin:14px 0 18px}
.ct-wrap h2 em,.ct-wrap h1 em{font-style:italic;color:var(--terra-light);font-weight:400}
.ct-wrap .lead{font-size:16px;line-height:1.75;color:rgba(243,232,220,.72);margin:0 auto 40px;max-width:560px}
.ct-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 auto 48px;max-width:760px;text-align:left}
@media(max-width:720px){.ct-quick{grid-template-columns:1fr}}
.ct-quick a{display:flex;align-items:center;gap:14px;padding:18px 20px;background:rgba(243,232,220,.05);border:1px solid rgba(243,232,220,.1);border-radius:14px;transition:background .25s,border-color .25s,transform .25s}
.ct-quick a:hover{background:rgba(243,232,220,.08);border-color:var(--terra);transform:translateY(-2px)}
.ct-quick .qicn{width:38px;height:38px;border-radius:50%;background:rgba(168,113,89,.18);display:inline-flex;align-items:center;justify-content:center;color:var(--terra-light);flex-shrink:0}
.ct-quick .qicn svg{width:16px;height:16px;stroke-width:1.7}
.ct-quick .qtxt strong{display:block;font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--terra-light);margin-bottom:4px;font-weight:400}
.ct-quick .qtxt span{font-family:'Lato',sans-serif;font-size:14px;color:var(--cream);font-weight:400;line-height:1.3}
.ct-form{background:rgba(243,232,220,.04);border:1px solid rgba(243,232,220,.12);border-radius:24px;padding:40px;text-align:left;max-width:760px;margin:0 auto}
@media(max-width:560px){.ct-form{padding:28px 22px}}
.ct-form .frow{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
@media(max-width:520px){.ct-form .frow{grid-template-columns:1fr}}
.ct-form .ffield{margin-bottom:18px}
.ct-form label{display:block;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--terra-light);margin-bottom:8px;font-weight:400}
.ct-form input,.ct-form select,.ct-form textarea{width:100%;background:rgba(243,232,220,.06);border:1px solid rgba(243,232,220,.18);color:var(--cream);padding:13px 16px;border-radius:12px;font-family:'Lato',sans-serif;font-size:14.5px;line-height:1.5;transition:border-color .25s,background .25s;box-sizing:border-box}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{outline:none;border-color:var(--terra);background:rgba(243,232,220,.1)}
.ct-form input::placeholder,.ct-form textarea::placeholder{color:rgba(243,232,220,.35)}
/* Autofill auf Dark-Background neutralisieren (Chrome/Safari/Firefox) */
.ct-form input:-webkit-autofill,
.ct-form input:-webkit-autofill:hover,
.ct-form input:-webkit-autofill:focus,
.ct-form input:-webkit-autofill:active,
.ct-form select:-webkit-autofill,
.ct-form textarea:-webkit-autofill{
  -webkit-text-fill-color:var(--cream)!important;
  -webkit-box-shadow:0 0 0 1000px rgba(243,232,220,.06) inset!important;
  caret-color:var(--cream);
  transition:background-color 5000s ease-in-out 0s,color 5000s ease-in-out 0s;
}
.ct-form input:autofill,.ct-form select:autofill,.ct-form textarea:autofill{
  background:rgba(243,232,220,.06)!important;
  color:var(--cream)!important;
}
.ct-form textarea{min-height:130px;resize:vertical}
.ct-form select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E3C3AE' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right 16px center;background-size:16px;padding-right:42px}
.ct-form select option{background:var(--olive);color:var(--cream)}
.ct-form .gdpr{display:flex;align-items:flex-start;gap:12px;margin:18px 0 24px;font-size:12.5px;line-height:1.55;color:rgba(243,232,220,.6)}
.ct-form .gdpr input[type=checkbox]{width:18px;height:18px;flex-shrink:0;margin:0;accent-color:var(--terra);cursor:pointer}
.ct-form .gdpr a{color:var(--terra-light);border-bottom:1px solid rgba(217,168,154,.4)}
.ct-form .gdpr a:hover{color:var(--cream)}
.ct-form .submit-row{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:8px}
.ct-form button[type=submit]{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;border-radius:999px;font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;background:var(--terra);color:var(--ink);border:0;cursor:pointer;transition:background .25s,color .25s,transform .25s,box-shadow .25s;box-shadow:0 6px 20px -8px rgba(168,113,89,.5)}
.ct-form button[type=submit]:hover{background:var(--cream);color:var(--ink);transform:translateY(-1px);box-shadow:0 10px 24px -6px rgba(243,232,220,.3)}
.ct-form .calendar-link{font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra-light);transition:color .25s}
.ct-form .calendar-link:hover{color:var(--cream)}
.ct-foot-note{margin-top:32px;text-align:center;font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(243,232,220,.45)}
.form-message{max-width:760px;margin:0 auto 28px;padding:24px 28px;border-radius:18px;display:flex;align-items:center;gap:16px;animation:fadeInDown .4s ease}
.form-message[hidden]{display:none!important}
.form-message.form-success-big{flex-direction:column;text-align:center;padding:80px 40px;min-height:380px;justify-content:center;border-radius:24px;background:rgba(168,113,89,.15);border:1px solid var(--terra);animation:fadeInScale .5s ease}
.form-message.form-success-big .form-icn{width:64px;height:64px;font-size:32px;margin-bottom:8px}
.form-message.form-success-big p{font-size:26px;line-height:1.4;max-width:520px;margin:8px 0 0}
.form-message.form-success-big::after{content:'';display:block;width:80px;height:1px;background:var(--terra);margin:24px auto 0;opacity:.5}
@keyframes fadeInScale{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
.form-success{background:rgba(168,113,89,.18);border:1px solid var(--terra);color:var(--cream)}
.form-success .form-icn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--terra);color:var(--ink);font-size:18px;font-weight:400;flex-shrink:0}
.form-success p{margin:0;font-family:'Cormorant Garamond',serif;font-size:18px;font-style:italic;line-height:1.4}
.form-error{background:rgba(160,40,40,.15);border:1px solid #C25C5C;color:var(--cream)}
.form-error p{margin:0;font-size:14px;line-height:1.5}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.ct-form button[type=submit][disabled]{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none}
.ct-form button[type=submit] .countdown{font-family:'Lato',sans-serif;font-size:10px;margin-left:8px;opacity:.8}

/* ============ FOOTER ============ */
footer{padding:64px 0 32px;background:var(--olive);color:rgba(243,232,220,.7);font-size:13px}
footer .f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:48px}
@media(max-width:720px){footer .f-grid{grid-template-columns:1fr 1fr;gap:32px}}
footer h5{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;color:var(--terra);text-transform:uppercase;margin:0 0 16px;font-weight:400}
footer a{display:block;padding:4px 0;color:rgba(243,232,220,.65);transition:color .25s;font-size:13px}
footer a:hover{color:var(--terra-light)}
footer .copy{padding-top:32px;border-top:1px solid rgba(243,232,220,.08);font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.16em;color:rgba(243,232,220,.62);text-transform:uppercase;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}

/* ============ FADE-IN ============ */
.fade{opacity:0;transform:translateY(20px);transition:opacity .9s ease,transform .9s ease}
.fade.in{opacity:1;transform:none}

/* ============ CONSENT BANNER ============ */
.consent-banner{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:var(--cream);border-top:1px solid var(--cream-line);box-shadow:0 -8px 32px -8px rgba(61,61,47,.12);padding:18px 0;transform:translateY(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);will-change:transform}
.consent-banner.consent-visible{transform:translateY(0)}
.consent-inner{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.consent-text{flex:1;min-width:220px;font-family:'Lato',sans-serif;font-size:13px;line-height:1.6;color:var(--body);margin:0}
.consent-text a{color:var(--terra);text-decoration:underline;text-underline-offset:2px}
.consent-text a:hover{color:var(--ink)}
.consent-btns{display:flex;gap:10px;flex-shrink:0}
/* Beide Buttons gleiche visuelle Gewichtung — DSGVO/EDPB konform, kein Nudging */
.consent-btn{display:inline-flex;align-items:center;font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:400;padding:10px 20px;border-radius:999px;cursor:pointer;transition:all .25s;border:1px solid var(--ink);background:transparent;color:var(--ink)}
.consent-btn:hover{background:rgba(61,61,47,.07)}
.consent-btn-accept{border-color:var(--terra);color:var(--terra)}
.consent-btn-accept:hover{background:rgba(168,113,89,.1)}
@media(max-width:600px){
  .consent-inner{gap:14px}
  .consent-btns{width:100%;justify-content:flex-end}
  .consent-text{font-size:12px}
}

/* ── QUIZ / FREIE DIAGNOSTIK ─────────────────────────────── */
#quiz{background:var(--olive);padding:100px 0}
#quiz .section-head{text-align:center;margin-bottom:56px}
#quiz .section-head .eyebrow{color:var(--terra)}
#quiz .section-head h2,#quiz .section-head h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(2.2rem,4vw,3.4rem);color:var(--ink);line-height:1.12;margin:12px 0 20px}
#quiz .section-head h2 em,#quiz .section-head h1 em{font-style:italic;color:var(--terra)}
#quiz .section-head p{font-size:15px;line-height:1.8;color:rgba(243,232,220,.65);max-width:560px;margin:0 auto}
.quiz-inner{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
@media(max-width:880px){.quiz-inner{grid-template-columns:1fr;gap:2.5rem}}
.quiz-text .eyebrow{margin-bottom:16px}
.quiz-text h2,.quiz-text h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(2rem,3.5vw,3.2rem);line-height:1.12;color:var(--cream);margin:0 0 24px}
.quiz-text h2 em,.quiz-text h1 em{font-style:italic;color:var(--terra)}
.quiz-text p{font-size:14px;line-height:1.8;color:rgba(243,232,220,.65);margin:0 0 16px}
.quiz-note{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(243,232,220,.3);margin-top:16px!important}
.quiz-card{background:rgba(243,232,220,.06);border:1px solid rgba(243,232,220,.1);border-radius:16px;padding:36px}
.quiz-card-eyebrow{font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--terra);margin-bottom:20px}
.quiz-card-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.quiz-card-list li{font-size:14px;color:rgba(243,232,220,.75);padding-left:20px;position:relative}
.quiz-card-list li::before{content:'—';position:absolute;left:0;color:var(--terra)}


/* =====================================================================
   LOVE LIFE — Redesign-Layer
   Dunkles Olive als Grundflaeche, Beige als Entlastung.
   Cormorant Light auf grosser Stufe, Lato Light im Fliesstext.
   Signet: zwei ineinanderliegende Kreise (Icon-Set "verbindend").
   ===================================================================== */
:root{
  --olive-deep:#3D3D2F;
  --olive:#3D3D2F;
  --olive-lift:#3D3D2F;
  --gold:#D4A28A;
  --gold-lit:#D4A28A;
  --rose:#C98F87;
  --beige:#F3E8DC;

  /* kontextuelle Tokens — Default = dunkel */
  --ink:#F3E8DC;
  --body:rgba(243,232,220,.66);
  --stone:rgba(243,232,220,.68);
  --stone-soft:rgba(243,232,220,.62);
  --cream:#F3E8DC;
  --cream-line:rgba(212,162,138,.20);
  --surface:#3D3D2F;
  --soft:#3D3D2F;
  --terra:#D4A28A;
  --terra-bright:#D4A28A;
  --terra-light:#D4A28A;
  --btn-bg:#D4A28A;
  --btn-fg:#3D3D2F;
}

/* helle Inseln */
section.cream,
section.light-panel{
  --ink:#3D3D2F;
  --body:#3D3D2F;
  --stone:#3D3D2F;
  --stone-soft:#3D3D2F;
  --cream-line:#3D3D2F;
  --surface:#F3E8DC;
  --soft:#F3E8DC;
  --terra:#3D3D2F;
  --terra-bright:#3D3D2F;
  --terra-light:#3D3D2F;
  --btn-bg:#3D3D2F;
  --btn-fg:#F3E8DC;
  background:var(--beige);
  color:var(--olive);
}
/* dunkle Inseln innerhalb heller Sektionen */
section.cream .pkg.featured,
section.cream .cmp-col.good,
section.cream .einzel-card{
  --ink:#F3E8DC; --body:rgba(243,232,220,.68); --stone:rgba(243,232,220,.54);
  --cream-line:rgba(212,162,138,.22); --surface:#3D3D2F;
  --terra:#D4A28A; --terra-bright:#D4A28A; --terra-light:#D4A28A;
  --btn-bg:#D4A28A; --btn-fg:#3D3D2F;
}

html{background:var(--olive)}
body{
  background:var(--olive);
  color:var(--ink);
  font-family:'Lato',system-ui,sans-serif;
  font-weight:300;
  font-size:17px;
  line-height:1.8;
  letter-spacing:.005em;
}

/* ---------- TYPOGRAFIE ---------- */
.serif,h1,h2,h3,h4,
section h2,.hero h1,.pkg h3,h1,section h1{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  letter-spacing:-.022em;
}
.hero h1{
  font-size:clamp(44px,5.9vw,84px);
  line-height:1.0;
  margin:22px 0 28px;
  color:var(--ink);
}
.hero h1 em{font-style:italic;font-weight:300;color:var(--rosegold)}
section h2,section h1{
  font-size:clamp(34px,4.4vw,58px);
  line-height:1.03;
  margin:16px 0 0;
  color:var(--ink);
}
section h2 em,section h1 em{font-style:italic;font-weight:300;color:var(--terra)}
section.dark h2,#quiz h2,section.dark h1,#quiz h1{color:var(--ink)}
.pkg h3{font-size:40px;line-height:1.05;font-weight:300}
.pkg h3 em{color:var(--terra)}
p,li,.body-text{font-weight:300}
.hero p.lead{font-size:17.5px;line-height:1.78;color:var(--body);max-width:520px;margin:0 0 34px}
.section-head p{font-size:17px;line-height:1.85;color:var(--body)}

/* Eyebrow: Kreis-Signet statt Gedankenstrich */
.eyebrow{
  font-family:'Lato',sans-serif;font-size:10px;font-weight:400;
  letter-spacing:.34em;text-transform:uppercase;color:var(--terra);
  display:inline-flex;align-items:center;gap:11px;
}
.eyebrow::before{
  content:'';width:32px;height:19px;flex:none;margin:0;
  /* echtes Logo-Zeichen als Maske: die Farbe kommt aus --terra und folgt
     damit dem Kontext (Rose Gold auf Olive, Olive auf Beige) */
  background-color:var(--terra);
  -webkit-mask:url('/images/mark-lovelife.png') center/contain no-repeat;
  mask:url('/images/mark-lovelife.png') center/contain no-repeat;
}

/* ---------- RAUM ---------- */
section{padding:clamp(104px,13vw,176px) 0}
section.tight{padding:clamp(72px,8vw,104px) 0}
.hr{display:none}

/* ---------- NAVIGATION ---------- */
.nav{background:rgba(43,43,34,.82);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(212,162,138,.16)}
.nav-utility{background:rgba(43,43,34,.5);border-bottom:1px solid rgba(212,162,138,.10)}
.nav-utility-inner{color:rgba(243,232,220,.68);font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.22em;font-weight:300}
.nav-utility-inner a:hover{color:var(--rosegold)}
.nav-links{color:rgba(243,232,220,.72);font-size:10.5px;letter-spacing:.26em;font-weight:400;gap:34px}
.nav-links a:hover{color:var(--rosegold);border-color:transparent}
.nav-inner{padding-top:20px;padding-bottom:20px}
.contact-icons a{border-color:rgba(212,162,138,.28);background:transparent;color:var(--rosegold)}
.contact-icons a:hover{background:var(--rosegold);border-color:var(--rosegold);color:var(--olive)}
.contact-icons a.cta-book{background:var(--rosegold);border-color:var(--rosegold);color:var(--olive);box-shadow:none}
.contact-icons a.cta-book:hover{background:var(--rosegold);border-color:var(--rosegold)}
.lang-switch,.lang-switch button{color:rgba(243,232,220,.68)}
.lang-switch button.active{color:var(--rosegold);border-bottom-color:var(--rosegold)}
.nav-toggle{color:var(--rosegold)}
@media(max-width:980px){
  .nav.open .nav-links{background:var(--olive);border-bottom-color:rgba(212,162,138,.16)}
  .lang-switch-mobile,.lang-switch-mobile button{color:rgba(243,232,220,.70)}
  .lang-switch-mobile button.active{color:var(--rosegold);border-bottom-color:var(--rosegold)}
  .nav-contact-mobile{background:var(--rosegold);color:var(--olive)}
}

/* ---------- LOGO ---------- */
.ll-logo{align-items:flex-start;gap:0}
.ll-word{font-size:19px;letter-spacing:.36em;color:var(--rosegold);font-weight:300;margin-top:1px}
.ll-sub{font-size:8px;letter-spacing:.36em;color:var(--rosegold);opacity:.72;margin-top:5px}
.ll-sub::before,.ll-sub::after{width:16px;opacity:.5}
@media(max-width:760px){.ll-word{font-size:14px;letter-spacing:.3em}.ll-sub{font-size:7px;letter-spacing:.26em}}

/* ---------- HERO ---------- */
.hero::before{display:none}
/* ---------- BUTTONS ---------- */
.btn{padding:17px 34px;font-size:11px;letter-spacing:.24em;font-weight:400;border-radius:999px}
.btn-primary{background:var(--rosegold);color:var(--olive);border-color:var(--rosegold)}
.btn-primary:hover{background:var(--rosegold);border-color:var(--rosegold);color:var(--olive);transform:translateY(-2px);box-shadow:0 18px 40px -18px rgba(212,162,138,.6)}
.btn-ghost{background:transparent;color:var(--ink);border-color:rgba(243,232,220,.32)}
.btn-ghost:hover{background:transparent;color:var(--rosegold);border-color:var(--rosegold)}
section.cream .btn-ghost{color:var(--olive);border-color:rgba(61,61,47,.28)}
section.cream .btn-ghost:hover{color:var(--olive);border-color:var(--olive);background:transparent}

/* ---------- STANDORT-CHIPS ---------- */
.locator{gap:10px;margin-top:34px}
.locator span{
  font-size:10px;letter-spacing:.26em;font-weight:400;padding:9px 18px;
  color:var(--rosegold);background:transparent;border:1px solid rgba(212,162,138,.32);
}

/* ---------- FLAECHEN & KARTEN ---------- */
.pkg,.hero-card,.loc-card,.ct-form,.faq-item,.rh-item,.cmp-col,.einzel-card{
  border-radius:28px;
}
.pkg{background:transparent;border:1px solid var(--cream-line);padding:44px}
.pkg:hover{transform:translateY(-6px);border-color:var(--rosegold);box-shadow:0 50px 90px -45px rgba(0,0,0,.6)}
.pkg .label{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.32em;font-weight:400;color:var(--terra)}
.pkg .badge{font-family:'Lato',sans-serif;font-size:9px;letter-spacing:.22em;font-weight:400;border-color:var(--terra);color:var(--terra)}
.pkg li{font-weight:300;font-size:13.5px;line-height:1.7}
.pkg li::before{color:var(--rosegold)}
.pkg .pkg-cta{font-size:10.5px;letter-spacing:.24em;font-weight:400;padding:15px 28px}
.pkg.featured{background:var(--olive);border-color:rgba(212,162,138,.24)}
.pkg.featured .pkg-cta{background:var(--rosegold);color:var(--olive)}
.pkg.featured .pkg-cta:hover{background:var(--rosegold)}
#quiz,section.dark{background:var(--olive)}

/* ---------- FOOTER ---------- */
footer{background:var(--olive);color:rgba(243,232,220,.6);padding:clamp(72px,9vw,110px) 0 36px}
footer h5{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.32em;font-weight:400;color:var(--rosegold)}
footer a{color:rgba(243,232,220,.62);font-weight:300}
footer a:hover{color:var(--rosegold)}
footer .copy{border-top-color:rgba(212,162,138,.14);font-family:'Lato',sans-serif;letter-spacing:.22em;font-weight:300}

/* ---------- FORMULAR ---------- */
.ct-form{background:rgba(243,232,220,.05);border-color:rgba(212,162,138,.18)}
.ct-form input,.ct-form select,.ct-form textarea{
  background:rgba(243,232,220,.06);border-color:rgba(212,162,138,.22);
  font-family:'Lato',sans-serif;font-weight:300;border-radius:14px;
}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{border-color:var(--rosegold);outline:none}
.ct-quick a{background:rgba(243,232,220,.05);border-color:rgba(212,162,138,.16);border-radius:18px}
.ct-quick a:hover{border-color:var(--rosegold)}

/* ---------- ZUGAENGLICHKEIT ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--rosegold);outline-offset:3px;border-radius:4px;
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- LOGO (Bilddatei) ---------- */
.ll-logo{display:inline-flex;align-items:center;line-height:0}
.ll-logo img{display:block;height:70px;width:auto}
footer .ll-logo img{height:96px}
@media(max-width:980px){.ll-logo img{height:54px}}
@media(max-width:480px){.ll-logo img{height:45px}}

/* ---------- HERO ----------
   Bildband oben, Aussage darunter. Eine Ueberlagerung wurde verworfen:
   der Textblock ist ~500px hoch, und jeder Ausschnitt, der ihn von den
   Gesichtern freihaelt, beschneidet sie auf breiten Schirmen. So bleiben
   beide Koepfe bei jeder Fensterbreite vollstaendig. */
.hero{position:relative;padding:0;display:block;background:var(--olive)}
.hero-shot{
  position:relative;z-index:0;width:100%;
  aspect-ratio:1671/941;                 /* Format des Fotos, deshalb kein Beschnitt */
  background:url('/images/hero-lovelife-v6.jpg') center/cover no-repeat;
}
.hero-inner{position:relative;z-index:2;width:100%;padding-top:38px;padding-bottom:clamp(72px,8vw,104px)}
.hero-inner>*{max-width:620px}
.hero h1{font-size:clamp(38px,4.4vw,62px);margin:16px 0 22px}
/* Above-the-fold: sofort sichtbar, kein Fade-in */
.hero-inner .fade{opacity:1;transform:none;transition:none}
.hero p.lead{font-size:16.5px;line-height:1.75;max-width:560px;margin:0 0 28px;color:rgba(243,232,220,.78)}
.hero .locator{margin-top:28px}
@media(max-width:980px){
  /* Das Breitformat waere hier nur ~200px hoch. Hoeheres Bildfeld,
     dafuer Beschnitt an den Raendern — Personen und Logo liegen mittig. */
  .hero-shot{aspect-ratio:4/3}
  .hero-inner{padding-top:34px;padding-bottom:60px}
  .hero-inner>*{max-width:none}
  .hero h1{font-size:clamp(34px,8.4vw,46px)}
  .hero .eyebrow{font-size:9px;letter-spacing:.22em}
}

/* Badge lief als absolut positioniertes Element gegen den Titel; der dafuer
   noetige padding-right erzwang 350px Mindestbreite und sprengte das Raster.
   Im normalen Fluss entfaellt beides. */
.pkg .badge{position:static;align-self:flex-start;margin:0 0 16px}
.pkg .label{padding-right:0}
/* 1fr weicht sonst auf den Mindestinhalt aus — Spalten wurden ungleich breit */
.pkgs{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1200px){.pkgs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.pkgs{grid-template-columns:minmax(0,1fr)}}

/* ---------- GOTTMAN-ERKENNTNISSE (Kurzfassung aus Entwurf 1) ---------- */
.gi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}
.gi-box{padding:38px 34px;border-radius:24px;display:flex;flex-direction:column}
.gi-light{background:transparent;border:1px solid var(--cream-line)}
.gi-dark{border:1px solid rgba(212,162,138,.30)}
.gi-wide{grid-column:span 2}
.gi-label{font-family:'Lato',sans-serif;font-size:10px;font-weight:400;letter-spacing:.30em;
  text-transform:uppercase;color:var(--terra);margin-bottom:16px}
.gi-dark .gi-label{color:var(--rosegold)}
.gi-box h3{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:1.6rem;
  line-height:1.18;letter-spacing:-.015em;color:var(--ink);margin:0 0 14px}
.gi-dark h3{color:var(--ink)}
.gi-box p{font-size:14px;line-height:1.78;color:var(--body);margin:0;font-weight:300}
.gi-dark p{color:var(--body)}

.gi-reiter-block{border:1px solid rgba(212,162,138,.30);
  border-radius:24px;padding:46px 40px}
.gi-reiter-block .gi-label{color:var(--rosegold)}
.gi-reiter-block h3{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:2rem;
  line-height:1.14;letter-spacing:-.02em;color:var(--ink);margin:0 0 12px}
.gi-reiter-lead{font-size:14.5px;line-height:1.75;color:var(--body);
  margin:0 0 38px;max-width:620px;font-weight:300}
.gi-reiter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gi-reiter{background:rgba(243,232,220,.045);border:1px solid rgba(243,232,220,.09);
  border-radius:18px;padding:26px 24px}
.gi-reiter-num{font-family:'Lato',sans-serif;font-size:9px;font-weight:400;letter-spacing:.26em;
  text-transform:uppercase;color:var(--rosegold);margin-bottom:10px}
.gi-reiter h4{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:1.35rem;
  color:var(--ink);margin:0 0 10px;line-height:1.2}
.gi-reiter p{font-size:13px;line-height:1.72;color:var(--body);margin:0;font-weight:300}

@media(max-width:1100px){
  .gi-grid{grid-template-columns:repeat(2,1fr)}
  .gi-wide{grid-column:span 2}
  .gi-reiter-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .gi-grid{grid-template-columns:1fr}
  .gi-wide{grid-column:auto}
  .gi-reiter-grid{grid-template-columns:1fr}
  .gi-box{padding:30px 26px}
  .gi-reiter-block{padding:34px 26px}
  .gi-reiter-block h3{font-size:1.7rem}
}

/* ---------- MOBIL ---------- */
@media(max-width:760px){
  .pkg{padding:30px 24px;border-radius:22px}
  .pkg h3{font-size:32px}
  .hero h1{font-size:clamp(38px,10vw,52px)}
  .hero p.lead{font-size:16.5px}
  section{padding:82px 0}
  .ll-logo{align-items:flex-start;flex:0 1 auto;min-width:0}
  .nav-inner .ll-sub{display:none}
  .nav-inner   .nav-inner .ll-word{font-size:12.5px;letter-spacing:.24em;margin-top:0}
  .btn{padding:15px 26px;font-size:10.5px;letter-spacing:.2em}
  }
@media(max-width:400px){.pkg{padding:26px 20px}.pkg .price{font-size:34px}}
body{overflow-x:hidden}

/* Buttons erbten sonst die Browser-Standardschrift */
button,input,select,textarea{font-family:'Lato',sans-serif}

/* ---------- VERGLEICH KLASSISCH / LOVE LIFE ---------- */
.cmp-col{padding:38px 34px;border-radius:24px}
.cmp-col.bad{background:transparent;border:1px solid var(--cream-line)}
.cmp-col.good{background:var(--beige);color:var(--olive)}
.cmp-col h3{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:26px;
  line-height:1.2;letter-spacing:-.015em;margin:0 0 22px;color:var(--ink)}
.cmp-col h3 em{font-style:italic;font-weight:300;color:var(--terra)}
.cmp-col.good h3{color:var(--olive)}
.cmp-col.good h3 em{color:var(--olive)}
.cmp-col ul{list-style:none;margin:0;padding:0}
.cmp-col li{padding:13px 0;border-bottom:1px solid var(--cream-line);font-size:14px;
  line-height:1.6;font-weight:300;display:flex;gap:12px;color:var(--body)}
.cmp-col li:last-child{border:0}
.cmp-col li::before{content:'×';font-family:'Cormorant Garamond',serif;color:var(--stone);
  font-size:18px;line-height:1;flex-shrink:0}
.cmp-col.good li{border-bottom-color:rgba(61,61,47,.18);color:rgba(61,61,47,.82)}
.cmp-col.good li::before{content:'✓';color:var(--rosegold);font-size:15px}
@media(max-width:680px){.cmp-col{padding:28px 24px}}

/* ---------- EINZELSITZUNG ---------- */
.einzel-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,5rem);align-items:center}
@media(max-width:900px){.einzel-grid{grid-template-columns:1fr;gap:2.5rem}}
.einzel-text .eyebrow{margin-bottom:20px}
.einzel-text h2,.einzel-text h1{font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(2rem,3.5vw,3rem);line-height:1.12;letter-spacing:-.02em;color:var(--ink);margin:0 0 18px}
.einzel-text h2 em,.einzel-text h1 em{font-style:italic;font-weight:300;color:var(--terra)}
.einzel-text p{font-size:14.5px;line-height:1.8;color:var(--body);margin:0 0 16px;font-weight:300}
.einzel-card{background:var(--olive);border-radius:24px;padding:40px;position:relative;overflow:hidden;
  --ink:#F3E8DC;--body:rgba(243,232,220,.78);--stone:rgba(243,232,220,.66);
  --cream-line:rgba(212,162,138,.30);--terra:#D4A28A;color:var(--ink)}
.einzel-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--rosegold),var(--dustyrose))}
.einzel-card-label{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.30em;
  text-transform:uppercase;color:var(--terra);margin-bottom:14px}
.einzel-card-title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:28px;
  color:var(--ink);line-height:1.2;margin-bottom:6px}
.einzel-card-sub{font-size:13px;color:var(--body);margin-bottom:28px;font-weight:300}
.einzel-price{font-family:'Cormorant Garamond',serif;font-size:3.5rem;font-weight:300;
  color:var(--terra);line-height:1}
.einzel-price-sub{font-size:12px;color:var(--body);margin-bottom:28px;padding-bottom:28px;
  border-bottom:1px solid var(--cream-line);font-weight:300}
.einzel-features{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:12px}
.einzel-features li{font-size:13px;color:var(--body);display:flex;align-items:center;gap:10px;font-weight:300}
.einzel-features li::before{content:'—';color:var(--terra);font-size:12px;flex-shrink:0}
.einzel-note{font-size:12px;line-height:1.7;color:var(--body);padding-top:20px;
  border-top:1px solid var(--cream-line);font-weight:300}
@media(max-width:680px){.einzel-card{padding:30px 26px}}

/* ---------- ERWEITERTES ANGEBOT ---------- */
.pkgs-drei{grid-template-columns:repeat(3,minmax(0,1fr))}
.pkgs-zwei{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.pkgs-zwei{grid-template-columns:minmax(0,1fr)}}

@media(max-width:1100px){.pkgs-drei{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.pkgs-drei{grid-template-columns:minmax(0,1fr)}}
#weitere .pkg .desc,#fachkollegen .pkg .desc{margin-bottom:22px}
#weitere .pkg h3,#fachkollegen .pkg h3{font-size:34px}
.einzel-text .btn{align-self:flex-start}

/* ---------- KLAPPMENUE ANGEBOTE ---------- */
.nav-drop{position:relative;display:inline-flex;align-items:center}
.nav-drop-btn{
  display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;
  font-family:'Lato',sans-serif;font-size:10.5px;font-weight:400;letter-spacing:.26em;
  text-transform:uppercase;color:rgba(243,232,220,.72);padding:0;transition:color .25s;
}
.nav-drop-btn svg{width:13px;height:13px;transition:transform .25s;opacity:.7}
.nav-drop-btn:hover,.nav-drop-btn[aria-expanded="true"]{color:var(--rosegold)}
.nav-drop-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-drop-menu{
  position:absolute;top:calc(100% + 18px);left:50%;transform:translate(-50%,-6px);
  min-width:312px;background:var(--olive);border:1px solid rgba(212,162,138,.26);
  border-radius:18px;padding:10px;z-index:60;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.75);
  opacity:0;visibility:hidden;transition:opacity .22s,transform .22s,visibility .22s;
}
.nav-drop-menu::before{content:'';position:absolute;top:-18px;left:0;right:0;height:18px}
.nav-drop:hover .nav-drop-menu,
.nav-drop:focus-within .nav-drop-menu,
.nav-drop-menu.offen{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-drop-menu a{
  display:block;padding:11px 14px;border-radius:12px;text-decoration:none;
  letter-spacing:normal;text-transform:none;transition:background .2s;
}
.nav-drop-menu a:hover,.nav-drop-menu a:focus-visible{background:rgba(243,232,220,.07)}
.nav-drop-menu a span{
  display:block;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:19px;
  color:var(--ink);line-height:1.25;
}
.nav-drop-menu a small{
  display:block;font-family:'Lato',sans-serif;font-size:11.5px;font-weight:300;
  color:var(--body);margin-top:2px;line-height:1.4;
}

@media(max-width:980px){
  .nav-drop{display:block;width:100%}
  .nav-drop-btn{width:100%;justify-content:space-between;padding:12px 0;
    font-size:12px;letter-spacing:.2em;color:var(--ink)}
  .nav-drop-menu{
    position:static;transform:none;min-width:0;width:100%;
    background:transparent;border:0;border-left:1px solid rgba(212,162,138,.28);
    border-radius:0;margin:0 0 8px 4px;padding:0 0 0 14px;box-shadow:none;
    display:none;opacity:1;visibility:visible;
  }
  /* Die Aufklapp-Regel des Desktops setzt sonst die Mittigstellung zurueck */
  .nav-drop-menu.offen{display:block;transform:none;left:auto;right:auto}
  .nav-drop:hover .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu{display:none;transform:none}
  .nav-drop-menu.offen,.nav-drop:hover .nav-drop-menu.offen{display:block;transform:none}
  .nav-drop-menu a{padding:9px 0}
  .nav-drop-menu a span{font-size:17px}
  .nav-drop-menu a small{font-size:11px}
}

/* Hervorgehobene Karte: Flaeche und Textfarben muessen zusammenpassen.
   Auf dunklem Grund beige mit olivem Text, in beigen Sektionen umgekehrt.
   Fruehere Regeln setzten die Flaeche spaeter im Stylesheet und hoben die
   Token-Zuweisung aus. */
.pkg.featured{
  background:var(--beige);border-color:rgba(61,61,47,.22);
  --ink:#3D3D2F; --body:rgba(61,61,47,.82); --stone:rgba(61,61,47,.70);
  --cream-line:rgba(61,61,47,.24); --terra:#3D3D2F;
  --btn-bg:#3D3D2F; --btn-fg:#F3E8DC; color:var(--ink);
}
.pkg.featured .pkg-cta,.pkg.featured .pkg-cta:hover{background:var(--olive);color:var(--beige)}
.pkg.featured .badge{color:var(--olive);border-color:rgba(61,61,47,.45)}
.pkg.featured li::before{color:var(--olive)}
section.cream .pkg.featured{
  background:var(--olive);border-color:rgba(212,162,138,.30);
  --ink:#F3E8DC; --body:rgba(243,232,220,.78); --stone:rgba(243,232,220,.66);
  --cream-line:rgba(212,162,138,.30); --terra:#D4A28A;
  --btn-bg:#D4A28A; --btn-fg:#3D3D2F; color:var(--ink);
}
section.cream .pkg.featured .pkg-cta,section.cream .pkg.featured .pkg-cta:hover{background:var(--rosegold);color:var(--olive)}
section.cream .pkg.featured .badge{color:var(--rosegold);border-color:rgba(212,162,138,.5)}
section.cream .pkg.featured li::before{color:var(--rosegold)}

/* Die Textfarben der hervorgehobenen Karte waren fest verdrahtet und
   damit an eine dunkle Flaeche gebunden. Ueber Token folgen sie dem
   Kontext — beige Karte auf dunklem Grund, olive Karte auf Beige. */
.pkg.featured .label,.pkg.featured .price-sub{color:var(--terra)}
.pkg.featured .desc,.pkg.featured li{color:var(--body)}
.pkg.featured .price,.pkg.featured h3{color:var(--ink)}
.pkg.featured h3 em{color:var(--terra)}
.pkg.featured li{border-bottom-color:var(--cream-line)}

/* ---------- ONLINE-STANDORT ----------
   Die dritte Karte ist kein Ort, sondern ein Format. Sie behaelt die
   Rose-Gold-Flaeche zur Unterscheidung, folgt aber demselben Aufbau wie
   die beiden Praxen. Auf Rose Gold traegt nur deckendes Olive (4.89:1),
   abgestufte Toene fallen dort unter die Norm. */
.loc.loc-online{
  background:var(--rosegold);border:0;
  --ink:#3D3D2F; --body:#3D3D2F; --stone:#3D3D2F; --terra:#3D3D2F;
  --cream-line:rgba(61,61,47,.28);
  color:var(--olive);
}
.loc.loc-online .pin,.loc.loc-online h3,.loc.loc-online h3 em,
.loc.loc-online .addr strong,.loc.loc-online .addr span,
.loc.loc-online .feats li{color:var(--olive)}
.loc.loc-online .addr{border-bottom-color:rgba(61,61,47,.28)}
.loc.loc-online .feats li::before{color:var(--olive);opacity:.65}

/* ---------- ZWEITE MENUEEBENE ----------
   Die Angebote klappen innerhalb des Panels auf statt seitlich
   herauszufahren: seitliche Untermenues verlangen diagonale
   Mausbewegung und sind auf Touch kaum bedienbar. */
.nav-drop-menu{min-width:352px;padding:8px}
.nav-grp + .nav-grp{margin-top:2px;border-top:1px solid rgba(212,162,138,.16);padding-top:2px}
.nav-grp-list{display:none;padding:2px 0 8px}
.nav-grp.offen .nav-grp-list{display:block}
.nav-grp-list a{padding:9px 14px 9px 26px}
.nav-grp-list a span{font-size:18px}
@media(max-width:980px){
  .nav-drop-menu{min-width:0;padding:0 0 0 14px}
  .nav-grp + .nav-grp{border-top-color:rgba(212,162,138,.2)}
  .nav-grp-list a{padding:8px 0 8px 12px}
  .nav-grp-list a span{font-size:16px}
}

/* Sprungziele innerhalb einer Sektion: Abstand zur festen Kopfleiste,
   sonst verschwindet die Kartenoberkante darunter. */
.pkg[id]{scroll-margin-top:170px}
@media(max-width:980px){.pkg[id]{scroll-margin-top:120px}}

/* Gruppenkopf: Titel springt zum Abschnitt, Pfeil klappt auf. */
.nav-grp-head{display:flex;align-items:stretch;border-radius:12px;transition:background .2s}
.nav-grp-head:hover,.nav-grp.offen .nav-grp-head{background:rgba(243,232,220,.06)}
.nav-drop-menu .nav-grp-link{
  flex:1;padding:12px 6px 12px 14px;text-decoration:none;border-radius:0;background:none;
  font-family:'Lato',sans-serif;font-size:10px;font-weight:400;letter-spacing:.26em;
  text-transform:uppercase;color:var(--terra);line-height:1.5;
}
.nav-drop-menu .nav-grp-link:hover{background:none}
.nav-grp-toggle{
  flex:none;display:flex;align-items:center;justify-content:center;width:42px;
  background:none;border:0;cursor:pointer;color:var(--terra);padding:0;
  border-radius:0 12px 12px 0;transition:background .2s;
}
.nav-grp-toggle:hover{background:rgba(243,232,220,.08)}
.nav-grp-toggle svg{width:13px;height:13px;opacity:.75;transition:transform .25s}
.nav-grp.offen .nav-grp-toggle svg{transform:rotate(90deg)}
@media(max-width:980px){
  .nav-drop-menu .nav-grp-link{padding:13px 6px 13px 0;font-size:9.5px;letter-spacing:.22em}
  /* Trefferflaeche fuer den Finger: mindestens 44px */
  .nav-grp-head{min-height:44px}
  .nav-grp-toggle{width:44px;min-height:44px;border-radius:12px}
}
/* Sprungziel Abschnittsanfang: die Kopfleiste darf die Eyebrow nicht verdecken */
section[id]{scroll-margin-top:24px}
@media(max-width:980px){section[id]{scroll-margin-top:70px}}

/* ---------- RETREAT-ABLAUF ---------- */
.retreat-ablauf{margin-top:clamp(56px,7vw,88px)}
.ablauf-kopf{margin-bottom:28px}
.ablauf-kopf h3{font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(1.7rem,2.6vw,2.2rem);line-height:1.15;letter-spacing:-.02em;
  color:var(--ink);margin:12px 0 0}

/* ---------- WERTE ----------
   Vier gleichrangige Karten, 2x2. Bewusst ohne Nummern und ohne
   hervorgehobene Karte: die Werte stehen nebeneinander, nicht in
   einer Reihenfolge. */
.werte-block{margin-top:clamp(56px,7vw,88px)}
.werte-kopf{margin-bottom:26px}
.werte-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.wert{border:1px solid var(--cream-line);border-radius:24px;padding:34px 32px}
.wert h4{font-family:'Cormorant Garamond',serif;font-weight:400;
  font-size:clamp(1.25rem,1.9vw,1.5rem);line-height:1.2;letter-spacing:-.01em;
  color:var(--ink);margin:0 0 12px}
.wert p{font-size:14px;line-height:1.75;color:var(--body);margin:0}
@media(max-width:820px){
  .werte-grid{grid-template-columns:1fr}
  .wert{padding:28px 24px}
}

/* ---------- MISSION ----------
   Ein Satz, kein Raster: Die Aussage steht fuer sich zwischen dem
   Zweck darueber und den Wertekarten darunter. */
.ziele-block{margin-top:clamp(56px,7vw,88px)}
.ziele-kopf{margin-bottom:26px}
.ziele-lead{font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.45;letter-spacing:-.01em;
  color:var(--ink);margin:16px 0 0;max-width:860px}

@media(max-width:900px){
  
}

/* ---------- KLAPPMENUE, ZWEITE EBENE ----------
   Auf Zeigegeraeten stehen alle drei Gruppen dauerhaft offen.
   Grund: Das Panel oeffnet per CSS-Hover. Klappt beim Ueberfahren
   eine Gruppe zu, schrumpft das Panel — der Zeiger steht dann
   ausserhalb, der Hover bricht ab und das ganze Menue verschwindet.
   Auf Touch bleibt die Ziehharmonika, dort oeffnet der Schalter. */
@media (hover:hover) and (min-width:981px){
  .nav-drop-menu .nav-grp-list{display:block}
  .nav-grp-toggle{display:none}
  .nav-grp-link{padding-right:14px}
  .nav-grp + .nav-grp{margin-top:6px;padding-top:6px}
  /* Alle Gruppen offen ergibt ein hohes Panel. Damit die letzten
     Eintraege auf flachen Bildschirmen erreichbar bleiben, wird es
     gedeckelt und scrollt in sich selbst. */
  .nav-drop-menu{max-height:calc(100vh - 150px);overflow-y:auto;overscroll-behavior:contain}
}


/* ---------- ANGEBOT FUER PAARTHERAPEUT:INNEN ----------
   Zielgruppen und Aufnahmehinweis stehen unter den drei Paketen,
   nicht darin: die Karten vergleichen Leistungen, die Zuordnung
   "fuer wen" ist eine andere Frage und wuerde sie ueberladen. */
.b2b-zielgruppen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;margin-top:34px}
.b2b-zg{border-top:1px solid var(--cream-line);padding-top:18px}
.b2b-zg-titel{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--terra);margin-bottom:10px}
.b2b-zg p{font-size:14px;line-height:1.75;color:var(--body);margin:0}
.b2b-hinweis{margin-top:34px;border:1px solid var(--cream-line);
  border-radius:22px;padding:26px 30px;max-width:860px}
.b2b-hinweis p{font-size:14px;line-height:1.8;color:var(--body);margin:0}
.b2b-hinweis strong{color:var(--ink);font-weight:400}
@media(max-width:900px){
  .b2b-zielgruppen{grid-template-columns:1fr;gap:20px}
}


/* ---------- STANDORTFOTOS ----------
   Randlos ueber die Kartenbreite statt innerhalb des Innenabstands:
   die Karten stehen zu dritt nebeneinander und sind nur gut 360 px
   breit — zwei Bilder im Innenraum waeren briefmarkengross. */
.loc-fotos{display:grid;grid-template-columns:1fr 1fr;gap:2px;
  width:calc(100% + 64px);margin:-32px -32px 26px;
  border-radius:22px 22px 0 0;overflow:hidden}
.loc-fotos img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}
/* height:auto ist noetig: die Masse im Markup wirken als
   Praesentationsangabe und wuerden das Seitenverhaeltnis ueberschreiben. */
@media(max-width:980px){
  .loc-fotos{width:calc(100% + 56px);margin:-28px -28px 24px}
}


/* ---------- VERWEIS AUF DAS GOTTMAN INSTITUTE ----------
   Textlink statt Schaltflaeche: er fuehrt von der Seite weg und soll
   nicht mit dem Erstgespraech-Aufruf um Aufmerksamkeit ringen. */
.gottman-quelle{display:inline-block;margin-top:24px;
  font-family:'Lato',sans-serif;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--terra);text-decoration:none;
  border-bottom:1px solid rgba(212,162,138,.4);padding-bottom:4px;
  transition:border-color .25s,color .25s}
.gottman-quelle:hover{color:var(--ink);border-bottom-color:var(--ink)}


/* Acht Reiter statt sechs: ohne diese Regel bricht "Für Paare" in
   zwei Zeilen um und die Leiste wirkt unruhig. */
.nav-links > a{white-space:nowrap}
/* Das Logo darf dabei nicht als Erstes nachgeben — sonst schrumpft
   es zum Strich, sobald die Reiter Platz brauchen. */
.nav-inner > .ll-logo{flex:0 0 auto}
/* Schmales Band kurz oberhalb des Handy-Menues (Umschaltpunkt 880px):
   dort entfallen die vier Symbole rechts. Telefon und E-Mail stehen
   bereits in der Zeile darueber, "Kontakt" ist ein eigener Reiter. */
@media(max-width:1000px) and (min-width:881px){
  .nav-inner > .contact-icons{display:none}
}

/* ---------- KONTRAST-KORREKTUREN (CI-konform) ---------- */
/* Rose Gold als Flaeche traegt nur dunklen Text: Charcoal 7.50:1.
   Beige darauf faellt auf 1.86:1 und waere unlesbar. */
.btn-primary,.btn-primary:hover,.btn-primary span,
.contact-icons a:hover,.contact-icons a.cta-book,.contact-icons a.cta-book:hover,
.nav-contact-mobile,.nav-contact-mobile:hover,
.pkg .pkg-cta:hover,
.ct-form button[type=submit],.ct-form button[type=submit]:hover,
.ct-form button[type=submit] span,.submit-row button,.submit-row button span,
.draft-flag,.loc.highlight,.loc.highlight *{
  color:var(--olive);
}
/* Die hervorgehobene Standortkarte liegt auf Rose Gold */
.loc.highlight .pin,.locs .loc[style*="D4A28A"] .pin{color:var(--olive);opacity:.72}

/* Consent-Banner steht ausserhalb der Sektionen und erbte sonst die
   dunklen Token auf hellem Grund. */
.consent-banner{
  background:var(--beige);border-top:1px solid rgba(61,61,47,.26);
  --ink:#3D3D2F; --body:rgba(61,61,47,.82); --stone:rgba(61,61,47,.70);
  --terra:#3D3D2F; --cream:#F3E8DC;
  color:var(--olive);
}
.consent-text{color:rgba(61,61,47,.82)}
.consent-text a{color:var(--olive);text-decoration:underline}
.consent-btn{color:var(--olive);border-color:rgba(61,61,47,.4)}
.consent-btn-decline{color:var(--olive);background:transparent}
.consent-btn-accept{background:var(--olive);border-color:var(--olive);color:var(--beige)}
.consent-btn-accept:hover{background:var(--olive);border-color:var(--olive);color:var(--beige)}

/* Schaltflaeche der hervorgehobenen Karte folgt der Kartenflaeche:
   olive Flaeche auf beiger Karte, Rose Gold auf oliver Karte. */
.pkg.featured .pkg-cta,.pkg.featured .pkg-cta:hover{background:var(--olive);color:var(--beige)}
section.cream .pkg.featured .pkg-cta,section.cream .pkg.featured .pkg-cta:hover{background:var(--rosegold);color:var(--olive)}

/* ---------- ENTWURFS-MARKER ---------- */
.draft-flag{background:var(--rosegold);color:var(--olive);border-color:var(--rosegold);font-weight:400}


.iv2-wrap{max-width:1200px;margin:0 auto;padding:0 32px}
@media(max-width:720px){.iv2-wrap{padding:0 22px}}
.iv2-head{text-align:center;margin-bottom:36px}
.iv2-eyebrow{font-family:'Lato',sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--terra-text,#3D3D2F);display:inline-block}
.iv2-eyebrow::before{content:'— ';color:var(--terra,#D4A28A)}
.iv2-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media(max-width:900px){.iv2-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.iv2-grid{grid-template-columns:repeat(2,1fr)}}
.iv2-tile{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:10px;background:var(--cream-line)}
.iv2-tile a{display:block;width:100%;height:100%}
.iv2-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.iv2-tile:hover img{transform:scale(1.06)}
.iv2-play{position:absolute;top:10px;left:10px;background:rgba(61,61,47,.65);color:var(--beige);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;pointer-events:none}
.iv2-play svg{width:11px;height:11px;margin-left:2px}
.iv2-follow{text-align:center;margin-top:28px}
.iv2-follow a{display:inline-flex;align-items:center;gap:8px;font-family:'Lato',sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:400;padding:11px 24px;border-radius:999px;border:1px solid var(--ink,#3D3D2F);color:var(--ink,#3D3D2F);transition:background .25s,color .25s}
.iv2-follow a:hover{background:var(--ink,#3D3D2F);color:var(--cream,#F3E8DC)}

/* ---------- ABSCHLUSS-AUFRUF ----------
   Steht am Ende der Startseite. Rose-Gold-Flaeche, damit er sich vom
   durchgehend dunklen Verlauf darueber absetzt; auf Rose Gold traegt
   nur deckendes Olive (4.89:1). */
.cta-schluss{padding:clamp(64px,8vw,104px) 0}
.cta-box{background:var(--rosegold);border-radius:28px;
  padding:clamp(40px,5vw,64px) clamp(28px,4vw,56px);text-align:center;
  --ink:#3D3D2F; --body:#3D3D2F; --terra:#3D3D2F;
  --btn-bg:#3D3D2F; --btn-fg:#F3E8DC;}
.cta-box .eyebrow{color:var(--olive);justify-content:center}
.cta-box h2{font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.15;letter-spacing:-.02em;
  color:var(--olive);margin:14px 0 0}
.cta-box h2 em{font-style:italic;color:var(--olive)}
.cta-box p{font-size:15px;line-height:1.8;color:var(--olive);opacity:.86;
  margin:18px auto 0;max-width:600px}
.cta-aktionen{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.cta-box .btn-ghost{border-color:rgba(61,61,47,.4);color:var(--olive)}
/* .btn-primary traegt Rose Gold fest im Regelwerk — auf der Rose-Gold-
   Flaeche waere der Knopf dadurch unsichtbar. Hier deshalb explizit
   umgekehrt: Olive-Flaeche, Beige-Schrift. */
.cta-box .btn-primary{background:var(--olive);border-color:var(--olive);color:var(--beige)}
.cta-box .btn-primary:hover{background:#31311f;border-color:#31311f}
/* Die Beschriftung sitzt in einem span mit eigener Farbregel — ohne
   diese Zeile bliebe der Knopf leer. */
.cta-box .btn-primary span{color:var(--beige)}
@media(max-width:600px){ .cta-aktionen .btn{width:100%} }
