/* ════════════════════════════════════════════════════════════════
   REKURGO · Designsystem  ·  Regeneration neu gedacht
   Ruhig · hochwertig · wissenschaftlich · viel Weißraum
   Referenz-Anmutung: WHOOP / Eight Sleep / Apple / AG1
   ════════════════════════════════════════════════════════════════ */

/* ---------- Tokens ---------- */
:root{
  --petrol:#23434A;        /* Primär – dunkles Petrol */
  --petrol-d:#1A3238;      /* dunkler */
  --petrol-l:#2E555E;      /* heller  */
  --sage:#3E8463;          /* Sekundär – Grün (satt) */
  --sage-d:#2F6B4E;        /* Grün dunkel */
  --green-d:#2F6B4E;       /* Grünverlauf: satt … */
  --green:#3E8463;
  --green-l:#5BA17C;       /* … ins leicht hellere */
  --green-grad:linear-gradient(135deg,var(--green-d) 0%,var(--green) 55%,var(--green-l) 100%);
  --lead-bg:radial-gradient(circle at 70% 10%,rgba(62,132,99,.30),transparent 55%),var(--petrol); /* Leitfarbton = Newsletter */
  --sand:#D7C5A3;          /* Akzent – Sand */
  --sand-d:#C3AE86;
  --bg:#F8F7F3;            /* Warmweiß */
  --bg-2:#F1EEE6;          /* leicht abgesetzt */
  --surface:#FFFFFF;
  --ink:#1E1E1E;
  --ink-soft:#3C4844;
  --muted:#6A7570;
  --line:rgba(30,30,30,.10);
  --line-soft:rgba(30,30,30,.06);
  --shadow:0 1px 2px rgba(30,40,38,.04),0 12px 40px -12px rgba(35,67,74,.16);
  --shadow-lg:0 30px 70px -24px rgba(35,67,74,.30);
  --radius:18px;
  --radius-lg:26px;
  --maxw:1180px;
  --pad:clamp(20px,5vw,64px);
  --sec-y:clamp(40px,7vw,84px);
  --fdisp:'Manrope',system-ui,sans-serif;
  --fbody:'Inter',system-ui,sans-serif;
  /* Kompatibilität: alte Variablennamen auf neue Palette mappen */
  --navy:var(--petrol); --forest:var(--petrol); --gold:var(--sand-d);
  --olive:var(--sage-d); --cream:var(--bg); --white:#fff;
  --mid:var(--ink-soft); --border:var(--line);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{font-family:var(--fbody);background:var(--bg);color:var(--ink);line-height:1.7;
  font-size:17px;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5{font-family:var(--fdisp);font-weight:800;line-height:1.08;letter-spacing:-.02em;color:var(--ink)}
em{font-style:italic}
::selection{background:var(--sand);color:var(--petrol-d)}

/* ---------- Header ---------- */
nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;gap:24px;
  padding:14px var(--pad);background:rgba(248,247,243,.72);backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid transparent;transition:.3s}
nav.scrolled{background:rgba(248,247,243,.9);border-bottom-color:var(--line-soft);
  box-shadow:0 6px 24px -18px rgba(35,67,74,.5)}
.nav-logo{height:52px;width:auto}
.nav-links{display:flex;gap:6px;list-style:none;margin:0 auto}
.nav-links a{font-size:14px;font-weight:600;color:var(--ink-soft);padding:8px 12px;border-radius:10px;
  letter-spacing:.005em;transition:.18s;position:relative}
.nav-links a:hover{color:var(--petrol);background:rgba(62,132,99,.14)}
.nav-links a.active{color:var(--petrol)}
.nav-cta{font-family:var(--fdisp);font-weight:700;font-size:14px;color:#fff;background:var(--petrol);
  padding:11px 20px;border-radius:999px;transition:.2s}
.nav-cta:hover{background:var(--petrol-d);transform:translateY(-1px)}
.nav-cart{position:relative;color:var(--ink-soft);font-size:21px;display:flex;align-items:center}
.nav-cart .badge{position:absolute;top:-7px;right:-9px;background:var(--sand-d);color:var(--petrol-d);
  font-size:10px;font-weight:800;min-width:17px;height:17px;border-radius:999px;display:flex;
  align-items:center;justify-content:center;font-family:var(--fbody)}
.ham{display:none;background:none;border:0;color:var(--ink);font-size:25px;cursor:pointer;margin-left:auto}

/* Mobile-Menü */
.mob{position:fixed;inset:0;z-index:200;background:var(--bg);flex-direction:column;
  align-items:center;justify-content:center;gap:6px;display:none;padding:40px}
.mob.open{display:flex;animation:fade .25s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.mob a{font-family:var(--fdisp);font-size:22px;font-weight:700;color:var(--petrol);padding:9px}
.mob .mcta{margin-top:18px;background:var(--petrol);color:#fff;padding:13px 34px;border-radius:999px;font-size:16px}
.mob-x{position:absolute;top:22px;right:24px;background:none;border:0;font-size:30px;color:var(--ink);cursor:pointer}

/* ---------- Buttons ---------- */
.btn-p,.btnwh,.b-submit,.pd-buy,.pbtn,.cart-checkout{display:inline-flex;align-items:center;gap:9px;
  font-family:var(--fdisp);font-weight:700;font-size:15px;cursor:pointer;border:0;border-radius:999px;
  padding:14px 30px;transition:.2s;line-height:1}
.btn-p{background:var(--sand);color:var(--petrol-d)}
.btn-p:hover{background:var(--sand-d);transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(199,174,134,.7)}
.btn-o,.btngh{display:inline-flex;align-items:center;gap:9px;font-family:var(--fdisp);font-weight:700;
  font-size:15px;cursor:pointer;border-radius:999px;padding:13px 28px;transition:.2s;line-height:1}
.btn-o{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45)}
.btn-o:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btnwh{background:#fff;color:var(--petrol-d)}
.btnwh:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btngh{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.btngh:hover{background:rgba(255,255,255,.1)}
.b-submit,.pd-buy,.cart-checkout{background:var(--petrol);color:#fff;width:100%;justify-content:center}
.b-submit:hover,.pd-buy:hover,.cart-checkout:hover{background:var(--petrol-d)}
.pbtn{background:var(--petrol);color:#fff;padding:10px 18px;font-size:13px}
.mehr,.mehr-nv{display:inline-flex;align-items:center;gap:7px;font-family:var(--fdisp);font-weight:600;
  font-size:13.5px;color:var(--ink-soft);background:var(--bg-2);border:1px solid var(--line-soft);
  border-radius:999px;padding:10px 20px;cursor:pointer;transition:.2s;margin-top:8px}
.mehr:hover,.mehr-nv:hover{background:var(--petrol);color:#fff;border-color:var(--petrol);transform:translateY(-1px)}
.partner-link-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--fdisp);font-weight:700;
  font-size:14px;color:var(--petrol);transition:.18s}
.partner-link-btn:hover{gap:10px;color:var(--sage-d)}
.back-btn{display:inline-flex;align-items:center;gap:7px;background:none;border:0;cursor:pointer;
  font-family:var(--fbody);font-weight:600;font-size:14px;color:var(--muted);transition:.18s}
.back-btn:hover{color:var(--petrol)}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--lead-bg);
  color:#fff;padding:clamp(44px,7.5vw,82px) var(--pad) clamp(46px,7.5vw,86px);overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none}
.hero::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:rgba(255,255,255,.08)}
.hero-in{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1}
.hero-txt{max-width:780px}
.hbadge{display:inline-flex;align-items:center;gap:8px;background:rgba(215,197,163,.16);
  border:1px solid rgba(215,197,163,.4);color:var(--sand);font-size:12px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:8px 16px;border-radius:999px;margin-bottom:26px;
  animation:rise .6s .05s both}
.hbadge i{font-size:14px}
.hero h1{font-size:clamp(40px,7vw,72px);font-weight:800;color:#fff;margin-bottom:22px;animation:rise .6s .12s both}
.hero h1 em{color:var(--sand);font-weight:800}
.hero-sub{font-size:clamp(17px,2.2vw,21px);line-height:1.6;color:rgba(255,255,255,.82);
  max-width:600px;margin-bottom:34px;animation:rise .6s .2s both}
.hbtns{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:40px;animation:rise .6s .28s both}
.htrust{display:flex;flex-wrap:wrap;gap:14px 30px;animation:rise .6s .36s both}
.htrust span{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:rgba(255,255,255,.8)}
.htrust i{color:var(--sage);font-size:17px}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ---------- Sektionen ---------- */
.sec{padding:var(--sec-y) var(--pad);position:relative}
.sec>*{max-width:var(--maxw);margin-left:auto;margin-right:auto}
.sw{background:var(--bg)}
.sc{background:var(--surface)}
.sn{background:var(--bg-2)}
.so{background:var(--lead-bg);color:#fff}
.lbl,.lbll,.plbl,.kontakt-lbl{display:inline-block;font-family:var(--fdisp);font-size:12px;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;color:var(--sage-d);margin-bottom:14px}
.so .lbl,.so .lbll{color:var(--sand)}
.bar,.barl{width:46px;height:3px;background:var(--sand);border-radius:3px;margin-bottom:26px}
.so .bar,.so .barl{background:var(--sand)}
.stit,.stitl{font-size:clamp(30px,5vw,48px);font-weight:800;margin-bottom:18px;max-width:760px}
.so .stit,.so .stitl{color:#fff}
.ssub,.psub{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:620px;margin-bottom:48px;line-height:1.65}
.so .ssub,.so .psub{color:rgba(255,255,255,.8)}

/* ---------- Karten-Grids (Kernbereiche, Für wen, Wissen, Partner) ---------- */
.core-grid,.fw-grid,.know-grid,.partner-grid,.shop-grid,.tags{display:grid;gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.kcard,.fcard,.tp-card,.content-card,.partner-card,.ccard,.del-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:30px;box-shadow:var(--shadow);transition:.28s;position:relative;overflow:hidden}
.tp-card{text-align:left}
.kcard:hover,.fcard:hover,.ccard:hover,.tp-card:hover,.content-card:hover,.partner-card:hover{
  transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:rgba(62,132,99,.4)}
.kcard::before,.fcard::before,.ccard::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:linear-gradient(90deg,var(--sage),var(--sand));transform:scaleX(0);transform-origin:left;transition:.3s}
.kcard:hover::before,.fcard:hover::before,.ccard:hover::before{transform:scaleX(1)}
.cnum,.knum{font-family:var(--fdisp);font-size:13px;font-weight:800;color:var(--sand-d);
  letter-spacing:.05em;margin-bottom:14px;display:block}
.kcard h3,.fcard h3,.tp-card h3,.content-card h3,.kbody h3,.cbody h3{font-size:21px;font-weight:800;
  margin-bottom:10px;letter-spacing:-.01em}
.kbody p,.cbody p,.kcard p,.fcard p,.tp-card p,.content-card p{color:var(--muted);font-size:15.5px;margin-bottom:16px}
.kbody,.cbody{margin-bottom:0}
.lead{color:var(--ink-soft);font-size:15.5px;margin-bottom:14px}
/* ----- Wissen: Suchleiste + Schlagwörter + Kachel-Raster (4 nebeneinander) ----- */
.wiss-panel{background:var(--lead-bg);border:0;border-radius:var(--radius-lg);
  padding:clamp(30px,5vw,60px);box-shadow:0 1px 2px rgba(30,40,38,.03),0 24px 60px -30px rgba(35,67,74,.13)}
.wiss-panel .lbl{color:rgba(255,255,255,.85)}
.wiss-panel .stit{color:#fff}
.wiss-panel .ssub{color:rgba(255,255,255,.92)}
.wiss-panel .bar{background:var(--sand)}
.wiss-panel .wtag{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.22)}
.wiss-panel .wtag:hover{border-color:rgba(255,255,255,.55)}
.wiss-panel .wtag.active{background:#fff;color:var(--petrol);border-color:#fff}
.wiss-toolbar{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:30px}
.wiss-search{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);
  border-radius:999px;padding:11px 18px;min-width:230px;flex:0 0 auto}
.wiss-search i{color:var(--muted);font-size:18px}
.wiss-search input{border:0;outline:none;background:transparent;font-family:var(--fbody);font-size:14.5px;color:var(--ink);width:170px}
.wiss-tags{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 auto}
.wtag{font-family:var(--fdisp);font-weight:600;font-size:13px;color:var(--ink-soft);background:var(--bg-2);
  border:1px solid var(--line);border-radius:999px;padding:9px 16px;cursor:pointer;transition:.18s;white-space:nowrap}
.wtag:hover{border-color:var(--petrol)}
.wtag.active{background:var(--petrol);color:#fff;border-color:var(--petrol)}
.wiss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(208px,1fr));gap:14px}
.wtile{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);
  border-radius:14px;padding:16px;box-shadow:var(--shadow);transition:.25s;text-decoration:none;color:inherit}
.wtile:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--sage)}
.wtile .wcat{font-family:var(--fdisp);font-size:11px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--sand-d);margin-bottom:10px}
.wtile h3{font-size:15px;font-weight:800;letter-spacing:-.01em;margin:0 0 6px;color:var(--ink);line-height:1.25}
.wtile p{color:var(--muted);font-size:12.5px;line-height:1.5;margin:0 0 12px;flex:1}
.wtile .mehr{align-self:flex-start;margin-top:auto}
@media(max-width:980px){.wiss-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.wiss-grid{grid-template-columns:1fr}.wiss-search{flex:1 1 100%;min-width:0}.wiss-search input{width:100%}}
.pill,.flist span,.tags span{display:inline-block;background:var(--bg-2);color:var(--ink-soft);
  font-size:12.5px;font-weight:600;padding:6px 13px;border-radius:999px;margin:3px 4px 3px 0;border:1px solid var(--line-soft)}
.flist{display:flex;flex-wrap:wrap;gap:2px;margin-bottom:16px}

/* ---------- Philosophie / Zitat (dunkle, zentrierte Sektion) ---------- */
.phil-c{text-align:center}
.phil-c .stitl,.phil-c .psub{margin-left:auto;margin-right:auto}
.pbox{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);
  padding:28px 30px;max-width:760px;margin:14px auto 0;text-align:left;backdrop-filter:blur(6px)}
.plbl{display:flex;align-items:center;gap:9px;font-family:var(--fdisp);font-weight:800;font-size:13px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--sand);margin-bottom:12px}
.ptxt{font-size:16.5px;line-height:1.75;color:rgba(255,255,255,.82)}
.phr{border:0;height:1px;background:rgba(255,255,255,.14);max-width:760px;margin:36px auto 28px}
.pq{font-family:var(--fdisp);font-size:clamp(22px,3.4vw,34px);font-weight:800;line-height:1.3;
  letter-spacing:-.02em;color:var(--sand);max-width:840px;margin:0 auto}

/* ---------- Community (soc) ---------- */
.soc-wrap{display:grid;gap:16px;max-width:600px;margin:0 auto;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.soccard{display:grid;grid-template-columns:auto 1fr;gap:0 14px;align-items:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:14px;
  padding:16px 18px;cursor:pointer;transition:.25s;text-align:left;backdrop-filter:blur(6px)}
.soccard:hover{background:rgba(255,255,255,.12);transform:translateY(-3px);border-color:rgba(215,197,163,.5)}
.socico{grid-row:1 / span 2;width:42px;height:42px;border-radius:11px;display:flex;align-items:center;
  justify-content:center;font-size:19px;color:#fff;margin:0}
.soccard.ig .socico{background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045)}
.soccard.yt .socico{background:#ff0000}
.socplat{grid-column:2;font-family:var(--fdisp);font-size:15px;font-weight:800;color:#fff;margin:0;align-self:end}
.socho{grid-column:2;color:var(--sand);font-size:12.5px;font-weight:600;margin:0;align-self:start}
.socdesc{display:none}

/* ---------- Newsletter ---------- */
.newsletter{background:var(--petrol);color:#fff;border-radius:var(--radius-lg);
  padding:clamp(40px,7vw,72px);text-align:center;position:relative;overflow:hidden}
.newsletter::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 70% 10%,rgba(62,132,99,.3),transparent 55%);pointer-events:none}
.newsletter>*{position:relative;z-index:1}
.newsletter h2{color:#fff;font-size:clamp(26px,4vw,40px);margin-bottom:14px}
.newsletter p{color:rgba(255,255,255,.82);max-width:520px;margin:0 auto 30px;font-size:17px}
.nl-form{display:flex;gap:10px;max-width:460px;margin:0 auto;flex-wrap:wrap}
.nl-form input{flex:1;min-width:200px;padding:15px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.08);color:#fff;font-family:var(--fbody);font-size:15px}
.nl-form input::placeholder{color:rgba(255,255,255,.6)}
.nl-form input:focus{outline:none;border-color:var(--sand);background:rgba(255,255,255,.14)}
.nl-form button{background:var(--sand);color:var(--petrol-d);border:0;border-radius:999px;
  padding:15px 30px;font-family:var(--fdisp);font-weight:700;font-size:15px;cursor:pointer;transition:.2s}
.nl-form button:hover{background:#fff}
.nl-note{font-size:12.5px;color:rgba(255,255,255,.55);margin-top:16px}
.nl-consent{max-width:470px;margin:18px auto 0;text-align:left;display:flex;flex-direction:column;gap:11px}
.nl-consent label{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:rgba(255,255,255,.8);line-height:1.5;cursor:pointer}
.nl-consent input{margin-top:2px;flex:none;width:17px;height:17px;accent-color:var(--sand);cursor:pointer}
.nl-consent a{color:var(--sand);text-decoration:underline}
/* Community / Social-Wall */
.social-wall{border:2px dashed var(--line);border-radius:var(--radius);padding:clamp(30px,6vw,56px);
  text-align:center;color:var(--muted);background:var(--bg-2)}
.social-wall i{font-size:34px;color:var(--petrol);display:block;margin-bottom:12px}
.social-wall h3{font-size:18px;margin-bottom:8px}
.sw-links{display:flex;gap:12px;justify-content:center;margin-top:18px}
.sw-links a{width:42px;height:42px;border-radius:11px;background:var(--bg-2);display:flex;
  align-items:center;justify-content:center;color:var(--petrol);font-size:19px;transition:.2s}
.sw-links a:hover{background:var(--petrol);color:#fff;transform:translateY(-2px)}

/* ---------- Closing ---------- */
.clos{text-align:center;max-width:720px}
.clos h2{font-size:clamp(30px,5vw,52px);color:#fff;margin-bottom:18px}
.clos p{color:rgba(255,255,255,.82);font-size:19px;margin-bottom:34px}
.closbtns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- Partner ---------- */
.partner-logo{width:64px;height:64px;border-radius:14px;overflow:hidden;margin-bottom:16px;background:#fff}
.partner-name{font-family:var(--fdisp);font-weight:800;font-size:18px;margin-bottom:8px}

/* ---------- Inhaltsseiten / Breadcrumb ---------- */
.breadcrumb{max-width:var(--maxw);margin:0 auto;padding:24px var(--pad) 0;display:flex;align-items:center;
  gap:10px;font-size:14px;color:var(--muted)}
.page-content,.pd-wrap,.cart-wrap{max-width:820px;margin:0 auto;padding:30px var(--pad) 90px}
.page-content h1{font-size:clamp(30px,5vw,46px);margin-bottom:22px}
.page-content h2{font-size:clamp(22px,3vw,30px);margin:38px 0 14px}
.page-content h3{font-size:21px;margin:26px 0 10px}
.page-content p,.page-content li{color:var(--ink-soft);margin-bottom:14px}
.page-content ul,.page-content ol{padding-left:22px;margin-bottom:14px}
.page-content a{color:var(--petrol);text-decoration:underline;text-underline-offset:2px}
.page-hero-box{margin-bottom:30px}
.page-hero-box.hero-dark{background:var(--petrol);color:#fff;padding:28px 26px;border-radius:var(--radius)}
.page-hero-box.hero-dark h1{color:#fff}
.db-section{margin-bottom:26px}
.db-section h2,.db-section h3{font-family:var(--fdisp)}
.db-highlight{background:var(--bg-2);border-left:3px solid var(--sage);border-radius:0 12px 12px 0;
  padding:18px 22px;margin:20px 0;color:var(--ink-soft)}

/* ---------- Formular (Kontakt) ---------- */
.frow{display:flex;align-items:flex-start;gap:11px;margin-bottom:11px;font-size:15px;color:var(--ink-soft)}
.frow i{color:var(--sage-d);font-size:18px;margin-top:3px;flex:none}
.form-field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.form-field label,.kontakt-lbl{font-weight:600;font-size:14px;color:var(--ink-soft)}
.form-field input,.form-field textarea{padding:13px 16px;border:1px solid var(--line);border-radius:12px;
  font-family:var(--fbody);font-size:15px;background:var(--surface);color:var(--ink);transition:.18s}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--sage);
  box-shadow:0 0 0 3px rgba(62,132,99,.18)}
.req{color:#c0563f}
.b-msg{display:none;margin-top:14px;color:var(--sage-d);font-weight:600}
.b-msg.show{display:block}
.b-msg.error{color:#c0563f}
.kontakt-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}
.kontakt-row i{color:var(--sage-d);font-size:20px;margin-top:2px}
.kontakt-val{color:var(--ink-soft)}

/* ---------- Footer ---------- */
footer{background:var(--petrol-d);color:rgba(255,255,255,.7);padding:clamp(50px,8vw,80px) var(--pad) 30px}
.ftgrid{max-width:var(--maxw);margin:0 auto;display:grid;gap:36px;
  grid-template-columns:1.6fr repeat(3,1fr);padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.12)}
.ftbrand p{font-size:15px;line-height:1.7;max-width:300px}
.ftcol h5{font-family:var(--fdisp);font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:#fff;margin-bottom:16px}
.ftcol a{display:block;color:rgba(255,255,255,.65);font-size:14.5px;padding:5px 0;transition:.15s}
.ftcol a:hover{color:var(--sand)}
.ftsoc{display:flex;gap:12px}
.ftsoc a{width:40px;height:40px;border-radius:11px;background:rgba(255,255,255,.08);display:flex;
  align-items:center;justify-content:center;font-size:19px;color:#fff;transition:.2s}
.ftsoc a:hover{background:var(--petrol);transform:translateY(-2px)}
.ftbot{max-width:var(--maxw);margin:0 auto;padding-top:26px;display:flex;justify-content:space-between;
  align-items:center;gap:16px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.5)}
.ftlinks{display:flex;gap:20px;flex-wrap:wrap}
.ftlinks a:hover{color:var(--sand)}

/* ---------- Toast ---------- */
.rk-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);
  background:var(--petrol-d);color:#fff;padding:13px 22px;border-radius:12px;font-size:14px;font-weight:600;
  box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:.25s;z-index:999}
.rk-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- Scroll-Reveal (sanftes Einblenden) ---------- */
.js-reveal{opacity:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s cubic-bezier(.2,.7,.2,1)}
.js-reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js-reveal{opacity:1!important;transform:none!important;transition:none}}

/* ---------- Hintergrund-Medien (Bild/Video je Sektion) ----------
   Nutzung in content/home.html:
   <section class="sec media" id="...">
     <div class="sec-bg"><img src="/assets/dein-bild.jpg" alt=""></div>   ODER
     <div class="sec-bg"><video autoplay muted loop playsinline poster="..."><source src="/assets/clip.mp4" type="video/mp4"></video></div>
     ... Inhalt ...
   </section>                                                                */
.sec.media{position:relative;color:#fff;overflow:hidden}
.sec.media .sec-bg{position:absolute;inset:0;z-index:0}
.sec.media .sec-bg img,.sec.media .sec-bg video{width:100%;height:100%;object-fit:cover}
.sec.media .sec-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(26,50,56,.55),rgba(26,50,56,.78))}
.sec.media>*:not(.sec-bg){position:relative;z-index:1}
.sec.media .stit,.sec.media .stitl,.sec.media .ssub,.sec.media .lbl{color:#fff}
.sec.media .lbl{color:var(--sand)}

/* ---------- Responsive ---------- */
@media(max-width:860px){
  .nav-links,.nav-cta{display:none}
  .ham{display:block}
  .frow{grid-template-columns:1fr}
  .ftgrid{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:560px){
  body{font-size:16px}
  .ftgrid{grid-template-columns:1fr}
  .hbtns{flex-direction:column;align-items:stretch}
  .hbtns a{justify-content:center}
}
.health-note{max-width:760px;margin:34px 0 0;padding-top:16px;border-top:1px solid var(--line-soft);font-size:12.5px;line-height:1.6;color:var(--muted)}
.health-note strong{color:var(--ink-soft);font-weight:700}

/* ════════ Rekurgo-Verbesserungen (Bilder, Badges, Byline) ════════ */
/* Hero-Bild hinter dem Petrol-Verlauf – dezent, edel, nie aufdringlich */
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.18;z-index:0;filter:saturate(.55) contrast(1.04);mix-blend-mode:luminosity;pointer-events:none}
.hero::after{z-index:0}
.hero-in{position:relative;z-index:2}

/* Meta-Badges: Lesedauer + Quellenzahl */
.ameta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.abadge{display:inline-flex;align-items:center;gap:5px;font-family:var(--fbody);font-size:12px;
  font-weight:600;color:var(--muted);background:var(--bg-2);border:1px solid var(--line-soft);
  border-radius:999px;padding:3px 11px;line-height:1.5}
.abadge i{font-size:13px;color:var(--sage-d)}
.wtile .ameta{margin:0 0 14px}
.kbody .ameta{margin:2px 0 14px}
.page-hero-box .ameta{margin-top:16px}
.ameta-d .abadge{color:rgba(255,255,255,.8);background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}
.ameta-d .abadge i{color:var(--sand)}
.share-wa{display:flex;width:fit-content;align-items:center;gap:7px;font-family:var(--fbody);font-size:12.5px;
  font-weight:600;color:var(--ink-soft);background:var(--bg-2);border:1px solid var(--line-soft);
  border-radius:999px;padding:7px 15px;line-height:1.5;text-decoration:none;transition:.2s;margin-top:20px}
.share-wa:hover{background:var(--petrol);color:#fff;border-color:var(--petrol)}
.share-wa svg{width:15px;height:15px;flex:none;stroke:currentColor}

/* Säulen-Banner-Bild oben in den Hub-Seiten */
.hub-banner{width:100%;height:auto;display:block;
  border-radius:var(--radius-lg);margin:0 0 10px;box-shadow:var(--shadow)}

/* Autor-Byline am Artikelende */
.byline{display:flex;align-items:center;gap:14px;margin:38px 0 0;padding:18px 20px;
  background:var(--bg-2);border:1px solid var(--line-soft);border-radius:var(--radius)}
.byline img{width:54px;height:54px;border-radius:999px;object-fit:cover;flex:none;background:var(--petrol)}
.byline .bn{font-family:var(--fdisp);font-weight:800;color:var(--ink);font-size:15px;line-height:1.3}
.byline .br{color:var(--muted);font-size:13.5px;margin-top:2px}

/* Founder-Card (Über uns) */
.founder-card{display:flex;gap:22px;align-items:center;flex-wrap:wrap;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;margin:28px 0;box-shadow:var(--shadow)}
.founder-card img{width:120px;height:120px;border-radius:var(--radius);object-fit:cover;flex:none;background:var(--petrol)}
.founder-card>div{flex:1;min-width:240px}
.founder-card p{color:var(--muted);font-size:15.5px}

/* Tastatur-Fokus sichtbar (Accessibility) */
:focus-visible{outline:2px solid var(--sage-d);outline-offset:2px;border-radius:6px}


/* ════════ Anpassungen (Grün-Vereinheitlichung, Kernkarten, Wissen-Footer) ════════ */
/* Kernbereiche 1–6: einheitlicher Grünverlauf als Hintergrund – nur diese Felder */
.ccard{background:linear-gradient(135deg,rgba(35,67,74,.90) 0%,rgba(35,67,74,.74) 45%,rgba(35,67,74,.52) 100%),var(--photo, var(--lead-bg));
  background-size:cover;background-position:center;border-color:transparent;color:#fff}
.ccard::before{display:none}
.ccard h3{color:var(--sand)}
.ccard .lead,.ccard p{color:rgba(255,255,255,.88)}
.ccard .cnum{color:rgba(255,255,255,.72)}
.ccard .mehr{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.45)}
.ccard .mehr:hover{background:#fff;color:var(--petrol);border-color:#fff}
.ccard:hover{border-color:transparent;box-shadow:var(--shadow-lg)}

/* "Lesen"-Button in einer Zeile neben den Quellen/Meta-Badges */
.wfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto}
.wfoot .ameta{margin:0;flex:0 1 auto}
.wfoot .mehr,.wfoot .mehr-nv{margin-top:0;padding:7px 14px;font-size:12.5px;white-space:nowrap}

/* Hero: Folgen-Buttons 50/50 (Instagram + YouTube) */
.hfollow{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:520px;margin:0 0 40px;animation:rise .6s .28s both}
.hfollow .btn-o{justify-content:center;width:100%}
@media(max-width:560px){.hfollow{grid-template-columns:1fr}}

/* Inhaltsseiten beim Öffnen sauber zentriert im Viewport */
.page-content,.pd-wrap,.cart-wrap{margin-left:auto;margin-right:auto}
.page-content{scroll-margin-top:90px}


/* ════════ B: Hero-Hub, Social-Icons, Vertrauens-Band, asymmetrische Säulen ════════ */
/* Hero zweispaltig */
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center}
.hero-grid .hero-txt{max-width:640px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:34px}}

/* Social nur noch als kleine Icons */
.hsocial{display:flex;align-items:center;gap:12px;margin-top:4px;animation:rise .6s .4s both}
.hsocial-lbl{font-size:13px;font-weight:600;color:rgba(255,255,255,.6);letter-spacing:.03em}
.hsoc-ic{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.3);color:#fff;font-size:18px;text-decoration:none;transition:.2s}
.hsoc-ic:hover{background:rgba(255,255,255,.12);border-color:#fff;transform:translateY(-2px)}

/* Vertrauens-Band: schmal, dezent, nur Text, an Hintergrund angepasst */
.trustband{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trustband-in{max-width:var(--maxw);margin:0 auto;padding:11px var(--pad);display:flex;flex-wrap:wrap;
  align-items:center;justify-content:center;gap:7px 20px}
.tb-stat{font-size:12.5px;color:var(--muted);font-weight:600}
.tb-stat strong{font-family:var(--fdisp);font-size:14px;color:var(--sage-d);margin-right:4px}
.tb-dot{width:4px;height:4px;border-radius:50%;background:var(--line)}
.tb-item{font-size:12px;color:var(--muted);font-weight:500;letter-spacing:.01em}
.tb-item::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--sage);margin-right:9px;vertical-align:middle}
@media(max-width:680px){.tb-dot{display:none}.trustband-in{gap:5px 14px}}

/* Kernbereiche: Regeneration als schmale Basis über volle Breite der 3 Kacheln, CTA rechts */
.core-base{margin-bottom:22px}
.ccard-base{width:100%;display:flex;align-items:center;gap:28px;padding:22px 30px;
  border:1.5px solid var(--sand);box-shadow:0 0 0 4px rgba(215,197,163,.16),0 18px 44px -20px rgba(0,0,0,.45)}
.ccard-base .cbase-main{flex:1;min-width:0}
.ccard-base .cbase-lbl{display:inline-flex;align-items:center;gap:9px;font-family:var(--fdisp);font-size:11.5px;font-weight:800;
  letter-spacing:.15em;text-transform:uppercase;color:var(--sand);margin-bottom:7px}
.ccard-base .cbase-lbl::before{content:"";width:24px;height:2px;background:var(--sand);border-radius:2px}
.ccard-base h3{font-size:20px;margin-bottom:5px;line-height:1.25}
.ccard-base .lead{font-size:14.5px;margin-bottom:0}
.ccard-base .cbase-cta{flex:0 0 auto;margin-top:0;white-space:nowrap}
.core-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.core-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.ccard-base{flex-direction:column;align-items:flex-start;gap:16px}}
@media(max-width:560px){.core-grid{grid-template-columns:1fr}}


/* Hero: kleine Social-Kacheln (an die Palette angepasst) */
.hsoc-tiles{display:flex;gap:12px;margin-top:6px;animation:rise .6s .4s both}
.hsoc-tile{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:12px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;
  font-family:var(--fdisp);font-weight:700;font-size:14px;transition:.22s}
.hsoc-tile i{font-size:19px;color:var(--sand)}
.hsoc-tile:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.42);transform:translateY(-2px)}

/* Hero-Visualisierung: Platzhalter (wird vom Nutzer ersetzt) */
.vis-ph{width:min(430px,84vw);aspect-ratio:1;margin:0 auto;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:12px;border:1.5px dashed rgba(255,255,255,.22);border-radius:24px;color:rgba(255,255,255,.38)}
.vis-ph i{font-size:46px}
.vis-ph span{font-size:12px;letter-spacing:.14em;text-transform:uppercase}
@media(max-width:900px){.vis-ph{width:min(360px,86vw)}}


/* Hub: Instagram + YouTube kombiniert, diagonal getrennt (Querstrich) + farbliche Trennung */
.hub-social{position:relative;width:min(430px,84vw);height:112px;margin:0 auto;border-radius:20px;overflow:hidden;
  background:#fff;box-shadow:0 20px 48px -18px rgba(0,0,0,.55);animation:rise .6s .3s both}
.hs-half{position:absolute;top:0;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:7px;text-decoration:none;font-family:var(--fdisp);font-weight:800;font-size:15px;transition:background .22s}
.hs-half i{font-size:26px}
.hs-ig{background:var(--sage);color:#fff;clip-path:polygon(0 0,55% 0,43% 100%,0 100%);padding-right:52%}
.hs-yt{background:var(--sand);color:var(--petrol-d);clip-path:polygon(57% 0,100% 0,100% 100%,45% 100%);padding-left:52%}
.hs-ig:hover{background:var(--sage-d)}
.hs-yt:hover{background:var(--sand-d)}
@media(max-width:900px){.hub-social{width:min(420px,86vw)}}

/* Leichte Umrandung beim Hover auf alle Kernbereich-Karten */
.ccard:hover{border-color:rgba(215,197,163,.6)}


/* Hero: Instagram/YouTube unter dem Primär-CTA, gleiche Größe wie "Wissen entdecken" */
.hsoc-row{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap;animation:rise .6s .4s both}
.hsoc-btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--fdisp);font-weight:700;font-size:15px;
  border-radius:999px;padding:14px 30px;line-height:1;text-decoration:none;transition:.2s}
.hsoc-btn i{font-size:18px}
.hsoc-ig{background:#fff;color:var(--petrol-d)}
.hsoc-ig:hover{background:rgba(255,255,255,.86);transform:translateY(-2px)}
.hsoc-yt{background:#fff;color:var(--petrol-d)}
.hsoc-yt:hover{background:rgba(255,255,255,.86);transform:translateY(-2px)}

/* Pulsierender Kreis hinter dem Folgen-Bereich (ohne Schrift, mittig, hinter dem Text) */
#soc,#closing{position:relative;overflow:hidden}
#soc>.lbl,#soc>.bar,#soc>.stit,#soc>.ssub,#soc>.soc-wrap,#closing>.clos{position:relative;z-index:1}

/* ── System-Diagramm: 6 Säulen um Regeneration (Startseite) ── */
.sysmap{max-width:460px;margin:6px auto 32px;text-align:center}
.sysmap svg{width:100%;height:auto;max-width:460px;display:block;margin:0 auto}
.sysmap-cap{font-size:13.5px;color:var(--muted);margin:10px 0 0;letter-spacing:.01em}
/* ── Newsletter-Nutzenpunkte ── */
.nl-benefits{list-style:none;margin:16px 0 6px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px}
.nl-benefits li{display:flex;align-items:center;gap:7px;font-size:14.5px;color:rgba(255,255,255,.92)}
.nl-benefits li i{color:var(--sand);font-size:16px;line-height:1}

/* ── Wissensbibliothek (/wissen/): Gruppen nach Säulen ── */
.lib-group{margin:0 0 42px}
.lib-group:last-child{margin-bottom:6px}
.lib-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line-soft)}
.lib-head h2{margin:0;font-size:clamp(20px,3vw,26px)}
.lib-head h2 a{color:inherit;text-decoration:none}
.lib-head h2 a:hover{color:var(--petrol)}
.lib-count{font-size:13px;color:var(--muted)}
.lib-head .lib-hub{margin-left:auto;font-family:var(--fdisp);font-weight:600;font-size:14px;white-space:nowrap;color:var(--sage-d);text-decoration:none;display:inline-flex;align-items:center;gap:5px;transition:color .15s}
.lib-head .lib-hub:hover{color:var(--petrol);text-decoration:underline;text-underline-offset:3px}
/* Wissen-Teaser auf der Startseite */
.wiss-toolbar-home{justify-content:center}
.wiss-more{text-align:center;margin-top:28px}
.btn-lib{display:inline-flex;align-items:center;gap:8px}

/* ── Sichtbares Datum (Hub/Artikel) ── */
.page-date{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:13.5px;margin-top:10px}
.page-date i{font-size:15px;color:var(--sage-d)}
/* ── FAQ (native details, FAQPage) ── */
.faq-block h2{font-size:clamp(20px,3vw,26px);margin:0}
.faq-list{margin-top:18px;border-top:1px solid var(--line-soft)}
.faq-item{border-bottom:1px solid var(--line-soft)}
.faq-item summary{cursor:pointer;list-style:none;padding:16px 2px;font-family:var(--fdisp);
  font-weight:700;font-size:16.5px;color:var(--ink);display:flex;align-items:center;
  justify-content:space-between;gap:14px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;line-height:1;color:var(--sage-d);font-weight:600}
.faq-item[open] summary::after{content:"\2212"}
.faq-a{padding:0 2px 18px;color:var(--ink-soft);font-size:15.5px;line-height:1.65;max-width:72ch}
.faq-a a{color:var(--sage-d);font-weight:600}

/* ── Hero: rechte Visual-Spalte (System-Diagramm) + Autoren-Zeile ── */
.hero-visual{display:flex;flex-direction:column;justify-content:center;align-items:center}
.hero-svg{width:100%;max-width:440px;height:auto}
.hero-cred{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;
  color:rgba(255,255,255,.8);margin-top:6px}
.hero-cred strong{color:#fff;font-weight:700}
.hero-cred i{color:var(--sand);font-size:15px}
@media(max-width:900px){.hero-svg{max-width:360px}.hero-cred{font-size:13px}}

/* Hero-Diagramm-Legende (01–06 → Bereiche) */
.hero-legend{list-style:none;margin:20px auto 0;padding:0;max-width:440px;
  display:grid;grid-template-columns:1fr 1fr;gap:9px 20px}
.hero-legend li{display:flex;align-items:center;gap:9px;font-size:13.5px;color:rgba(255,255,255,.82)}
.hero-legend li span{flex:none;width:27px;height:22px;display:inline-flex;align-items:center;
  justify-content:center;font-size:11px;font-weight:700;color:var(--sand);
  border:1px solid rgba(215,197,163,.4);border-radius:6px}
@media(max-width:900px){.hero-legend{max-width:360px}}

/* ── Startseiten-CTA: Regenerations-Score ── */
#score-cta{text-align:center}
.scta{max-width:620px;margin:0 auto}
.scta-ey{font-family:var(--fdisp);font-weight:700;font-size:12.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sand);margin-bottom:14px}
.scta h2{color:#fff;font-size:clamp(24px,4.5vw,34px);margin:0 0 14px}
.scta p{color:rgba(255,255,255,.82);font-size:clamp(15px,3vw,17px);max-width:48ch;margin:0 auto 24px}
.scta .btnwh{display:inline-flex;align-items:center;gap:8px}
.scta-meta{margin-top:16px;color:rgba(255,255,255,.6);font-size:13px}

/* ── Hero-Diagramm: klickbarer Regenerations-Kreis ── */
.hero-svg .hero-core{cursor:pointer}
.hero-svg .hero-core circle,.hero-svg .hero-core text{transition:stroke-opacity .2s,filter .2s}
.hero-svg .hero-core:hover{filter:brightness(1.05)}
.hero-svg .hero-core:hover .hero-core-ring{stroke-opacity:.55}
.hero-svg a{text-decoration:none}
.hero-svg a:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:50%}

/* ── Hero-Diagramm: anklickbare Kernbereich-Buttons ── */
.hero-svg .hero-spoke{cursor:pointer}
.hero-svg .hero-spoke rect{transition:fill .2s,stroke-opacity .2s}
.hero-svg .hero-spoke text{transition:fill .2s}
.hero-svg .hero-spoke:hover rect{fill:#D7C5A3;stroke-opacity:.95}
.hero-svg .hero-spoke:hover text{fill:#1a3138}
.hero-svg .hero-spoke:focus-visible rect{stroke:#fff;stroke-opacity:1;stroke-width:2}

/* ── Cookie-Consent-Banner ── */
.cc-banner{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--navy,#1a2e33);color:#fff;
  padding:20px 22px;box-shadow:0 -8px 30px rgba(0,0,0,.25);display:flex;flex-wrap:wrap;gap:16px 24px;
  align-items:center;justify-content:space-between;font-family:var(--fbody)}
.cc-banner.hide{display:none}
.cc-text{flex:1 1 340px;font-size:14px;line-height:1.6;color:rgba(255,255,255,.85);max-width:640px}
.cc-text a{color:var(--sand);text-decoration:underline}
.cc-btns{display:flex;gap:10px;flex-wrap:wrap}
.cc-btn{font-family:var(--fbody);font-weight:700;font-size:13.5px;border-radius:999px;padding:11px 20px;
  cursor:pointer;border:1.5px solid rgba(255,255,255,.35);background:transparent;color:#fff;transition:.2s}
.cc-btn:hover{background:rgba(255,255,255,.1)}
.cc-btn.cc-accept{background:var(--petrol);border-color:var(--petrol)}
.cc-btn.cc-accept:hover{background:var(--petrol-d,var(--petrol))}
@media(max-width:600px){.cc-banner{padding:18px 16px}.cc-btns{width:100%}.cc-btn{flex:1;text-align:center}}
.cc-settings-link{cursor:pointer;background:none;border:none;padding:0;font:inherit;color:inherit;text-decoration:none}
.ftlinks .cc-settings-link:hover{color:var(--sand)}
