.buehne__rast { display: none; }
.fuehrung-rast { position: absolute; left: 0; width: 1px; height: 1px; pointer-events: none; scroll-snap-align: start; scroll-snap-stop: always; }
@media (pointer: coarse) { html:not(.einstieg-kompakt) { scroll-snap-type: none; } html.fuehrung-rasten:not(.einstieg-kompakt) { scroll-snap-type: y mandatory; } }
.buehne { height: 280vh; }
.stufen { position: relative; isolation: isolate; gap: 0; }
.stufen button { position: relative; z-index: 1; background: none !important; box-shadow: none !important; transition: transform 0.2s; }
.stufen button + button::before { content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: currentColor; opacity: 0.22; }
.stufen button:active { transform: scale(0.96); }
.stufen button svg path, .stufen button svg rect { transition: stroke 0.3s, fill 0.3s; }
.stufen__marke { position: absolute; z-index: 0; left: 0; top: 0; border-radius: 0.65rem; background: #fff; box-shadow: 0 0 0 1px rgb(255 255 255 / 0.6), 0 10px 22px -12px rgb(10 25 45 / 0.6); pointer-events: none; will-change: transform; }
.stufen__spur { position: absolute; z-index: 2; bottom: -0.15rem; height: 2px; border-radius: 2px; background: rgb(255 255 255 / 0.25); pointer-events: none; }
.stufen__spur::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: var(--gold-hell); transform-origin: left; transform: scaleX(var(--fort, 0)); }
.kein-js .stufen__marke, .kein-js .stufen__spur { display: none; }
@media (min-width: 48em) and (min-height: 36em) and (orientation: landscape) {
  .buehne__haft { grid-template-columns: minmax(0, 1fr); grid-template-areas: "alles"; background: var(--himmel-tief); --tafel-b: min(44rem, 46%); }
  .bild { grid-area: alles; }
  .bild::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background:
      linear-gradient(90deg, rgb(7 18 34 / 0.8) 0%, rgb(7 18 34 / 0.66) calc(var(--tafel-b) * 0.55), rgb(7 18 34 / 0.34) calc(var(--tafel-b) * 0.88), rgb(7 18 34 / 0.12) calc(var(--tafel-b) * 1.08), rgb(7 18 34 / 0) calc(var(--tafel-b) * 1.32)),
      linear-gradient(0deg, rgb(7 18 34 / 0.38), rgb(7 18 34 / 0) 26%),
      linear-gradient(180deg, rgb(7 18 34 / 0.22), rgb(7 18 34 / 0) 18%); }
  .einstieg__tafel { grid-area: alles; z-index: 3; justify-self: start; width: var(--tafel-b); max-width: 100%; color: #fff; }
  .einstieg__titel { color: #fff; font-size: clamp(3rem, min(5.4vw, 10vh), 6rem); text-shadow: 0 2px 28px rgb(4 12 24 / 0.35); }
  .buehne__haft { --aussage: clamp(2.6rem, min(4.6vw, 8.6vh), 4.75rem); }
  .einstieg__titel .einstieg__text, .kapitel__satz { color: rgb(255 255 255 / 0.9); text-shadow: 0 1px 14px rgb(4 12 24 / 0.45); }
  .kapitel__titel { color: #fff; text-shadow: 0 2px 24px rgb(4 12 24 / 0.35); }
  .kapitel__marke { color: #e9cf96; }
  .kontakt .knopf { box-shadow: 0 18px 36px -16px rgb(0 0 0 / 0.6); }
  .steuerung { grid-area: alles; flex-direction: row; align-items: stretch; gap: 0; padding: 0.3rem; border-radius: 0.95rem; background: rgb(10 24 44 / 0.42); -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.16), 0 18px 40px -24px rgb(0 0 0 / 0.7); }
  .stufen button { flex-direction: row; gap: 0.5rem; min-height: 2.9rem; padding: 0.35rem 0.95rem 0.35rem 0.7rem; color: rgb(255 255 255 / 0.88); font-size: 0.9375rem; }
  .stufen button svg { width: 2rem; height: 1.6rem; }
  .stufen button.is-an { color: var(--marine); }
  .stufen button, .stufen button.is-an { color: color-mix(in srgb, var(--marine) calc(var(--deckung, 0) * 100%), rgb(255 255 255 / 0.88)); }
  @media (hover: hover) { .stufen button:not(.is-an):hover { color: #fff; } .stufen button:not(.is-an):hover svg { transform: translateY(-1px); } }
  .stufen button svg { transition: transform 0.25s; }
  .stufen button + button::before { background: #fff; opacity: 0.22; }
  .stufen button.is-an::before, .stufen button.is-an + button::before { opacity: 0; transition: opacity 0.2s; }
  .ueberspringen { position: relative; margin-left: 0.3rem; padding: 0 0.9rem 0 1.05rem; border-radius: 0.65rem; color: rgb(255 255 255 / 0.9); font-size: 0.9375rem; text-decoration: none; transition: background-color 0.25s, color 0.25s; }
  .ueberspringen::before { content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: #fff; opacity: 0.3; }
  .ueberspringen span { display: inline-block; transition: transform 0.3s cubic-bezier(0.3, 1.6, 0.5, 1); }
  @media (hover: hover) { .ueberspringen:hover { background: rgb(255 255 255 / 0.12); color: #fff; } .ueberspringen:hover span { transform: translateY(3px); } }
  .stufen__spur { bottom: -0.2rem; }
}
@media (min-width: 48em) and (min-height: 36em) and (orientation: landscape) and (max-width: 74em) {
  .stufen button { padding: 0.35rem 0.6rem; font-size: 0.875rem; } .stufen button svg { display: none; } .ueberspringen { font-size: 0.875rem; }
}
@media (max-width: 47.99em), (max-height: 35.99em), (orientation: portrait) {
  .stufen { padding: 0.25rem; border-radius: 0.9rem; background: #fff; box-shadow: 0 0 0 1px var(--linie-warm), 0 10px 24px -18px rgb(20 33 46 / 0.5); }
  .stufen button { color: var(--tinte-2); }
  .stufen button.is-an { color: #fff; }
  .stufen button, .stufen button.is-an { color: color-mix(in srgb, #fff calc(var(--deckung, 0) * 100%), var(--tinte-2)); }
  .stufen button.is-an svg .neu { fill: rgb(201 164 92 / 0.6); stroke: var(--gold-hell); }
  .stufen__marke { background: var(--marine); box-shadow: 0 8px 18px -10px rgb(27 58 92 / 0.7); }
  .stufen__spur { background: rgb(28 38 50 / 0.12); bottom: -0.45rem; }
  .stufen button.is-an::before, .stufen button.is-an + button::before { opacity: 0; }
}
.v-svg { display: block; overflow: visible; }
.v-svg .v-l { --v-mal: 1; fill: none; stroke: var(--tinte); stroke-width: calc(var(--v-strich, 1.25) * var(--v-mal) * var(--v-skala, 1)); stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 0s linear 0.4s; }
.v-svg .v-k { --v-mal: 1.6; }
.v-svg .v-h { --v-mal: 0.55; }
.v-svg .v-g { --v-mal: 1.3; stroke: var(--gold); }
.v-svg .v-g.v-h { --v-mal: 0.62; }
.v-svg .v-m { --v-mal: 0.5; stroke: var(--tinte-2); opacity: 0.7; }
.v-svg .v-g.v-m { --v-mal: 0.62; stroke: var(--gold); opacity: 1; }
.v-svg .v-klein { --v-skala: 1.6667; }
.v-svg.v-nah { --v-skala: 0.68; }
.v-svg .v-f, .v-svg .v-s { stroke: none; opacity: 0; transition: opacity 0.2s; }
.v-svg .v-f { fill: var(--gold-hell); }
.v-svg .v-s { fill: var(--tinte); }
.v-svg .v-s.v-g { fill: var(--gold-hell); }
.v-svg .v-x { fill: none; stroke: var(--tinte); stroke-width: calc(var(--v-strich, 1.25) * 0.75 * var(--v-skala, 1)); stroke-dasharray: 3 2.4; stroke-linecap: round; opacity: 0; transition: opacity 0.2s; }
.v-svg .v-achse { stroke: var(--tinte-2); stroke-width: calc(var(--v-strich, 1.25) * 0.5 * var(--v-skala, 1)); stroke-dasharray: 9 2.5 1.5 2.5; }
.ist-an > .v-svg .v-l { stroke-dashoffset: 0; transition: stroke-dashoffset 1.1s var(--b-aus) 0.1s; }
.ist-an > .v-svg .v-h { transition: stroke-dashoffset 1.2s var(--b-aus) 0.3s; }
.ist-an > .v-svg .v-g { transition: stroke-dashoffset 1.2s var(--b-aus) 0.55s; }
.ist-an > .v-svg .v-m { transition: stroke-dashoffset 0.9s var(--b-aus) 1s; }
.ist-an > .v-svg .v-f { opacity: 0.26; transition: opacity 0.7s ease 1.05s; }
.ist-an > .v-svg .v-s { opacity: 0.6; transition: opacity 0.6s ease 0.65s; }
.ist-an > .v-svg .v-s.v-g { opacity: 0.5; transition: opacity 0.6s ease 1s; }
.ist-an > .v-svg .v-x { opacity: 0.7; transition: opacity 0.6s ease 0.5s; }
.ist-an > .v-svg .v-achse { opacity: 0.85; transition: opacity 0.8s ease 0.9s; }
.v-blatt { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.v-blatt .v-svg { width: 100%; height: 100%; max-width: 46rem; }
.v-blatt .v-b { fill: none; stroke: var(--tinte); stroke-width: 1px; vector-effect: non-scaling-stroke; opacity: 0.34; }
.v-bild .v-svg { overflow: hidden; }
.v-bild .v-d, .v-bild .v-h, .v-bild .v-m { display: none; }
.b-vorteile__kopf { display: block; }
.b-vorteile__zahl { position: relative; max-width: var(--b-breit); margin: clamp(2rem, 5vw, 3rem) auto 0; padding: clamp(1.2rem, 2vw, 1.6rem) clamp(1.25rem, 2.2vw, 1.75rem); border: 0; border-radius: 0.9rem; background: var(--marine); color: #fff; box-shadow: 0 26px 50px -32px rgb(19 41 74 / 0.75); }
.b-vorteile__zahl strong { color: #e9cf96; font-size: clamp(2.75rem, 2rem + 2vw, 3.5rem); }
.b-vorteile__zahl span { color: rgb(255 255 255 / 0.86); }
.b-vorteile__zahl::after { content: ""; display: block; height: 0.4rem; margin-top: 1.1rem; border-radius: 0.2rem; background: linear-gradient(90deg, rgb(255 255 255 / 0.16) 30%, var(--gold-hell) 30% 60%, rgb(255 255 255 / 0.16) 60%); }
@media (min-width: 48em) {
  .b-vorteile__zahl { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1.5rem; align-items: center; }
  .b-vorteile__zahl span { margin: 0; max-width: 40rem; }
  .b-vorteile__zahl::after { grid-column: 1 / -1; }
}
.v-buehne, .w-flieger, .w-ring, .r-seite { display: none; }
.v-haft, .r-strecke, .r-haft, .r-links, .r-fenster { display: contents; }
.b-vorteil { position: relative; }
.v-bild { display: none; }
html:not(.ideen-gross) .v-bild { display: block; position: absolute; top: 1.1rem; right: 0; width: 5.75rem; height: 3.6rem; pointer-events: none; }
html:not(.ideen-gross) .v-bild .v-svg { --v-strich: 3.4; width: 100%; height: 100%; }
html:not(.ideen-gross) .b-vorteil h3 { min-height: 3.7rem; padding-right: 6.5rem; -webkit-hyphens: auto; hyphens: auto; }
html.ideen-gross .b-vorteile { --v-seg: 30vh; position: relative; height: calc(100vh - var(--kopf-h) + 8 * var(--v-seg)); padding: 0 var(--rand); }
html.ideen-gross .v-haft { display: grid; position: sticky; top: var(--kopf-h); height: calc(100vh - var(--kopf-h)); max-width: var(--b-breit); margin: 0 auto; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: auto auto auto; align-content: center; align-content: safe center; column-gap: clamp(2.5rem, 5vw, 5.5rem); row-gap: clamp(0.9rem, 2.4vh, 1.75rem); padding-block: clamp(0.75rem, 3vh, 2.25rem); }
html.ideen-gross .b-vorteile__kopf { grid-column: 1; grid-row: 1; margin: 0; }
html.ideen-gross .b-vorteile__kopf > div { padding: 0; border: 0; }
html.ideen-gross .b-vorteile__liste { grid-column: 1; grid-row: 2; display: flex; flex-direction: column; max-width: none; margin: 0; padding: 0; gap: 0; }
html.ideen-gross .b-vorteil { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); grid-template-rows: auto; grid-row: auto; column-gap: 0.5rem; align-items: baseline; padding: 0.3rem 0.85rem; border: 0; border-radius: 0.8rem; cursor: pointer; transition: background-color 0.3s, box-shadow 0.3s; }
html.ideen-gross .b-vorteil__nr { grid-row: 1; padding: 0; font-size: 0.875rem; font-weight: 600; color: var(--klein); transform-origin: 0 0; }
html.ideen-gross .b-vorteil h3 { grid-row: 1; min-height: 0; padding: 0; font-size: 1rem; font-weight: 500; line-height: 1.3; letter-spacing: 0; color: var(--tinte-2); transform-origin: 0 0; transition: color 0.25s; }
@media (hover: hover) { html.ideen-gross .b-vorteil:not(.ist-an):hover h3 { color: var(--marine); } }
html.ideen-gross .b-vorteil p { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html.ideen-gross .b-vorteil.ist-an { margin-block: clamp(0.3rem, 1vh, 0.6rem); padding: clamp(0.8rem, 2.1vh, 1.3rem) clamp(1rem, 1.6vw, 1.4rem); background: #fff; box-shadow: inset 0 0 0 1px var(--linie-warm), 0 22px 44px -34px rgb(19 41 74 / 0.5); cursor: default; }
html.ideen-gross .b-vorteil.ist-an:first-child { margin-top: 0; }
html.ideen-gross .b-vorteil.ist-an:last-child { margin-bottom: 0; }
html.ideen-gross .b-vorteil.ist-an .b-vorteil__nr { font-size: 1.125rem; font-weight: 700; color: var(--b-blau); }
html.ideen-gross .b-vorteil.ist-an h3 { font-size: clamp(1.375rem, min(1rem + 1.1vw, 3.6vh), 1.875rem); font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; color: var(--marine); text-wrap: balance; }
html.ideen-gross .b-vorteil.ist-an p { position: static; grid-column: 2; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; margin: 0.5rem 0 0; max-width: 32rem; font-size: clamp(0.9375rem, 2.1vh, 1.0625rem); line-height: 1.5; color: var(--tinte); animation: v-satz 0.5s var(--b-aus) 0.14s both; }
@keyframes v-satz { from { opacity: 0; transform: translateY(0.4rem); } }
html.ideen-gross .b-vorteile__zahl { grid-column: 1; grid-row: 3; max-width: none; margin: 0; padding: clamp(0.8rem, 2vh, 1.2rem) clamp(1rem, 1.8vw, 1.4rem); column-gap: 1.1rem; }
html.ideen-gross .b-vorteile__zahl strong { font-size: clamp(1.9rem, min(1.2rem + 1.6vw, 5vh), 2.75rem); }
html.ideen-gross .b-vorteile__zahl span { font-size: 0.875rem; line-height: 1.4; }
html.ideen-gross .b-vorteile__zahl::after { height: 0.3rem; margin-top: clamp(0.55rem, 1.4vh, 0.85rem); }
.v-mess { display: none; }
html.ideen-gross .b-vorteile__liste.v-mess { display: flex; position: absolute; top: 0; left: 0; min-height: 0; visibility: hidden; pointer-events: none; }
.v-mess, .v-mess * { animation: none !important; transition: none !important; }
html.ideen-gross .v-haft.ist-eng { row-gap: 0.6rem; padding-block: 0.5rem; }
html.ideen-gross .ist-eng .b-vorteile__kopf .b-marke { margin-bottom: 0.45rem; }
html.ideen-gross .ist-eng .b-vorteile__kopf h2 { font-size: clamp(1.75rem, 5.4vh, 2.5rem); }
html.ideen-gross .ist-eng .b-vorteile__text { margin-top: 0.35rem; font-size: 0.9375rem; }
html.ideen-gross .ist-eng .b-vorteil { padding-block: 0.1rem; }
html.ideen-gross .ist-eng .b-vorteil h3 { line-height: 1.25; }
html.ideen-gross .ist-eng .b-vorteil.ist-an { margin-block: 0.2rem; padding-block: 0.6rem; }
html.ideen-gross .ist-eng .b-vorteil.ist-an:first-child { margin-top: 0; }
html.ideen-gross .ist-eng .b-vorteil.ist-an:last-child { margin-bottom: 0; }
html.ideen-gross .ist-eng .b-vorteil.ist-an p { margin-top: 0.3rem; font-size: 0.9375rem; line-height: 1.45; }
html.ideen-gross .ist-eng .b-vorteile__zahl { padding: 0.65rem 1rem; }
html.ideen-gross .ist-eng .b-vorteile__zahl strong { font-size: 1.75rem; }
html.ideen-gross .ist-eng .b-vorteile__zahl span { font-size: 0.8125rem; line-height: 1.35; }
html.ideen-gross .ist-eng .b-vorteile__zahl::after { display: none; }
html.ideen-gross .ist-enger .b-vorteile__text { display: none; }
html.ideen-gross .ist-enger .b-vorteile__kopf h2 { font-size: clamp(1.5rem, 4.6vh, 2.1rem); }
html.ideen-gross .ist-enger .b-vorteil:not(.ist-an) h3 { font-size: 0.9375rem; }
html.ideen-gross .v-buehne { grid-column: 2; grid-row: 1 / -1; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: clamp(0.75rem, 2vh, 1.5rem); min-height: 0; padding: clamp(1.25rem, 2.4vw, 2.25rem); border-radius: 1.1rem; background-color: var(--papier); background-image: var(--raster); box-shadow: inset 0 0 0 1px var(--linie-warm), 0 34px 64px -44px rgb(19 41 74 / 0.5); overflow: hidden; }
.v-buehne__kopf { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.v-zaehler { margin: 0; display: flex; align-items: baseline; gap: 0.4rem; color: var(--b-blau); font-variant-numeric: tabular-nums; }
.v-zaehler__nr { font-size: clamp(2.25rem, 1.6rem + 1.6vw, 3rem); font-weight: 700; line-height: 1; letter-spacing: -0.04em; }
.v-zaehler__von { font-size: 1rem; font-weight: 600; color: var(--tinte-2); }
.v-fort { display: flex; gap: 0.375rem; }
.v-fort i { position: relative; width: clamp(1.1rem, 1.8vw, 1.9rem); height: 4px; border-radius: 2px; background: rgb(28 38 50 / 0.12); overflow: hidden; }
.v-fort i::after { content: ""; position: absolute; inset: 0; background: var(--gold); transform-origin: left; transform: scaleX(var(--v-teil, 0)); }
.v-folien { position: relative; min-height: 0; }
.v-folie { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.35s var(--b-aus); }
.v-folie.ist-an { opacity: 1; transition-delay: 0.08s; }
.v-folie .v-svg { --v-strich: 0.62; width: 100%; height: 100%; max-width: 46rem; }
html.ideen-gross .b-wege { position: relative; }
html.ideen-gross .b-weg__zeichnung > .b-haus { visibility: hidden; }
html.ideen-gross .w-flieger { --flug: 0; display: block; position: absolute; left: 0; top: 0; z-index: 4; pointer-events: none; transform-origin: 50% 55%; will-change: transform; }
html.ideen-gross .w-flieger::before { content: ""; position: absolute; inset: -18% -9% -12%; border-radius: 1.25rem; background: rgb(246 242 234 / 0.95); box-shadow: inset 0 0 0 1px var(--linie-warm), 0 28px 56px -30px rgb(19 41 74 / 0.55); opacity: var(--flug); }
html.ideen-gross .w-flieger .b-haus { position: relative; }
html.ideen-gross .w-ring { display: block; position: absolute; left: 0; top: 0; z-index: 3; pointer-events: none; will-change: transform; }
.w-ring b, .w-ring i { position: absolute; inset: 0; border-radius: 50%; }
.w-ring b { border: 2px dashed var(--gold); background: radial-gradient(closest-side, rgb(201 164 92 / 0.24), rgb(201 164 92 / 0));opacity: var(--naehe, 0); transform: scale(calc(0.7 + 0.3 * var(--naehe, 0))); }
.w-ring i { border: 2px solid var(--gold-hell); opacity: 0; }
.w-ring.ist-gelandet i { animation: w-landen 0.8s var(--b-aus); }
@keyframes w-landen { from { opacity: 0.9; transform: scale(0.92); } to { opacity: 0; transform: scale(1.4); } }
.b-fakten dd { font-size: 1.1875rem; }
.b-tagebuch__seite { min-width: 0; }
@media (min-width: 60em) {
  .b-tagebuch__oben { grid-template-rows: auto auto; row-gap: 0; }
  .b-tagebuch__kopf { grid-column: 1; grid-row: 1; align-self: end; }
  .b-tagebuch__vergleich { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .b-tagebuch__seite { grid-column: 1; grid-row: 2; align-self: start; padding-top: clamp(1.5rem, 3vh, 2.25rem); }
}
.b-wahl__leiste { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr 1fr; padding: 0.25rem; border-radius: 0.75rem; background: #fff; box-shadow: inset 0 0 0 1px var(--linie-warm), 0 10px 24px -20px rgb(20 33 46 / 0.5); }
.b-wahl__knopf { position: relative; min-height: 2.75rem; padding: 0 1rem; border: 0; border-radius: 0.55rem; background: none; font: inherit; font-size: 0.9375rem; font-weight: 600; color: var(--tinte); cursor: pointer; -webkit-user-select: none; user-select: none; transition: color 0.1s 0.1s; }
.b-wahl__knopf::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--marine); clip-path: inset(0 100% 0 0); transition: clip-path 0.22s cubic-bezier(0.55, 0, 0.8, 0.2); }
.b-wahl__knopf + .b-wahl__knopf::before { clip-path: inset(0 0 0 100%); }
.b-wahl__knopf[aria-pressed="true"]::before { clip-path: inset(0); transition: clip-path 0.36s var(--b-aus) 0.16s; }
.b-wahl__knopf[aria-pressed="true"] { color: #fff; cursor: default; transition: color 0.12s 0.24s; }
@media (prefers-reduced-motion: reduce) { .b-wahl__knopf, .b-wahl__knopf::before { transition: none; } }
.b-wahl__knopf:focus-visible { outline: 2px solid var(--b-blau); outline-offset: 2px; }
@media (hover: hover) { .b-wahl__knopf[aria-pressed="false"]:hover { color: var(--marine); } }
.b-wahl__satz { margin: 0.75rem 0 0; max-width: 30rem; min-height: 3em; font-size: 0.9375rem; line-height: 1.5; color: var(--tinte); text-wrap: pretty; }
.b-tagebuch__weiter { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: clamp(1.25rem, 2.5vw, 1.75rem); padding-top: clamp(1.25rem, 2.5vw, 1.75rem); border-top: 1px solid rgb(28 38 50 / 0.15); }
.b-tagebuch__frage { flex: 1 1 12rem; margin: 0; font-size: 0.9375rem; line-height: 1.5; color: var(--tinte); }
.b-tagebuch__frage strong { display: block; margin-bottom: 0.15rem; font-size: 1.0625rem; color: var(--marine); }
.b-tagebuch__knopf { flex: none; border-radius: 0.55rem; background: var(--marine); }
.kein-js .b-wahl { display: none; }
@media (max-width: 47.99em) { .b-tagebuch__knopf { width: 100%; } }
html.ideen-gross .r-strecke { --r-seg: 40vh; display: block; position: relative; height: calc(100vh - var(--kopf-h) + 2 * var(--r-seg)); margin-top: clamp(1.5rem, 4vh, 3rem); }
html.ideen-gross .r-haft { display: grid; position: sticky; top: var(--kopf-h); height: calc(100vh - var(--kopf-h)); max-width: var(--b-breit); margin: 0 auto; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(2rem, 4vw, 4.5rem); align-items: center; }
html.ideen-gross .r-links { display: block; }
html.ideen-gross .r-links .b-reihe__titel { margin: 0; }
html.ideen-gross .r-seite { display: block; }
html.ideen-gross .r-fenster { display: block; overflow-x: clip; overflow-y: visible; margin-right: calc(-1 * var(--rand)); padding-block: 2rem; }
html.ideen-gross .b-reihe { --r-karte: min(45rem, 50vw, calc((100vh - var(--kopf-h) - 8rem) * 1.45));    display: flex; gap: clamp(1.25rem, 2.2vw, 2.25rem); max-width: none; margin: 0; will-change: transform; }
html.ideen-gross .b-reihe__foto { --nah: 0; flex: 0 0 var(--r-karte); }
html.ideen-gross .b-reihe__foto .b-abzug { transform-origin: 0 50%; transform: scale(calc(0.84 + 0.16 * var(--nah))); opacity: calc(0.38 + 0.62 * var(--nah)); box-shadow: 0 30px 60px -36px rgb(19 41 74 / 0.55); will-change: transform, opacity; }
html.ideen-gross .b-reihe__foto .projekt__gross img { transform: scale(calc(1.07 - 0.07 * var(--nah))); transition: none; will-change: transform; }
html.ideen-gross .b-reihe__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.r-zaehler { margin: clamp(0.75rem, 2.5vh, 1.75rem) 0 0; display: flex; align-items: baseline; gap: 0.5rem; color: var(--b-blau); font-variant-numeric: tabular-nums; }
.r-zaehler__nr { font-size: clamp(3.25rem, min(1.5rem + 4vw, 10vh), 6.5rem); font-weight: 700; line-height: 0.85; letter-spacing: -0.05em; }
.r-zaehler__von { font-size: 1.125rem; font-weight: 600; color: var(--tinte-2); }
.r-texte { display: grid; margin-top: clamp(0.6rem, 1.8vh, 1.25rem); }
.r-text { grid-area: 1 / 1; opacity: 0; transform: translateY(0.75rem); transition: opacity 0.3s var(--b-aus), transform 0.5s var(--b-aus); }
.r-text.ist-an { opacity: 1; transform: none; transition-delay: 0.06s; }
.r-text__titel { margin: 0; font-size: var(--b-h3); font-weight: 700; line-height: 1.2; color: var(--marine); }
.r-text__satz { margin: 0.4rem 0 0; max-width: 26rem; font-size: clamp(0.9375rem, 2.2vh, 1.125rem); line-height: 1.5; color: var(--tinte); text-wrap: pretty; }
.r-punkte { --r-fort: 0; list-style: none; position: relative; display: flex; justify-content: space-between; max-width: 22rem; margin: clamp(1rem, 3vh, 1.75rem) 0 0; padding: 1.15rem 0 0; }
.r-punkte::before, .r-punkte::after { content: ""; position: absolute; top: 0.28rem; left: 0.3rem; right: 0.3rem; height: 2px; background: rgb(28 38 50 / 0.15); }
.r-punkte::after { background: var(--gold); transform-origin: left; transform: scaleX(var(--r-fort)); }
.r-punkte li { position: relative; font-size: 0.9375rem; font-weight: 600; color: var(--klein); cursor: pointer; transition: color 0.3s; }
.r-punkte li::before { content: ""; position: absolute; top: -1.15rem; left: 0; width: 0.62rem; height: 0.62rem; border-radius: 50%; background: var(--papier-blau); box-shadow: inset 0 0 0 2px rgb(28 38 50 / 0.3); transition: background-color 0.3s, box-shadow 0.3s; }
.r-punkte li:nth-child(2):not(:last-child)::before { left: calc(50% - 0.31rem); }
.r-punkte li:last-child::before { left: auto; right: 0; }
.r-punkte li.ist-an, .r-punkte li.ist-durch { color: var(--marine); }
.r-punkte li.ist-an::before, .r-punkte li.ist-durch::before { background: var(--gold); box-shadow: none; }
.b-vorteile { position: relative; }
.b-check .check__zaehler { font-size: 1rem; font-weight: 600; color: var(--marine); }
.b-check .check__frage legend { margin-bottom: 1.2rem; }
.b-check .check__wahl { gap: 0.6rem; border: 0; }
.b-check .check__wahl button { position: relative; min-height: 3.6rem; padding: 0.85rem 2.6rem 0.85rem 3.05rem; border: 1.5px solid rgb(28 38 50 / 0.16); border-radius: 0.75rem; background: #fff; color: var(--tinte); font-size: 1.0625rem; font-weight: 500; line-height: 1.3; box-shadow: 0 1px 0 rgb(28 38 50 / 0.04); transition: border-color 0.2s, background-color 0.2s, color 0.2s, box-shadow 0.25s, transform 0.15s; }
.b-check .check__wahl button::before { content: ""; position: absolute; left: 1.05rem; top: 50%; width: 1.15rem; height: 1.15rem; margin-top: -0.575rem; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1.5px rgb(28 38 50 / 0.35); transition: box-shadow 0.2s, background-color 0.2s; }
.b-check .check__wahl button::after { position: absolute; right: 1.05rem; top: 50%; margin-top: -0.7em; line-height: 1.4; }
@media (hover: hover) {
  .b-check .check__wahl button:hover { border-color: var(--b-blau-linie); background: #f3f7fa; color: var(--marine); box-shadow: 0 12px 24px -18px rgb(19 41 74 / 0.5); transform: translateY(-1px); }
  .b-check .check__wahl button:hover::before { box-shadow: inset 0 0 0 1.5px var(--b-blau-linie); }
}
.b-check .check__wahl button:active { transform: scale(0.985); color: var(--marine); }
.b-check .check__wahl button[aria-pressed="true"] { border-color: var(--marine); background: var(--marine); color: #fff; }
.b-check .check__wahl button[aria-pressed="true"]::before { background: var(--gold-hell); box-shadow: inset 0 0 0 3.5px #fff; }
.b-check .check__wahl button[aria-pressed="true"]::after { color: #e9cf96; opacity: 1; }
.b-check .check__wahl--laender { grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); column-gap: 0.6rem; }
.b-check .check__wahl--laender button { padding-right: 1rem; }
@media (min-width: 64em) { .b-check .check__wahl:not(.check__wahl--laender) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .b-check .check__wahl button { transition: none; } .b-check .check__wahl button:hover, .b-check .check__wahl button:active { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .v-svg .v-l, .ist-an > .v-svg .v-l { stroke-dashoffset: 0; transition: none; }
  .v-svg .v-f { opacity: 0.26; transition: none; }
  .v-svg .v-s { opacity: 0.6; transition: none; } .v-svg .v-s.v-g { opacity: 0.5; } .v-svg .v-x { opacity: 0.7; transition: none; }
  .v-folie, .r-text, .stufen__marke, .w-ring b, .w-ring i { transition: none; animation: none; }
}
.b-band { position: relative; overflow: clip; background: var(--plan-nacht); color: var(--papier); }
.b-band__mass { --strich: rgb(246 242 234 / 0.4); position: absolute; left: 0; width: calc(100% + 100px); height: 1rem; pointer-events: none;
  background: linear-gradient(90deg, var(--gold-hell) 2px, transparent 2px) 0 0 / 100px 100% repeat-x,
    linear-gradient(90deg, var(--strich) 1px, transparent 1px) 0 0 / 50px 62% repeat-x,
    linear-gradient(90deg, var(--strich) 1px, transparent 1px) 0 0 / 10px 32% repeat-x; }
.b-band__mass--oben { top: 0; }
.b-band__mass--unten { bottom: 0; background-position: 0 100%, 0 100%, 0 100%; }
.b-band__spur { display: flex; align-items: center; width: max-content; padding-block: clamp(1.7rem, 3.6vh, 2.6rem); font: 600 clamp(1.75rem, 0.9rem + 2.5vw, 3.5rem)/1.1 var(--display); letter-spacing: -0.025em; white-space: nowrap; }
.b-band__spur span { padding-inline: clamp(1.4rem, 3vw, 3.2rem); }
.b-band__spur i { flex: none; width: 2px; height: 0.7em; background: var(--gold-hell); opacity: 0.85; }
.r-woerter { display: none; }
html.ideen-gross .r-fenster { position: relative; }
html.ideen-gross .r-woerter { display: block; position: absolute; inset: 0; pointer-events: none; }
html.ideen-gross .r-wort { position: absolute; left: -0.04em; top: var(--r-wy, 0px); font: 700 var(--r-wf, 12rem)/1 var(--display); letter-spacing: -0.045em; white-space: nowrap; color: rgb(19 41 74 / 0.08); opacity: 0; will-change: transform, opacity; }
.b-lineal { position: absolute; left: 0; right: 0; bottom: 0; height: 7px; pointer-events: none;
  background: linear-gradient(90deg, rgb(255 255 255 / 0.4) 1px, transparent 1px) 0 100% / 40px 7px repeat-x,
    linear-gradient(90deg, rgb(255 255 255 / 0.26) 1px, transparent 1px) 0 100% / 8px 3px repeat-x; }
.b-lineal b { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--gold-hell); transform-origin: 0 50%; transform: scaleX(0); }
.b-marke::before { width: 2.25rem; height: 9px; background: linear-gradient(currentColor, currentColor) 0 50% / 100% 1px no-repeat, linear-gradient(currentColor, currentColor) 0 0 / 1px 100% no-repeat, linear-gradient(currentColor, currentColor) 100% 0 / 1px 100% no-repeat; }
html.ideen-marken .b-marke::before { transform-origin: 0 50%; transform: scaleX(0); transition: transform 0.9s var(--b-aus) 0.15s; }
html.ideen-marken .b-marke.ist-da::before { transform: none; }
