/* Seitenexklusive Gestaltung für /bu-vorsorge/. */
.bu-vorsorge-page mark {
  color: inherit;
  background: none;
}

.bu-vorsorge-page #kontakt-check {
  scroll-margin-top: 104px;
}

.bu-vorsorge-page .detail-hero {
  background:
    radial-gradient(circle at 88% 14%, rgba(255, 210, 0, 0.3), transparent 28%),
    linear-gradient(135deg, #fff 0 50%, #fffdf3 100%);
}

.bu-vorsorge-page .detail-hero h1 {
  max-width: 800px;
  font-size: clamp(2.65rem, 6.2vw, 5.9rem);
}

.bu-vorsorge-page .detail-hero h1 mark,
.bu-vorsorge-page .vorsorge-signature h2 mark,
.bu-vorsorge-page .vorsorge-timeline h2 mark {
  color: #FFD200;
}

.bu-vorsorge-page .vorsorge-hero-board {
  min-height: 410px;
  padding: 18px;
  background: #1f2228;
}

.bu-vorsorge-page .vorsorge-hero-board::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 42px 42px;
  content: "";
}

.bu-vorsorge-page .vorsorge-hero-board::after {
  border-color: rgba(255, 210, 0, 0.5);
  box-shadow: 0 0 0 38px rgba(255, 210, 0, 0.08);
}

.bu-vorsorge-page .vorsorge-hero-points {
  position: relative;
  z-index: 1;
  display: grid;
  height: 100%;
  gap: 10px;
}

.bu-vorsorge-page .vorsorge-hero-points article {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 112px;
  padding: 20px 72px 20px 20px;
  align-content: center;
  gap: 8px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 22px;
  color: white;
  background: rgba(255, 255, 255, 0.07);
}

.bu-vorsorge-page .vorsorge-hero-points article:nth-child(2) {
  color: #1f2228;
  background: #FFD200;
}

.bu-vorsorge-page .vorsorge-hero-points span {
  color: #FFD200;
  font-size: 0.64rem;
  font-weight: 850;
  letter-spacing: 0.13em;
}

.bu-vorsorge-page .vorsorge-hero-points article:nth-child(2) span { color: rgba(31, 34, 40, 0.62); }
.bu-vorsorge-page .vorsorge-hero-points strong { max-width: 320px; overflow-wrap: anywhere; font-size: clamp(0.88rem, 2vw, 1.08rem); line-height: 1.25; }
.bu-vorsorge-page .vorsorge-hero-points i { position: absolute; right: 18px; top: 50%; display: grid; width: 42px; height: 42px; border-radius: 14px; color: #1f2228; background: #FFD200; place-items: center; font-size: 0.8rem; font-style: normal; font-weight: 900; transform: translateY(-50%); }
.bu-vorsorge-page .vorsorge-hero-points article:nth-child(2) i { color: #FFD200; background: #1f2228; }

.bu-vorsorge-page .vorsorge-why,
.bu-vorsorge-page .vorsorge-compare-section,
.bu-vorsorge-page .vorsorge-myths { overflow: hidden; }

.bu-vorsorge-page .vorsorge-bento {
  display: grid;
  gap: 12px;
}

.bu-vorsorge-page .vorsorge-bento-card {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 280px;
  padding: 26px;
  align-content: space-between;
  overflow: hidden;
  border: 1px solid var(--detail-line);
  border-radius: 30px;
  background: #f7f8fa;
  box-shadow: 0 18px 46px rgba(31, 34, 40, 0.07);
}

.bu-vorsorge-page .vorsorge-bento-card::after {
  position: absolute;
  right: -52px;
  top: -52px;
  width: 142px;
  height: 142px;
  border: 1px solid rgba(255, 210, 0, 0.5);
  border-radius: 50%;
  box-shadow: 0 0 0 24px rgba(255, 210, 0, 0.07);
  content: "";
}

.bu-vorsorge-page .vorsorge-bento-card.is-build { background: #FFD200; }
.bu-vorsorge-page .vorsorge-bento-card.is-future { color: white; background: #1f2228; }
.bu-vorsorge-page .vorsorge-bento-card > span { position: relative; z-index: 1; color: #747880; font-size: 0.65rem; font-weight: 850; letter-spacing: 0.13em; }
.bu-vorsorge-page .vorsorge-bento-card.is-build > span { color: rgba(31, 34, 40, 0.62); }
.bu-vorsorge-page .vorsorge-bento-card.is-future > span { color: #FFD200; }
.bu-vorsorge-page .vorsorge-bento-card h3 { position: relative; z-index: 1; max-width: 350px; margin: 34px 0 10px; font-size: clamp(1.45rem, 4vw, 2rem); letter-spacing: -0.05em; line-height: 1.05; }
.bu-vorsorge-page .vorsorge-bento-card p { position: relative; z-index: 1; margin: 0 0 26px; color: var(--detail-muted); font-size: 0.84rem; }
.bu-vorsorge-page .vorsorge-bento-card.is-future p { color: rgba(255, 255, 255, 0.68); }
.bu-vorsorge-page .vorsorge-bento-card > strong { position: relative; z-index: 1; padding-top: 16px; border-top: 1px solid var(--detail-line); font-size: 0.78rem; }
.bu-vorsorge-page .vorsorge-bento-card.is-future > strong { border-color: rgba(255, 255, 255, 0.14); color: #FFD200; }

.bu-vorsorge-page .vorsorge-signature {
  overflow: hidden;
  background:
    radial-gradient(circle at 90% 15%, rgba(255, 210, 0, 0.17), transparent 27%),
    #1f2228;
}

.bu-vorsorge-page .vorsorge-signature .detail-section-heading p,
.bu-vorsorge-page .vorsorge-timeline .detail-section-heading p { color: rgba(255, 255, 255, 0.68); }

.bu-vorsorge-page .vorsorge-combination {
  display: grid;
  gap: 10px;
}

.bu-vorsorge-page .vorsorge-combination article,
.bu-vorsorge-page .vorsorge-combination-result {
  display: grid;
  min-width: 0;
  min-height: 170px;
  padding: 24px;
  align-content: center;
  gap: 8px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.07);
}

.bu-vorsorge-page .vorsorge-combination article > span,
.bu-vorsorge-page .vorsorge-combination-result > span { color: #FFD200; font-size: 0.64rem; font-weight: 850; letter-spacing: 0.13em; }
.bu-vorsorge-page .vorsorge-combination article > strong { font-size: clamp(1.25rem, 4vw, 1.9rem); letter-spacing: -0.045em; line-height: 1.08; }
.bu-vorsorge-page .vorsorge-combination article > small { color: rgba(255, 255, 255, 0.62); font-size: 0.74rem; }
.bu-vorsorge-page .vorsorge-parallel { display: flex; min-height: 56px; align-items: center; justify-content: center; gap: 14px; color: rgba(255, 255, 255, 0.58); font-size: 0.64rem; font-weight: 850; letter-spacing: 0.14em; }
.bu-vorsorge-page .vorsorge-parallel i { display: grid; width: 38px; height: 38px; border-radius: 50%; color: #1f2228; background: #FFD200; place-items: center; font-size: 1.25rem; font-style: normal; }
.bu-vorsorge-page .vorsorge-combination-result { min-height: 190px; color: #1f2228; background: #FFD200; text-align: center; }
.bu-vorsorge-page .vorsorge-combination-result > span { color: rgba(31, 34, 40, 0.62); }
.bu-vorsorge-page .vorsorge-combination-result > strong { font-size: clamp(2rem, 7vw, 4.6rem); letter-spacing: -0.065em; line-height: 0.95; }
.bu-vorsorge-page .vorsorge-combination-result > small { font-size: 0.78rem; font-weight: 750; }

.bu-vorsorge-page .vorsorge-answer-grid { display: grid; gap: 12px; }
.bu-vorsorge-page .vorsorge-answer-grid article { display: grid; min-height: 280px; padding: 28px; align-content: end; border: 1px solid var(--detail-line); border-radius: 30px; background: #f7f8fa; box-shadow: 0 18px 46px rgba(31, 34, 40, 0.06); }
.bu-vorsorge-page .vorsorge-answer-grid article.is-accent { background: #FFD200; }
.bu-vorsorge-page .vorsorge-answer-grid h2 { margin: 48px 0 14px; font-size: clamp(2rem, 6vw, 3.5rem); letter-spacing: -0.06em; line-height: 0.98; }
.bu-vorsorge-page .vorsorge-answer-grid p { margin: 0; color: var(--detail-muted); font-size: 0.9rem; }
.bu-vorsorge-page .vorsorge-answer-grid a { display: inline-flex; width: fit-content; margin-top: 24px; padding: 12px 15px; align-items: center; gap: 18px; border-radius: 14px; color: white; background: #1f2228; font-size: 0.75rem; font-weight: 820; }

.bu-vorsorge-page .vorsorge-contribution-card {
  display: grid;
  padding: 14px;
  gap: 10px;
  border: 1px solid var(--detail-line);
  border-radius: 34px;
  background: white;
  box-shadow: var(--detail-shadow);
}

.bu-vorsorge-page .vorsorge-contribution-card article { display: grid; min-width: 0; min-height: 210px; padding: 26px; align-content: center; gap: 10px; border-radius: 24px; background: #f7f8fa; }
.bu-vorsorge-page .vorsorge-contribution-card article:last-child { background: #FFD200; }
.bu-vorsorge-page .vorsorge-contribution-card span { color: #747880; font-size: 0.66rem; font-weight: 850; letter-spacing: 0.13em; }
.bu-vorsorge-page .vorsorge-contribution-card article:last-child span { color: rgba(31, 34, 40, 0.62); }
.bu-vorsorge-page .vorsorge-contribution-card h3 { max-width: 430px; margin: 10px 0 0; font-size: clamp(1.35rem, 4vw, 2.2rem); letter-spacing: -0.05em; line-height: 1.08; }
.bu-vorsorge-page .vorsorge-contribution-card small { color: var(--detail-muted); font-size: 0.74rem; }
.bu-vorsorge-page .vorsorge-contribution-divider { display: flex; align-items: center; justify-content: center; gap: 10px; }
.bu-vorsorge-page .vorsorge-contribution-divider i { width: 100%; height: 1px; background: var(--detail-line); }
.bu-vorsorge-page .vorsorge-contribution-divider strong { display: grid; width: 40px; height: 40px; flex: 0 0 auto; border-radius: 50%; color: #FFD200; background: #1f2228; place-items: center; }
.bu-vorsorge-page .vorsorge-contribution-message { margin: 20px 0 0; text-align: center; font-size: clamp(1rem, 3vw, 1.25rem); font-weight: 850; }

.bu-vorsorge-page .vorsorge-compare { display: grid; gap: 12px; }
.bu-vorsorge-page .vorsorge-compare > article { padding: 26px; border: 1px solid var(--detail-line); border-radius: 30px; background: #f7f8fa; box-shadow: 0 18px 46px rgba(31, 34, 40, 0.06); }
.bu-vorsorge-page .vorsorge-compare > article.is-highlight { background: #FFD200; }
.bu-vorsorge-page .vorsorge-compare > article > span { color: #747880; font-size: 0.65rem; font-weight: 850; letter-spacing: 0.13em; }
.bu-vorsorge-page .vorsorge-compare h3 { margin: 40px 0 24px; font-size: clamp(2rem, 6vw, 3.4rem); letter-spacing: -0.06em; line-height: 0.98; }
.bu-vorsorge-page .vorsorge-compare dl { margin: 0; }
.bu-vorsorge-page .vorsorge-compare dl div { display: grid; padding: 16px 0; gap: 4px; border-top: 1px solid var(--detail-line); }
.bu-vorsorge-page .vorsorge-compare dt { color: var(--detail-muted); font-size: 0.68rem; font-weight: 760; }
.bu-vorsorge-page .vorsorge-compare dd { margin: 0; font-size: 0.86rem; font-weight: 820; }
.bu-vorsorge-page .vorsorge-compare-note { display: grid; margin-top: 14px; padding: 22px; gap: 7px; border-radius: 22px; color: white; background: #1f2228; }
.bu-vorsorge-page .vorsorge-compare-note strong { color: #FFD200; font-size: 0.92rem; }
.bu-vorsorge-page .vorsorge-compare-note span { color: rgba(255, 255, 255, 0.68); font-size: 0.76rem; }
.bu-vorsorge-page .vorsorge-compare-note a { display: inline-flex; width: fit-content; margin-top: 9px; align-items: center; gap: 16px; font-size: 0.72rem; font-weight: 830; }
.bu-vorsorge-page .vorsorge-compare-note a i { color: #FFD200; font-style: normal; }

.bu-vorsorge-page .vorsorge-timeline {
  overflow: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    #1f2228;
  background-size: 54px 54px;
}

.bu-vorsorge-page .vorsorge-time-path { display: grid; gap: 10px; }
.bu-vorsorge-page .vorsorge-time-path article { display: grid; min-height: 210px; padding: 24px; align-content: space-between; gap: 20px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 26px; background: rgba(255, 255, 255, 0.07); }
.bu-vorsorge-page .vorsorge-time-path article.is-accent { color: #1f2228; background: #FFD200; }
.bu-vorsorge-page .vorsorge-time-path article > span { color: #FFD200; font-size: 0.65rem; font-weight: 850; letter-spacing: 0.13em; }
.bu-vorsorge-page .vorsorge-time-path article.is-accent > span { color: rgba(31, 34, 40, 0.62); }
.bu-vorsorge-page .vorsorge-time-path article > strong { font-size: clamp(1.35rem, 4vw, 2rem); letter-spacing: -0.04em; line-height: 1.2; }
.bu-vorsorge-page .vorsorge-time-path article > small { color: rgba(255, 255, 255, 0.58); font-size: 0.66rem; }
.bu-vorsorge-page .vorsorge-time-path > i { display: grid; min-height: 44px; color: #FFD200; place-items: center; font-size: 1.4rem; font-style: normal; }

.bu-vorsorge-page .detail-myth-answer small { display: grid; gap: 12px; }
.bu-vorsorge-page .detail-myth-answer small em { padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, 0.16); color: #FFD200; font-style: normal; font-weight: 820; }
.bu-vorsorge-page .vorsorge-contact-options { grid-template-columns: 1fr; }

@media (min-width: 720px) {
  .bu-vorsorge-page .vorsorge-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bu-vorsorge-page .vorsorge-bento-card.is-protection { grid-row: span 2; min-height: 572px; }
  .bu-vorsorge-page .vorsorge-bento-card.is-build,
  .bu-vorsorge-page .vorsorge-bento-card.is-future { min-height: 280px; }
  .bu-vorsorge-page .vorsorge-answer-grid,
  .bu-vorsorge-page .vorsorge-compare { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bu-vorsorge-page .vorsorge-contribution-card { grid-template-columns: minmax(0, 1fr) 54px minmax(0, 1fr); align-items: stretch; }
  .bu-vorsorge-page .vorsorge-contribution-divider { flex-direction: column; }
  .bu-vorsorge-page .vorsorge-contribution-divider i { width: 1px; height: 100%; }
  .bu-vorsorge-page .vorsorge-time-path { grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr) 44px minmax(0, 1fr); align-items: stretch; }
  .bu-vorsorge-page .vorsorge-time-path > i { min-height: 100%; }
  .bu-vorsorge-page .vorsorge-contact-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .bu-vorsorge-page .detail-hero-grid { grid-template-columns: minmax(0, 1.2fr) minmax(390px, 0.8fr); }
  .bu-vorsorge-page .vorsorge-hero-board { min-height: 470px; }
  .bu-vorsorge-page .vorsorge-bento { grid-template-columns: 1.18fr 0.91fr 0.91fr; }
  .bu-vorsorge-page .vorsorge-bento-card.is-protection { grid-row: auto; min-height: 390px; }
  .bu-vorsorge-page .vorsorge-bento-card.is-build,
  .bu-vorsorge-page .vorsorge-bento-card.is-future { min-height: 390px; }
  .bu-vorsorge-page .vorsorge-combination { grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); align-items: stretch; }
  .bu-vorsorge-page .vorsorge-parallel { min-height: 100%; flex-direction: column; }
  .bu-vorsorge-page .vorsorge-combination-result { grid-column: 1 / -1; min-height: 220px; }
  .bu-vorsorge-page .vorsorge-compare-note { grid-template-columns: minmax(220px, 0.5fr) minmax(0, 1fr) auto; align-items: center; gap: 24px; }
  .bu-vorsorge-page .vorsorge-compare-note a { margin-top: 0; }
}

@media (max-width: 430px) {
  .bu-vorsorge-page .detail-hero { padding-top: 44px; }
  .bu-vorsorge-page .detail-hero h1 { font-size: clamp(2.35rem, 11.4vw, 3rem); }
  .bu-vorsorge-page .vorsorge-hero-board { min-height: 380px; }
  .bu-vorsorge-page .vorsorge-bento-card { min-height: 250px; padding: 22px; }
  .bu-vorsorge-page .vorsorge-combination article,
  .bu-vorsorge-page .vorsorge-combination-result { padding: 22px; }
  .bu-vorsorge-page .vorsorge-answer-grid article { min-height: 250px; padding: 24px; }
  .bu-vorsorge-page .vorsorge-contribution-card article { min-height: 190px; padding: 22px; }
  .bu-vorsorge-page .vorsorge-compare > article { padding: 22px; }
  .bu-vorsorge-page .vorsorge-time-path article { min-height: 180px; }
}

@media (max-width: 719px) {
  .bu-vorsorge-page #vergleich { scroll-margin-top: 92px; }
  .bu-vorsorge-page .detail-myth-grid { align-items: start; }
  .bu-vorsorge-page .detail-myth-card { min-height: 292px; }
  .bu-vorsorge-page .detail-myth-card[aria-expanded="true"] { min-height: 0; padding: 0; align-content: start; }
  .bu-vorsorge-page .detail-myth-card[aria-expanded="true"] > span:first-child,
  .bu-vorsorge-page .detail-myth-card[aria-expanded="true"] > strong,
  .bu-vorsorge-page .detail-myth-card[aria-expanded="true"] > .detail-myth-prompt { display: none; }
  .bu-vorsorge-page .detail-myth-answer { position: relative; inset: auto; min-height: 0; padding: 26px 23px; align-content: start; }
  .bu-vorsorge-page .detail-myth-answer b { font-size: 0.8rem; }
  .bu-vorsorge-page .detail-myth-answer > strong { font-size: 1.08rem; line-height: 1.25; }
  .bu-vorsorge-page .detail-myth-answer small { color: rgba(255, 253, 243, 0.84); font-size: 0.82rem; line-height: 1.5; }
  .bu-vorsorge-page .detail-myth-answer small em { font-size: 0.76rem; line-height: 1.45; }
}

@media (max-width: 359px) {
  .bu-vorsorge-page .detail-hero h1 { font-size: 2.28rem; }
  .bu-vorsorge-page .vorsorge-hero-points article { padding: 18px 60px 18px 16px; }
  .bu-vorsorge-page .vorsorge-hero-points i { right: 14px; width: 38px; height: 38px; }
  .bu-vorsorge-page .vorsorge-bento-card,
  .bu-vorsorge-page .vorsorge-answer-grid article,
  .bu-vorsorge-page .vorsorge-compare > article { padding: 20px; }
  .bu-vorsorge-page .vorsorge-combination article,
  .bu-vorsorge-page .vorsorge-combination-result,
  .bu-vorsorge-page .vorsorge-contribution-card article,
  .bu-vorsorge-page .vorsorge-time-path article { padding: 19px; }
  .bu-vorsorge-page .detail-myth-card { min-height: 284px; }
}