/* Raleway, selbst ausgeliefert. Keine Verbindung zu Google. */
@font-face{font-family:'Raleway';font-style:normal;font-weight:400;src:url('/assets/fonts/raleway-400.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Raleway';font-style:normal;font-weight:500;src:url('/assets/fonts/raleway-500.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Raleway';font-style:normal;font-weight:600;src:url('/assets/fonts/raleway-600.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Raleway';font-style:normal;font-weight:700;src:url('/assets/fonts/raleway-700.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Raleway';font-style:normal;font-weight:800;src:url('/assets/fonts/raleway-800.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* PflichtteilsHero — Grundstil
   Farben und Maße folgen dem Canvas-Entwurf. Eine Schrift, Raleway.
   Aufbau: Tokens, Grundlagen, Layout, Kopf und Fuß, Bausteine, Seitentypen. */

:root{
  --cta:#4F46E5; --cta-dark:#4338CA; --cta-hover:#4036C7;
  --ink:#17171F; --ink-2:#585866; --ink-3:#8A8A99;
  --bg:#FFFFFF; --surface:#F7F7FB; --soft:#EEEDFD;
  --line:#E8E8F0; --line-soft:#CDC9F8;
  --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:22px; --r-2xl:26px;
  --wrap:1160px; --gut:24px;
  --font:'Raleway', Arial, Helvetica, sans-serif;
  --shadow-sm:0 8px 24px rgba(20,18,32,.05);
  --shadow-md:0 10px 30px rgba(20,18,32,.07);
  --shadow-lg:0 16px 40px rgba(20,18,32,.09);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-size:17px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--cta-dark)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid var(--cta); outline-offset:3px; border-radius:4px;
}
h1,h2,h3,h4{margin:0; font-weight:800; line-height:1.18; letter-spacing:-.4px; text-wrap:balance}
h1{font-size:clamp(32px,5.2vw,52px); line-height:1.08; letter-spacing:-1.3px}
h2{font-size:clamp(25px,3.4vw,30px); letter-spacing:-.6px}
h3{font-size:clamp(19px,2.4vw,22px); letter-spacing:-.3px}
p{margin:0}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* ---------- Layout ---------- */
.wrap{max-width:var(--wrap); margin:0 auto; padding-inline:var(--gut)}
.stack{display:flex; flex-direction:column}
.band{padding-block:clamp(44px,6vw,72px)}
.band--surface{background:var(--surface)}
.band--tight{padding-block:clamp(32px,4vw,48px)}
.skip{position:absolute; left:-9999px}
.skip:focus{left:16px; top:16px; z-index:100; background:#fff; padding:12px 18px; border-radius:var(--r-md); box-shadow:var(--shadow-md)}

/* ---------- Kopfzeile ---------- */
.hdr{position:sticky; top:0; z-index:50; background:var(--bg); border-bottom:1px solid var(--line)}
.hdr__in{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:76px}
.brand{display:inline-flex; align-items:center; gap:11px; text-decoration:none; flex:none}
.brand svg{flex:none}
.brand__word{font-size:21px; font-weight:800; letter-spacing:1px; color:var(--ink); line-height:1}
.brand__word em{font-style:normal; color:var(--cta)}
.nav{display:flex; align-items:center; gap:26px}
.nav a:not(.btn){color:var(--ink); text-decoration:none; font-weight:700; font-size:16px}
.nav a:not(.btn):hover{color:var(--cta-dark)}
.nav .btn{font-size:15px; padding:11px 20px}
.menu-btn{display:none; border:1px solid var(--line); background:#fff; border-radius:var(--r-md); padding:9px 12px; cursor:pointer}
.menu-btn svg{display:block}
@media (max-width:860px){
  .nav{display:none; position:absolute; left:0; right:0; top:100%; background:#fff; border-bottom:1px solid var(--line);
       flex-direction:column; align-items:stretch; gap:0; padding:8px var(--gut) 18px; box-shadow:var(--shadow-md)}
  .nav[data-open="true"]{display:flex}
  .nav a:not(.btn){padding:13px 2px; border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:12px; justify-content:center}
  .menu-btn{display:block}
}

/* ---------- Knöpfe ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--cta); color:#fff; text-decoration:none;
  font-weight:700; font-size:16px; padding:14px 24px; min-height:52px;
  border:2px solid var(--cta); border-radius:var(--r-md); cursor:pointer;
  transition:background .15s ease, border-color .15s ease;
}
.btn:hover{background:var(--cta-hover); border-color:var(--cta-hover)}
.btn--ghost{background:#fff; color:var(--cta-dark)}
.btn--ghost:hover{background:var(--soft); border-color:var(--cta)}
.btn--lg{font-size:17px; padding:16px 30px; min-height:58px}
.btn--block{width:100%}

/* ---------- Kleinteile ---------- */
.eyebrow{font-size:12px; font-weight:800; letter-spacing:1.4px; text-transform:uppercase; color:var(--cta-dark)}
.lead{font-size:clamp(17px,2vw,19px); line-height:1.7; color:var(--ink-2)}
.small{font-size:14px; line-height:1.6; color:var(--ink-2)}
.tiny{font-size:13px; line-height:1.55; color:var(--ink-3)}
.crumb{font-size:14px; font-weight:700; color:var(--ink-2); display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.crumb a{color:var(--ink-2); text-decoration:none}
.crumb a:hover{text-decoration:underline}
.crumb span[aria-current]{color:var(--cta-dark)}
.chip{display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px;
      border:1px solid var(--line); background:#fff; font-size:14px; font-weight:700; white-space:nowrap}
.checks{display:flex; flex-direction:column; gap:9px; margin:0; padding:0; list-style:none}
.checks li{display:flex; gap:10px; align-items:flex-start; font-size:16px; line-height:1.5; color:var(--ink-2)}
.checks svg{flex:none; margin-top:4px}
.trustrow{display:flex; flex-wrap:wrap; gap:14px 26px}
.trustrow span{display:inline-flex; align-items:center; gap:9px; font-size:15px; font-weight:700; color:var(--ink-2)}

/* ---------- Fließtext ---------- */
.prose{max-width:none}
.prose>*+*{margin-top:22px}
.prose h2{margin-top:44px}
.prose h3{margin-top:32px}
.prose p{font-size:18px; line-height:1.78; color:#2A2A36}
.prose ul,.prose ol{margin:0; padding-left:24px; display:flex; flex-direction:column; gap:10px}
.prose li{font-size:18px; line-height:1.7; color:#2A2A36}
.prose strong{font-weight:800; color:var(--ink)}
.prose a{color:var(--cta-dark); text-decoration:underline; text-underline-offset:3px}
.prose blockquote{margin:0; border-left:4px solid var(--cta); background:var(--soft);
  border-radius:0 var(--r-lg) var(--r-lg) 0; padding:20px 24px; font-size:17px; line-height:1.65}
.prose blockquote p{font-size:17px}
.tablewrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-lg)}
.prose table{border-collapse:collapse; width:100%; min-width:460px; font-size:16px}
.prose th,.prose td{text-align:left; padding:13px 20px; border-top:1px solid var(--line); vertical-align:top}
.prose thead th{background:var(--surface); border-top:0; font-size:14px; font-weight:800; color:var(--ink-2)}
.prose tbody td:last-child{font-variant-numeric:tabular-nums}

/* ---------- Artikelseite ---------- */
.artgrid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:72px; align-items:start}
@media (max-width:980px){.artgrid{grid-template-columns:1fr; gap:44px}}
.aside{display:flex; flex-direction:column; gap:26px; position:sticky; top:100px}
@media (max-width:980px){.aside{position:static}}
.meta{display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; font-size:15px; color:var(--ink-2)}
.meta b{color:var(--ink)}
.toc{border:1px solid var(--line); border-radius:var(--r-xl); padding:20px 22px; background:#fff; box-shadow:var(--shadow-sm)}
.toc h2{font-size:16px; margin-bottom:6px; letter-spacing:0}
.toc a{display:block; padding:9px 0; border-bottom:1px solid var(--line); font-size:15px; line-height:1.4;
       color:var(--ink); text-decoration:none; font-weight:600}
.toc a:last-child{border-bottom:0}
.toc a:hover{color:var(--cta-dark)}
.authorbox{display:flex; gap:16px; align-items:flex-start; border:1px solid var(--line);
  border-radius:var(--r-xl); padding:22px; background:var(--surface)}
.authorbox img,.authorbox .ph{width:64px; height:64px; border-radius:999px; flex:none; background:var(--line-soft)}

/* ---------- CTA-Boxen ---------- */
.cta{background:var(--soft); border-radius:var(--r-2xl); padding:clamp(26px,4vw,36px) clamp(22px,4vw,40px);
     display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center}
.cta__h{font-size:clamp(21px,3vw,26px); font-weight:800; line-height:1.22; letter-spacing:-.3px}
.cta__p{font-size:17px; line-height:1.6; color:var(--ink-2); max-width:62ch}
.cta .checks{align-items:flex-start; text-align:left}
.cta__btns{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; padding-top:4px}
/* Auf schmalen Schirmen untereinander und ueber die volle Breite: gleiche Kante,
   groessere Trefferflaeche fuer den Daumen. */
@media (max-width:640px){
  .cta__btns{flex-direction:column; align-items:stretch; gap:10px}
  .cta__btns .btn{width:100%}
}
.cta--inline{margin-block:36px}

/* ---------- Karten und Teaser ---------- */
.grid{display:grid; gap:24px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){.grid--3,.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}
.card{border:1px solid var(--line); border-radius:var(--r-xl); overflow:hidden; background:#fff;
      display:flex; flex-direction:column; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-sm)}
.card:hover{border-color:var(--line-soft)}
.card__img{aspect-ratio:16/9; background:var(--surface); display:flex; align-items:center;
           justify-content:center; color:var(--ink-3); font-size:12px; object-fit:cover; width:100%}
.card__body{padding:22px; display:flex; flex-direction:column; gap:7px; flex:1}
.card__kat{font-size:11px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--cta-dark)}
.card__t{font-size:19px; font-weight:800; line-height:1.3}
.card__p{font-size:15px; line-height:1.6; color:var(--ink-2)}
.card__m{font-size:13px; color:var(--ink-3); margin-top:auto; padding-top:8px}
.katnav{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
@media (max-width:860px){.katnav{grid-template-columns:repeat(2,minmax(0,1fr))}}
.katnav a{text-align:center; padding:14px 10px; border-radius:13px; border:1px solid var(--line);
          background:#fff; color:var(--ink); font-size:14px; font-weight:800; text-decoration:none}
.katnav a[aria-current]{border-color:var(--cta); background:var(--soft); color:var(--cta-dark)}
.katnav b{display:block; font-weight:400; font-size:12px; color:var(--ink-3); margin-top:3px}
.katnav a[aria-current] b{color:var(--cta-dark)}

/* ---------- Rechner ---------- */
.calc{background:#fff; border:1px solid var(--line); border-radius:var(--r-2xl); padding:clamp(22px,3vw,32px);
      display:flex; flex-direction:column; gap:18px; box-shadow:var(--shadow-md)}
.field{display:flex; flex-direction:column; gap:7px}
.field__l{font-size:15px; font-weight:800}
.field__h{font-size:13px; color:var(--ink-2); line-height:1.5}
.field input,.field select{
  height:56px; border:2px solid var(--line-soft); border-radius:var(--r-md); background:#fff;
  padding:0 16px; font:800 18px var(--font); color:var(--ink); width:100%;
  appearance:none; -webkit-appearance:none;
}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23585866' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 18px center; padding-right:46px}
.field input:focus,.field select:focus{border-color:var(--cta)}
.seg{display:flex; gap:8px; flex-wrap:wrap}
.seg button{flex:1 1 120px; min-height:52px; border-radius:12px; border:1px solid var(--line); background:#fff;
  font:800 15px var(--font); color:var(--ink-2); cursor:pointer; padding:8px 10px}
.seg button[aria-pressed="true"]{border:2px solid var(--cta); color:var(--cta-dark); background:#fff}
.result{border:1px solid var(--line); border-radius:var(--r-2xl); overflow:hidden; background:#fff}
.result__top{background:var(--soft); padding:28px; text-align:center; display:flex; flex-direction:column; gap:4px}
.result__num{font-size:clamp(34px,6vw,44px); font-weight:800; line-height:1.1; font-variant-numeric:tabular-nums}
.result__rows{padding:8px 28px 20px}
.result__row{display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid var(--line); font-size:16px}
.result__row span:last-child{font-weight:800; font-variant-numeric:tabular-nums}
.result__row--sum{border-top:2px solid var(--ink)}
.result__row--sum span{font-weight:800}
.result__foot{background:var(--surface); border-top:1px solid var(--line); padding:20px 28px;
              display:flex; flex-direction:column; gap:12px}
@media (max-width:560px){.result__rows,.result__foot,.result__top{padding-inline:20px}}

/* ---------- FAQ ---------- */
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none; cursor:pointer; padding:17px 0; display:flex; justify-content:space-between;
             gap:14px; font-size:17px; font-weight:800; line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--cta-dark); font-size:22px; line-height:1; flex:none}
.faq details[open] summary::after{content:"\2212"}
.faq p{padding-bottom:18px; font-size:17px; line-height:1.7; color:var(--ink-2)}

.panel{background:var(--surface); border-radius:var(--r-xl); padding:26px; display:flex; flex-direction:column; gap:12px}
.panel__h{font-size:19px; font-weight:800}

/* Personenkarten auf Über uns */
.person{display:flex; flex-direction:column; gap:14px}
.person__kopf{display:flex; align-items:center; gap:16px}
.ph--rund{width:88px; height:88px; border-radius:999px; background:var(--line-soft); flex:none; object-fit:cover}
@media (max-width:520px){.ph--rund{width:72px; height:72px}}

/* Ueber uns: Held und Ortsblock folgen dem Raster der Vorlage. */
.uu__held{display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px 56px; align-items:center}
.uu__ort{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:44px; align-items:start}
@media (max-width:900px){.uu__held,.uu__ort{grid-template-columns:1fr}}
.foto--held{display:block; width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:22px}
@media (max-width:900px){.foto--held{aspect-ratio:4/3; border-radius:18px}}
.ort__bilder{display:flex; flex-direction:column; gap:14px}
.ort__paar{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.foto--gross{display:block; width:100%; border-radius:20px}
.foto--klein{display:block; width:100%; border-radius:16px}
.ort__daten{display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--line-soft);
  padding-top:18px; font-size:16px; line-height:1.7; color:var(--ink-2)}
.ort__daten b{color:var(--ink)}
.person b{display:block; font-size:19px; line-height:1.3}
.person__r{display:block; margin-top:2px; font-size:14px; font-weight:700; color:var(--cta-dark)}
.person p{margin-top:9px; font-size:15px; line-height:1.65; color:var(--ink-2)}
.arrowlist{display:flex; flex-direction:column; gap:10px}
.arrowlist div{display:flex; gap:10px; align-items:flex-start; font-size:16px; line-height:1.65}
.arrowlist b{font-weight:800}
.arrowlist span[aria-hidden]{color:var(--cta-dark); font-weight:800; flex:none}

/* Nur fuer Screenreader und Suchmaschinen, optisch nicht vorhanden */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
         clip:rect(0,0,0,0); white-space:nowrap; border:0}

/* Funnelseite: der Flow bringt eigene Ueberschrift, Raender und Weissflaeche mit.
   Deshalb keine Baender, keine Innenabstaende, auf dem Handy randlos. */
.funnel{background:#fff}
.funnel__in{max-width:860px; margin:0 auto; padding:40px 0}
@media (min-width:720px){.funnel__in{padding:40px 24px 56px}}
/* Auf der Funnelseite soll der Fuss direkt anschliessen, nicht nach einer Leerflaeche */
main:has(.funnel) + .ftr{margin-top:0}
.ftr--schlank{padding-block:18px; font-size:13px}
.ftr--schlank .ftr__legal{justify-content:center; gap:10px 18px; font-size:13px; line-height:1.5}

/* ---------- Fußzeile ---------- */
.ftr{background:var(--surface); border-top:1px solid var(--line); padding-block:clamp(36px,4.5vw,48px) 26px;
     font-size:15px; line-height:1.45; color:var(--ink-2); margin-top:clamp(48px,7vw,80px)}
.ftr__cols{display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:32px}
@media (max-width:980px){.ftr__cols{grid-template-columns:repeat(2,1fr); gap:28px}}
@media (max-width:560px){.ftr__cols{grid-template-columns:1fr; gap:24px}}
.ftr__col{display:flex; flex-direction:column; gap:7px}
.ftr__col b{color:var(--ink); margin-bottom:3px}
.ftr__col .small{line-height:1.5}
.ftr a{color:var(--ink-2); text-decoration:none}
.ftr a:hover{color:var(--cta-dark); text-decoration:underline}
.ftr__bot{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
          border-top:1px solid var(--line); margin-top:26px; padding-top:18px; font-size:14px}
.ftr__legal{display:flex; gap:22px; flex-wrap:wrap}

/* ---------- Startseite ---------- */
.hero{background:var(--surface); border-bottom:1px solid var(--line)}
.hero__in{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;
          padding-block:clamp(40px,6vw,72px)}
@media (max-width:980px){.hero__in{grid-template-columns:1fr; gap:36px}}
.hero__card{background:#fff; border-radius:var(--r-2xl); padding:28px; box-shadow:var(--shadow-lg);
            display:flex; flex-direction:column; gap:12px}
/* Auswahlkarte rechts im Hero */
.pick{display:flex; justify-content:space-between; align-items:center; gap:14px; padding:15px 17px;
      border:1px solid var(--line); border-radius:var(--r-lg); background:#fff;
      text-decoration:none; color:var(--ink)}
.pick:hover{border-color:var(--cta); background:var(--soft)}
.pick > span{display:flex; flex-direction:column; gap:2px}
.pick b{font-size:16px; font-weight:800; line-height:1.35}
.pick b + span{font-size:14px; line-height:1.5; color:var(--ink-2)}
.pick svg{flex:none}

/* Faktenkarten */
.fact{background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:26px;
      box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:12px}
.fact__k{font-size:12px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--cta-dark)}
.fact__v{font-size:26px; font-weight:800; line-height:1.15; letter-spacing:-.4px}
.fact p{font-size:15px; line-height:1.6; color:var(--ink-2); flex-grow:1; margin:0}
.fact a{font-size:15px; font-weight:800; color:var(--cta-dark); text-decoration:none}
.fact a:hover{text-decoration:underline}

/* Rechner-Teaser mit Beispielkarte */
.teaser{display:grid; grid-template-columns:1fr .85fr; gap:56px; align-items:center}
@media (max-width:980px){.teaser{grid-template-columns:1fr; gap:32px}}
.bar__top{display:flex; justify-content:space-between; align-items:center; gap:12px;
          font-size:14px; font-weight:700; color:var(--ink-2)}
.bar{height:9px; border-radius:5px; background:var(--line); overflow:hidden}
.bar > i{display:block; height:100%; border-radius:5px; background:var(--cta)}
.badge{font-size:11px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--cta-dark);
       background:var(--soft); border:1px solid var(--line-soft); border-radius:999px; padding:5px 11px}

.tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
@media (max-width:980px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.tiles{grid-template-columns:1fr}}
.tile{border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; background:#fff;
      text-decoration:none; color:var(--ink); display:flex; flex-direction:column; gap:7px}
.tile:hover{border-color:var(--cta); background:var(--soft)}
.tile b{font-size:18px; line-height:1.3}
.tile span{font-size:15px; line-height:1.6; color:var(--ink-2)}
/* Kachel, die erkennbar verlinkt: Pfeil rechts neben der Überschrift */
.tile--link b{display:flex; align-items:flex-start; justify-content:space-between; gap:10px}
.tile--link svg{flex:none; margin-top:4px; transition:transform .15s ease}
.tile--link:hover svg{transform:translateX(3px)}
.tile--link .tiny{margin-top:auto; padding-top:4px; font-weight:700}

/* Ablauf in Schritten */
.steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 32px}
@media (max-width:860px){.steps{grid-template-columns:1fr; gap:22px}}
.step{display:grid; grid-template-columns:42px minmax(0,1fr); gap:16px; align-items:start}
.step__n{width:42px; height:42px; border-radius:999px; background:var(--soft); color:var(--cta-dark);
         display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:800;
         font-variant-numeric:tabular-nums}
.step b{display:block; font-size:18px; line-height:1.3; padding-top:9px}
.step span{display:block; margin-top:6px; font-size:15px; line-height:1.6; color:var(--ink-2)}

/* ---------- Rechtstext ---------- */
.legal{display:grid; grid-template-columns:280px minmax(0,1fr); gap:64px; align-items:start}
@media (max-width:980px){.legal{grid-template-columns:1fr; gap:32px}}
.legal .prose p{font-size:17px}

/* ---------- Fehlerseite ---------- */
.err{text-align:center; display:flex; flex-direction:column; align-items:center; gap:16px;
     padding-block:clamp(48px,8vw,88px)}
.err__code{font-size:clamp(64px,12vw,120px); font-weight:800; line-height:1; color:var(--line-soft); letter-spacing:-4px}

/* CTA-Boxen innerhalb des Fließtexts erben keine Link-Unterstreichung */
.prose .btn{text-decoration:none}
.prose .cta__p,.prose .checks li{margin:0}
.prose .cta>*+*{margin-top:0}

/* Startseite: "Das Wichtigste" und "Themen" offen, ohne Boxen.
   Entschieden am 13. Oktober, Variante A aus dem Canvas. Trennlinien statt Rahmen. */
.fakten{display:grid; grid-template-columns:repeat(4,minmax(0,1fr))}
.fakten .fact{background:none; border:0; border-radius:0; box-shadow:none; padding:4px 28px;
      border-left:1px solid var(--line)}
.fakten .fact:first-child{border-left:0; padding-left:0}
.fakten .fact:last-child{padding-right:0}
@media (max-width:980px){
  .fakten{grid-template-columns:repeat(2,minmax(0,1fr)); border-bottom:1px solid var(--line)}
  .fakten .fact{border-left:0; border-top:1px solid var(--line); padding:22px 0 22px 24px}
  .fakten .fact:nth-child(odd){padding:22px 24px 22px 0; border-right:1px solid var(--line)}
}
@media (max-width:640px){
  .fakten{grid-template-columns:1fr}
  .fakten .fact,.fakten .fact:nth-child(odd){padding:20px 0; border-right:0}
}
.themen{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:32px;
      border-bottom:1px solid var(--line)}
.themen .tile{border:0; border-top:1px solid var(--line); border-radius:0; background:none; padding:20px 0}
.themen .tile:hover{background:none; border-color:var(--line)}
.themen .tile:hover b{color:var(--cta-dark)}
@media (max-width:980px){.themen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.themen{grid-template-columns:1fr} .themen .tile{padding:18px 0}}

/* Buttons im Fliesstext: .prose a darf die Buttonfarbe nicht ueberschreiben */
.prose a.btn{color:#fff; text-decoration:none}
.prose a.btn--ghost{color:var(--cta-dark)}

/* Artikelseite nach Canvas-Vorlage T1 (13. Oktober) */
.artikel{padding-block:32px 72px}
.artgrid--artikel{grid-template-columns:minmax(0,1fr) 340px}
.aside--artikel{position:static; gap:20px}
.artikel__haupt{min-width:0; display:flex; flex-direction:column}
.crumb--leise{font-size:14px; font-weight:500; color:var(--ink-3); margin-bottom:20px}
.crumb--leise a{color:var(--ink-3)}
.crumb--leise span[aria-current]{color:var(--ink-3)}
.artikel__kat{margin:0 0 12px}
.artikel__h1{font-size:clamp(30px,4.2vw,46px); line-height:1.12; letter-spacing:-1.1px; margin:0 0 18px}
.artikel__lead{font-size:clamp(17px,2vw,20px); line-height:1.6; color:var(--ink-2); margin:0 0 22px}
.byline{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; font-size:14px; color:var(--ink-3); margin-bottom:26px}
.byline>span:nth-child(2){color:var(--ink-2)}
.byline a{color:var(--cta-dark); font-weight:700; text-decoration:none}
.byline a:hover{text-decoration:underline}
.byline__ini{width:34px; height:34px; border-radius:999px; background:var(--soft); color:var(--cta-dark);
      display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:800}
.pruefleiste{display:flex; flex-wrap:wrap; gap:12px 18px; align-items:center; justify-content:space-between;
      padding:16px 22px; border:1px solid var(--line); border-left:4px solid var(--cta); border-radius:var(--r-md);
      background:var(--surface); margin-bottom:28px}
.pruefleiste span{flex:1 1 320px; font-size:16px; line-height:1.5}
.pruefleiste strong{font-weight:800}
.pruefleiste a{font-size:16px; font-weight:800; color:var(--cta-dark); text-decoration:none; white-space:nowrap}
.pruefleiste a:hover{text-decoration:underline}
.artikel__bild{width:100%; height:auto; border-radius:var(--r-xl); margin-bottom:32px}
.inhalt{border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:22px 26px; margin-bottom:34px}
.inhalt__k{font-size:12px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--ink-3); margin:0 0 10px}
.inhalt ol{margin:0; padding-left:20px; font-size:16px; line-height:1.9}
.inhalt a{color:var(--ink); text-underline-offset:3px}
.inhalt a:hover{color:var(--cta-dark)}
.prose h2{scroll-margin-top:100px}
/* Bausteine im Fliesstext */
.prose .ctazeile{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:24px 0;
      display:flex; flex-direction:column; gap:12px; margin-block:32px}
.prose .ctazeile p{margin:0; font-size:18px; line-height:1.7}
.prose .ctazeile a{font-size:17px; font-weight:800; color:var(--cta-dark); text-decoration:none}
.prose .ctazeile a:hover{text-decoration:underline}
.prose .hinweis{display:flex; gap:14px; padding:18px 22px; border-radius:var(--r-md); background:var(--surface);
      border:1px solid var(--line)}
.prose .hinweis p{margin:0; font-size:17px; line-height:1.7}
.hinweis__punkt{flex:none; width:9px; height:9px; border-radius:999px; background:var(--cta); margin-top:10px}
/* Abschluss */
.ctablau{background:var(--cta); border-radius:var(--r-xl); padding:34px; display:flex; flex-direction:column;
      gap:12px; margin-top:44px}
.ctablau__h{font-size:24px; font-weight:800; color:#fff; line-height:1.25; margin:0}
.ctablau p:not(.ctablau__h){margin:0; font-size:17px; line-height:1.65; color:rgba(255,255,255,.9)}
.ctablau__btn{align-self:flex-start; margin-top:6px; background:#fff; border-color:#fff; color:var(--cta-dark)}
.ctablau__btn:hover{background:var(--soft); border-color:var(--soft); color:var(--cta-dark)}
.weiter{margin-top:44px; display:flex; flex-direction:column; gap:20px}
.weiter__liste{display:flex; flex-direction:column; gap:16px}
.wkarte{display:grid; grid-template-columns:220px minmax(0,1fr); border:1px solid var(--line); border-radius:18px;
      overflow:hidden; text-decoration:none; color:var(--ink); box-shadow:var(--shadow-sm); background:#fff}
.wkarte--ohne{grid-template-columns:1fr}
.wkarte:hover{border-color:var(--line-soft)}
.wkarte img{width:100%; height:100%; object-fit:cover; min-height:150px}
.wkarte__body{padding:22px; display:flex; flex-direction:column; gap:6px}
.wkarte__t{font-size:20px; font-weight:800; line-height:1.3}
.wkarte__p{font-size:16px; line-height:1.6; color:var(--ink-2)}
@media (max-width:640px){.wkarte{grid-template-columns:1fr} .wkarte img{aspect-ratio:16/9; min-height:0}}
/* Seitenspalte */
.skarte{background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:26px;
      box-shadow:var(--shadow-md); display:flex; flex-direction:column; gap:14px}
.skarte .badge{align-self:flex-start}
.skarte__h{font-size:21px; font-weight:800; line-height:1.25; margin:0}
.skarte__p{font-size:15px; line-height:1.6; color:var(--ink-2); margin:0}
.skarte .checks li{font-size:15px; font-weight:700}
.skarte__fuss{text-align:center; font-size:13px; color:var(--ink-3)}
.skarte--soft{background:var(--soft); border-color:var(--line-soft); box-shadow:none; padding:24px}
.skarte--soft .skarte__h{font-size:19px}
.badge--weiss{background:#fff}
.skarte__rechnung{background:#fff; border:1px solid var(--line-soft); border-radius:var(--r-md); padding:16px;
      display:flex; flex-direction:column; gap:12px}
.skarte__rechnung .bar__top{font-size:13px; font-weight:700; color:var(--ink-2)}
.skarte__rechnung .bar{height:8px}
.skarte__wert{border-top:1px solid var(--line); padding-top:12px; display:flex; flex-direction:column; gap:2px}
.skarte__wert span:last-child{font-size:30px; font-weight:800; color:var(--cta-dark); letter-spacing:-.7px}
.skarte--liste{gap:4px; padding:24px; box-shadow:none}
.skarte--liste .skarte__h{font-size:19px; margin-bottom:8px}
.skarte--liste a{font-size:15px; color:var(--ink); text-decoration:none; padding:9px 0; border-bottom:1px solid var(--line); line-height:1.4}
.skarte--liste a:last-child{border-bottom:0}
.skarte--liste a:hover{color:var(--cta-dark)}
@media (max-width:980px){.artgrid--artikel{grid-template-columns:1fr; gap:40px}}
.skarte__rechnung .bar__top span:last-child{white-space:nowrap}
.artikel__h1{hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word}
@media (max-width:640px){.crumb--leise span[aria-current]{display:none}}
@media (max-width:640px){.crumb--leise span[aria-hidden="true"]:nth-last-child(2){display:none}}
/* Seitenspalte im Artikel klebt; den Abstand nach oben setzt ein kleines Skript in der Artikelseite */
.aside--artikel{position:sticky; top:100px; align-self:start}
@media (max-width:980px){.aside--artikel{position:static}}
/* Header-Button schlanker (13. Oktober): 42 px statt 52 px, wie Vorlage T1 */
.nav .btn{min-height:42px; padding:8px 18px; font-size:15px; border-radius:12px}
@media (max-width:860px){.nav .btn{min-height:50px}}
/* Artikel fuer Erben: Kennzeichnung in der CTA-Zeile */
.ctazeile__fuer{display:inline-block;margin-right:8px;padding:2px 9px;border-radius:999px;background:#EEEDFD;color:#4338CA;font-size:12px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;vertical-align:2px}
/* Ueber uns nach Vorlage T7 */
.uu-signatur{align-self:flex-end; display:flex; flex-direction:column; gap:2px; text-align:right; padding-right:16px; border-right:3px solid var(--cta); margin-top:6px}
.uu-signatur b{font-size:16px; color:var(--ink)} .uu-signatur span{font-size:14px; color:var(--ink-2)}
.uu-held .foto--held{aspect-ratio:auto; height:460px; object-fit:cover; object-position:center 40%}
.uu-fakten{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; border-top:1px solid var(--line); padding-top:28px; margin-top:40px}
.uu-fakt{display:flex; gap:10px; align-items:flex-start} .uu-fakt svg{margin-top:3px; flex:none}
.uu-fakt b{display:block; font-size:16px} .uu-fakt span span{display:block; font-size:14px; line-height:1.5; color:var(--ink-2)}
.uu-zwei{display:grid; grid-template-columns:340px minmax(0,1fr); gap:72px; align-items:start}
.uu-zwei__kopf h2{margin:0} .uu-zwei__sub{margin-top:12px; font-size:16px; line-height:1.75; color:var(--ink-2)}
.uu-zwei__body{display:flex; flex-direction:column; gap:16px; max-width:760px}
.uu-zwei__body > p{margin:0; font-size:17px; line-height:1.8; color:#212130}
.uu-zwei__body > p.small{font-size:15px; color:var(--ink-2)}
.band--tight-top{padding-top:0}
.uu-ablauf{border-bottom:1px solid var(--line)}
.uu-schritt{display:grid; grid-template-columns:72px 300px minmax(0,1fr); gap:24px; align-items:baseline; padding:26px 0; border-top:1px solid var(--line)}
.uu-schritt__n{font-size:32px; font-weight:800; color:var(--cta)} .uu-schritt__t{font-size:22px; font-weight:800}
.uu-schritt__p{font-size:17px; line-height:1.7; color:var(--ink-2)}
.uu-kriterien{display:flex; flex-direction:column; max-width:560px}
.uu-krit{display:flex; gap:9px; align-items:center; padding:14px 0; border-top:1px solid var(--line); font-size:16px; font-weight:700; color:var(--ink-2)}
.uu-krit svg{flex:none}
.uu-ohne-unten{padding-bottom:28px} .uu-ohne-oben{padding-top:28px}
.uu-menschen{gap:48px}
.uu-teamliste{display:grid; grid-template-columns:1fr 1fr; gap:0 48px}
.uu-team{display:flex; flex-direction:column; gap:6px; padding:22px 0; border-top:1px solid var(--line)}
.uu-team b{font-size:19px} .uu-team__r{font-size:13px; font-weight:800; color:var(--cta-dark); letter-spacing:.4px; text-transform:uppercase}
.uu-team > span:not(.uu-team__r){font-size:16px; line-height:1.7; color:var(--ink-2)}
.uu-li{display:inline-flex; align-items:center; gap:6px; margin-top:6px; font-size:14px; font-weight:700; color:var(--cta-dark); text-decoration:none}
.uu-li:hover{text-decoration:underline} .uu-team .uu-li{margin-top:2px}
.uu-zwei .uu__ort{grid-template-columns:1fr 1fr; gap:40px}
@media (max-width:980px){
  .uu-zwei{grid-template-columns:1fr; gap:20px}
  .uu-fakten{grid-template-columns:1fr 1fr; gap:20px}
  .uu-schritt{grid-template-columns:48px minmax(0,1fr); gap:6px 16px}
  .uu-schritt__n{font-size:24px; grid-row:span 2} .uu-schritt__t{font-size:19px}
  .uu-teamliste,.uu-zwei .uu__ort{grid-template-columns:1fr}
  .uu-held .foto--held{height:auto; aspect-ratio:4/3}
}
@media (max-width:520px){.uu-fakten{grid-template-columns:1fr}}
.byline__foto{width:34px; height:34px; border-radius:999px; object-fit:cover; flex:none}
.autor__kopf{display:grid; grid-template-columns:180px minmax(0,1fr); gap:40px; align-items:start}
.autor__foto{width:180px; height:180px; border-radius:999px; object-fit:cover}
@media (max-width:700px){.autor__kopf{grid-template-columns:1fr; gap:20px}.autor__foto{width:120px; height:120px}}

/* Autoren: Platzhalter ohne Foto, Uebersicht */
.autor__ini{display:inline-flex; align-items:center; justify-content:center; flex:none; border-radius:50%;
  background:var(--brand-soft, #EEF0FF); color:#4338CA; font-weight:800; letter-spacing:.02em}
.autorkarten{display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:24px}
.autorkarte{display:flex; gap:20px; align-items:flex-start; padding:26px; border:1px solid var(--line);
  border-radius:16px; background:#fff; color:var(--ink); text-decoration:none; transition:box-shadow .15s}
.autorkarte:hover{box-shadow:0 8px 24px rgba(23,23,31,.08)}
.autorkarte__foto{width:96px; height:96px; border-radius:50%; object-fit:cover; flex:none}
.autorkarte b{font-size:20px; line-height:1.3}
.autorkarte__r{font-weight:700; color:#4338CA; font-size:15px}
.autorkarte__a{font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2)}
@media (max-width:560px){.autorkarte{flex-direction:column; padding:20px}}
/* Ueber uns: Fotos oben buendig, auch wenn die Rolle zweizeilig ist */
.person__kopf{align-items:flex-start}
/* LinkedIn als kleines Badge direkt hinter dem Namen */
.uu-name{display:inline-flex !important; align-items:center; gap:8px; flex-wrap:wrap}
.uu-name > a:not(.uu-li){color:inherit; text-decoration:none} .uu-name > a:not(.uu-li):hover{text-decoration:underline}
.uu-li{display:inline-flex; margin:0 !important; line-height:0; border-radius:4px}
.uu-li svg{display:block} .uu-li:hover{opacity:.85; text-decoration:none}
/* Heyflow scrollt per scrollIntoView an den oberen Rand und kennt keinen Abstand.
   Der Abstand haelt die Frage unter dem klebenden Header (77 px) sichtbar. */
html{scroll-padding-top:96px}
/* Funnelseite: Telefon statt Menue, nur auf dem Desktop */
.hdr-tel{display:inline-flex; align-items:center; gap:10px; color:#4338CA; text-decoration:none}
.hdr-tel svg{flex:none}
.hdr-tel__t{display:flex; flex-direction:column; line-height:1.15}
.hdr-tel__t small{font-size:12px; font-weight:600; color:var(--ink-2)}
.hdr-tel__t b{font-size:18px; font-weight:800; color:var(--ink)}
@media (max-width:560px){.hdr-tel{display:none}}

/* hidden-Attribut gewinnt gegen display:flex/grid (Rechner-Felder) */
[hidden]{display:none !important}

/* Rechner: Umschalter Berechtigter / Erbe */
.seg--seite button{font-weight:800; min-height:56px}
.seg--seite button[aria-pressed="true"]{background:var(--cta); color:#fff; border-color:var(--cta)}