/* /betreuung, 15.10.2026: Landingpage Betreuungspaket. Baut auf den lp-Klassen der Leistungsseiten auf. */
.bt{--bt-mint:#dff3f2;--bt-mint-2:#c9ece9;--bt-cyan:#22C7D6}

/* Hero: Kopf, Beispielfenster, Text. Am Handy steht das Fenster direkt unter der Überschrift. */
.bt-hero{padding-bottom:96px}
.bt-breadcrumb{margin-bottom:40px}
.bt-hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"kopf fenster" "text fenster";column-gap:clamp(40px,6vw,96px);align-items:start}
.bt-hero__kopf{grid-area:kopf;align-self:end}
.bt-hero__text{grid-area:text}
.bt-fenster{grid-area:fenster;align-self:center}
.bt-hero h1{margin:0;max-width:12ch}
.bt-unterstrich{background:url(/assets/img/zeichen/unterstrich.svg) left bottom / 100% .32em no-repeat;padding-bottom:.08em}
.bt-intro{margin-top:28px}
.bt-cta{margin-bottom:12px}
.bt-tel{margin:0;font-size:15px;color:var(--lp-muted,#6E6A66)}
.bt-tel a{color:var(--ink,#19191C);font-weight:650;text-underline-offset:4px;white-space:nowrap}

/* Gezeichnetes Beispielfenster */
.bt-fenster{position:relative;margin:0;background:#fff;border:1.5px solid #19191C;border-radius:14px;box-shadow:6px 7px 0 var(--bt-mint-2);max-width:460px;justify-self:end;width:100%}
.bt-fenster__leiste{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1.5px solid #19191C}
.bt-fenster__leiste i{width:9px;height:9px;border:1.5px solid #19191C;border-radius:50%}
.bt-fenster__leiste span{margin-left:10px;font-size:12px;color:#6E6A66;background:#F3F1F0;border-radius:999px;padding:3px 12px}
.bt-fenster__inhalt{padding:22px 26px 26px}
.bt-fenster__titel{font-size:12px;font-weight:750;text-transform:uppercase;letter-spacing:.1em;color:#075B62;margin:0 0 10px}
.bt-zeiten{margin:0 0 22px}
.bt-zeiten div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px dashed rgba(25,25,28,.25);font-size:17px}
.bt-zeiten dt{font-weight:650}
.bt-zeiten dd{margin:0;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;column-gap:4px}
.bt-alt{position:relative;color:#6E6A66;white-space:nowrap}
.bt-alt::after{content:"";position:absolute;left:-5px;right:-5px;top:20%;height:60%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M2 13.5C22 10.5 48 12.8 70 8.6 81 6.8 90 7.4 98 5.2' fill='none' stroke='%2319191C' stroke-width='2.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat;clip-path:inset(0 0 0 0)}
.bt-neu{display:inline-block;margin-left:6px;padding:1px 8px;font-weight:700;white-space:nowrap;background:url(/assets/img/zeichen/marker-cyan.svg) center / 100% 100% no-repeat}
.bt-aktuelles{list-style:none;margin:0;padding:0}
.bt-aktuelles li{padding:9px 0;border-bottom:1px dashed rgba(25,25,28,.25);font-size:16px}
.bt-aktuelles__neu{display:inline-block;margin-right:8px;padding:0 8px;font-size:12px;font-weight:750;text-transform:uppercase;letter-spacing:.06em;background:url(/assets/img/zeichen/marker-lime.svg) center / 100% 100% no-repeat}
.bt-zettel{position:absolute;right:-22px;top:-26px;margin:0;padding:10px 14px 9px;background:#FFF8C9;border:1.5px solid #19191C;border-radius:4px;transform:rotate(4deg);font-size:15px;font-weight:650;line-height:1.3;box-shadow:3px 4px 0 rgba(25,25,28,.12)}
.bt-fenster__hinweis{position:absolute;left:0;bottom:-28px;font-size:12px;color:#6E6A66}

/* Bewegung: Streichung zieht durch, Markierung erscheint, Zettel klebt sich an. */
@media (prefers-reduced-motion:no-preference){
  .bt-alt::after{animation:bt-streich .7s .5s cubic-bezier(.22,.61,.36,1) both}
  .bt-neu{animation:bt-auf .45s 1.2s ease-out both}
  .bt-zettel{animation:bt-zettel .5s 1.6s cubic-bezier(.22,.61,.36,1) both}
}
@keyframes bt-streich{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes bt-auf{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes bt-zettel{from{opacity:0;transform:rotate(12deg) translateY(-10px)}to{opacity:1;transform:rotate(4deg)}}

/* Aushang */
.bt-aushang{padding-block:88px;border-top:1px solid rgba(25,25,28,.10)}
.bt-aushang__kopf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:end;margin-bottom:56px}
.bt-aushang__kopf h2{margin:0;max-width:16ch}
.bt-aushang__kopf p{margin:0;max-width:52ch;font-size:clamp(17px,1.3vw,19px);line-height:1.6}
.bt-punkte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px}
.bt-punkte li{display:grid;grid-template-rows:64px auto 1fr;row-gap:16px;border-top:2px solid #19191C;padding-top:26px}
.bt-symbol{width:64px;height:64px;fill:none;stroke:#19191C;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.bt-symbol__akzent{stroke:#097078;stroke-width:3}
.bt-punkte h3{margin:0;font-size:clamp(20px,1.6vw,24px);line-height:1.2}
.bt-punkte p{margin:0;font-size:16px;color:var(--lp-muted,#6E6A66);line-height:1.6}

/* Paket */
.bt-paket{background:var(--bt-mint);padding-block:96px}
.bt-paket__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);align-items:start}
.bt-paket__kopf h2{margin:0 0 24px;max-width:11ch}
.bt-paket__kopf p{margin:0;max-width:40ch;font-size:clamp(17px,1.3vw,19px);line-height:1.6}
.bt-preis{white-space:nowrap;background:url(/assets/img/zeichen/unterstrich.svg) left bottom / 100% .32em no-repeat;padding-bottom:.08em}
.bt-paket__karte{background:#fff;border:1.5px solid #19191C;border-radius:14px;padding:34px 36px 30px;box-shadow:6px 7px 0 var(--bt-mint-2)}
.bt-liste{list-style:none;margin:0 0 26px;padding:0}
.bt-liste li{position:relative;padding:18px 0 18px 44px;border-bottom:1px dashed rgba(25,25,28,.25)}
.bt-liste li:first-child{padding-top:0}
.bt-liste li::before{content:"";position:absolute;left:0;top:20px;width:26px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 22'%3E%3Cpath d='M2.5 12.2c2.4 1.6 4.3 3.6 6 6.4C12 11.8 16.6 6.3 23.6 2.4' fill='none' stroke='%23097078' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat}
.bt-liste li:first-child::before{top:2px}
.bt-liste h3{margin:0 0 6px;font-size:clamp(18px,1.4vw,21px);line-height:1.25}
.bt-liste p{margin:0;font-size:16px;color:var(--lp-muted,#6E6A66);line-height:1.55}
.bt-bedingungen{margin:6px 0 0;font-size:14px;line-height:1.6;color:#19191C;max-width:60ch}

/* Wechsel */
.bt-wechsel{padding-block:96px}
.bt-wechsel h2{margin:16px 0 48px;max-width:22ch}
.bt-schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px;counter-reset:none}
.bt-schritte li{display:grid;grid-template-rows:auto 1fr;row-gap:18px}
.bt-schritte__nr{display:grid;place-items:center;width:52px;height:52px;font-size:22px;font-weight:750;background:url(/assets/img/zeichen/kreis.svg) center / 100% 100% no-repeat}
.bt-schritte p{margin:0;font-size:17px;line-height:1.6;max-width:36ch}

.bt-faq{border-top:1px solid rgba(25,25,28,.10)}

/* Direkte Terminbuchung (Victor 15.10.2026): bestehende Rückruf-Karte mit cal.com-Zeiten. */
#termin{scroll-margin-top:96px}
.bt-termin__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"text karte" "fuss karte";column-gap:clamp(40px,6vw,96px);align-items:start}
.bt-termin__text{grid-area:text}
.bt-termin__fuss{grid-area:fuss}
.bt-termin{grid-area:karte}
.bt-termin__text h2{margin:0 0 20px;max-width:15ch}
.bt-termin__text>p{max-width:42ch;margin-bottom:0}
.bt-termin__fuss .lp-person{margin:30px 0 20px}
.bt-termin__alt{font-size:15px;margin:0}
.bt-termin__alt a{font-weight:650;text-underline-offset:4px}
.bt-termin .rueckruf{margin-top:0;max-width:none;border:1.5px solid #19191C;box-shadow:6px 7px 0 var(--bt-mint-2)}
.bt-termin .rueckruf h3{margin:2px 0 4px;font:600 clamp(20px,1.7vw,24px)/1.15 var(--sans);letter-spacing:-.018em;color:var(--ink)}
.bt-termin .rueckruf[data-rueckruf-state="aus"]{display:block}
.bt-termin__fallback{display:none;margin:16px 0 0;font-size:15px;line-height:1.5}
.bt-termin .rueckruf[data-rueckruf-state="aus"] .rueckruf__slots{display:none}
.bt-termin .rueckruf[data-rueckruf-state="aus"] .bt-termin__fallback{display:block}
.bt-weiter{padding-block:28px 56px}

@media (max-width:980px){
  .bt-hero__grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"kopf" "fenster" "text"}
  .bt-fenster{justify-self:start;margin:28px 0 30px;max-width:520px}
  .bt-hero h1{max-width:14ch}
  .bt-aushang__kopf,.bt-paket__grid{grid-template-columns:minmax(0,1fr)}
  .bt-termin__grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"text" "karte" "fuss"}
  .bt-termin{margin-top:24px}
  .bt-punkte,.bt-schritte{grid-template-columns:minmax(0,1fr);gap:0}
  .bt-punkte li{grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto;column-gap:18px;row-gap:6px;padding:22px 0;border-top:1px solid rgba(25,25,28,.18)}
  .bt-punkte .bt-symbol{width:52px;height:52px;grid-row:span 2}
  .bt-schritte li{grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto;column-gap:18px;padding:14px 0;align-items:center}
}
@media (max-width:640px){
  .bt-hero{padding-bottom:64px}
  .bt-breadcrumb{margin-bottom:20px}
  .bt-hero .lp-eyebrow{margin-bottom:14px}
  .bt-hero h1{font-size:clamp(34px,10vw,44px);line-height:1.05}
  .bt-fenster{margin:20px 18px 26px 0;box-shadow:4px 5px 0 var(--bt-mint-2)}
  .bt-fenster__inhalt{padding:14px 16px 14px}
  .bt-fenster__titel{margin-bottom:4px;font-size:11px}
  .bt-zeiten{margin-bottom:12px}
  .bt-zeiten div,.bt-aktuelles li{padding:6px 0;font-size:15px}
  .bt-fenster__titel--aktuelles,.bt-aktuelles{display:none}
  .bt-zeiten{margin-bottom:0}
  .bt-breadcrumb{display:none}
  .bt-zettel{right:-14px;top:-18px;padding:7px 10px 6px;font-size:13px}
  .bt-fenster__hinweis{bottom:-22px}
  .bt-intro{margin-top:18px;font-size:18px}
  .bt-aushang,.bt-paket,.bt-wechsel{padding-block:64px}
  .bt-aushang__kopf{margin-bottom:28px;gap:18px}
  .bt-paket__karte{padding:24px 20px 22px}
  .bt-liste li{padding-left:38px}
  .bt-wechsel h2{margin-bottom:24px}
}