/* ═══════════════════════════════════════════════════════════════
   animallow — Mobil-Ebene („App-Gefühl")
   Wird nur bis 760 px geladen (media-Attribut am <link>), immer NACH
   den Seiten-Styles. Gleicher Inhalt wie am Desktop, nur anders
   präsentiert: Glas-Kopfleiste, Leisten im Daumenbereich, gruppierte
   Listen, Karten zum Wischen, Tipp-Feedback, Dunkelmodus.
   .app …   = Startseite/Check (index.html)
   .guide … = Ratgeber-Seiten
   Desktop bleibt unberührt.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --gut:16px;
  --hdr-h:52px;
  --bar-h:58px;
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  --kb:0px;                               /* Tastaturhöhe (setzt app.js) */
  --app-bg:#F4EEE7;                       /* iOS „grouped background", warm */
  --cell:#FFFFFF;
  --sep:rgba(33,30,26,.11);
  --press:rgba(33,30,26,.06);
  --glass:rgba(251,248,244,.8);
  --seg-bg:rgba(33,30,26,.075);
  --seg-thumb:#FFFFFF;
  --r-cell:16px;
  --spring:cubic-bezier(.3,1.25,.5,1);
  --out:cubic-bezier(.2,.8,.2,1);
  --btn-bg:var(--mallow);
  --btn-ink:#FFFFFF;
  --chev:#B5ADA2;
  --tile-1:#8A4F6B; --tile-2:#C9853A; --tile-3:#4E8D6E; --tile-4:#56627E;
  /* Kontrast AA: Hilfstext etwas dunkler als am Desktop */
  --ink-3:#73656B;
  --subtle:#73656B;
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --ink:#F4ECEF; --ink-2:#CBBEC4; --ink-3:#A3959B;
    --paper:#120E10; --paper-2:#221B1F; --paper-card:#1D171A; --aubergine:#2A1522;
    --line:rgba(242,235,226,.11); --line-strong:rgba(242,235,226,.22);
    --mallow:#DB7FAB; --mallow-deep:#F2B9D3; --mallow-soft:rgba(219,127,171,.17); --mallow-tint:rgba(219,127,171,.16);
    --honey:#F3AE4C; --honey-soft:rgba(243,174,76,.14);
    --good:#5CC292; --good-soft:rgba(92,194,146,.14);
    --warn:#E4A24C; --warn-soft:rgba(228,162,76,.14);
    --sh-soft:none; --sh-card:0 18px 40px -20px rgba(0,0,0,.8); --sh-sel:none;
    /* Ratgeber-Tokens */
    --surface:#1D171A; --muted:#CBBEC4; --subtle:#A3959B; --dark-bg:#1D171A;
    --sh-xs:none; --sh-md:none;
    /* App */
    --app-bg:#0C090B; --cell:#1D171A;
    --sep:rgba(242,235,226,.12); --press:rgba(242,235,226,.08);
    --glass:rgba(18,14,16,.76);
    --seg-bg:rgba(244,236,239,.1); --seg-thumb:#3B3036;
    --btn-bg:#B83F7A; --btn-ink:#FFFFFF;
    --chev:#6E665E;
    --tile-1:#9A5A79; --tile-2:#B8792F; --tile-3:#3F8462; --tile-4:#56627E;
  }
}

/* ─── Grundlagen ─── */
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr-h) + var(--safe-t) + 12px);}
body{background:var(--app-bg);-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none;}
body::before{opacity:.55;}
@media (prefers-color-scheme:dark){ body::before{display:none;} }
a,button,summary,label,input,select{-webkit-tap-highlight-color:transparent;}
:focus-visible{outline:2.5px solid var(--mallow);outline-offset:2px;border-radius:6px;}
button{touch-action:manipulation;}

/* ═══════════════════════ STARTSEITE + CHECK ═══════════════════════ */

.app{min-height:100dvh;}

/* ─── Kopfleiste: Glas, 52 px ─── */
.app .top{
  height:calc(var(--hdr-h) + var(--safe-t));
  padding:var(--safe-t) var(--gut) 0;gap:10px;
  background:var(--glass);
  backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);
  border-bottom:.5px solid transparent;box-shadow:none;
  transition:border-color .3s,background-color .3s;
  view-transition-name:m-top;
}
.app .top.scrolled{background:var(--glass);border-bottom-color:var(--sep);box-shadow:none;}
.app .brand{gap:9px;min-height:44px;}
.app .brand-mark{width:30px;height:30px;border-radius:9px;}
.app .brand-mark svg{width:18px;height:18px;}
.app .brand-mark svg circle{fill:#FAF6F0;}
.app .brand-word{font-size:19px;}
.app .brand-kicker{display:none;}
.app .brand:active .brand-mark{transform:scale(.92);}
.app .top-cta{display:none;}

/* Im Check: Zurück-Chevron links, Fortschritt mittig */
.app .top.is-funnel .brand{display:none;}
.app .top:not(.is-funnel) .back-btn{display:none;}
.app .back-btn{
  order:-1;flex:none;width:44px;height:44px;padding:0;margin-left:-10px;
  border:0;border-radius:50%;justify-content:center;gap:0;
  background:transparent;color:var(--mallow);font-size:0;
  transition:background-color .18s,transform .18s var(--out);
}
.app .back-btn svg{width:22px;height:22px;}
.app .back-btn:hover{background:transparent;color:var(--mallow);border:0;}
.app .back-btn:active{background:var(--press);transform:scale(.9);}
.app .prog-wrap{max-width:none;gap:12px;}
.app .prog-track{height:6px;background:var(--seg-bg);}
.app .prog-fill{transition:width .5s var(--spring);}
.app .prog-lbl{min-width:0;font-size:13px;font-weight:600;color:var(--ink-2);}

/* ─── Inhalt ─── */
.app main{display:block;}
.app .wrap{padding:22px var(--gut) calc(96px + var(--safe-b));}
.app .wrap--wide{padding:0 0 8px;}
.app .eyebrow{font-size:12px;letter-spacing:.13em;font-weight:600;color:var(--mallow);}
.app h2.q{font-size:30px;line-height:1.1;letter-spacing:-.015em;margin-top:8px;}
.app .q-hint{margin-top:12px;font-size:16px;line-height:1.5;}
.app .q-body{margin-top:24px;}

/* Bildschirm-Wechsel ohne View Transitions (Fallback) */
.app .screen{animation:m-in .42s var(--out) both;}
html[data-dir="back"] .app .screen{animation-name:m-in-back;}
html.m-vt .app .screen{animation:none;}
@keyframes m-in{from{opacity:0;transform:translateX(26px);}to{opacity:1;transform:none;}}
@keyframes m-in-back{from{opacity:0;transform:translateX(-26px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:m-vt-out .3s var(--out) both;}
  ::view-transition-new(root){animation:m-vt-in .42s var(--out) both;}
  html[data-dir="back"]::view-transition-old(root){animation-name:m-vt-out-back;}
  html[data-dir="back"]::view-transition-new(root){animation-name:m-vt-in-back;}
  ::view-transition-group(m-top),::view-transition-group(m-bar),::view-transition-group(m-tabs){animation-duration:.3s;}
}
@keyframes m-vt-in{from{opacity:0;transform:translateX(34%);}to{opacity:1;transform:none;}}
@keyframes m-vt-out{to{opacity:0;transform:translateX(-14%);}}
@keyframes m-vt-in-back{from{opacity:0;transform:translateX(-14%);}to{opacity:1;transform:none;}}
@keyframes m-vt-out-back{to{opacity:0;transform:translateX(34%);}}

/* ─── Antwort-Karten ─── */
.app .opts{gap:10px;}
.app .opt{
  min-height:66px;gap:14px;padding:15px 16px 15px 18px;border-radius:18px;
  border:1.5px solid transparent;background:var(--cell);
  box-shadow:0 1px 2px rgba(33,30,26,.05);
  transition:transform .2s var(--out),background-color .2s,border-color .2s;
}
.app .opt:hover{transform:none;border-color:transparent;}
.app .opt.sel,.app .opt.sel:hover{border-color:var(--mallow);background:var(--mallow-soft);box-shadow:none;}
.app .opt:active{transform:scale(.97);}
.app .opt .lbl{font-size:17px;letter-spacing:-.01em;}
.app .opt .desc{margin-top:3px;font-size:14px;line-height:1.4;}
.app .opt .check{width:26px;height:26px;border-width:2px;}
.app .opt.sel .check svg{transform:none;}
.app .opt.sel .check{animation:m-pop .35s var(--spring);}
@keyframes m-pop{0%{transform:scale(.6);}100%{transform:scale(1);}}
.app .opt[data-val="hund"]::before,.app .opt[data-val="katze"]::before,.app .opt[data-val="pferd"]::before,.app .opt[data-val="anderes"]::before{width:52px;height:52px;border-radius:14px;}

/* ─── Felder (17 px = kein Safari-Zoom) ─── */
.app input[type=text],.app input[type=email],.app input[type=tel],.app select{
  height:54px;padding:0 16px;font-size:17px;border-radius:14px;
  border:1px solid var(--line);background:var(--cell);color:var(--ink);
}
.app select{
  -webkit-appearance:none;appearance:none;padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23948B7E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:14px;
}
.app input:focus,.app select:focus{border-color:var(--mallow);box-shadow:0 0 0 4px var(--mallow-tint);}
.app .chips-lbl{font-size:13px;font-weight:600;margin-top:22px;color:var(--ink-2);}
.app .chips{gap:8px;margin-top:10px;}
.app .chip{min-height:44px;padding:0 16px;font-size:15px;font-weight:500;border-color:transparent;background:var(--cell);color:var(--ink);transition:transform .18s var(--out),background-color .18s;}
.app .chip:active{transform:scale(.95);}
.app .chip.sel{border-color:var(--mallow);background:var(--mallow-soft);color:var(--mallow-deep);}
.app .recog{border-radius:14px;font-size:15px;padding:13px 15px;border-color:transparent;animation:m-drop .35s var(--out);}
@keyframes m-drop{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
.app .sizebox{border:0;background:var(--cell);border-radius:var(--r-cell);}
.app .sizebox .t{font-size:15px;}
.app .size-opt{min-height:62px;border-radius:12px;background:var(--paper-2);border-color:transparent;transition:transform .18s var(--out);}
.app .size-opt:active{transform:scale(.95);}
.app .size-opt.sel{background:var(--mallow-soft);border-color:var(--mallow);}
.app .size-opt .sl{font-size:16px;}
.app .size-opt .sk{font-size:13px;}

/* Der Weiter-Knopf wandert in die Leiste unten (app.js) */
.js-app .app .q-body .cta-row{display:none;}

/* ─── Buttons ─── */
.app .cta{
  justify-content:center;min-height:54px;padding:0 24px;font-size:17px;
  background:var(--btn-bg);color:var(--btn-ink);
  transition:transform .18s var(--out),opacity .2s,background-color .2s;
}
.app .cta:hover{background:var(--btn-bg);transform:none;}
.app .cta:active{transform:scale(.96);}
.app .cta .arrow{background:rgba(128,128,128,.22);}
.app .linklike{min-height:44px;padding:0 10px;font-size:14px;}

/* ─── Leiste unten: Check (Zurück + Weiter) / Auswertung (CTA + Anruf) ─── */
.m-bar{display:none;}
.js-app .m-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  display:flex;align-items:center;gap:10px;
  padding:10px var(--gut) calc(10px + var(--safe-b));
  background:var(--glass);
  backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);
  border-top:.5px solid var(--sep);
  transform:translateY(calc(-1 * var(--kb)));
  transition:transform .25s var(--out),opacity .25s,visibility .25s;
  view-transition-name:m-bar;
}
html.m-kb .m-bar{padding-bottom:10px;}
.m-bar[hidden],.m-bar.away{opacity:0;visibility:hidden;pointer-events:none;}
.m-bar.away{transform:translateY(110%);}
.m-bar-main{
  flex:1;min-width:0;height:52px;padding:0 18px;border:0;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--btn-bg);color:var(--btn-ink);font:inherit;font-size:17px;font-weight:600;letter-spacing:-.01em;
  cursor:pointer;transition:transform .18s var(--out),opacity .2s,background-color .2s;
}
.m-bar-main:active{transform:scale(.97);}
.m-bar-main:disabled{opacity:.32;}
.m-bar-main:disabled:active{transform:none;}
.m-bar-main svg{width:16px;height:16px;flex:none;}
.m-bar-round{
  flex:none;width:52px;height:52px;border-radius:50%;border:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--cell);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line);
  cursor:pointer;transition:transform .18s var(--out),background-color .18s;
}
.m-bar-round:active{transform:scale(.9);background:var(--press);}
.m-bar-round svg{width:22px;height:22px;}
.m-bar-call{background:var(--good);color:#fff;box-shadow:none;}
.m-bar-call:active{background:var(--good);}
.m-bar[data-mode="q"] .m-bar-call,.m-bar[data-mode="cta"] .m-bar-back{display:none;}

/* ─── Tab-Leiste (Startseite) ─── */
.m-tabbar{display:none;}
.js-app .m-tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  display:grid;grid-template-columns:repeat(5,1fr);
  padding:6px 4px var(--safe-b);min-height:calc(var(--bar-h) + var(--safe-b));
  background:var(--glass);
  backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);
  border-top:.5px solid var(--sep);
  transition:transform .3s var(--out),opacity .3s,visibility .3s;
  view-transition-name:m-tabs;
}
.m-tabbar[hidden]{display:none !important;}
html.m-kb .m-tabbar{transform:translateY(110%);opacity:0;visibility:hidden;}
.m-tab{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;
  min-height:48px;padding:3px 0 0;border:0;background:none;
  color:var(--ink-3);font:inherit;font-size:10.5px;font-weight:600;letter-spacing:.01em;text-decoration:none;
  cursor:pointer;transition:color .2s,transform .18s var(--out);
}
.m-tab svg{width:25px;height:25px;}
.m-tab:active{transform:scale(.9);}
.m-tab[aria-current="true"]{color:var(--mallow);}
@media (prefers-color-scheme:dark){ .m-tab{color:#8A8178;} .m-tab[aria-current="true"]{color:var(--mallow);} }

/* ─── Schwebende Pille ─── */
.m-pill{display:none;}
.js-app .m-pill{
  position:fixed;left:50%;z-index:39;bottom:calc(var(--bar-h) + var(--safe-b) + 12px);
  display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);white-space:nowrap;
  padding:8px 8px 8px 18px;border:0;border-radius:999px;
  background:rgba(33,30,26,.9);color:#FAF6F0;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  font:inherit;font-size:14.5px;line-height:1.2;cursor:pointer;
  box-shadow:0 12px 30px -10px rgba(33,30,26,.5);
  transform:translate(-50%,24px) scale(.94);opacity:0;visibility:hidden;
  transition:transform .4s var(--spring),opacity .22s,visibility .22s;
}
@media (prefers-color-scheme:dark){ .js-app .m-pill{background:rgba(242,235,226,.94);color:#16120F;box-shadow:0 12px 30px -12px rgba(0,0,0,.9);} }
.js-app .m-pill.show{transform:translate(-50%,0) scale(1);opacity:1;visibility:visible;}
html.m-kb .m-pill{opacity:0 !important;visibility:hidden !important;}
.m-pill:active{transform:translate(-50%,0) scale(.96) !important;}
.m-pill .t{overflow:hidden;text-overflow:ellipsis;}
.m-pill b{font-weight:700;}
.m-pill .go{flex:none;display:inline-flex;align-items:center;gap:5px;padding:8px 13px;border-radius:999px;background:var(--honey);color:#2A1C0C;font-weight:700;font-size:13.5px;}
.m-pill .go svg{width:12px;height:12px;}

/* ════════ Startseite ════════ */
.app .lp-hero{padding:18px var(--gut) 6px;}
.app .lp-hero-in{grid-template-columns:minmax(0,1fr);gap:0;}
.app .lp-hero-text{text-align:left;min-width:0;}
.app .lp-hero .eyebrow{font-size:11.5px;padding:0;}
.app .lp-hero .eyebrow.handoff{font-size:17px;letter-spacing:0;color:var(--mallow-deep);}
.app .lp-hero h1{font-size:44px;line-height:.98;letter-spacing:-.045em;margin:16px 0 0;max-width:11ch;}
.app .lp-hero .lead{margin:16px 0 0;font-size:17px;line-height:1.5;max-width:none;}
.app .lp-cta-row{flex-direction:column;align-items:stretch;gap:10px;margin-top:24px;}
.app .lp-cta-row .cta{width:100%;}
.app .lp-link{justify-content:center;min-height:50px;border-radius:999px;background:var(--cell);font-size:16px;font-weight:600;box-shadow:inset 0 0 0 1px var(--line);transition:transform .18s var(--out),background-color .18s;}
.app .lp-link:active{transform:scale(.97);background:var(--press);}
.app .lp-meta{margin-top:14px;font-size:13px;}
/* Fakten unter dem CTA: ruhige Zeile mit Haken in Beere (statt Pillen) */
.app .lp-meta.m-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:16px;}
.m-chips span{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2);font-size:13.5px;font-weight:500;letter-spacing:-.005em;white-space:nowrap;}
.m-chips span::before{content:"";width:14px;height:14px;flex:none;background:var(--mallow);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.4l2.9 2.9 6.1-6.4'/%3E%3C/svg%3E") center/14px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.4l2.9 2.9 6.1-6.4'/%3E%3C/svg%3E") center/14px no-repeat;}
.app .lp-makerline{
  position:relative;margin:22px 0 0;padding:14px 16px 14px 70px;min-height:76px;
  border-radius:var(--r-cell);background:var(--cell);font-size:14.5px;line-height:1.5;max-width:none;
}
.app .lp-makerline::before{
  left:14px;top:14px;
}

/* Vorschau-Karten zum Wischen */
.app .lp-hero-visual{display:block;margin-top:26px;min-width:0;padding:0;}
.app .lp-photo{aspect-ratio:1 / 1;border-radius:28px;box-shadow:0 18px 40px -26px rgba(30,21,25,.55);}
.app .lp-photo img{object-position:50% 40%;}
.app .lp-hero-visual .mock-wrap{position:static;width:auto;margin-top:22px;}
.app .lp-hero-visual .mock-cap{display:flex;}
.app .lp-hero-visual .mock{min-height:0;}
.app .lp-hero-visual::before{display:none;}
.app .mock-wrap{max-width:none;margin:0;}
.app .mock-cap{margin:0 0 10px;padding-inline:4px;font-size:11.5px;}
.app .mock{
  display:flex;gap:12px;min-height:0;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);
  margin-inline:calc(-1 * var(--gut));padding:4px var(--gut) 18px;scrollbar-width:none;
}
.app .mock::-webkit-scrollbar{display:none;}
.app .mock-card{
  position:relative !important;inset:auto;flex:0 0 84%;min-height:338px;scroll-snap-align:start;
  transform:none !important;opacity:1 !important;z-index:auto !important;pointer-events:auto !important;
  transition:none !important;touch-action:pan-x pan-y;cursor:default;
  border:0;border-radius:22px;padding:20px;background:var(--cell);
  box-shadow:0 1px 2px rgba(33,30,26,.05),0 12px 28px -16px rgba(33,30,26,.28);
}
.app .mock-dots{margin-top:2px;justify-content:center;padding:0;}
.app .mock-dot{transition:background-color .25s,width .25s;}
.app .mock-dot.on{transform:none;width:18px;border-radius:4px;}
.app .mock-opt{background:var(--paper-2);border-color:transparent;}
.app .mock-opt.is-sel{background:var(--mallow-soft);border-color:var(--mallow);}
.app .mock-reco{background:var(--mallow-soft);}

/* Abschnitte: große Titel wie in iOS */
.app .lp-sec{padding:44px var(--gut) 0;scroll-margin-top:calc(var(--hdr-h) + var(--safe-t) + 4px);}
.app .lp-sec.tint{background:transparent;}
.app .lp-kicker{padding-inline:4px;font-size:11.5px;letter-spacing:.13em;}
.app .lp-h{padding-inline:4px;margin-top:10px;font-size:32px;line-height:1.02;letter-spacing:-.04em;max-width:none;}
.app .lp-sub{padding-inline:4px;margin-top:12px;font-size:16px;line-height:1.55;}

/* Gruppierte Listen (iOS „inset grouped") */
.app .lp .faq{
  display:block;margin-top:16px;background:var(--cell);border-radius:var(--r-cell);overflow:hidden;
}
.app .lp .faq details{position:relative;}
.app .lp .faq details+details::before{
  content:"";position:absolute;top:0;right:0;left:16px;height:.5px;background:var(--sep);
}

/* So funktioniert's: kompakte Karten mit großer Ziffer */
.app .lp-steps{display:grid;gap:10px;margin-top:18px;}
.app .lp-step{display:grid;grid-template-columns:52px 1fr;column-gap:12px;padding:18px 18px 18px 16px;border-radius:22px;}
.app .lp-step .n{grid-row:1 / span 2;font-size:40px;line-height:.9;}
.app .lp-step h3{grid-column:2;margin:0;font-size:19px;}
.app .lp-step p{grid-column:2;margin-top:4px;font-size:15px;line-height:1.5;}

/* Warum animallow: Bento, gestapelt */
.app .lp-cards{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px;}
.app .lp-card{padding:22px 20px;border-radius:24px;}
.app .lp-card:nth-child(1),.app .lp-card:nth-child(4){grid-column:auto;}
.app .lp-card .ic{width:42px;height:42px;border-radius:12px;}
.app .lp-card h3{margin-top:16px;font-size:20px;}
.app .lp-card:nth-child(1) h3{font-size:26px;}
.app .lp-card p{font-size:15px;line-height:1.5;}
.app .lp-card:nth-child(1) p{font-size:16px;}

/* Für dein Tier: 2 × 2 Foto-Kacheln */
.app .lp-tiers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;}
.app .lp-tier{padding:7px 7px 16px;border-radius:22px;text-align:left;transition:transform .18s var(--out);}
.app .lp-tier:hover{transform:none;}
.app .lp-tier:active{transform:scale(.97);}
.app .lp-tier .tp{border-radius:16px;margin-bottom:12px;}
.app .lp-tier .tn,.app .lp-tier p{padding:0 9px;}
.app .lp-tier .tn{font-size:19px;}
.app .lp-tier p{margin-top:3px;font-size:13px;line-height:1.4;}
.app .lp-tier .go{display:none;}

/* Kosten: dunkle Karte */
.app #kosten{padding-left:var(--gut);padding-right:var(--gut);}
.app #kosten .lp-cost{gap:20px;padding:30px 20px 24px;border-radius:28px;}
.app #kosten .lp-kicker,.app #kosten .lp-h,.app #kosten .lp-sub{padding-inline:0;}
.app #kosten .lp-h{font-size:30px;}
.app .lp-cost-item{padding:15px 0;}
.app .lp-cost-item .cl{font-size:15px;}
.app .lp-cost-item .cv{font-size:18px;font-variant-numeric:tabular-nums;white-space:nowrap;}
.app .lp-cost-note{padding-inline:0;font-size:12.5px;}

/* Der Mensch dahinter: Kontaktkarte */
.app .lp-maker{margin-top:14px;padding:26px 20px;border:0;border-radius:26px;background:var(--cell);box-shadow:none;gap:14px;}
.app .lp-maker .avatar{width:80px;height:80px;border-radius:24px;font-size:30px;color:#fff;}
.app .lp-maker h3{font-size:24px;}
.app .lp-maker .role{font-size:13px;}
.app .lp-maker blockquote{margin-top:12px;font-size:16px;line-height:1.55;}

/* Häufige Fragen: Aufklapper */
.app .lp-faq{gap:0;}
.app .lp .faq details{margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;}
.app .lp .faq summary{
  display:flex;align-items:center;gap:12px;min-height:54px;padding:14px 16px;
  font-size:16px;line-height:1.35;list-style:none;transition:background-color .15s;
}
.app .lp .faq summary::-webkit-details-marker{display:none;}
.app .lp .faq summary::after{
  content:"";flex:none;width:8px;height:8px;margin-left:auto;margin-right:2px;border-radius:0;background:none;
  border-right:2px solid var(--chev);border-bottom:2px solid var(--chev);
  transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s var(--spring),border-color .2s;
}
.app .lp .faq details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px);border-color:var(--mallow);background:none;}
.app .lp .faq summary:active{background:var(--press);}
.app .lp .faq details p{padding:0 16px 16px;font-size:15px;line-height:1.6;}
.app .lp .faq details[open] p{animation:m-drop .3s var(--out);}

/* Abschluss */
.app .lp-final{padding-bottom:8px;}
.app .lp-final-card{padding:0;border:0;border-radius:28px;}
.app .lp-final-text{padding:30px 20px 24px;text-align:left;}
.app .lp-final-photo{min-height:220px;}
.app .lp-final-card h2{font-size:30px;margin:0;}
.app .lp-final-card p{font-size:16px;margin:12px 0 0;}
.app .lp-final-card .cta-row{margin-top:22px;}
.app .lp-final-card .cta{width:100%;background:#fff;color:#1E1519;}
.app .lp-final-card .cta-row{justify-content:stretch;}

/* Scroll-Reveal sanfter */
@media (prefers-reduced-motion:no-preference){ .app .lp-sec.reveal{transform:translateY(14px);} }

/* ─── Fußzeile ─── */
.app .site-foot{margin-top:28px;padding:24px var(--gut) calc(var(--bar-h) + var(--safe-b) + 28px);border-top:0;}
.app .foot-inner{gap:14px;}
.app .foot-logo svg circle:first-child{fill:var(--mallow);}
.app .foot-links{gap:4px 6px;margin-inline:-10px;}
.app .foot-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font-size:14px;}
.app .foot-base{margin-top:6px;}
html:not([data-m-screen="hero"]) .app .site-foot{padding-bottom:calc(84px + var(--safe-b));}

/* ─── Laden ─── */
.app .loading{min-height:56vh;justify-content:center;padding:40px 0;}
.app .loading p{font-size:16px;max-width:28ch;}

/* ════════ Auswertung ════════ */
.app h2.q{text-wrap:balance;}
[data-m-screen="reveal"] .app h2.q{font-size:26px;line-height:1.16;}

/* Zusammenfassung oben */
.m-sum{
  position:relative;margin-top:20px;padding:20px 18px 18px;border-radius:24px;
  background:radial-gradient(70% 60% at 100% 0%,rgba(240,165,60,.3),transparent 60%),linear-gradient(150deg,#9E3770 0%,#6B1E47 100%);color:#FFFFFF;
  box-shadow:0 22px 40px -24px rgba(107,30,71,.9);overflow:hidden;
}
.m-sum::after{display:none;content:"";position:absolute;right:-50px;top:-60px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(217,154,78,.35),transparent 70%);pointer-events:none;}
.m-sum-eye{font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(250,246,240,.72);}
.m-sum-title{margin-top:6px;font-family:var(--display);font-weight:700;letter-spacing:-.03em;font-size:25px;line-height:1.1;}
.m-sum-big{display:flex;align-items:baseline;gap:5px;margin-top:14px;font-variant-numeric:tabular-nums;}
.m-sum-big .ca{font-size:16px;color:rgba(250,246,240,.75);}
.m-sum-big .v{font-family:var(--display);font-weight:700;font-size:46px;line-height:1;letter-spacing:-.04em;}
.m-sum-big .u{font-size:15px;color:rgba(250,246,240,.8);}
.m-sum-big.txt .v{font-size:24px;}
.m-sum-note{margin-top:6px;font-size:12.5px;color:rgba(250,246,240,.7);}
.m-sum-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;}
.m-sum-chips span{padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.14);font-size:12.5px;font-weight:600;}
.m-sum-acts{display:flex;gap:8px;margin-top:16px;}
.m-sum-acts button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 16px;
  border:0;border-radius:999px;font:inherit;font-size:15px;font-weight:600;cursor:pointer;
  background:rgba(255,255,255,.16);color:#FAF6F0;transition:transform .18s var(--out),background-color .18s;
}
.m-sum-acts button:first-child{flex:1;background:#FFFFFF;color:#4E1535;}
.m-sum-acts button:active{transform:scale(.96);}
.m-sum-acts svg{width:16px;height:16px;}

/* Segmented Control (iOS) */
.m-seg{
  --i:0;position:sticky;top:calc(var(--hdr-h) + var(--safe-t) + 8px);z-index:6;
  display:grid;grid-template-columns:repeat(3,1fr);margin-top:22px;padding:2px;border-radius:11px;
  background:var(--seg-bg);
  box-shadow:0 0 0 8px var(--app-bg);
}
.m-seg-thumb{
  position:absolute;top:2px;bottom:2px;left:2px;width:calc((100% - 4px) / 3);border-radius:9px;
  background:var(--seg-thumb);box-shadow:0 3px 8px rgba(0,0,0,.12),0 1px 1px rgba(0,0,0,.04);
  transform:translateX(calc(var(--i) * 100%));transition:transform .34s var(--spring);
}
.m-seg button{
  position:relative;z-index:1;min-height:40px;padding:6px 4px;border:0;background:none;
  font:inherit;font-size:13.5px;font-weight:500;color:var(--ink-2);cursor:pointer;line-height:1.2;
}
.m-seg button[aria-selected="true"]{font-weight:700;color:var(--ink);}
.js-app .screen[data-seg] > .panel{display:none;margin-top:12px;}
.js-app .screen[data-seg="0"] > .panel[data-seg="0"],
.js-app .screen[data-seg="1"] > .panel[data-seg="1"],
.js-app .screen[data-seg="2"] > .panel[data-seg="2"]{display:block;animation:m-fade .3s var(--out);}
@keyframes m-fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

.app .panel{padding:18px 16px;border:0;border-radius:var(--r-cell);background:var(--cell);box-shadow:none;}
.app .panel-eye{font-size:12px;font-weight:600;color:var(--ink-3);}
.app .panel-lead{font-size:15px;line-height:1.55;}
.app .panel-note{font-size:13px;}
.app .risk-name{font-size:15.5px;}
.app .risk-cost{font-size:14.5px;}
.app .risk-track{height:8px;background:var(--seg-bg);}
.app .risk-note{font-size:13px;}
.app .got-try{font-size:15px;}
/* GOT-Faktor als Segmented Control */
.app .got-grid{gap:0;padding:2px;border-radius:11px;background:var(--seg-bg);}
.app .got-opt{min-height:44px;padding:8px 2px;border:0;border-radius:9px;background:none;font-size:15px;color:var(--ink-2);transition:background-color .25s,box-shadow .25s,color .2s;}
.app .got-opt.sel{background:var(--seg-thumb);color:var(--ink);box-shadow:0 3px 8px rgba(0,0,0,.12),0 1px 1px rgba(0,0,0,.04);}
.app .got-tag{font-size:9px;}
.app .big-num{font-size:48px;font-variant-numeric:tabular-nums;}
.app .got-ctx{font-size:14px;}
.app .callout{border-radius:14px;font-size:14.5px;line-height:1.5;border-color:transparent;}
.app .callout.info{background:var(--cell);}
.app .range-top{font-size:14.5px;}
.app input[type=range]{height:8px;margin-top:18px;background:var(--seg-bg);}
.app input[type=range]::-webkit-slider-thumb{width:30px;height:30px;border:0;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.2),0 0 0 .5px rgba(0,0,0,.08);}
.app .range-scale{font-size:12.5px;}
.app .versus{background:var(--paper-2);border-radius:14px;}
.app .bar2-top{font-size:14px;}
.app .bar2-track{background:var(--seg-bg);}
.app .versus-gap{font-size:14px;}
.app .spar-summary{font-size:15px;border-radius:14px;}
.app .lines{gap:8px;}
.app .reco{margin-top:22px;padding:22px 18px;border:0;border-radius:26px;scroll-margin-top:calc(var(--hdr-h) + var(--safe-t) + 12px);}
.app .reco-title{font-size:26px;}
.app .reco-text{font-size:15.5px;}
.app .reco-konflikt{border-radius:14px;font-size:14.5px;border-color:transparent;}
.app .bstn{border:0;border-radius:12px;background:var(--cell);}
.app .bstn-name{font-size:15px;}
.app .bstn-note{font-size:13.5px;}
.app .reco-price{display:flex;flex-wrap:wrap;border:0;border-radius:14px;background:var(--cell);}
.app .reco-price .amt{font-size:17px;}
.app .ctacard{margin-top:16px;padding:24px 20px;border-radius:26px;background:var(--aubergine);color:#FFFFFF;}
.app .ctacard p{color:rgba(250,246,240,.75);font-size:15px;}
.app .cta-light{width:100%;justify-content:center;min-height:52px;font-size:16px;background:#FFFFFF;color:#1E1519;}
.app .cta-light:active{transform:scale(.97);}
.app .disclaimer{font-size:12.5px;}

/* ─── Beratung anfordern: iOS-Formular ─── */
[data-m-screen="lead"] .app .wrap{padding-bottom:calc(40px + var(--safe-b));}
.app .lead-badge{margin-top:16px;font-size:14px;border-radius:14px;align-items:flex-start;}
.app .lead-badge .d{margin-top:6px;flex:none;}
.app .lead-form{margin-top:22px;gap:16px;}
.app .field-lbl{font-size:13px;font-weight:600;color:var(--ink-2);margin:0 0 6px 4px;}
.app .field-hint,.app .field-err{margin-left:4px;font-size:13px;}
.app .consent-box{gap:0;padding:4px 0;border:0;border-radius:var(--r-cell);background:var(--cell);}
.app .consent{position:relative;gap:14px;padding:13px 16px;}
.app .consent+.consent::before{content:"";position:absolute;top:0;right:0;left:54px;height:.5px;background:var(--sep);}
.app .consent span{font-size:14px;line-height:1.5;}
.app .consent input{
  -webkit-appearance:none;appearance:none;flex:none;width:24px;height:24px;margin-top:0;border-radius:50%;
  border:2px solid var(--line-strong);background:var(--cell);display:grid;place-items:center;
  transition:background-color .2s,border-color .2s;
}
.app .consent input::after{content:"";width:6px;height:11px;margin-top:-3px;border-right:2.4px solid #fff;border-bottom:2.4px solid #fff;transform:rotate(45deg) scale(0);transition:transform .3s var(--spring);}
.app .consent input:checked{background:var(--mallow);border-color:var(--mallow);}
.app .consent input:checked::after{transform:rotate(45deg) scale(1);}
.app .consent input:focus-visible{outline:2.5px solid var(--mallow);outline-offset:2px;}
.app .form-err{border-radius:14px;font-size:14.5px;}
.app .lead-form .cta{width:100%;}
.app .fineprint{font-size:13px;text-align:center;padding-inline:8px;}
@media (prefers-color-scheme:dark){
  .app .form-err{background:rgba(192,71,60,.16);color:#F0A49B;border-color:transparent;}
  .app .field.has-error input{border-color:#E0705F;}
  .app .field-err{color:#F0A49B;}
  .app .recog,.app .callout.good{color:#9FDCBC;}
  .app .callout.warn{color:#F1C98A;}
}

/* ─── Erfolg ─── */
.app .result{padding-top:12px;}
.js-app .app .result .mark{display:none;}
.m-done{width:92px;height:92px;margin:0 auto 22px;}
.m-done circle{fill:var(--good);transform-origin:center;animation:m-pop .5s var(--spring) both;}
.m-done path{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:48;animation:m-draw .45s .28s var(--out) forwards;}
@keyframes m-draw{to{stroke-dashoffset:0;}}
@media (prefers-reduced-motion:reduce){ .m-done path{stroke-dashoffset:0;} }
.app .result h2.q{font-size:30px;}
.app .result p.lead{font-size:16.5px;}
.app .result-card{max-width:none;border:0;border-radius:20px;background:var(--cell);padding:18px;}
.m-share{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;margin-top:14px;
  border:0;border-radius:999px;background:var(--cell);color:var(--ink);font:inherit;font-size:16px;font-weight:600;
  box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;transition:transform .18s var(--out);
}
.m-share:active{transform:scale(.97);}
.m-share svg{width:18px;height:18px;}

/* ─── Kurzmeldung ─── */
.m-toast{
  position:fixed;left:50%;top:calc(var(--safe-t) + 62px);z-index:10000;
  padding:10px 16px;border-radius:999px;background:rgba(33,30,26,.92);color:#FAF6F0;
  font-size:14.5px;font-weight:600;transform:translate(-50%,-14px);opacity:0;
  transition:transform .35s var(--spring),opacity .2s;pointer-events:none;
}
.m-toast.show{transform:translate(-50%,0);opacity:1;}

/* ─── Einwilligungs-Hinweis als Sheet (Text unverändert) ─── */
html body .cm{
  left:8px;right:8px;bottom:calc(8px + var(--safe-b));max-width:none;padding:18px 18px 14px;
  border:0;border-radius:22px;font-size:14.5px;line-height:1.5;
  background:var(--glass);backdrop-filter:saturate(1.8) blur(24px);-webkit-backdrop-filter:saturate(1.8) blur(24px);
  box-shadow:0 20px 50px -18px rgba(0,0,0,.45),0 0 0 .5px var(--sep);
  animation:m-sheet .45s var(--spring);
}
@keyframes m-sheet{from{transform:translateY(40px);opacity:0;}to{transform:none;opacity:1;}}
html body .cm .cm-h{font-size:16px;}
html body .cm-b{gap:10px;margin-top:14px;}
html body .cm-b button{height:46px;font-size:15.5px;background:var(--cell);}
html body .cm-b button:active{transform:scale(.97);}
html body .cm-more{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;font-size:14px;}
html body .cm-opts input{width:22px;height:22px;}

/* ═══════════════════════ RATGEBER ═══════════════════════ */
.guide{font-size:16px;}
.guide .wrap{width:auto;margin-inline:var(--gut);}
.guide .topbar{
  padding-top:var(--safe-t);background:var(--glass);border-bottom:.5px solid transparent;
  backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);
  transition:border-color .3s;
}
.guide .topbar.stuck{border-bottom-color:var(--sep);}
.guide .topbar-inner{height:var(--hdr-h);}
.guide .brand{min-height:44px;}
.guide .brand svg{width:30px;height:30px;}
.guide .brand-name{font-size:19px;}
.guide .top-actions .btn{display:none;}
.guide.guide-hub .top-link{display:none;}
/* Artikel: „‹ Ratgeber" statt Logo */
.guide.guide-article .brand{display:none;}
.guide.guide-article .top-link{
  display:inline-flex;align-items:center;gap:4px;min-height:44px;margin-left:-4px;
  font-size:17px;font-weight:500;color:var(--mallow);
}
.guide.guide-article .top-link::before{content:"";width:11px;height:11px;border-left:2.4px solid currentColor;border-bottom:2.4px solid currentColor;transform:rotate(45deg);border-radius:1px;margin-right:2px;}
.guide.guide-article .topbar-inner{justify-content:flex-start;}
.guide.guide-article .top-actions{order:-1;}
.m-read{position:absolute;left:0;bottom:-.5px;height:2px;width:100%;transform-origin:left;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--mallow),var(--honey));}
.guide main{padding:16px 0 0;}
.guide p{line-height:1.65;}

/* Übersicht */
.guide .hub-head{margin-bottom:18px;}
.guide .hub-head h1{font-size:34px;line-height:1.06;margin:6px 0 10px;}
.guide .hub-head p{font-size:16.5px;}
.guide .eyebrow{font-size:12px;}
.guide .cat-nav{
  flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px;
  margin:0 calc(-1 * var(--gut)) 18px;padding:2px var(--gut) 4px;scroll-padding-inline:var(--gut);
}
.guide .cat-nav::-webkit-scrollbar{display:none;}
.guide .cat-chip{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 15px;border:0;background:var(--cell);color:var(--ink);font-size:15px;box-shadow:inset 0 0 0 1px var(--line);}
.guide .cat-chip:active{background:var(--press);}
.guide .article-grid{display:block;background:var(--cell);border-radius:var(--r-cell);overflow:hidden;}
.guide .a-card{
  position:relative;display:block;padding:15px 40px 15px 16px;border:0;border-radius:0;background:none;box-shadow:none;
  transition:background-color .15s;
}
.guide .a-card:hover{transform:none;box-shadow:none;}
.guide .a-card:active{background:var(--press);}
.guide .a-card+.a-card::before{content:"";position:absolute;top:0;right:0;left:16px;height:.5px;background:var(--sep);}
.guide .a-card::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;margin-top:-4px;border-right:2px solid var(--chev);border-top:2px solid var(--chev);transform:rotate(45deg);}
.guide .a-card .card-cat{font-size:11.5px;}
.guide .a-card h2{margin:4px 0 3px;font-family:var(--f-body);font-size:17px;font-weight:600;line-height:1.3;}
.guide .a-card p{font-size:14.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.guide .a-card .card-meta{margin-top:6px;font-size:12.5px;}
.guide .a-card .card-go,.guide .a-card br{display:none;}
.guide .a-card.feat{display:block;margin-bottom:0;padding:20px 40px 20px 18px;background:linear-gradient(150deg,var(--mallow-soft),var(--honey-soft));}
.guide .a-card.feat .feat-mark{width:52px;height:52px;margin-bottom:10px;}
.guide .a-card.feat h2{font-family:var(--f-display);font-weight:700;font-size:24px;line-height:1.08;letter-spacing:-.03em;}
@media (prefers-color-scheme:dark){ .guide .a-card.feat{background:linear-gradient(150deg,#33202A,#2C2216);} }

/* Artikel */
.guide .crumbs{display:none;}
.guide .article-meta{gap:6px;margin-bottom:10px;font-size:13px;}
.guide .article h1{font-size:32px;line-height:1.07;}
.guide .article .lead{font-size:17.5px;line-height:1.6;}
.guide .article h2{font-size:25px;line-height:1.15;margin:34px 0 10px;scroll-margin-top:calc(var(--hdr-h) + var(--safe-t) + 14px);}
.guide .article h3{font-size:17.5px;}
.guide .article p,.guide .article li{font-size:16.5px;}
.guide .tldr{border:0;border-left:3px solid var(--mallow);border-radius:var(--r-cell);background:var(--cell);padding:18px 16px;}
.guide .tldr li{font-size:15.5px;}
.guide .article .tldr h2{margin:0 0 10px;font-family:var(--f-body);font-size:12px;line-height:1.3;}
.guide .toc{padding:0;border-radius:var(--r-cell);background:var(--cell);overflow:hidden;}
.guide .toc strong{padding:14px 16px 4px;margin:0;font-size:12px;}
.guide .toc ol{list-style:none;padding:0;counter-reset:toc;}
.guide .toc li{position:relative;margin:0;}
.guide .toc li+li::before{content:"";position:absolute;top:0;right:0;left:50px;height:.5px;background:var(--sep);}
.guide .toc a{display:flex;align-items:center;gap:12px;min-height:50px;padding:10px 38px 10px 16px;font-size:15.5px;font-weight:500;color:var(--ink);text-decoration:none;line-height:1.35;transition:background-color .15s;}
.guide .toc a:active{background:var(--press);}
.guide .toc a::before{counter-increment:toc;content:counter(toc);flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--mallow-soft);color:var(--mallow-deep);font-size:12.5px;font-weight:700;}
.guide .toc a::after{content:"";position:absolute;right:18px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-right:2px solid var(--chev);border-top:2px solid var(--chev);transform:rotate(45deg);}
.guide .callout{border-radius:var(--r-cell);border:0;padding:16px;}
.guide .callout p{font-size:15.5px;}
@media (prefers-color-scheme:dark){
  .guide .callout.tip p strong{color:#9FDCBC;}
  .guide .callout.warn p strong{color:#F1C98A;}
}
.guide .rtable{margin-inline:calc(-1 * var(--gut));border:0;border-radius:0;background:var(--cell);-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.guide .rtable::-webkit-scrollbar{display:none;}
.guide .rtable table{font-size:14.5px;}
.guide .rtable th:first-child,.guide .rtable td:first-child{padding-left:var(--gut);position:sticky;left:0;background:var(--cell);z-index:1;box-shadow:.5px 0 0 var(--sep);}
.guide .rtable thead th:first-child{background:var(--paper-2);}
.guide .rtable td,.guide .rtable th{padding:12px 13px;}
.m-swipe-hint{display:block;margin:-10px 0 18px;font-size:12.5px;color:var(--subtle);text-align:right;}
.guide .article .faq details{border:0;border-radius:0;margin:0;padding:0;background:none;position:relative;}
.guide .article .faq{background:none;}
.guide .article .faq h2{margin-bottom:12px;}
.guide .article .faq .m-group{background:var(--cell);border-radius:var(--r-cell);overflow:hidden;}
.guide .article .faq details+details::before{content:"";position:absolute;top:0;right:0;left:16px;height:.5px;background:var(--sep);}
.guide .article .faq summary{min-height:54px;align-items:center;padding:14px 16px;font-size:16px;line-height:1.35;transition:background-color .15s;}
.guide .article .faq summary:active{background:var(--press);}
.guide .article .faq summary::after{content:"";width:8px;height:8px;margin:0 2px 0 auto;border-right:2px solid var(--chev);border-bottom:2px solid var(--chev);transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s var(--spring);}
.guide .article .faq details[open] summary::after{content:"";transform:rotate(-135deg) translate(-2px,-2px);border-color:var(--mallow);}
.guide .article .faq details p{padding:0 16px 16px;font-size:15.5px;}
.guide .author-box{border:0;border-radius:22px;background:var(--cell);padding:20px 18px;}
.guide .author-box .ava{width:56px;height:56px;border-radius:50%;font-size:21px;}
.guide .related-grid{
  display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  margin-inline:calc(-1 * var(--gut));padding:2px var(--gut) 6px;scroll-padding-inline:var(--gut);
}
.guide .related-grid::-webkit-scrollbar{display:none;}
.guide .related a{flex:0 0 76%;scroll-snap-align:start;min-height:108px;border:0;border-radius:18px;background:var(--cell);padding:16px;}
.guide .related a:hover{transform:none;}
.guide .related a:active{transform:scale(.97);}
.guide .related .r-title{font-size:19px;}
.m-dots{display:flex;justify-content:center;gap:7px;margin-top:10px;}
.m-dots i{width:7px;height:7px;border-radius:4px;background:var(--line-strong);transition:background-color .25s,width .25s;}
.m-dots i.on{width:18px;background:var(--mallow);}
.guide .cta-band{border-radius:24px;padding:28px 20px;}
.guide .cta-band h2{font-size:26px;}
.guide .cta-band .btn{width:100%;justify-content:center;min-height:52px;font-size:16px;}
@media (prefers-color-scheme:dark){ .guide .cta-band{background:#2A2421;} .guide .btn-primary{background:var(--ink);color:#16120F;} }
.guide .article-disc{font-size:13px;}
.guide footer{padding-bottom:calc(var(--bar-h) + var(--safe-b) + 28px);margin-top:28px;}
.guide .footer-card{border-radius:24px;}
@media (prefers-color-scheme:dark){ .guide .footer-card{background:#1C1917;} }
.guide .footer-links a{display:inline-flex;align-items:center;min-height:44px;}
.guide .footer-links{gap:0;}

/* Aktionsleiste (Ratgeber) */
.m-action{display:none;}
.js-app .m-action{
  position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;gap:10px;
  padding:10px var(--gut) calc(10px + var(--safe-b));
  background:var(--glass);backdrop-filter:saturate(1.8) blur(20px);-webkit-backdrop-filter:saturate(1.8) blur(20px);
  border-top:.5px solid var(--sep);
  transition:transform .3s var(--out),opacity .3s,visibility .3s;
}
.js-app .m-action.away{transform:translateY(110%);opacity:0;visibility:hidden;}
.m-action .m-bar-main{text-decoration:none;}

/* Bewegung reduzieren */
@media (prefers-reduced-motion:reduce){
  .app .screen,.m-sum,.m-done circle{animation:none !important;}
  .m-pill,.m-bar,.m-tabbar,.m-action,.m-seg-thumb{transition:none !important;}
}

/* Lange deutsche Komposita („Tierkrankenversicherung") nie über den Rand */
.guide h1,.guide h2,.app h1,.app h2,.app .reco-title,.m-sum-title{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;hyphenate-limit-chars:15 6 6;-webkit-hyphenate-limit-before:6;-webkit-hyphenate-limit-after:6;}
.guide .hub-head h1{font-size:32px;}
/* Kontrast AA im dunklen Ratgeber-Fuß */
.guide .footer-copy,.guide .footer-col-title{color:rgba(255,255,255,.66);}
.app .lp-card h3{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;}
@media (max-width:389px){ [data-m-screen="reveal"] .app h2.q{font-size:24px;} }
@media (max-width:389px){ .app .lp-meta.m-chips{column-gap:10px;} .m-chips span{font-size:12.8px;gap:4px;} .m-chips span::before{width:13px;height:13px;-webkit-mask-size:13px;mask-size:13px;} }