:root{
  --brand-dark:#1a3e63;
  --brand-accent:#15477a;
  --brand-gray:#E0E2E5;
  --brand-bg:#f6f8fb;
  --brand-text:#0f172a;
  --radius:14px;
}

/* Base */
html { -webkit-text-size-adjust: 100%; }
body{ background:var(--brand-bg); color:var(--brand-text); }

/* Header */
.brand-header{ background:var(--brand-dark); color:#fff; }
.brand-logo-wrap {
  padding: .5rem .8rem;
  border-radius: 16px;
}
/* Skalierung mit clamp -> sauber responsiv */
.brand-logo {
  height: clamp(60px, 10vw, 120px); /* min 60px, max 120px */
  width: auto;
}
/* Layout */
.container-narrow{ max-width:1080px; }
.card{ border:1px solid var(--brand-gray); border-radius: var(--radius); }

/* Fragen */
.question{ display:none; }
.question.active{ display:block; }
.form-label.fw-bold{ color:#1a6d70; }

/* Progressbar */
.progress{ height: 12px; background:#e9edf3; border-radius:999px; }
.progress-bar{
  background: linear-gradient(90deg, var(--brand-accent), #4bc4c7);
  box-shadow:0 2px 6px rgba(42,177,180,.35) inset; border-radius:999px;
}

/* Auswahl-Karten / Inputs */
.form-check,
.form-check.border.rounded{
  border:1px solid #e4eaf1 !important; border-radius:12px !important; background:#fff;
  transition: box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
  padding: .9rem 1rem;
}
.form-check:hover,
.form-check.border.rounded:hover{ box-shadow:0 6px 16px rgba(0,0,0,.06); border-color:#d5deea; background:#fbfdff; }
.form-check:focus-within,
.form-check.border.rounded:focus-within{ border-color:var(--brand-accent) !important; box-shadow:0 0 0 3px rgba(42,177,180,.15) !important; }
.form-check-input{
  width:1.35rem; height:1.35rem; border-radius:50%; border-color:#c9d3df; box-shadow:none;
  flex:0 0 auto;
}
.form-check-label{
  line-height:1.4; word-break:break-word; overflow-wrap: anywhere;
}
.form-check-input:checked{ background-color:var(--brand-accent); border-color:var(--brand-accent); }

/* Inputs (Kontakt) */
.input-group .input-group-text { min-width: 3rem; }
.input-group img { display:block; }

/* Buttons */
.btn-primary{ background:var(--brand-accent); border-color:var(--brand-accent); }
.btn-primary:hover{ filter:brightness(.96); }
.btn-primary:focus{ box-shadow:0 0 0 .2rem rgba(42,177,180,.25); }

.btn-outline-secondary{ border-color:#c9d3df; color:#334155; }
.btn-outline-secondary:hover{ background:#f1f5f9; border-color:#c9d3df; }

.btn-success{ background:#34c759; border-color:#34c759; }
.btn-success:hover{ filter:brightness(.95); }
.btn-success:focus{ box-shadow:0 0 0 .2rem rgba(52,199,89,.25); }

.page-title{ color:var(--brand-dark); font-weight:800; letter-spacing:.2px; }

/* Review-List Optik */
.review-list .item{ border-bottom:1px dashed #e5e7eb; padding:.6rem 0; }
.review-list .key{ color:#334155; font-weight:600; }
.review-list .val{ color:#0f172a; word-break:break-word; overflow-wrap:anywhere; }

/* Toasts */
.toast-container{ z-index:1080; }
@media (max-width: 576px){
  .toast-container{ left:0; right:0; margin:0 auto; width:min(92%, 420px); }
}

/* Responsive Tweaks */
@media (max-width: 992px){
  .card-body{ padding:1.5rem !important; }
}
@media (max-width: 576px){
  .card-body{ padding:1.25rem !important; }
  .nav-row { gap:.75rem !important; }
  .nav-row .btn{ width:100%; } /* Vor/Zurück/Weiter stacken */
  .form-check{ padding:.85rem .9rem; }
  .input-group .form-control{ min-height: 44px; }
}

/* Motion preference */
@media (prefers-reduced-motion: reduce) {
  * { transition:none !important; scroll-behavior:auto !important; }
}