/* ============================================================
   Versicherungen — Info-Karten + Kostenrechner
   ============================================================ */
.i{ fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

/* ---- Info cards ---- */
.vsec{ background:#fff; }
.vgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; }
.vcard{
  display:flex; flex-direction:column; background:var(--cream);
  border:1px solid var(--line-soft); border-radius:var(--r-lg); padding:30px 28px;
  box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease;
}
.vcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.vcard__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.vcard__ic{ width:54px; height:54px; border-radius:14px; display:grid; place-items:center; background:var(--navy-900); color:var(--gold-200); flex:none; }
.vcard__ic svg{ width:26px; height:26px; }
.vbadge{ font-family:var(--font-body); font-weight:800; font-size:11px; letter-spacing:.05em; text-transform:uppercase; padding:6px 12px; border-radius:var(--r-pill); white-space:nowrap; }
.vbadge--must{ background:var(--navy-900); color:#fff; }
.vbadge--strong{ background:var(--gold); color:#1a1407; }
.vbadge--rec{ background:#e7f0e5; color:var(--green-700); }
.vbadge--opt{ background:#e7e2da; color:var(--muted); }
.vcard h3{ font-family:var(--font-display); font-weight:800; font-size:20px; letter-spacing:-.01em; color:var(--navy); margin-top:20px; }
.vcard p{ color:var(--body); font-size:15px; line-height:1.6; margin-top:10px; }

/* ---- Calculator (mirrors Zins-/Umzugsrechner) ---- */
.vz{ background:var(--navy-900); color:#fff; position:relative; overflow:hidden; }
.vz::before{ content:""; position:absolute; inset:0;
  background: radial-gradient(68% 60% at 8% 0%, rgba(134,181,58,.12), transparent 60%),
             radial-gradient(60% 60% at 100% 100%, rgba(212,144,26,.18), transparent 55%); }
.vz .wrap{ position:relative; }
.vz__grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,5vw,64px); align-items:start; }
.vz__intro .eyebrow{ color:var(--gold-200); }
.vz__intro h2{ color:#fff; }
.vz__lead{ color:#cdddE6; font-size:18px; line-height:1.6; margin-top:18px; }
.vz__motto{ display:inline-flex; align-items:center; gap:10px; margin-top:22px; color:var(--gold-200); font-weight:800; font-size:14px; }
.vz__motto svg{ width:19px; height:19px; }
.vz__trust{ display:flex; flex-direction:column; gap:11px; margin-top:24px; }
.vz__trust span{ display:inline-flex; align-items:center; gap:10px; color:#dbe7ee; font-weight:600; font-size:15px; }
.vz__trust svg{ width:18px; height:18px; color:var(--gold-200); flex:none; }

.vzc{ background:#fff; color:var(--ink); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); padding:clamp(24px,3vw,36px); }
.vz-chips{ display:flex; gap:10px; }
.vz-chip{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
  font-family:inherit; font-weight:700; font-size:15px; color:var(--navy);
  background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:13px 14px; transition:all .16s ease; }
.vz-chip svg{ width:18px; height:18px; color:var(--gold); }
.vz-chip.is-active{ background:var(--navy-900); color:#fff; border-color:transparent; }
.vz-chip.is-active svg{ color:var(--gold-200); }

.vz-field{ margin-top:24px; }
.vz-field__head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; }
.vz-field__lab{ font-weight:700; color:var(--navy); font-size:15px; }
.vz-field__val{ font-family:var(--font-display); font-weight:800; font-size:clamp(19px,2.2vw,24px); color:var(--navy); letter-spacing:-.02em; }
.vz-range{ -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:99px; margin:13px 0 0; background:var(--line); outline:none; }
.vz-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:26px; height:26px; border-radius:50%; background:var(--gold); border:4px solid #fff; box-shadow:0 4px 12px rgba(200,145,31,.45); cursor:pointer; }
.vz-range::-moz-range-thumb{ width:26px; height:26px; border-radius:50%; background:var(--gold); border:4px solid #fff; box-shadow:0 4px 12px rgba(200,145,31,.45); cursor:pointer; }

.vz-opts{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:26px; }
.vz-opt{ display:flex; gap:12px; align-items:center; padding:14px 16px; border:1px solid var(--line); border-radius:var(--r); cursor:pointer; background:#fff; transition:border-color .16s ease, background .16s ease; user-select:none; }
.vz-opt:hover{ border-color:var(--gold-200); }
.vz-opt.is-on{ border-color:var(--gold); background:#fffdf7; }
.vz-opt input{ width:19px; height:19px; accent-color:var(--gold); flex:none; }
.vz-opt__t{ font-weight:700; font-size:14px; color:var(--navy); line-height:1.2; }
.vz-opt__t small{ display:block; color:var(--muted); font-weight:700; font-size:12px; margin-top:2px; }

.vz-breakdown{ margin-top:28px; border-top:1px solid var(--line); }
.vz-breakdown .row{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 0; border-bottom:1px solid var(--line-soft); }
.vz-breakdown .row span{ color:var(--body); font-size:15px; font-weight:600; }
.vz-breakdown .row span small{ display:block; color:var(--muted); font-weight:700; font-size:12px; }
.vz-breakdown .row b{ font-family:var(--font-display); font-size:17px; color:var(--navy); white-space:nowrap; }
.vz-breakdown .row.is-off{ display:none; }

.vz-result{ margin-top:18px; background:var(--navy-900); color:#fff; border-radius:var(--r); padding:22px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; position:relative; overflow:hidden; }
.vz-result::before{ content:""; position:absolute; inset:0; background:radial-gradient(80% 90% at 100% 0%, rgba(200,145,31,.28), transparent 60%); }
.vz-result > *{ position:relative; }
.vz-result__k{ font-weight:800; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--gold-200); }
.vz-result__k small{ display:block; color:#bcd2dd; font-weight:700; font-size:12px; letter-spacing:0; text-transform:none; margin-top:3px; }
.vz-result__v{ font-family:var(--font-display); font-weight:800; font-size:clamp(24px,3vw,34px); color:#fff; letter-spacing:-.02em; white-space:nowrap; text-align:right; }
.vz-result__v small{ display:block; font-size:.46em; font-weight:700; color:var(--gold-200); margin-top:2px; }
.vz-foot{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin-top:20px; }
.vz-note{ color:var(--muted); font-size:12.5px; line-height:1.5; max-width:46ch; }
.vz-hint{ display:none; gap:9px; align-items:flex-start; margin-top:16px; color:var(--gold-600); font-size:12.5px; line-height:1.5; }
.vz-hint.show{ display:flex; }
.vz-hint svg{ width:15px; height:15px; flex:none; margin-top:1px; }

@media (max-width:1000px){ .vgrid{ grid-template-columns:repeat(2,1fr); } .vz__grid{ grid-template-columns:1fr; } }
@media (max-width:640px){ .vgrid{ grid-template-columns:1fr; } .vz-opts{ grid-template-columns:1fr; } .vz-result{ flex-direction:column; align-items:flex-start; } }