/* Pflege-Check (Vollbild-Funnel) */

body { background: var(--surface-blue); }
.check-app { min-height: calc(100vh / var(--zoom)); min-height: calc(100dvh / var(--zoom)); display: flex; flex-direction: column; background: var(--surface-blue); }

/* Header */
.check-header { background: #fff; border-bottom: 1px solid var(--border); }
.check-header__inner { max-width: 1200px; margin: 0 auto; padding: 10px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.check-header__logo { height: 40px; width: auto; display: block; }
.check-header__meta { display: flex; align-items: center; gap: 28px; }
.check-header__title { font: 600 14px/1 var(--font-body); color: var(--blue-deep); padding-right: 28px; border-right: 1px solid var(--border); line-height: 40px; }
@media (max-width: 900px) { .check-header__title { display: none; } }
@media (max-width: 640px) { .check-header__inner { padding: 10px 16px; } .check-header__logo { height: 30px; } }
.progress { height: 6px; background: var(--track); }
.progress__bar { height: 100%; background: var(--blue); transition: width 450ms var(--ease-out); width: 0; }

/* Main */
.check-main { flex: 1; display: flex; align-items: center; justify-content: center; padding: 56px 24px; }
.check-main__inner { width: 100%; max-width: 920px; display: flex; flex-direction: column; }
.check-main__inner:focus, .check-main__inner:focus-visible { outline: none; box-shadow: none; }
@media (max-width: 560px) { .check-main { padding: 36px 16px; align-items: flex-start; } }

/* Fragen */
.q-head { display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px; text-align: center; align-items: center; }
.q-meta { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: center; }
.q-pct { font: 600 14px/1 var(--font-body); color: var(--blue-text); }
.badge-important { font: 600 13px/1 var(--font-body); color: var(--orange-ink); background: var(--orange-bg); border-radius: 999px; padding: 7px 12px; }
.q-title { font: 600 clamp(30px, 4vw, 48px)/1.1 var(--font-sans); letter-spacing: -0.03em; color: var(--blue); max-width: 820px; text-wrap: balance; }
.q-why { font: 400 18px/1.5 var(--font-body); color: var(--ink-2); max-width: 640px; }
.options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; }
.option {
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px; text-align: left;
  min-height: 168px; padding: 26px 28px; border-radius: 20px; cursor: pointer; font-family: inherit; color: inherit;
  background: #fff; border: 2px solid #fff; box-shadow: var(--shadow-tile);
  transition: border-color 180ms var(--ease), background 180ms var(--ease), box-shadow 220ms var(--ease), transform 220ms var(--ease-out);
}
@media (hover: hover) { .option:hover { border-color: var(--blue); box-shadow: var(--shadow-tile-hover); transform: translateY(-2px); } }
.option:active { transform: scale(0.985); transition-duration: 80ms; }
.option__key { width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font: 600 15px/1 var(--font-sans); color: var(--blue-text); background: var(--surface-blue); transition: background 180ms var(--ease), color 180ms var(--ease), transform 260ms var(--ease-out); }
.option__text { margin-top: auto; display: flex; flex-direction: column; gap: 6px; }
.option__label { font: 600 23px/1.2 var(--font-sans); letter-spacing: -0.01em; color: var(--ink); }
.option__sub { font: 400 15px/1.4 var(--font-body); color: var(--ink-2); }
.option[aria-pressed="true"] { background: var(--surface-blue); border-color: var(--blue); }
.option[aria-pressed="true"] .option__key { background: var(--blue-text); color: #fff; transform: scale(1.08); }
.q-tip { font: 400 14px/1.4 var(--font-body); color: var(--ink-3); text-align: center; margin-top: 20px; }
@media (max-width: 560px) {
  /* Handy: Zahlentasten-Hinweis weg, dafür ein Pfeil als Tipp-Signal */
  .option { min-height: 0; flex-direction: row; align-items: center; padding: 20px; }
  .option__key { display: none; }
  .option:not(.options--compact .option)::after { content: '›'; margin-left: auto; font: 400 30px/1 var(--font-sans); color: var(--blue); }
  .option__text { margin-top: 0; }
  .option__label { font-size: 20px; }
  .q-head { margin-bottom: 28px; }
  .q-tip { display: none; }
}

/* Formular-Schritte */
.form-step { width: 100%; max-width: 600px; margin: 0 auto; display: flex; flex-direction: column; gap: 24px; }
.form-head { display: flex; flex-direction: column; gap: 14px; text-align: center; align-items: center; }
.form-title { font: 600 clamp(28px, 3.6vw, 42px)/1.12 var(--font-sans); letter-spacing: -0.03em; color: var(--blue); text-wrap: balance; }
.form-lead { font: 400 18px/1.5 var(--font-body); color: var(--ink-2); }
.form-card { background: #fff; border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 20px; box-shadow: var(--shadow); }
.form-card--tight { gap: 16px; }
.badge-success { font: 600 14px/1 var(--font-body); color: var(--success); background: var(--success-bg); border-radius: 999px; padding: 9px 14px; }
.badge-warn { font: 600 14px/1 var(--font-body); color: var(--orange-ink); background: var(--orange-bg); border-radius: 999px; padding: 9px 14px; }
.form-note { font: 400 14px/1.4 var(--font-body); color: var(--ink-3); text-align: center; }
.form-error { font: 500 15px/1.5 var(--font-body); color: var(--danger); background: #fdeeee; border-radius: 12px; padding: 12px 14px; }
.submit-group { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
@media (max-width: 560px) { .form-card { padding: 22px; } }

/* Einwilligung */
.consent { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.consent input { position: absolute; opacity: 0; width: 24px; height: 24px; margin: 0; cursor: pointer; }
.consent__box {
  position: relative; width: 24px; height: 24px; flex: none; border-radius: 6px; margin-top: 1px;
  display: flex; align-items: center; justify-content: center; color: #fff; font: 700 14px/1 var(--font-body);
  border: 2px solid #c9c3bb; background: #fff; transition: background 120ms var(--ease), border-color 120ms var(--ease);
}
.consent input:checked + .consent__box { background: var(--blue); border-color: var(--blue); }
.consent input:checked + .consent__box::after { content: '✓'; }
.consent input:focus-visible + .consent__box { outline: 3px solid var(--blue); outline-offset: 2px; }
.consent__text { font: 400 14px/1.5 var(--font-body); color: var(--ink-2); }
.consent-wrap { display: flex; flex-direction: column; gap: 8px; }
.consent-wrap.is-error .consent__box { border-color: var(--danger); background: #fdeeee; }
.consent__error { font: 500 14px/1.4 var(--font-body); color: var(--danger); padding-left: 36px; }

/* Suche */
.search { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 28px; }
.search__title { font: 600 clamp(28px, 3.6vw, 42px)/1.15 var(--font-sans); letter-spacing: -0.03em; color: var(--blue); max-width: 640px; }
.search__track { width: 100%; max-width: 420px; height: 10px; background: #dfe8f3; border-radius: 999px; overflow: hidden; }
.search__bar { height: 100%; width: 100%; background: var(--blue); border-radius: 999px; transform: scaleX(0.04); transform-origin: left center; }

/* DOI-Hinweis */
.doi { width: 100%; max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 24px; }
.doi__title { font: 600 clamp(28px, 3.6vw, 44px)/1.12 var(--font-sans); letter-spacing: -0.03em; color: var(--blue); text-wrap: balance; }
.doi__steps { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; }
.doi__steps li { background: #fff; border-radius: 16px; padding: 22px 18px; display: flex; flex-direction: column; align-items: center; gap: 12px; font: 400 16px/1.4 var(--font-body); }
.doi__num { width: 36px; height: 36px; border-radius: 50%; background: var(--blue); color: #fff; display: flex; align-items: center; justify-content: center; font: 700 19px/1 var(--font-sans); }
.doi__num--accent { background: var(--orange); }
@media (max-width: 560px) {
  /* Handy: Schritte als kompakte Zeilen statt hoher Kacheln */
  .doi__steps { gap: 8px; }
  .doi__steps li { flex-direction: row; text-align: left; padding: 14px 18px; gap: 14px; }
  .doi__num { flex: none; width: 32px; height: 32px; }
}
.doi__sent { font: 400 16px/1.5 var(--font-body); color: var(--ink-2); overflow-wrap: anywhere; }
.doi__summary { width: 100%; max-width: 520px; margin: 0; background: #fff; border-radius: 16px; padding: 6px 20px; text-align: left; }
.doi__row { display: grid; grid-template-columns: 72px 1fr; gap: 12px; align-items: center; padding: 14px 0; }
.doi__row dd { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.doi__value { overflow-wrap: anywhere; min-width: 0; }
.doi__row + .doi__row { border-top: 1px solid var(--border); }
.doi__row dt { font: 500 14px/1.4 var(--font-body); color: var(--ink-3); }
.doi__row dd { margin: 0; font: 600 16px/1.4 var(--font-body); color: var(--ink); overflow-wrap: anywhere; }
.mailers { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.mailers a { font: 500 15px/1 var(--font-body); color: var(--blue-deep); text-decoration: none; background: #fff; border: 1px solid var(--border-blue); border-radius: 999px; padding: 11px 16px; transition: border-color 150ms ease; }
.mailers a:hover { border-color: var(--blue); color: var(--blue-deep); }
.doi__links { display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; }
.link-btn { background: none; border: 0; padding: 10px 0; color: var(--blue-text); cursor: pointer; font: 500 15px/1 var(--font-body); }
.link-btn:hover { color: var(--blue-hover); }
.link-btn:disabled { color: var(--success); cursor: default; }

/* Bestätigt */
.done { width: 100%; max-width: 680px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; }
.done__title { font: 600 clamp(28px, 3.6vw, 44px)/1.12 var(--font-sans); letter-spacing: -0.03em; color: var(--blue); text-wrap: balance; }
.done__text { font: 400 18px/1.55 var(--font-body); color: var(--ink-2); }
.done__box { background: #fff; border-radius: 16px; padding: 20px 24px; font: 400 16px/1.5 var(--font-body); }
.done__box strong { font-weight: 600; color: var(--blue-deep); }
.done__back { font: 500 16px/1 var(--font-body); text-decoration: none; }

/* Footer */
.check-footer { background: #fff; border-top: 1px solid var(--border); }
.check-footer__inner { max-width: 1200px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.check-footer__back { min-width: 90px; }
.back-btn { background: none; border: 0; padding: 10px 0; font: 500 16px/1 var(--font-body); color: var(--blue-text); cursor: pointer; }
.back-btn:hover { color: var(--blue-hover); }
.check-footer__info { font: 400 14px/1.4 var(--font-body); color: var(--ink-2); }
.check-footer__info a { font-weight: 600; text-decoration: none; white-space: nowrap; }
.noscript-note { text-align: center; }

/* Weniger Bewegung, wenn im System eingestellt */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
  .option:hover, .option:active, .option[aria-pressed="true"] .option__key { transform: none; }
}

/* Intro-Hinweis auf der ersten Frage */
.badge-intro { font: 600 14px/1 var(--font-body); color: var(--blue-text); background: #fff; border-radius: 999px; padding: 9px 14px; }

/* Vertrauen + Tippfehler-Hinweis */
.trust-line { font: 400 13px/1.5 var(--font-body); color: var(--ink-3); text-align: center; margin-top: -6px; }
.email-suggest { background: var(--orange-bg); border: 0; border-radius: 10px; padding: 10px 14px; width: 100%; text-align: left; cursor: pointer; font: 400 15px/1.4 var(--font-body); color: var(--ink); }
.email-suggest strong { color: var(--orange-ink); font-weight: 600; }
.email-suggest:hover { background: #fde9c8; }
#email-suggest:empty { display: none; }

/* DOI */
.doi__lead { font: 400 18px/1.5 var(--font-body); color: var(--ink-2); max-width: 560px; }
.doi__meta { font: 400 14px/1.6 var(--font-body); color: var(--ink-3); }
.doi__meta strong { font-weight: 600; color: var(--ink-2); }

/* 4–5 Antworten: zweispaltig statt 3+1 */
.options--2col { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
/* Ungerade Anzahl: letzte Kachel über die ganze Breite */
.options--2col .option:last-child:nth-child(odd) { grid-column: 1 / -1; }
/* Kompakte Zeilen statt hoher Kacheln, damit alle Antworten ohne Scrollen sichtbar sind */
@media (min-width: 561px) {
  .options--2col .option { flex-direction: row; align-items: center; min-height: 0; padding: 22px 26px; gap: 18px; }
  .options--2col .option__text { margin-top: 0; }
}
@media (max-width: 560px) {
  .options--2col { gap: 10px; }
  .options--2col .option { padding: 15px 20px; }
  .options--2col .option__label { font-size: 19px; }
}

/* Pflegegrad: kompakte Kacheln – 1–5 in einer Reihe, darunter "Noch keiner" / "Beantragt" */
.options--compact { grid-template-columns: repeat(10, 1fr); gap: 12px; }
.options--compact .option { grid-column: span 2; min-height: 112px; padding: 20px 16px; align-items: center; justify-content: center; text-align: center; gap: 4px; }
.options--compact .option:nth-child(n+6) { grid-column: span 5; min-height: 88px; }
.options--compact .option__key { display: none; }
.options--compact .option__text { margin-top: 0; align-items: center; }
.options--compact .option__label { font-size: 21px; }
@media (max-width: 720px) {
  .options--compact { grid-template-columns: repeat(2, 1fr); }
  .options--compact .option, .options--compact .option:nth-child(n+6) { grid-column: span 1; min-height: 0; padding: 16px 12px; }
  .options--compact .option:nth-child(5) { grid-column: span 2; }
  .options--compact .option__label { font-size: 18px; }
}

/* ---------- Feinschliff für alle Formate ---------- */
/* Antworten ab Tablet als ruhige Zeilen (Nummer links, Text rechts) statt hoher Kacheln */
@media (min-width: 561px) {
  .options:not(.options--compact) .option { flex-direction: row; align-items: center; min-height: 0; padding: 24px 28px; gap: 18px; }
  .options:not(.options--compact) .option__text { margin-top: 0; }
}
/* Tastatur-Tipp nur mit Maus/Tastatur sinnvoll */
@media (hover: none), (pointer: coarse) { .q-tip { display: none; } }
/* Handy: Fußzeile nur mit „Zurück“, Telefon steht schon oben */
@media (max-width: 640px) {
  .check-footer__info { display: none; }
  .check-footer:not(:has(.back-btn:not([hidden]))) { display: none; }
  .check-footer__inner { padding: 10px 16px; }
}
/* Schmale Handys: Absende-Button bleibt einzeilig */
@media (max-width: 400px) {
  .btn--block.btn--arrow { padding-left: 16px; padding-right: 16px; }
  .form-card { padding: 20px 18px; }
}
/* Handy quer / niedrige Fenster: kompakt, damit die Antworten ohne Scrollen sichtbar sind */
@media (orientation: landscape) and (max-height: 520px) {
  .check-header__inner { padding-top: 6px; padding-bottom: 6px; }
  .check-header__logo { height: 28px; }
  .check-header__title { display: none; }
  .check-main { padding: 14px 24px; align-items: flex-start; }
  .q-head { margin-bottom: 18px; gap: 8px; }
  .q-title { font-size: 26px; }
  .q-why { font-size: 16px; }
  .badge-intro { display: none; }
  .options { gap: 10px; }
  .options:not(.options--compact) .option { padding: 14px 20px; }
  .options--compact .option { min-height: 0; padding: 12px; }
  .options--compact .option:nth-child(n+6) { min-height: 0; }
  .option__label { font-size: 19px; }
  .q-tip { display: none; }
  .check-footer__inner { padding-top: 8px; padding-bottom: 8px; }
}

/* Touch-Geräte (auch Tablets): Zahlentasten-Nummer weg, Pfeil als Tipp-Signal */
@media (hover: none) and (pointer: coarse) {
  .option__key { display: none; }
  .option:not(.options--compact .option)::after { content: '›'; margin-left: auto; font: 400 30px/1 var(--font-sans); color: var(--blue); }
}
/* Niedrige Handys hochkant (z. B. 360×740, iPhone SE): kompakter, damit alle Antworten sichtbar sind */
@media (max-width: 560px) and (max-height: 760px) {
  .check-main { padding-top: 20px; padding-bottom: 20px; }
  .q-head { margin-bottom: 18px; gap: 10px; }
  .q-title { font-size: 26px; }
  .q-why { font-size: 16px; }
  .options, .options--2col { gap: 8px; }
  .options:not(.options--compact) .option { padding: 12px 18px; }
  .option__label, .options--2col .option__label { font-size: 18px; }
  .form-step { gap: 18px; }
  .form-title, .doi__title, .done__title { font-size: 26px; }
  .form-lead, .doi__lead { font-size: 16px; }
  .doi { gap: 16px; }
}
/* Handy quer: Antworten ohne Unterzeile, Formulare und Bestätigung kompakter */
@media (orientation: landscape) and (max-height: 520px) {
  .options--2col .option__sub { display: none; }
  .options--2col .option { padding: 12px 18px; }
  .options--2col .option__label { font-size: 18px; }
  .form-step .form-lead { display: none; }
  .form-step { gap: 14px; }
  .form-head { gap: 8px; }
  .form-title, .doi__title, .done__title { font-size: 26px; }
  .form-lead, .doi__lead, .done__text { font-size: 16px; }
  .form-card { padding: 18px 22px; gap: 14px; }
  .doi { gap: 12px; }
  .doi__steps li { flex-direction: row; text-align: left; padding: 10px 14px; gap: 10px; font-size: 15px; }
  .doi__num { flex: none; width: 30px; height: 30px; }
}

/* ---------- Kontaktschritt mit Standortkarte („individuelle Seite“ je Standort) ---------- */
.contact { width: 100%; max-width: 1040px; margin: 0 auto; display: flex; flex-direction: column; gap: 24px; }
.contact__grid { display: grid; gap: 20px; align-items: start; }
.contact .form-card { width: 100%; }
@media (min-width: 900px) {
  /* Formular links, Standort rechts daneben (bleibt beim Scrollen sichtbar) */
  /* Standortkarte genauso hoch wie das Formular */
  .contact__grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: stretch; }
  .contact__grid .form-card { grid-column: 1; grid-row: 1; }
  /* Karte zählt nicht zur Zeilenhöhe, füllt aber genau die Höhe des Formulars */
  .contact__grid .loc { grid-column: 2; grid-row: 1; height: 0; min-height: 100%; }
}
.badge-neutral { font: 600 14px/1 var(--font-body); color: var(--ink-2); background: #fff; border-radius: 999px; padding: 9px 14px; }

.loc { background: #fff; border-radius: 20px; overflow: hidden; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.loc__media { background: var(--blue-50); display: flex; align-items: center; justify-content: center; }
.loc__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; display: block; }
.loc__media .loc__logo--media { width: 88px; height: 88px; object-fit: contain; }
.loc__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; }
.loc__kicker { font: 600 13px/1.2 var(--font-body); color: var(--blue-text); }
.loc__name { font: 600 22px/1.2 var(--font-sans); color: var(--blue-text); letter-spacing: -0.01em; }
.loc__person { display: flex; flex-direction: column; gap: 2px; }
.loc__person strong { font: 600 17px/1.3 var(--font-sans); color: var(--ink); }
.loc__person span { font: 400 14px/1.3 var(--font-body); color: var(--ink-3); }
.loc__facts { margin: 6px 0 0; display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--border); padding-top: 14px; }
.loc__fact { display: grid; grid-template-columns: 18px 1fr; column-gap: 10px; row-gap: 1px; align-items: start; }
.loc__icon { grid-row: 1 / span 2; color: var(--blue); margin-top: 1px; }
.loc__fact dt { font: 500 12.5px/1.3 var(--font-body); color: var(--ink-3); }
.loc__fact dd { margin: 0; font: 500 15px/1.4 var(--font-body); color: var(--ink); overflow-wrap: anywhere; }
.loc__fact dd a { font-weight: 600; text-decoration: none; }
.loc__note { font: 400 12.5px/1.45 var(--font-body); color: var(--ink-3); margin-top: 4px; }
.loc--none .loc__body { padding: 24px; }
.loc__logo { width: 56px; height: 56px; }
.loc__text { font: 400 15px/1.5 var(--font-body); color: var(--ink-2); }
/* Handy/Tablet: Standort kompakt über dem Formular – Foto klein links */
@media (max-width: 899px) {
  .loc__body { padding: 16px 18px; gap: 6px; }
  .loc__name { font-size: 19px; }
  .loc__person strong { font-size: 15.5px; }
  .loc__facts { gap: 8px; padding-top: 10px; margin-top: 4px; }
  .loc__fact dd { font-size: 14px; }
  .loc__note { font-size: 12px; }
}
@media (max-width: 420px) {
  .loc__body { padding: 14px 14px 16px; }
}
/* Bestätigt: Ansprechpartner noch einmal */
.done__loc { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 16px; padding: 14px 18px; text-align: left; }
.done__loc img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 22%; flex: none; }
.done__loc p { display: flex; flex-direction: column; gap: 2px; }
.done__loc strong { font: 600 16px/1.3 var(--font-sans); color: var(--ink); }
.done__loc span { font: 400 14px/1.4 var(--font-body); color: var(--ink-2); }
@media (orientation: landscape) and (max-height: 520px) { .contact .form-lead { display: none; } }

/* Foto der Inhaber oben; füllt den Platz, den die Texte übrig lassen (mind. 190 px) */
.loc__brand { display: block; font: 600 14px/1.3 var(--font-body); color: var(--ink-3); }
.loc__visuals { flex: 1 1 0; min-height: 190px; display: grid; grid-template-columns: 1fr 1fr; background: var(--blue-50); }
.loc__visuals--single { grid-template-columns: 1fr; }
.loc__visuals .loc__media { aspect-ratio: auto; min-height: 0; height: 100%; }
.loc__body { flex: none; }
@media (max-width: 899px) {
  .loc:not(.loc--none) { display: flex; flex-direction: column; }
  .loc__visuals { flex: none; height: 240px; }
}
@media (max-width: 420px) { .loc__visuals { height: 210px; } }

/* ---------- Abzweig Zentrale (PLZ ohne Standort) ---------- */
.loc--central .loc__central-head { display: flex; align-items: center; gap: 14px; padding: 22px 22px 0; }
.loc--central .loc__central-head .loc__logo { width: 52px; height: 52px; flex: none; }
.loc--central .loc__central-head div { display: flex; flex-direction: column; gap: 2px; }
.loc--central .loc__body { gap: 14px; }
.loc__actions { display: flex; flex-direction: column; gap: 10px; }
.loc__actions .btn { gap: 10px; }
.loc__actions .btn .loc__icon { color: currentColor; margin: 0; }
.btn--ghost { background: #fff; color: var(--blue-text); border: 2px solid var(--border-blue); }
.btn--ghost:hover { border-color: var(--blue); color: var(--blue-hover); }
.btn--primary { background: var(--blue-text); }
.form-card__title { font: 600 20px/1.2 var(--font-sans); color: var(--blue-text); }