/* ═══════════════════════════════════════════════════════════════════════
   Hashtag Hamburg · v2-Unterseiten im hashtaq-Stil (2026-11-09)
   Lädt NACH v2.css, nur auf /v2/*.html außer index.html.
   v2.css bleibt unangetastet: alle Unterseiten-Regeln stehen hier.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --vp-card: #16161c;
  --vp-line-dark: rgba(250, 250, 251, .09);
  --vp-glow: radial-gradient(600px 420px at 12% 18%, rgba(232,107,239,.14), transparent 65%),
             radial-gradient(700px 500px at 88% 78%, rgba(69,215,222,.12), transparent 65%),
             radial-gradient(500px 400px at 60% 8%, rgba(157,140,246,.10), transparent 60%);
  --vp-glow-soft: radial-gradient(560px 400px at 88% 10%, rgba(232,107,239,.05), transparent 65%),
                  radial-gradient(640px 460px at 6% 92%, rgba(69,215,222,.06), transparent 65%),
                  radial-gradient(520px 380px at 50% 50%, rgba(157,140,246,.04), transparent 60%);
}

/* Kurze Seiten (Danke, Funnel): unter dem dunklen Footer kein heller Streifen */
body.page-sub { background: var(--ink); }

/* ── Sektionen: Papier / Weiß mit weichen Verläufen, dunkle Akzente ─── */
.page-sub .section { position: relative; isolation: isolate; min-height: 0; padding: 90px 0; }
@media (max-width: 720px) { .page-sub .section { padding: 56px 0; } }
.vp-paper { background: var(--paper); }
.vp-white { background: #fff; }
.vp-white::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: var(--vp-glow-soft); }

.page-sub .sec-head:last-child { margin-bottom: 0; }
.page-sub .sec-head p:not(.eyebrow) a { color: var(--tint-c-text); border-bottom: 1px solid currentColor; }
.page-sub .sec-head p:not(.eyebrow) a:hover { color: var(--ink); }
.page-sub .on-dark .sec-head p:not(.eyebrow) { color: rgba(250,250,251,.72); }
.page-sub .on-dark .sec-head p:not(.eyebrow) a { color: var(--blue); }
.vp-center { margin-left: auto; margin-right: auto; text-align: center; }

/* ── Hero: Tinte, Verläufe, Rauschen ─────────────────────────────────── */
.vp-hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--ink); color: var(--paper);
  padding: clamp(72px, 10vw, 128px) 0 clamp(64px, 8vw, 104px);
}
.has-overlay-header .vp-hero { margin-top: calc(-1 * var(--header-h) - 1px);padding-top: calc(clamp(72px, 10vw, 128px) + var(--header-h)); }
.page-sub.has-overlay-header .hero { margin-top: calc(-1 * var(--header-h) - 1px); }
.vp-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: var(--vp-glow); }
.vp-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: var(--noise); opacity: .05; }
.vp-hero .eyebrow { display: block; color: var(--blue); margin-bottom: 20px; }
.vp-hero h1, .vp-hero .display-1 {
  font-family: var(--font-display); font-weight: 600; color: var(--paper);
  font-size: clamp(36px, 5.4vw, 62px); line-height: 1.08; letter-spacing: -.01em;
  max-width: 920px; margin-top: 0; text-wrap: balance;
}
.vp-hero .lead, .vp-hero .page-hero__lead { margin-top: 24px; font-size: 19px; line-height: 1.6; color: rgba(250,250,251,.75); max-width: 680px; }
.vp-hero .muted { color: rgba(250,250,251,.75); }
.vp-hero .btn-row { margin-top: 36px; }
@media (max-width: 720px) { .vp-hero .lead, .vp-hero .page-hero__lead { font-size: 17px; } }

/* Rechtstexte: nur Titel im Hero */
.vp-hero--legal { padding-bottom: clamp(48px, 6vw, 72px); }
.vp-hero--legal h1 { font-size: clamp(34px, 5vw, 56px); }

/* Danke / 404: zentriert */
.vp-hero--center { text-align: center; padding-bottom: clamp(88px, 12vw, 150px); }
.vp-hero--center .eyebrow { margin-bottom: 0; }
.vp-hero--center h1, .vp-hero--center .display-1, .vp-hero--center .lead { margin-left: auto; margin-right: auto; }
.vp-hero--center .display-2 { color: var(--paper); font-size: clamp(30px, 4vw, 44px); }
.vp-hero--center p.display-1 { font-size: clamp(88px, 16vw, 180px); line-height: 1; color: var(--blue); }
.vp-hero--center .btn-row { justify-content: center; }
.vp-hero .caption { color: rgba(250,250,251,.6); font-size: 14px; line-height: 1.8; }
.vp-hero .caption a { color: var(--paper); }
.vp-hero .caption a:hover { color: var(--blue); }

/* ── Checkliste als Karten ───────────────────────────────────────────── */
.vp-checks { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.vp-checks li {
  position: relative; background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 26px 24px 26px 56px; font-size: 16px; line-height: 1.5;
  transition: transform .3s ease, box-shadow .3s ease;
}
.vp-checks li::before { content: "✓"; position: absolute; left: 24px; top: 26px; color: var(--tint-c-text); font-weight: 700; }
.vp-checks li:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,11,14,.08); }
.vp-white .vp-checks li { background: var(--paper); }

/* ── Zitat als dunkle Karte (wie .mcard) ─────────────────────────────── */
.vp-quote {
  position: relative; isolation: isolate; overflow: hidden; margin: 0 auto; max-width: 900px;
  background: var(--ink); border: 1px solid var(--vp-line-dark); border-radius: 20px;
  padding: 48px 48px 40px; color: var(--paper);
}
.vp-quote::before { content: "„"; display: block; font-family: var(--font-display); font-weight: 600; font-size: 88px; line-height: .6; color: var(--magenta); margin-bottom: 18px; }
.vp-quote::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(420px 300px at 90% 0%, rgba(232,107,239,.10), transparent 65%), radial-gradient(460px 320px at 0% 100%, rgba(69,215,222,.09), transparent 65%); }
.vp-quote blockquote { font-family: var(--font-display); font-weight: 500; font-size: clamp(21px, 2.4vw, 28px); line-height: 1.38; letter-spacing: -.005em; color: rgba(250,250,251,.92); }
.vp-quote figcaption { margin-top: 28px; }
.vp-quote .quote-card__ava { width: 44px; height: 44px; border-radius: 50%; border: 0; object-fit: cover; }
.vp-quote .who { font-weight: 500; font-size: 15px; color: var(--paper); }
.vp-quote .role { font-size: 13px; color: rgba(250,250,251,.55); margin-top: 2px; }
@media (max-width: 720px) { .vp-quote { padding: 32px 24px 28px; } .vp-quote::before { font-size: 68px; } }

/* ── FAQ (Muster .faq-item aus v2.css) ───────────────────────────────── */
.page-sub .faq-list { max-width: 920px; }
.page-sub .faq-item .a a { color: var(--tint-c-text); border-bottom: 1px solid currentColor; }
.vp-white .faq-item { background: var(--paper); }

/* ── Abschluss-CTA: dunkle Box wie .kontakt ──────────────────────────── */
.vp-cta { background: var(--ink); overflow: hidden; }
.vp-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(560px 400px at 85% 12%, rgba(232,107,239,.08), transparent 65%), radial-gradient(640px 460px at 8% 88%, rgba(69,215,222,.07), transparent 65%); }
.vp-cta::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: var(--noise); opacity: .04; }
.vp-cta__box {
  background: rgba(22,22,28,.92); border: 1px solid var(--vp-line-dark); border-radius: 20px;
  padding: 64px 48px; text-align: center; display: flex; flex-direction: column; align-items: center;
}
.vp-cta .eyebrow { display: block; color: var(--blue); margin-bottom: 14px; }
.vp-cta__box h2 { color: var(--paper); font-size: clamp(30px, 4vw, 44px); line-height: 1.12; max-width: 760px; margin: 0; }
.vp-cta .cta-band__copy { color: rgba(250,250,251,.72); font-size: 17px; line-height: 1.65; max-width: 560px; margin: 16px auto 0; }
.vp-cta .btn-row { margin-top: 32px; width: 100%; justify-content: center; }
.vp-cta .cta-band__meta { margin-top: 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; font-size: 15px; color: rgba(250,250,251,.6); }
.vp-cta__box h2, .vp-cta .cta-band__copy, .vp-hero h1, .vp-hero .display-1 { text-wrap: balance; }
.vp-cta .cta-band__meta { gap: 10px 12px; }
.vp-cta .cta-band__meta a { display: inline-flex; align-items: center; gap: 9px; padding: 9px 16px; border: 1px solid rgba(250,250,251,.14); border-radius: 999px; background: rgba(250,250,251,.04); color: rgba(250,250,251,.85); font-size: 14.5px; line-height: 1; font-variant-numeric: tabular-nums; text-decoration: none; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.vp-cta .cta-band__meta a::before { content: ""; width: 15px; height: 15px; flex: none; background: var(--blue); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.vp-cta .cta-band__meta a[href^="tel:"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
.vp-cta .cta-band__meta a[href^="mailto:"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E"); }
.vp-cta .cta-band__meta a:hover { color: var(--paper); border-color: rgba(69,215,222,.55); background: rgba(69,215,222,.08); }
.vp-cta .lp-microcopy { color: rgba(250,250,251,.55); margin-top: 16px; }
@media (max-width: 720px) { .vp-cta__box { padding: 40px 22px; } }

/* ── Zahlen-Karten (Hotel-Reichweiten) auf Tinte ─────────────────────── */
.page-sub .authority .sec-head { margin-bottom: 40px; }
.page-sub .authority__stats { margin-top: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; border-top: 0; }
.page-sub .authority__stat {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 10px;
  background: var(--vp-card); border: 1px solid var(--vp-line-dark); border-radius: 16px; padding: 26px 24px;
  transition: transform .3s ease, border-color .3s ease;
}
.page-sub a.authority__stat:hover { transform: translateY(-4px); border-color: rgba(69,215,222,.45); }
.page-sub .authority__stat .num, .page-sub .authority__stat .num--paper { color: var(--blue); letter-spacing: -.01em; }
.page-sub .authority__stat .num .u--quiet { color: rgba(250,250,251,.5); }
.page-sub .authority__stat .lbl { text-align: left; font-size: 14px; color: rgba(250,250,251,.65); }
.page-sub a.authority__stat .lbl .arr { opacity: 1; }
.page-sub .authority .caption { color: rgba(250,250,251,.5); }
@media (max-width: 900px) { .page-sub .authority__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .page-sub .authority__stats { grid-template-columns: 1fr; } }

/* ── Cases-Seite ─────────────────────────────────────────────────────── */
.page-sub .video-grid { gap: 18px; }
.page-sub .reel__media { border: 0; border-radius: 18px; background: var(--ink); }
.page-sub .reel__meta { padding-top: 14px; }
.page-sub .reel__meta .who { font-weight: 500; font-size: 15px; }
.page-sub .reel__handle { color: var(--grey); }
.page-sub .reel__num .n { color: var(--ink); }
.page-sub .reel__num .l { color: var(--grey); font-weight: 500; }

.page-sub .case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; border-top: 0; }
.page-sub .case-card {
  background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 36px 30px; gap: 14px;
  transition: transform .3s ease, box-shadow .3s ease;
}
.page-sub .case-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,11,14,.08); }
.vp-white .case-card { background: var(--paper); }
.page-sub .case-card__name { font-size: 20px; line-height: 1.2; }
.page-sub .case-card__num .n { color: var(--tint-c-text); line-height: 1.1; }
.page-sub .case-card__note { color: var(--grey); font-size: 15.5px; line-height: 1.6; }
@media (max-width: 1020px) { .page-sub .case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .page-sub .case-grid { grid-template-columns: 1fr; } .page-sub .case-card { padding: 28px 22px; } }

.page-sub .mini-case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; border-top: 0; }
.page-sub .mini-case {
  background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px 22px 20px;
  transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.vp-white .mini-case { background: var(--paper); }
.page-sub .mini-case:hover { transform: translateY(-3px); border-color: rgba(11,11,14,.28); box-shadow: 0 14px 32px rgba(11,11,14,.07); }
.page-sub .mini-case .n .u { color: var(--grey); }
.page-sub .mini-case .who { font-weight: 500; font-size: 15px; margin-top: 8px; }
.page-sub .mini-case .who .arr { color: var(--tint-c-text); }
.page-sub .mini-case .cat { color: var(--tint-c-text); font-weight: 500; }
@media (max-width: 900px) { .page-sub .mini-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .page-sub .mini-case-grid { grid-template-columns: 1fr; } }

/* ── Abläufe: große Kontur-Ziffern wie .flow ─────────────────────────── */
.vp-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; align-items: start; }
.vp-flow .fstep:nth-child(2) { margin-top: 48px; }
.vp-flow .fstep:nth-child(3) { margin-top: 96px; }
.vp-flow .fstep:nth-child(4) { margin-top: 144px; }
.vp-flow .fnum { font-size: 104px; }
.vp-flow .fstep:nth-child(1) .fnum { -webkit-text-stroke-color: var(--blue); }
.vp-flow .fstep:nth-child(2) .fnum { -webkit-text-stroke-color: var(--magenta); }
.vp-flow .fstep:nth-child(3) .fnum { -webkit-text-stroke-color: var(--lilac); }
.vp-flow .fstep:nth-child(4) .fnum { -webkit-text-stroke-color: var(--blue); }
.vp-flow .fstep h3 { font-size: 23px; }
.vp-flow .fstep p { font-size: 16px; color: var(--grey); }
@media (max-width: 1020px) { .vp-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; } .vp-flow .fstep:nth-child(n) { margin-top: 0; } }
@media (max-width: 600px) { .vp-flow { grid-template-columns: 1fr; gap: 32px; } .vp-flow .fnum { font-size: 80px; } }

/* ── Faktoren als Karten (Kosten-Seite) ──────────────────────────────── */
.vp-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.vp-card {
  background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 36px 30px;
  transition: transform .3s ease, box-shadow .3s ease;
}
.vp-white .vp-card { background: var(--paper); }
.vp-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,11,14,.08); }
.vp-card__num { display: inline-block; background: var(--tint-c); color: var(--tint-c-text); font-size: 13px; font-weight: 500; padding: 4px 12px; border-radius: 999px; margin-bottom: 18px; font-variant-numeric: tabular-nums; }
.vp-card h3 { font-size: 21px; line-height: 1.2; margin: 0 0 10px; }
.vp-card p { color: var(--grey); font-size: 15.5px; line-height: 1.6; }
@media (max-width: 1020px) { .vp-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .vp-cards { grid-template-columns: 1fr; } .vp-card { padding: 28px 22px; } }

/* ── Formulare auf dunkler Box (Kontakt, Erstgespräch) ───────────────── */
.vp-formbox {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--ink); color: var(--paper); border: 1px solid var(--vp-line-dark); border-radius: 20px; padding: 48px;
}
.vp-formbox::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(560px 400px at 85% 12%, rgba(232,107,239,.09), transparent 65%), radial-gradient(640px 460px at 8% 88%, rgba(69,215,222,.08), transparent 65%); }
@media (min-width: 900px) { .contact-grid.vp-formbox { gap: 64px; } }
.vp-formbox .contact-info .item { border-top: 1px solid rgba(250,250,251,.12); padding: 20px 0; }
.vp-formbox .contact-info .item:first-child { border-top: 0; padding-top: 0; }
.vp-formbox .contact-info .item .lbl { color: var(--blue); font-weight: 500; font-size: 13px; letter-spacing: .12em; }
.vp-formbox .contact-info .item .val { color: var(--paper); font-weight: 500; font-size: 18px; line-height: 1.5; }
.vp-formbox .contact-info .item .val a:hover { color: var(--blue); }
@media (max-width: 720px) { .vp-formbox { padding: 32px 22px; } }

:is(.vp-formbox, .vp-funnel) .field label { color: rgba(250,250,251,.6); font-size: 13px; }
:is(.vp-formbox, .vp-funnel) .field input[type=text],
:is(.vp-formbox, .vp-funnel) .field input[type=email],
:is(.vp-formbox, .vp-funnel) .field input[type=tel],
:is(.vp-formbox, .vp-funnel) .field textarea {
  font-family: var(--font-body); font-size: 16px; padding: 14px 16px;
  border: 1px solid rgba(250,250,251,.15); border-radius: 10px; background: rgba(250,250,251,.06); color: var(--paper);
}
:is(.vp-formbox, .vp-funnel) input::placeholder, :is(.vp-formbox, .vp-funnel) textarea::placeholder { color: rgba(250,250,251,.45); }
:is(.vp-formbox, .vp-funnel) .field input:focus, :is(.vp-formbox, .vp-funnel) .field textarea:focus { outline: 2px solid var(--blue); border-color: transparent; }
:is(.vp-formbox, .vp-funnel) .consent { color: rgba(250,250,251,.55); }
:is(.vp-formbox, .vp-funnel) .consent input { accent-color: var(--blue); }
:is(.vp-formbox, .vp-funnel) .consent a { color: var(--paper); border-bottom: 0; text-decoration: underline; text-underline-offset: 3px; }
:is(.vp-formbox, .vp-funnel) .form-state { color: var(--paper); border-color: rgba(250,250,251,.18); border-radius: 12px; }
:is(.vp-formbox, .vp-funnel) .form-state--ok { border-color: var(--blue); }
:is(.vp-formbox, .vp-funnel) .form-state--err { color: #FF8A80; border-color: #FF8A80; }
.vp-formbox button[type=submit] { width: 100%; }

/* Erstgespräch-Funnel: ganze Seite dunkel, Box wie .kontakt */
.vp-funnel .funnel {
  max-width: 780px; background: rgba(22,22,28,.92); border: 1px solid var(--vp-line-dark); border-radius: 20px; padding: 48px;
}
.vp-funnel .funnel > .center { margin-top: 0; }
.vp-funnel .funnel h1 { color: var(--paper); font-size: clamp(30px, 4vw, 44px); line-height: 1.12; }
.vp-funnel .funnel .eyebrow { margin-bottom: 0; }
.vp-funnel .muted { color: rgba(250,250,251,.72); }
.vp-funnel .caption { color: rgba(250,250,251,.6); }
.vp-funnel .funnel__progress .bar { background: rgba(250,250,251,.14); border-radius: 2px; overflow: hidden; }
.vp-funnel .funnel__progress .bar i { background: var(--blue); }
.vp-funnel .funnel__progress .lbl { color: rgba(250,250,251,.55); }
.vp-funnel .funnel__q { color: var(--paper); }
.vp-funnel .choice span { border: 1px solid rgba(250,250,251,.15); border-radius: 12px; background: rgba(250,250,251,.04); color: rgba(250,250,251,.9); }
.vp-funnel .choice span:hover { border-color: rgba(250,250,251,.35); }
.vp-funnel .choice input:checked + span { border-color: var(--blue); background: rgba(69,215,222,.12); box-shadow: inset 0 0 0 1px var(--blue); color: var(--paper); }
.vp-funnel .choice input:focus-visible + span { outline-color: var(--blue); }
.vp-funnel .funnel__back { border: 1px solid rgba(250,250,251,.22); color: rgba(250,250,251,.7); border-radius: 10px; }
.vp-funnel .funnel__back:hover { border-color: var(--blue); color: var(--blue); }
@media (max-width: 720px) { .vp-funnel .funnel { padding: 30px 20px; } }

/* ── Rechtstexte: ruhige Lesespalte ──────────────────────────────────── */
.page-sub .prose { max-width: 760px; }
.page-sub .prose h2 { font-size: clamp(22px, 2.4vw, 26px); line-height: 1.2; margin: 48px 0 14px; }
.page-sub .prose > h2:first-child { margin-top: 0; }
.page-sub .prose h3 { font-family: var(--font-display); font-weight: 600; font-size: 19px; margin: 32px 0 10px; }
.page-sub .prose h4 { font-weight: 600; font-size: 16.5px; margin: 24px 0 8px; }
.page-sub .prose p, .page-sub .prose li { font-size: 16.5px; line-height: 1.75; color: #2A2A31; }
.page-sub .prose .text-color-muted { color: var(--grey); }
.page-sub .prose a { color: var(--tint-c-text); }

/* ── Landingpage „sichtbar in Hamburg" (überschreibt den Seiten-<style>) ─ */
.page-sub .lp-hero-note { justify-content: flex-start; margin-top: 18px; font-size: 14px; color: rgba(250,250,251,.75); opacity: 1; gap: 8px 18px; }
.page-sub .lp-guarantee { background: #fff; border: 2px solid var(--blue); border-radius: 20px; padding: 44px 40px; max-width: 920px; }
.page-sub .lp-guarantee .eyebrow { color: var(--tint-c-text); margin-bottom: 14px !important; }
.page-sub .lp-guarantee .big { font-size: clamp(24px, 3vw, 34px); line-height: 1.15; color: var(--ink); margin-bottom: 14px; }
.page-sub .lp-guarantee p:not(.big):not(.eyebrow) { color: var(--grey); font-size: 17px; line-height: 1.65; }
.page-sub .lp-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: stretch; }
.page-sub .lp-fit__card { border-radius: 20px; padding: 40px 38px; }
.page-sub .lp-fit__card--yes { background: #fff; border: 2px solid var(--blue); }
.page-sub .lp-fit__card--no { background: var(--ink); border: 0; color: rgba(250,250,251,.85); }
.page-sub .lp-fit__card h3 { font-family: var(--font-display); font-weight: 600; font-size: 22px; margin: 0 0 18px; }
.page-sub .lp-fit__card--no h3 { color: var(--paper); }
.page-sub .lp-check { gap: 0; }
.page-sub .lp-check li { padding: 8px 0; font-size: 16.5px; }
.page-sub .lp-check .ic { background: none; width: auto; height: auto; font-size: 16px; font-weight: 700; margin-top: 0; min-width: 22px; }
.page-sub .lp-check--yes .ic { color: var(--tint-c-text); }
.page-sub .lp-check--no .ic { color: var(--magenta); }
.page-sub .lp-check--no li { color: rgba(250,250,251,.85); }
@media (max-width: 860px) { .page-sub .lp-fit { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .page-sub .lp-guarantee, .page-sub .lp-fit__card { padding: 28px 22px; } }
.page-sub .site-footer--min { color: rgba(250,250,251,.6); padding: 28px 0; }
.page-sub .site-footer--min .site-footer__legal a { color: rgba(250,250,251,.65); }
.page-sub .site-footer--min .site-footer__legal a:hover { color: var(--blue); }

/* ── Sicherheitsnetz gegen seitliches Scrollen ───────────────────────── */
.page-sub main { overflow-x: clip; }