/* ==========================================================================
   Re:vive Unterseite — seitenspezifische Stile (Entwurf 2)
   Änderungen gegenüber Entwurf 1: Hero geteilt, Demo gestapelt (jetzt in base.css),
   Story-Sequenz statt „Drei Situationen", Rechner.
   ========================================================================== */

/* ---------- Wortmarke ---------- */
.rv-logo { font-family: var(--f-display); font-weight: 700; font-size: 1.5rem; letter-spacing: -.02em; color: var(--text); line-height: 1; }
.rv-logo b { color: var(--sand); font-weight: 700; }
.rv-by { display: inline-flex; align-items: center; gap: 8px; font-size: .8125rem; color: var(--text-3); padding-left: 14px; border-left: 1px solid var(--line); line-height: 1; }
.rv-by img { height: 12px; width: auto; }
@media (max-width: 480px) { .rv-by span { display: none; } }

/* ---------- Hero, geteilt: Text links, Demo rechts im ersten Bildschirm ---------- */
.rv-hero { padding-block: clamp(48px, 6vw, 72px) clamp(48px, 6vw, 72px); overflow: hidden; }
.rv-hero__grid > * { min-width: 0; }
.rv-hero__grid { display: grid; grid-template-columns: 10fr 14fr; gap: clamp(28px, 4vw, 56px); align-items: center; }
.rv-hero__cat { font-weight: 500; color: var(--accent); margin-bottom: 1.1rem; font-size: .9375rem; }
.rv-hero__text .h1 { font-size: clamp(2.1rem, 3.25vw, 3.05rem); max-width: none; }
/* Claim: ein Satz pro Zeile, auf breiten Bildschirmen ohne Umbruch im Satz */
.rv-claim span { display: block; }
@media (min-width: 1024px) { .rv-claim span { white-space: nowrap; } }
@media (max-width: 1023px) { .rv-hero__text .h1.rv-claim { font-size: clamp(1.95rem, 8.6vw, 3.25rem); } .rv-claim span { white-space: nowrap; } }
.rv-hero__text .lead { margin-top: 20px; font-size: clamp(1.05rem, 1.3vw, 1.2rem); max-width: 30em; }
.rv-hero__text .btn-row { margin-top: 28px; }
@media (max-width: 1023px) {
  .rv-hero__grid { grid-template-columns: 1fr; }
  .rv-hero__text .h1 { font-size: clamp(2.5rem, 6vw, 3.4rem); }
  .rv-hero__text { max-width: 44rem; }
}

/* ---------- Ausgangslage: Zahlen mit Quelle ---------- */
.rv-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(20px, 3vw, 40px); }
.rv-fact { padding-left: 18px; border-left: 2px solid var(--copper); }
.rv-fact dt { font-weight: 700; font-variant-numeric: tabular-nums; font-size: clamp(1.7rem, 2.6vw, 2.25rem); line-height: 1.1; color: var(--text); letter-spacing: -.01em; margin-bottom: 10px; }
.rv-fact dd { margin: 0; color: var(--text-2); font-size: .9875rem; line-height: 1.5; text-wrap: pretty; }
.rv-fact .source { display: block; margin-top: 10px; }
@media (max-width: 899px) { .rv-facts { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .rv-facts { grid-template-columns: 1fr; } }

/* ---------- Story: vier Schritte, wie eine Folienfolge ---------- */
.rv-story { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 28px); }
.rv-story__step { display: grid; grid-template-rows: auto auto auto 1fr; gap: 12px; }
.rv-story__n { font-variant-numeric: tabular-nums; font-weight: 600; font-size: .8125rem; color: var(--accent); }
.rv-story__title { font-family: var(--f-display); font-weight: 700; font-size: clamp(1.35rem, 1.8vw, 1.7rem); line-height: 1.15; letter-spacing: -.015em; min-height: 2.3em; color: var(--text); text-wrap: balance; }
.rv-story__visual { height: 224px; border-radius: 10px; overflow: hidden; }
.rv-story__visual > * { height: 100%; }
.rv-story__step > p { color: var(--text-2); font-size: .9875rem; text-wrap: pretty; }
.rv-story .placeholder { aspect-ratio: auto; border-radius: 0; }
.rv-story__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rv-story__img--q { object-position: 30% 60%; }
.rv-story__img--leave { object-position: 50% 45%; }
.rv-counts { list-style: none; margin: 0; padding: 6px 22px; background: var(--night); color: var(--dark-text); display: grid; grid-template-rows: repeat(3, 1fr); }
.rv-counts li { display: grid; grid-template-columns: 38px 1fr; grid-template-rows: auto auto; column-gap: 14px; align-content: center; border-bottom: 1px solid var(--dark-line); }
.rv-counts__ico { grid-row: 1 / 3; align-self: center; }
.rv-counts li:last-child { border-bottom: 0; }
.rv-counts__ico { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(231,201,160,.12); color: var(--sand); }
.rv-counts__ico svg { width: 19px; height: 19px; }
.rv-counts b { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 1.35rem; line-height: 1.15; letter-spacing: -.01em; color: #fff; }
.rv-counts__l { font-size: .8125rem; line-height: 1.3; color: var(--dark-text-2); }
.rv-questions { background: var(--bg-2); border: 1px solid var(--line); padding: 12px 14px; display: grid; align-content: center; gap: 12px; overflow: hidden; }
.rv-questions span { position: relative; display: inline-block; justify-self: start; max-width: 88%; padding: 8px 13px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(20,28,46,.06); font-size: .8rem; line-height: 1.35; color: var(--text); }
/* Zipfel der Sprechblase */
.rv-questions span::after { content: ""; position: absolute; bottom: -6px; left: 16px; width: 10px; height: 10px; background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transform: rotate(45deg); }
.rv-questions span:nth-child(even)::after { left: auto; right: 16px; }
.rv-questions span:nth-child(even) { background: var(--accent-tint); }
.rv-questions span:nth-child(even)::after { background: var(--accent-tint); }
.rv-questions span:nth-child(even) { justify-self: end; }
@media (max-width: 1023px) { .rv-story { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rv-story { grid-template-columns: 1fr; } .rv-story__title { min-height: 0; } }

.rv-callout { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: auto 1fr; gap: 22px; padding: clamp(24px, 3vw, 36px) clamp(24px, 3.5vw, 44px); border-radius: var(--r-md); background: var(--bg-2); border-left: 4px solid var(--copper); }
.rv-callout__kicker { font-variant-numeric: tabular-nums; font-weight: 600; font-size: .8rem; color: var(--accent); padding-top: .35em; white-space: nowrap; }
.rv-callout .h3 { margin-bottom: 8px; }
.rv-callout p { color: var(--text-2); max-width: 62ch; }
@media (max-width: 640px) { .rv-callout { grid-template-columns: 1fr; gap: 8px; } }

/* ---------- Rechner ---------- */
.rv-calc { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 56px); padding: clamp(28px, 4vw, 48px); border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); }
@media (max-width: 899px) { .rv-calc { grid-template-columns: 1fr; } }
.rv-calc__inputs { display: grid; gap: 24px; align-content: start; }
.rv-range label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: .9375rem; font-weight: 500; margin-bottom: 8px; color: var(--text); }
.rv-range output { font-variant-numeric: tabular-nums; font-weight: 600; font-size: .95rem; color: var(--accent); white-space: nowrap; }
.rv-range input[type="range"] { width: 100%; accent-color: var(--accent); cursor: pointer; }
.rv-range small { display: block; margin-top: 6px; font-size: .8rem; color: var(--text-3); line-height: 1.45; }
.rv-calc__result { display: grid; align-content: start; gap: 18px; padding-left: clamp(0px, 3vw, 32px); border-left: 1px solid var(--line); }
@media (max-width: 899px) { .rv-calc__result { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: 22px; } }
.rv-calc__big { font-weight: 700; font-variant-numeric: tabular-nums; font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1; color: var(--accent); letter-spacing: -.01em; }
.rv-calc__label { font-size: .9375rem; color: var(--text-2); margin-top: 8px; }
.rv-calc__rows { display: grid; gap: 8px; font-size: .9rem; color: var(--text-2); }
.rv-calc__rows div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 7px; }
.rv-calc__rows b { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); white-space: nowrap; }
.rv-calc__year { padding: 14px 16px; border-radius: 8px; background: var(--accent-tint); color: var(--text); font-weight: 500; line-height: 1.5; }
.rv-calc__year b { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--accent); }
.rv-calc__note { font-size: .8125rem; color: var(--text-3); line-height: 1.5; }

/* ---------- Ergebnis: Produktaufbau im Format der Nachfolge ---------- */
.rv-story--3 { grid-template-columns: repeat(3, 1fr); }
.rv-story--3 .rv-story__title { min-height: 0; }
.rv-story--3 .rv-story__visual { height: 292px; border: 1px solid var(--line); background: #fff; }
.rv-story__cap { margin-top: 18px; font-size: .8125rem; color: var(--text-3); text-align: right; }
@media (max-width: 1023px) { .rv-story--3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 680px) { .rv-story--3 { grid-template-columns: 1fr; } }

/* Dossier, kompakt */
.rv-dos { margin: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 7px; color: #1E1F23; }
.rv-dos__h { font-size: .9375rem; font-weight: 700; letter-spacing: -.01em; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.rv-dos__h span { font-size: .6875rem; font-weight: 400; color: #6B7280; white-space: nowrap; }
.rv-dos__h + .rv-dos__chips, .rv-dos__todo + .rv-dos__h { margin-top: 2px; }
.rv-dos__todo { border: 1px solid #E5E7EB; border-left: 3px solid #DC3B3B; border-radius: 8px; padding: 6px 10px; display: grid; gap: 1px; }
.rv-dos__todo .rv-mini__tags { margin-bottom: 2px; }
.rv-dos__todo b { font-size: .8125rem; font-weight: 700; line-height: 1.3; }
.rv-dos__todo small { font-size: .6875rem; color: #6B7280; }
.rv-dos__chips { display: flex; flex-wrap: wrap; gap: 4px; }
.rv-dos__chips span { font-size: .6875rem; padding: 2px 8px; border: 1px solid #E5E7EB; border-radius: 99px; background: #F9FAFB; white-space: nowrap; }
.rv-dos__chips em { font-style: normal; color: #6B7280; }

/* Chat, kompakt */
.rv-chat { margin: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; color: #1E1F23; font-size: .8125rem; line-height: 1.45; }
.rv-chat__q { align-self: flex-end; max-width: 88%; background: #F3E6D2; color: #2B2418; padding: 7px 12px; border-radius: 12px 12px 3px 12px; }
.rv-chat__a { background: #F7F7F8; border: 1px solid #E5E7EB; border-radius: 10px; padding: 9px 11px; display: grid; gap: 5px; }
.rv-chat__a b { font-weight: 600; }
.rv-chat__stat { display: flex; align-items: center; gap: 6px; color: #6B7280; font-size: .6875rem; }
.rv-chat__ok { width: 13px; height: 13px; border-radius: 50%; flex: none; background: #2F6F73 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat; }
.rv-chat__note { font-size: .75rem; color: #8A5A12; }
.rv-chat__note::before { content: "Hinweis: "; font-weight: 600; }
.rv-chat__src { align-self: flex-start; border: 1px solid #E5E7EB; border-radius: 8px; padding: 3px 10px; color: #4B5563; font-size: .6875rem; }
.rv-chat__src::before { content: "▸ "; }

/* Netzwerkgraph, kompakt */
.rv-graph { margin: 0; position: relative; background: #F8F9FA; display: flex; flex-direction: column; }
.rv-graph svg { display: block; width: 100%; flex: 1; min-height: 0; font-family: var(--f-display); }
.rv-graph .e { stroke: #A9B0BA; stroke-linecap: round; opacity: .75; transition: opacity .25s, stroke .25s; }
.rv-graph .e--in { stroke: #CDD2D9; }
.rv-graph .n circle { stroke: rgba(0,0,0,.18); stroke-width: 1; transition: opacity .25s; }
.rv-graph .n text { font-size: 11.5px; fill: #1E1F23; paint-order: stroke; stroke: #F8F9FA; stroke-width: 3px; stroke-linejoin: round; transition: opacity .25s; }
.rv-graph .n--p circle, .rv-graph__legend .is-p { fill: #2A3346; background: #2A3346; }
.rv-graph .n--o circle, .rv-graph__legend .is-o { fill: #C9A571; background: #C9A571; }
.rv-graph .n--s circle, .rv-graph__legend .is-s { fill: #3A7D86; background: #3A7D86; }
.rv-graph .n--a circle, .rv-graph__legend .is-a { fill: #A07C93; background: #A07C93; }
.rv-graph .n--i circle { fill: #8B929C; }
.rv-graph .n--core circle { fill: #141C2E; }
.rv-graph .n--core .n__ring { fill: none; stroke: #C9A571; stroke-width: 2.5; }
.rv-graph .n--core text { font-weight: 700; font-size: 12px; }
.rv-graph svg.is-focus .e:not(.is-on) { opacity: .1; }
.rv-graph svg.is-focus .e.is-on { stroke: #735632; opacity: 1; }
.rv-graph svg.is-focus .n:not(.is-on) circle, .rv-graph svg.is-focus .n:not(.is-on) text { opacity: .2; }
.rv-graph__legend { list-style: none; margin: 0; padding: 6px 12px 9px; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .6875rem; color: #4B5563; }
.rv-graph__legend li { display: flex; align-items: center; gap: 5px; }
.rv-graph__legend i { width: 8px; height: 8px; border-radius: 50%; }

/* ---------- Fragen: nach Themen gruppiert ---------- */
.rv-faq { display: grid; gap: clamp(40px, 5vw, 64px); }
.rv-faq__group { scroll-margin-top: 96px; }
.rv-faq__title { font-size: .875rem; font-weight: 600; letter-spacing: .02em; color: var(--accent); margin-bottom: 6px; }
@media (min-width: 900px) {
  .rv-faq__group { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(40px, 4.5vw, 72px); align-items: start; }
  .rv-faq__title { font-size: 1.25rem; font-weight: 600; letter-spacing: -.01em; color: var(--text); padding-top: 20px; position: sticky; top: 96px; }
}
.rv-faq__steps { display: grid; gap: 10px; padding-left: 1.3em; list-style: decimal; }
.rv-faq__steps b { color: var(--text); font-weight: 600; }

/* ---------- Ansprechpartner ---------- */
.rv-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(32px, 4vw, 56px); }
@media (max-width: 1023px) { .rv-people { grid-template-columns: 1fr; max-width: 40rem; } }
.rv-person { display: grid; grid-template-columns: 1fr; gap: 18px; align-items: start; align-content: start; }
@media (max-width: 1023px) { .rv-person { grid-template-columns: 112px 1fr; gap: 22px; } }
.rv-person__photo { width: 112px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--bg-2); display: grid; place-items: center; }
.rv-person__photo img { width: 100%; height: 100%; object-fit: cover; }
.rv-person__photo--ph { border: 1px dashed var(--line); font-family: var(--f-display); font-weight: 700; font-size: 1.5rem; color: var(--text-3); }
.section--alt .rv-person__photo--ph { background: #fff; }
.rv-person__role { color: var(--text-3); font-size: .9375rem; margin: 2px 0 12px; }
.rv-person blockquote { margin: 14px 0 0; padding-left: 14px; border-left: 2px solid var(--accent); font-style: italic; color: var(--text-2); }
@media (max-width: 520px) { .rv-person { grid-template-columns: 1fr; } }

/* ---------- Kontakt ---------- */
.rv-contact .grid { align-items: start; }
.rv-contact__text { grid-column: 1 / 6; }
.rv-contact__form { grid-column: 7 / 13; }
.rv-contact__list { margin-top: 26px; display: grid; gap: 10px; }
.rv-contact__list li { display: grid; grid-template-columns: 22px 1fr; gap: 12px; color: var(--text-2); }
.rv-contact__list svg { width: 22px; height: 22px; color: var(--accent); margin-top: 1px; }
.rv-contact__form .field input, .rv-contact__form .field select, .rv-contact__form .field textarea { background: #fff; }

/* ---------- Footer-Ergänzung ---------- */
.rv-footer-brand .rv-logo { color: #fff; font-size: 1.35rem; margin-bottom: 10px; }
.rv-footer-brand .rv-logo b { color: #E7C9A0; }
.rv-footer-brand img { height: 16px; margin: 14px 0 0; }


/* ==========================================================================
   Entwurf 4: Sand #E7C9A0 auf Nachtblau #141C2E, wie die Mediakit-Anzeige.
   Dunkel: Navigation, Hero, Zahlen, Technik, Kontakt, Footer. Sand ist dort Schrift.
   Hell: alle Inhaltssektionen. Sand ist dort nur Fläche, Schrift in dunklem Sand.
   ========================================================================== */

/* Navigation dunkel */
[data-theme="revive"] .nav { background: rgba(20,28,46,.94); }
[data-theme="revive"] .nav.is-scrolled { border-bottom-color: var(--dark-line); }
[data-theme="revive"] .rv-logo { color: #fff; }
[data-theme="revive"] .rv-by { color: var(--dark-text-2); border-left-color: var(--dark-line); }
[data-theme="revive"] .nav__links a { color: var(--dark-text-2); }
[data-theme="revive"] .nav__links a:hover { color: #fff; }
[data-theme="revive"] .nav__links a::after { background: var(--sand); }
[data-theme="revive"] .nav__toggle span { background: #fff; }
[data-theme="revive"] :focus-visible { outline-color: var(--accent); }
[data-theme="revive"] .section--dark :focus-visible,
[data-theme="revive"] .nav :focus-visible,
[data-theme="revive"] .rv-hero :focus-visible { outline-color: var(--sand); }
@media (max-width: 899px) { [data-theme="revive"] .nav.is-open .nav__links { background: var(--night); border-bottom-color: var(--dark-line); } }

/* Buttons: auf Hell Nachtblau mit Sand, auf Dunkel Sand mit Nachtblau */
[data-theme="revive"] .btn--primary { background: var(--night); border-color: var(--night); color: var(--sand); }
[data-theme="revive"] .btn--primary:hover { background: #1F2A42; border-color: #1F2A42; }
[data-theme="revive"] .nav .btn--primary,
[data-theme="revive"] .rv-hero .btn--primary,
[data-theme="revive"] .section--dark .btn--primary { background: var(--sand); border-color: var(--sand); color: var(--night); }
[data-theme="revive"] .nav .btn--primary:hover,
[data-theme="revive"] .rv-hero .btn--primary:hover,
[data-theme="revive"] .section--dark .btn--primary:hover { background: #F0DABA; border-color: #F0DABA; }
[data-theme="revive"] .nav__links a.btn { color: var(--night); }
[data-theme="revive"] .nav__links a.btn:hover { color: var(--night); }

/* Hero dunkel, zweite Zeile des Claims in Sand */
.rv-hero { background: var(--night); color: var(--dark-text); }
.rv-hero .h1 { color: #fff; }
.rv-hero .rv-claim span + span { color: var(--sand); }
.rv-hero .rv-hero__cat { color: var(--sand); }
.rv-hero .lead { color: var(--dark-text-2); }
.rv-hero .btn--ghost { color: #fff; border-color: rgba(255,255,255,.28); }
.rv-hero .btn--ghost:hover { border-color: #fff; }
.rv-hero .rv-demo { box-shadow: 0 30px 70px -30px rgba(0,0,0,.65); border-color: transparent; }

/* Zahlen dunkel, wie in der Anzeige */
.section--dark .rv-fact { border-left-color: var(--sand); }
.section--dark .rv-fact dt { color: var(--sand); }
.section--dark .rv-fact dd { color: var(--dark-text); }

/* Kontakt dunkel */
.section--dark.rv-contact .rv-contact__list li { color: var(--dark-text-2); }
.section--dark.rv-contact .rv-contact__list svg { color: var(--sand); }
.section--dark .rv-contact__form .field input,
.section--dark .rv-contact__form .field select,
.section--dark .rv-contact__form .field textarea { background: rgba(255,255,255,.06); }
.section--dark .rv-contact__form .field select option { color: #141C2E; }

/* Footer */
[data-theme="revive"] .footer { background: #0E1422; }

/* Sand-Flächen auf Hell brauchen einen Rand, sonst verschwinden sie */
[data-theme="revive"] .rv-demo__row.is-lit { border-left-color: var(--copper); }
.section--dark .kicker b { color: var(--sand); }
.rv-hero + .section--dark { border-top: 1px solid var(--dark-line); }


/* ---------- Rechner, Entwurf 5: Gallup-Rolle und Oxford-Aufteilung ---------- */
.rv-role { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.rv-role legend { font-size: .9375rem; font-weight: 500; margin-bottom: 8px; padding: 0; color: var(--text); }
.rv-role label { display: grid; grid-template-columns: 20px 1fr; gap: 12px; align-items: start; padding: 11px 14px; border: 1.5px solid var(--line); border-radius: 8px; cursor: pointer; transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease); }
.rv-role label:hover { border-color: var(--copper); }
.rv-role label:has(input:checked) { border-color: var(--night); background: var(--accent-tint); }
.rv-role input { accent-color: var(--night); margin: 3px 0 0; width: 16px; height: 16px; }
.rv-role b { display: block; font-weight: 600; font-size: .9375rem; color: var(--text); }
.rv-role label small { display: block; font-size: .82rem; color: var(--text-3); margin-top: 2px; }
.rv-role > small { font-size: .8rem; color: var(--text-3); margin-top: 2px; }
.rv-range input[type="range"] { accent-color: var(--night); }
.rv-split { display: flex; height: 12px; border-radius: 6px; overflow: hidden; gap: 2px; }
.rv-split__p { background: var(--night); }
.rv-split__l { background: var(--sand); }
.rv-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 8px; vertical-align: 0; }
.rv-dot--p { background: var(--night); }
.rv-dot--l { background: var(--sand); box-shadow: inset 0 0 0 1px var(--copper); }
.rv-calc__rows em { font-style: normal; font-variant-numeric: tabular-nums; font-weight: 600; font-size: .8125rem; color: var(--text-3); margin-left: 6px; }
.rv-calc__big { color: var(--night); }


/* ---------- Entwurf 6 ---------- */
.rv-hero .rv-hero__lead { color: #fff; font-weight: 500; }
.rv-hero__lead sup, .rv-hero__note sup { color: var(--sand); font-weight: 700; }
.rv-hero__note { margin-top: 28px; max-width: 34em; font-size: .9rem; line-height: 1.55; color: var(--dark-text-2); }
.rv-hero__note span { display: block; margin-top: 6px; font-size: .84rem; opacity: .85; }
.rv-hero .ph-mark { margin-top: 14px; }

/* Entwurf 7: Herleitung direkt unter der Kostenzahl */
.rv-calc__how { margin-top: 10px; font-size: .9375rem; line-height: 1.5; color: var(--text-2); max-width: 34em; font-variant-numeric: tabular-nums; }

/* Navigation: sechs Menüpunkte brauchen mehr Platz, daher Burger-Menü schon unter 1120 px */
@media (min-width: 900px) and (max-width: 1119px) {
  [data-theme="revive"] .nav__links, [data-theme="revive"] .nav__cta { display: none; }
  [data-theme="revive"] .nav__toggle { display: block; }
  [data-theme="revive"] .nav.is-open .nav__links { display: flex; flex-direction: column; gap: 4px; position: absolute; left: 0; right: 0; top: 100%; background: var(--night); border-bottom: 1px solid var(--dark-line); padding: 12px var(--gutter) 24px; }
  [data-theme="revive"] .nav.is-open .nav__links a { font-size: 1.15rem; padding: .6em 0; }
  [data-theme="revive"] .nav.is-open .nav__cta { display: inline-flex; margin: 12px 0 0; align-self: flex-start; }
  [data-theme="revive"] .nav.is-open .nav__toggle span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  [data-theme="revive"] .nav.is-open .nav__toggle span:nth-child(2) { opacity: 0; }
  [data-theme="revive"] .nav.is-open .nav__toggle span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
}


/* Dossier-Nachbau: Styles in assets/css/mockup.css (gemeinsam mit der BRAINBOX-Startseite) */

/* Bild nie höher als der Text daneben: etwas breiter (weniger Spaltenabstand, leicht in den Rand),
   und falls es doch höher wäre, auf Texthöhe begrenzt mit weichem Auslauf nach unten. */
@media (min-width: 1024px) {
  .rv-hero__grid { column-gap: clamp(28px, 2.8vw, 40px); }
  .rv-hero .rv-app { margin-right: calc(-1 * min(var(--gutter), 28px)); }
}

/* Schritt 4 der Nachfolge: Kern des Dossiers, lesbar statt verkleinert */
.rv-mini { margin: 0; background: #fff; border: 1px solid var(--line); padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; color: #1E1F23; }
.rv-mini__h { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.rv-mini__card { border: 1px solid #E5E7EB; border-left: 3px solid #DC3B3B; border-radius: 8px; padding: 9px 11px; display: grid; gap: 2px; }
.rv-mini__tags { display: flex; gap: 5px; margin-bottom: 4px; }
.rv-mini__tags span, .rv-mini__tags em { font-size: .6875rem; font-style: normal; padding: 1px 8px; border-radius: 99px; line-height: 1.5; }
.rv-mini__tags span { border: 1px solid #D1D5DB; color: #374151; }
.rv-mini__tags em { background: #DC3B3B; color: #fff; font-weight: 600; }
.rv-mini__card b { font-size: .875rem; font-weight: 700; line-height: 1.3; }
.rv-mini__card small { font-size: .75rem; color: #6B7280; }
.rv-mini__card p { font-size: .8125rem; line-height: 1.4; color: #374151; margin-top: 3px; }
.rv-mini__more { margin-top: auto; font-size: .8125rem; font-weight: 500; color: #006B7D; }
.rv-mini__more::after { content: " →"; }