/* harixumzug – Seite /umzuege/ und Umzugsrechner. Alles unter .hu-page / .hu-root, damit das Theme unberührt bleibt. */
.hu-page, .hu-root {
  --hu-blue: #0C31A6; --hu-blue-2: #0A2785; --hu-cyan: #00B4F5; --hu-box: #D9AE86; --hu-ink: #111827; --hu-mut: #5b6475;
  --hu-line: #dfe5ef; --hu-bg: #ffffff; --hu-bg-2: #f3f6fb; --hu-ok: #0f9d58; --hu-warn: #b45309; --hu-r: 14px;
  --hu-shadow: 0 10px 30px rgba(12, 49, 166, .10);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: var(--hu-ink); line-height: 1.55;
}
.hu-page *, .hu-root * { box-sizing: border-box; }
.hu-page { background: var(--hu-bg); overflow-x: hidden; }
.hu-wrap { max-width: 1160px; margin: 0 auto; padding: 0 16px; }
.hu-narrow { max-width: 820px; }
.hu-preview-bar { background: #fff4d6; color: #7a4b00; text-align: center; padding: 10px 16px; font-size: 14px; }

/* Kopfbereich */
.hu-hero { background: radial-gradient(1200px 500px at 85% -10%, rgba(0, 180, 245, .35), transparent 60%), linear-gradient(135deg, var(--hu-blue) 0%, var(--hu-blue-2) 60%, #071a5c 100%); color: #fff; padding: 56px 0 64px; }
.hu-hero-in { display: grid; grid-template-columns: 1.25fr .75fr; gap: 40px; align-items: center; }
.hu-hero-logo { height: 60px; width: auto; margin-bottom: 18px; }
.hu-hero h1 { font-size: clamp(30px, 4.4vw, 50px); line-height: 1.1; margin: 0 0 14px; color: #fff; font-weight: 800; letter-spacing: -.02em; }
.hu-lead { font-size: 18px; opacity: .92; margin: 0 0 24px; max-width: 620px; }
.hu-cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.hu-checks { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; }
.hu-checks li { padding-left: 28px; position: relative; font-size: 15px; }
.hu-checks li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--hu-cyan); color: #04245e; font-weight: 800; font-size: 12px; display: grid; place-items: center; }
.hu-hero-card { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .22); border-radius: 20px; padding: 22px; backdrop-filter: blur(6px); }
.hu-hc-step { display: flex; align-items: center; gap: 14px; padding: 12px 0; font-weight: 600; border-bottom: 1px dashed rgba(255, 255, 255, .2); }
.hu-hc-step:last-child { border-bottom: 0; }
.hu-hc-step span { width: 34px; height: 34px; border-radius: 10px; background: #fff; color: var(--hu-blue); display: grid; place-items: center; font-weight: 800; flex: none; }

/* Knöpfe */
.hu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 20px; border-radius: 12px; border: 2px solid transparent; font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none; transition: transform .15s, box-shadow .15s, background .15s; }
.hu-btn:hover { transform: translateY(-1px); }
.hu-btn:disabled { opacity: .55; cursor: default; transform: none; }
.hu-btn-lg { min-height: 54px; padding: 0 26px; font-size: 17px; }
.hu-btn-sm, .hu-sm { min-height: 40px; padding: 0 14px; font-size: 15px; }
.hu-btn-primary { background: var(--hu-blue); color: #fff; }
.hu-btn-primary:hover { background: var(--hu-blue-2); }
.hu-btn-accent { background: var(--hu-cyan); color: #032053; box-shadow: 0 8px 22px rgba(0, 180, 245, .35); }
.hu-btn-ghost { background: transparent; border-color: currentColor; color: inherit; }
.hu-root .hu-btn-ghost, .hu-section .hu-btn-ghost { color: var(--hu-blue); }
.hu-contact .hu-btn-ghost { color: #fff; }
.hu-link { background: none; border: 0; color: var(--hu-blue); text-decoration: underline; cursor: pointer; font: inherit; font-size: 14px; padding: 0 4px; }

/* Abschnitte */
.hu-section { padding: 64px 0; }
.hu-alt { background: var(--hu-bg-2); }
.hu-h2 { font-size: clamp(26px, 3vw, 36px); margin: 0 0 10px; font-weight: 800; letter-spacing: -.01em; color: var(--hu-ink); }
.hu-sub { color: var(--hu-mut); margin: 0 0 24px; }
.hu-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 24px; }
.hu-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 24px; }
.hu-card { background: #fff; border: 1px solid var(--hu-line); border-radius: var(--hu-r); padding: 22px; }
.hu-card h3 { margin: 10px 0 6px; font-size: 18px; }
.hu-card p { margin: 0; color: var(--hu-mut); font-size: 15px; }
.hu-card-ico { font-size: 26px; width: 48px; height: 48px; border-radius: 12px; background: #e9f0ff; display: grid; place-items: center; }
.hu-steps { counter-reset: s; list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.hu-steps li { counter-increment: s; background: #fff; border: 1px solid var(--hu-line); border-radius: var(--hu-r); padding: 20px; position: relative; }
.hu-steps li::before { content: counter(s); display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--hu-blue); color: #fff; font-weight: 800; margin-bottom: 10px; }
.hu-steps b { display: block; margin-bottom: 4px; }
.hu-steps span { color: var(--hu-mut); font-size: 15px; }
.hu-veh { background: #fff; border-radius: var(--hu-r); padding: 20px; border: 1px solid var(--hu-line); display: flex; flex-direction: column; gap: 4px; border-top: 4px solid var(--hu-cyan); }
.hu-veh b { font-size: 18px; }
.hu-veh small { color: var(--hu-mut); }
.hu-note { color: var(--hu-mut); font-size: 14px; margin-top: 16px; }
.hu-faq { border-bottom: 1px solid var(--hu-line); padding: 16px 0; }
.hu-faq summary { cursor: pointer; font-weight: 700; font-size: 17px; list-style: none; position: relative; padding-right: 30px; }
.hu-faq summary::-webkit-details-marker { display: none; }
.hu-faq summary::after { content: "+"; position: absolute; right: 4px; top: -2px; font-size: 24px; color: var(--hu-blue); }
.hu-faq[open] summary::after { content: "–"; }
.hu-faq p { margin: 10px 0 0; color: var(--hu-mut); }
.hu-contact { background: linear-gradient(135deg, var(--hu-blue), #071a5c); color: #fff; }
.hu-contact .hu-h2 { color: #fff; }
.hu-contact-in { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: center; }
.hu-contact-links { display: flex; flex-wrap: wrap; gap: 10px; }
.hu-imprint { grid-column: 1 / -1; opacity: .75; font-size: 14px; margin: 0; }
.hu-fab { display: none; }

/* ---------------- Rechner ---------------- */
.hu-app { background: #fff; border: 1px solid var(--hu-line); border-radius: 20px; box-shadow: var(--hu-shadow); padding: 28px; }
.hu-loading { text-align: center; color: var(--hu-mut); padding: 60px 20px; }
.hu-progress { list-style: none; display: flex; gap: 6px; margin: 0 0 10px; padding: 0; overflow-x: auto; scrollbar-width: none; }
.hu-progress li { flex: 1; min-width: 0; }
.hu-progress button { width: 100%; display: flex; align-items: center; gap: 8px; background: none; border: 0; padding: 6px 4px; cursor: pointer; font: inherit; color: var(--hu-mut); text-align: left; }
.hu-progress button:disabled { cursor: default; }
.hu-progress span { width: 28px; height: 28px; border-radius: 50%; flex: none; display: grid; place-items: center; font-weight: 700; font-size: 13px; background: var(--hu-bg-2); border: 2px solid var(--hu-line); }
.hu-progress em { font-style: normal; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hu-progress .cur span { background: var(--hu-blue); border-color: var(--hu-blue); color: #fff; }
.hu-progress .cur em { color: var(--hu-ink); }
.hu-progress .done span { background: var(--hu-cyan); border-color: var(--hu-cyan); color: #032053; }
.hu-bar { height: 4px; border-radius: 4px; background: var(--hu-bg-2); margin-bottom: 22px; overflow: hidden; }
.hu-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--hu-blue), var(--hu-cyan)); transition: width .3s; }
.hu-h3 { font-size: 21px; margin: 6px 0 14px; font-weight: 800; }
.hu-h4, .hu-fotos h4, .hu-vorschlag h4 { font-size: 17px; margin: 20px 0 8px; font-weight: 700; }
.hu-info { background: #eef4ff; border-radius: 10px; padding: 10px 14px; color: #23407f; font-size: 14px; }
.hu-small { font-size: 14px; color: var(--hu-mut); margin: 6px 0; }
.hu-datehint { color: var(--hu-warn); font-size: 14px; min-height: 1em; margin: 4px 0; }
.hu-msg { background: #fdecec; color: #9b1c1c; border-radius: 10px; padding: 12px 14px; margin: 14px 0 0; font-weight: 600; }
.hu-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--hu-line); }

.hu-tiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 22px; }
.hu-tile { position: relative; border: 2px solid var(--hu-line); border-radius: 14px; padding: 14px 10px; text-align: center; cursor: pointer; display: flex; flex-direction: column; gap: 2px; transition: border-color .15s, background .15s; }
.hu-tile input, .hu-seg input, .hu-svc input { position: absolute; opacity: 0; pointer-events: none; }
.hu-tile-ico { font-size: 28px; }
.hu-tile small { color: var(--hu-mut); font-size: 13px; }
.hu-tile:has(input:checked), .hu-svc:has(input:checked) { border-color: var(--hu-blue); background: #f0f4ff; }
.hu-tile:has(input:focus-visible), .hu-seg label:has(input:focus-visible), .hu-svc:has(input:focus-visible) { outline: 3px solid var(--hu-cyan); outline-offset: 2px; }

.hu-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; align-items: flex-end; }
.hu-row > .hu-field { flex: 1 1 180px; }
.hu-row4 > .hu-field { flex: 1 1 90px; }
.hu-row4 > .hu-w2 { flex: 2 1 200px; }
.hu-field { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.hu-full { width: 100%; margin-bottom: 12px; }
.hu-field > span { font-size: 13px; font-weight: 600; color: var(--hu-mut); }
.hu-field input, .hu-field select, .hu-field textarea, .hu-search, .hu-var {
  width: 100%; min-height: 46px; border: 1.5px solid #cfd7e6; border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 16px; background: #fff; color: var(--hu-ink); }
.hu-field textarea { min-height: 90px; resize: vertical; }
.hu-field input:focus, .hu-field select:focus, .hu-field textarea:focus, .hu-search:focus { outline: none; border-color: var(--hu-blue); box-shadow: 0 0 0 3px rgba(12, 49, 166, .15); }
.hu-check { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; margin: 8px 0; cursor: pointer; }
.hu-check input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--hu-blue); }
.hu-checks-row { display: flex; flex-wrap: wrap; gap: 4px 22px; margin-bottom: 8px; }
.hu-station { border: 1px solid var(--hu-line); border-radius: 14px; padding: 16px; margin: 0 0 16px; }
.hu-station legend { font-weight: 800; padding: 0 6px; }
.hu-ac { position: relative; }
.hu-ac-list { position: absolute; top: 100%; left: 0; right: 0; z-index: 30; background: #fff; border: 1px solid var(--hu-line); border-radius: 10px; box-shadow: var(--hu-shadow); margin-top: 4px; max-height: 300px; overflow: auto; }
.hu-ac-list button { display: block; width: 100%; text-align: left; padding: 11px 14px; background: none; border: 0; border-bottom: 1px solid #f0f2f6; font: inherit; font-size: 15px; cursor: pointer; }
.hu-ac-list button:hover, .hu-ac-list button.on { background: #eef4ff; }

.hu-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
.hu-seg label { position: relative; cursor: pointer; }
.hu-seg span { display: flex; flex-direction: column; border: 2px solid var(--hu-line); border-radius: 12px; padding: 12px 14px; }
.hu-seg small { color: var(--hu-mut); font-size: 13px; }
.hu-seg input:checked + span { border-color: var(--hu-blue); background: #f0f4ff; }

.hu-inv { border: 1px solid var(--hu-line); border-radius: 14px; overflow: hidden; margin-top: 8px; }
.hu-inv-head { padding: 12px; background: var(--hu-bg-2); position: sticky; top: 0; z-index: 5; }
.hu-search { margin-bottom: 10px; }
.hu-rooms { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
.hu-chip { flex: none; border: 1.5px solid #cfd7e6; background: #fff; border-radius: 999px; padding: 7px 13px; font: inherit; font-size: 14px; cursor: pointer; white-space: nowrap; }
.hu-chip.on { background: var(--hu-blue); color: #fff; border-color: var(--hu-blue); }
.hu-chip b { background: var(--hu-cyan); color: #032053; border-radius: 999px; padding: 0 7px; font-size: 12px; }
.hu-items { max-height: 520px; overflow-y: auto; }
.hu-item { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-bottom: 1px solid #eef1f6; }
.hu-item.has { background: #f6f9ff; }
.hu-item-t { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.hu-item-t small { color: var(--hu-mut); width: 100%; }
.hu-var { min-height: 36px; padding: 4px 8px; font-size: 14px; width: auto; max-width: 100%; }
.hu-tag { background: #fff4d6; color: #7a4b00; font-size: 12px; padding: 2px 8px; border-radius: 6px; }
.hu-stepper { display: flex; align-items: center; flex: none; }
.hu-stepper button { width: 40px; height: 40px; border-radius: 10px; border: 1.5px solid #cfd7e6; background: #fff; font-size: 22px; line-height: 1; cursor: pointer; color: var(--hu-blue); }
.hu-stepper button:disabled { color: #b7bfcd; cursor: default; }
.hu-stepper input { width: 46px; height: 40px; text-align: center; border: 0; font: inherit; font-weight: 700; font-size: 16px; background: transparent; }
.hu-own { padding: 12px 14px; border-top: 1px solid var(--hu-line); }
.hu-own summary { cursor: pointer; color: var(--hu-blue); font-weight: 600; }
.hu-own .hu-row { margin-top: 10px; }
.hu-sum { display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: center; padding: 12px 14px; background: var(--hu-blue); color: #fff; position: sticky; bottom: 0; }
.hu-sum small { width: 100%; opacity: .85; }

.hu-fotos { margin-top: 18px; border: 1.5px dashed #b9c6e0; border-radius: 14px; padding: 16px; }
.hu-file input { padding: 9px; }
.hu-thumbs { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0; }
.hu-thumb { position: relative; width: 92px; margin: 0; }
.hu-thumb img, .hu-thumb > span { width: 92px; height: 92px; object-fit: cover; border-radius: 10px; display: grid; place-items: center; background: var(--hu-bg-2); font-size: 30px; }
.hu-thumb figcaption { font-size: 11px; color: var(--hu-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hu-thumb button { position: absolute; top: -6px; right: -6px; width: 26px; height: 26px; border-radius: 50%; border: 0; background: var(--hu-ink); color: #fff; cursor: pointer; }
.hu-up { align-self: center; color: var(--hu-blue); font-weight: 600; }
.hu-vorschlag { background: #f6f9ff; border-radius: 12px; padding: 14px; margin-top: 12px; }
.hu-vrow { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid #e6ecf6; }
.hu-vrow input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--hu-blue); }
.hu-vrow span { flex: 1; }
.hu-vrow small { color: var(--hu-warn); }
.hu-vrow input[type=text] { width: 60px; min-height: 38px; border: 1.5px solid #cfd7e6; border-radius: 8px; text-align: center; font-size: 16px; }

.hu-svcs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 14px; }
.hu-svc { position: relative; cursor: pointer; border: 2px solid var(--hu-line); border-radius: 12px; padding: 12px 14px 12px 46px; }
.hu-svc::before { content: ""; position: absolute; left: 14px; top: 14px; width: 20px; height: 20px; border-radius: 6px; border: 2px solid #b7c2d6; }
.hu-svc:has(input:checked)::before { background: var(--hu-blue); border-color: var(--hu-blue); box-shadow: inset 0 0 0 3px #fff; }
.hu-svc span { display: flex; flex-direction: column; }
.hu-svc small { color: var(--hu-mut); font-size: 13px; }

.hu-summary { border: 1px solid var(--hu-line); border-radius: 14px; margin-bottom: 18px; }
.hu-summary > div { display: grid; grid-template-columns: 110px 1fr auto; gap: 10px; padding: 11px 14px; border-bottom: 1px solid #eef1f6; align-items: start; }
.hu-summary > div:last-child { border-bottom: 0; }
.hu-summary span { color: var(--hu-mut); font-size: 14px; }
.hu-summary b { font-weight: 600; font-size: 15px; }
.hu-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.hu-result { text-align: center; }
.hu-ok { width: 64px; height: 64px; border-radius: 50%; background: var(--hu-ok); color: #fff; font-size: 34px; display: grid; place-items: center; margin: 0 auto 8px; }
.hu-price { background: linear-gradient(135deg, var(--hu-blue), #071a5c); color: #fff; border-radius: 16px; padding: 22px; margin: 18px auto; max-width: 560px; display: flex; flex-direction: column; gap: 4px; }
.hu-price b { font-size: clamp(28px, 6vw, 40px); font-weight: 800; letter-spacing: -.01em; }
.hu-price small { opacity: .85; }
.hu-price ul { text-align: left; margin: 8px 0 0; padding-left: 20px; }
.hu-price-ind b { font-size: 26px; }
.hu-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 10px 0; }
.hu-facts div { background: var(--hu-bg-2); border-radius: 12px; padding: 10px 16px; display: flex; flex-direction: column; min-width: 140px; }
.hu-facts span { font-size: 13px; color: var(--hu-mut); }
.hu-hinweise, .hu-next { text-align: left; max-width: 560px; margin: 10px auto; }
.hu-result .hu-nav { justify-content: center; }

/* ---------------- Seite mit Fotos (1.1) ---------------- */
.hu-page img { max-width: 100%; height: auto; display: block; }
.hu-page .hu-hero-logo { height: 60px; width: auto; }
.hu-hero-foto { position: relative; isolation: isolate; padding: 88px 0 96px; background: #071a5c; }
.hu-hero-bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.hu-hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 65% 40%; }
.hu-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7, 26, 92, .94) 0%, rgba(12, 49, 166, .82) 42%, rgba(12, 49, 166, .25) 75%, rgba(7, 26, 92, .1) 100%); }
.hu-hero-foto .hu-hero-card { background: rgba(7, 26, 92, .55); }
.hu-kicker { color: var(--hu-cyan); font-weight: 800; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 6px; }
.hu-alt .hu-kicker, .hu-section .hu-kicker { color: #0a8fc4; }
.hu-trust { background: #eaf7fd; border-bottom: 1px solid #d5eefa; }
.hu-trust-in { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding-top: 18px; padding-bottom: 18px; }
.hu-trust-in div { display: flex; flex-direction: column; padding-left: 34px; position: relative; }
.hu-trust-in div::before { content: "✓"; position: absolute; left: 0; top: 2px; width: 24px; height: 24px; border-radius: 50%; background: var(--hu-blue); color: #fff; font-weight: 800; font-size: 13px; display: grid; place-items: center; }
.hu-trust-in span { color: var(--hu-mut); font-size: 14px; }
.hu-card-foto { padding: 0; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.hu-card-foto:hover { box-shadow: var(--hu-shadow); transform: translateY(-2px); }
.hu-card-img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--hu-bg-2); }
.hu-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.hu-card-foto:hover .hu-card-img img { transform: scale(1.04); }
.hu-card-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.hu-card-body h3 { margin: 0 0 6px; }
.hu-more { margin-top: auto; padding-top: 12px; color: var(--hu-blue); font-weight: 700; text-decoration: none; font-size: 15px; }
.hu-more:hover { text-decoration: underline; }
.hu-split { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.hu-split-img img { border-radius: 20px; box-shadow: var(--hu-shadow); width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.hu-collage { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hu-collage img:first-child { grid-column: 1 / -1; }
.hu-collage img:last-child { grid-column: 2; margin-top: -90px; border: 6px solid #fff; aspect-ratio: 4 / 3; }
.hu-list { list-style: none; padding: 0; margin: 16px 0 22px; display: grid; gap: 8px; }
.hu-list li { padding-left: 28px; position: relative; }
.hu-list li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--hu-cyan); color: #04245e; font-weight: 800; font-size: 12px; display: grid; place-items: center; }
.hu-split .hu-btn-ghost { color: var(--hu-blue); }
.hu-facts-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 22px; }
.hu-facts-row div { background: #fff; border: 1px solid var(--hu-line); border-radius: 14px; padding: 14px; text-align: center; }
.hu-facts-row b { display: block; font-size: 30px; color: var(--hu-blue); font-weight: 800; line-height: 1.1; }
.hu-facts-row span { font-size: 14px; color: var(--hu-mut); }
.hu-fz-card { background: #fff; border: 1px solid var(--hu-line); border-radius: 18px; padding: 14px 18px 18px; display: flex; flex-direction: column; }
.hu-fz-card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; margin-bottom: 12px; }
.hu-fz-card h3 { margin: 0 0 8px; font-size: 19px; }
.hu-fz-card dl { margin: 0 0 10px; }
.hu-fz-card dl div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid #eef1f6; font-size: 14px; }
.hu-fz-card dt { color: var(--hu-mut); text-transform: uppercase; font-size: 12px; letter-spacing: .06em; font-weight: 700; align-self: center; }
.hu-fz-card dd { margin: 0; font-weight: 700; }
.hu-fz-card p { margin: auto 0 0; color: var(--hu-mut); font-size: 14px; }
/* Fahrzeuge freigestellt (ohne Hintergrund); beim Überfahren leicht anheben, beim Klicken kurz „anfahren“ */
.hu-fz-stage { aspect-ratio: 2 / 1; display: flex; align-items: flex-end; justify-content: center; padding: 12px 4px 8px; margin-bottom: 12px; cursor: pointer; outline: none; position: relative; }
.hu-fz-stage::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: 6px; height: 10px; border-radius: 50%; background: radial-gradient(closest-side, rgba(15, 23, 42, .18), transparent); }
.hu-page .hu-fz-stage img { position: absolute; left: 4px; top: 10px; width: calc(100% - 8px); height: calc(100% - 18px); object-fit: contain; object-position: center bottom; aspect-ratio: auto; border-radius: 0; margin: 0; z-index: 1; transition: transform .35s ease; transform-origin: 50% 100%; }
.hu-page .hu-fz-lkw75 img { left: 8%; width: 84%; top: 22%; height: calc(78% - 8px); }   /* 7,5 t etwas kleiner als 12 t */
.hu-fz-stage:hover img, .hu-fz-stage:focus-visible img { transform: translateY(-3px); }
.hu-fz-stage.hu-drive img { animation: hu-drive 1.1s ease-in-out; }
@keyframes hu-drive {
  0% { transform: translateX(0) rotate(0); }
  18% { transform: translateX(-5px) rotate(.6deg); }
  45% { transform: translateX(14px) rotate(-.8deg); }
  65% { transform: translateX(10px) rotate(.4deg); }
  82% { transform: translateX(2px) rotate(-.2deg); }
  100% { transform: translateX(0) rotate(0); }
}
@media (prefers-reduced-motion: reduce) { .hu-fz-stage.hu-drive img { animation: none; } }
.hu-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 24px; }
.hu-gallery figure { margin: 0; position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 3 / 2; }
.hu-gallery img { width: 100%; height: 100%; object-fit: cover; }
.hu-gallery figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 10px; color: #fff; font-size: 14px; font-weight: 600; background: linear-gradient(transparent, rgba(7, 26, 92, .85)); }
.hu-share { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: 14px; }
.hu-share span { opacity: .8; }
.hu-share a { color: #fff; font-weight: 600; }
.hu-tiles-7 { grid-template-columns: repeat(4, 1fr); }
.hu-fzv { display: flex; gap: 12px; align-items: center; background: var(--hu-bg-2); border-radius: 12px; padding: 10px 14px; margin: 8px 0; }

@media (max-width: 999px) {
  .hu-split { grid-template-columns: 1fr; gap: 28px; }
  .hu-split-rev .hu-split-img { order: -1; }
  .hu-trust-in { grid-template-columns: 1fr 1fr; }
  .hu-gallery { grid-template-columns: 1fr 1fr; }
  .hu-hero-foto { padding: 56px 0 64px; }
  .hu-hero-bg::after { background: linear-gradient(180deg, rgba(7, 26, 92, .78), rgba(12, 49, 166, .9)); }
}
@media (max-width: 640px) {
  .hu-trust-in, .hu-facts-row { grid-template-columns: 1fr; }
  .hu-collage img:last-child { margin-top: 0; border: 0; }
  .hu-tiles-7 { grid-template-columns: 1fr 1fr; }
  .hu-grid3.hu-svc-cards, .hu-grid4.hu-fz { grid-template-columns: 1fr 1fr; gap: 12px; }
  .hu-card-body { padding: 12px 12px 14px; }
  .hu-card-body h3 { font-size: 16px; }
  .hu-card-body p { font-size: 14px; }
}
@media (max-width: 480px) {
  .hu-grid3.hu-svc-cards, .hu-grid4.hu-fz, .hu-gallery { grid-template-columns: 1fr; }
}

@media (max-width: 999px) {
  .hu-hero-in { grid-template-columns: 1fr; }
  .hu-hero-card { display: none; }
  .hu-grid3 { grid-template-columns: 1fr 1fr; }
  .hu-grid4, .hu-steps { grid-template-columns: 1fr 1fr; }
  .hu-tiles { grid-template-columns: repeat(3, 1fr); }
  .hu-contact-in { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hu-hero { padding: 36px 0 44px; }
  .hu-page .hu-hero-logo { height: 46px; }
  .hu-lead { font-size: 16px; }
  .hu-checks, .hu-grid3, .hu-grid4, .hu-steps, .hu-svcs { grid-template-columns: 1fr; }
  .hu-section { padding: 44px 0; }
  .hu-app { padding: 16px; border-radius: 16px; margin: 0 -4px; }
  .hu-tiles { grid-template-columns: 1fr 1fr; }
  .hu-progress em { display: none; }
  .hu-progress .cur em { display: inline; }
  .hu-progress li { flex: none; }
  .hu-progress li.cur { flex: 1; }
  .hu-summary > div { grid-template-columns: 1fr auto; }
  .hu-summary > div > span { grid-column: 1 / -1; margin-bottom: -6px; }
  .hu-nav .hu-btn { flex: 1; }
  .hu-items { max-height: none; }
  .hu-cta-row .hu-btn { width: 100%; }
  .hu-fab { display: flex; position: fixed; left: 16px; bottom: 16px; z-index: 50; background: var(--hu-cyan); color: #032053; font-weight: 800; border-radius: 999px; padding: 14px 20px; text-decoration: none; box-shadow: 0 10px 24px rgba(0, 0, 0, .25); }
}
@media (prefers-reduced-motion: reduce) { .hu-btn, .hu-bar i { transition: none; } }

/* =====================================================================
   Rechner 1.2 – App-Optik (Buchungsstrecke): Liniensymbole in angehobenen Kacheln,
   Fortschritt mit Häkchen, Übersicht rechts, Schalter, sanfte Übergänge
   ===================================================================== */
.hu-root .hu-i { width: 22px; height: 22px; flex: none; }
.hu-app.hu-app2 { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; padding: 0; background: none; border: 0; box-shadow: none; }
.hu-main { background: #fff; border: 1px solid var(--hu-line); border-radius: 22px; box-shadow: 0 18px 50px rgba(12, 49, 166, .10); padding: 26px 28px 22px; min-width: 0; }
.hu-side { position: sticky; top: 110px; }
.hu-side-card { background: #fff; border: 1px solid var(--hu-line); border-radius: 20px; box-shadow: 0 12px 36px rgba(12, 49, 166, .08); padding: 18px 18px 14px; }
.hu-side-head { display: flex; gap: 10px; align-items: center; font-size: 17px; margin-bottom: 6px; }
.hu-side-head .hu-i { color: var(--hu-blue); }
.hu-side-row { display: grid; grid-template-columns: 20px 1fr auto; gap: 10px; padding: 10px 0; border-top: 1px solid #eef1f6; align-items: start; }
.hu-side-row .hu-i { width: 18px; height: 18px; color: #a9b3c6; margin-top: 2px; transition: color .2s; }
.hu-side-row.set .hu-i { color: var(--hu-blue); }
.hu-side-row span { display: block; font-size: 11.5px; color: var(--hu-mut); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.hu-side-row b { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.hu-side-row small { display: block; font-weight: 400; color: var(--hu-mut); font-size: 12.5px; }
.hu-side-row em { font-style: normal; color: #b3bccd; font-weight: 500; }
.hu-side-row .hu-link { font-size: 12.5px; padding: 0; }
.hu-side-price { display: flex; gap: 10px; margin-top: 8px; padding: 12px; border-radius: 14px; background: linear-gradient(135deg, #eef4ff, #e6f7fe); }
.hu-side-price .hu-i { color: var(--hu-blue); }
.hu-side-price b { display: block; font-size: 14px; }
.hu-side-price small { display: block; font-size: 12.5px; color: #43506b; line-height: 1.4; }
.hu-side-trust { list-style: none; margin: 14px 6px 0; padding: 0; display: grid; gap: 9px; font-size: 13.5px; color: #43506b; }
.hu-side-trust li { display: flex; gap: 9px; align-items: center; }
.hu-side-trust .hu-i { width: 18px; height: 18px; color: var(--hu-ok); }

/* Fortschritt: Symbole mit Verbindungslinie */
.hu-app2 .hu-progress { display: flex; gap: 0; margin: 0 0 4px; padding: 4px 0 0; overflow: visible; }
.hu-app2 .hu-progress li { flex: 1; position: relative; display: flex; justify-content: center; min-width: 0; }
.hu-app2 .hu-progress li:not(:first-child)::before { content: ""; position: absolute; top: 21px; right: 50%; width: 100%; height: 3px; background: #e6ebf4; border-radius: 3px; z-index: 0; transition: background .3s; }
.hu-app2 .hu-progress li.done::before, .hu-app2 .hu-progress li.cur::before { background: linear-gradient(90deg, var(--hu-cyan), var(--hu-blue)); }
.hu-app2 .hu-progress button { position: relative; z-index: 1; flex-direction: column; align-items: center; gap: 7px; width: auto; padding: 0 2px; text-align: center; }
.hu-app2 .hu-progress span { width: 44px; height: 44px; border-radius: 14px; background: #fff; border: 2px solid #e3e8f1; color: #9aa6bd; box-shadow: 0 4px 12px rgba(12, 49, 166, .06); transition: all .25s; }
.hu-app2 .hu-progress span .hu-i { width: 20px; height: 20px; }
.hu-app2 .hu-progress .cur span { background: linear-gradient(135deg, var(--hu-blue), #2a5cff); border-color: transparent; color: #fff; box-shadow: 0 10px 22px rgba(12, 49, 166, .35); transform: translateY(-2px); }
.hu-app2 .hu-progress .done span { background: var(--hu-cyan); border-color: transparent; color: #032053; }
.hu-app2 .hu-progress .done span .hu-i { stroke-width: 2.6; }
.hu-app2 .hu-progress em { font-size: 12.5px; }
.hu-app2 .hu-progress button:not(:disabled):hover span { transform: translateY(-2px); }
.hu-app2 .hu-bar { display: none; }
.hu-stepcount { margin: 6px 0 14px; text-align: center; font-size: 12.5px; color: var(--hu-mut); }

/* Übergang zwischen den Schritten */
.hu-app2 .hu-step { animation: hu-in .35s ease both; }
@keyframes hu-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Überschriften */
.hu-app2 .hu-h3 { display: flex; align-items: center; gap: 10px; font-size: 21px; margin: 10px 0 12px; }
.hu-app2 .hu-h-i { color: var(--hu-blue); width: 22px; height: 22px; }
.hu-lead2 { color: var(--hu-mut); margin: -4px 0 16px; font-size: 15px; }

/* Symbol-Kachel (gemeinsam für Auswahl und Leistungen) */
.hu-ico { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; flex: none; background: linear-gradient(145deg, #f3f6ff, #e2eaff); color: var(--hu-blue); box-shadow: inset 0 1px 0 #fff, 0 6px 14px rgba(12, 49, 166, .12); transition: all .25s; }

/* Auswahlkacheln */
.hu-app2 .hu-tiles { grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 12px; margin-bottom: 20px; }
.hu-app2 .hu-tile { flex-direction: row; align-items: center; text-align: left; gap: 14px; padding: 14px 14px 14px 16px; border: 1.5px solid #e3e8f1; border-radius: 16px; background: #fff; box-shadow: 0 2px 6px rgba(15, 23, 42, .04); transition: transform .2s, box-shadow .2s, border-color .2s, background .2s; }
.hu-app2 .hu-tile:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(12, 49, 166, .12); border-color: #c9d6f3; }
.hu-tile-t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.hu-tile-t b { font-size: 15.5px; line-height: 1.3; }
.hu-tile-t small { color: var(--hu-mut); font-size: 13px; line-height: 1.35; }
.hu-tick { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #d5dce8; display: grid; place-items: center; flex: none; color: transparent; transition: all .2s; }
.hu-tick .hu-i { width: 13px; height: 13px; stroke-width: 3; }
.hu-app2 .hu-tile:has(input:checked) { border-color: var(--hu-blue); background: #f6f9ff; box-shadow: 0 14px 30px rgba(12, 49, 166, .16); transform: translateY(-2px); }
.hu-tile:has(input:checked) .hu-ico, .hu-svc:has(input:checked) .hu-ico { background: linear-gradient(135deg, var(--hu-blue), #2a5cff); color: #fff; box-shadow: 0 10px 20px rgba(12, 49, 166, .35); }
.hu-tile:has(input:checked) .hu-tick { background: var(--hu-blue); border-color: var(--hu-blue); color: #fff; }

/* Möbelliste / Schnell schätzen */
.hu-app2 .hu-seg span { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; border: 1.5px solid #e3e8f1; border-radius: 16px; padding: 14px 16px; transition: all .2s; }
.hu-app2 .hu-seg span .hu-i { grid-row: span 2; color: var(--hu-blue); }
.hu-app2 .hu-seg label:hover span { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(12, 49, 166, .10); }
.hu-app2 .hu-seg input:checked + span { border-color: var(--hu-blue); background: #f6f9ff; box-shadow: 0 12px 26px rgba(12, 49, 166, .14); }

/* Leistungen als Schalter */
.hu-app2 .hu-svcs { gap: 12px; }
.hu-app2 .hu-svc { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1.5px solid #e3e8f1; border-radius: 16px; background: #fff; transition: transform .2s, box-shadow .2s, border-color .2s, background .2s; }
.hu-app2 .hu-svc::before { display: none; }
.hu-app2 .hu-svc:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(12, 49, 166, .10); }
.hu-app2 .hu-svc:has(input:checked) { border-color: var(--hu-blue); background: #f6f9ff; }
.hu-svc .hu-ico { width: 40px; height: 40px; border-radius: 12px; }
.hu-svc .hu-ico .hu-i { width: 20px; height: 20px; }
.hu-svc-t { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.hu-switch { width: 42px; height: 24px; border-radius: 999px; background: #d9dfea; position: relative; flex: none; transition: background .2s; }
.hu-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, .2); transition: transform .2s; }
.hu-svc:has(input:checked) .hu-switch { background: var(--hu-blue); }
.hu-svc:has(input:checked) .hu-switch::after { transform: translateX(18px); }

/* Auswahl-Chips (Keller, Dachboden, Besonderheiten …) */
.hu-app2 .hu-checks-row { gap: 8px; }
.hu-app2 .hu-checks-row .hu-check { border: 1.5px solid #e3e8f1; border-radius: 999px; padding: 8px 14px 8px 10px; margin: 2px 0; background: #fff; align-items: center; transition: all .2s; }
.hu-app2 .hu-checks-row .hu-check input { margin-top: 0; }
.hu-app2 .hu-checks-row .hu-check:has(input:checked) { border-color: var(--hu-blue); background: #f6f9ff; }

/* Eingabefelder */
.hu-app2 .hu-field input, .hu-app2 .hu-field select, .hu-app2 .hu-field textarea { border: 1.5px solid #dfe5ef; border-radius: 12px; background: #fbfcfe; transition: border-color .15s, box-shadow .15s, background .15s; }
.hu-app2 .hu-field input:focus, .hu-app2 .hu-field select:focus, .hu-app2 .hu-field textarea:focus { background: #fff; }
.hu-app2 .hu-field select { appearance: none; -webkit-appearance: none; padding-right: 38px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6475' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }
.hu-app2 .hu-station { border-radius: 18px; background: #fbfcfe; padding: 18px; border-color: #e6ebf3; }
.hu-app2 .hu-info { border-radius: 12px; }

/* Navigation */
.hu-app2 .hu-nav { margin-top: 22px; padding-top: 16px; }
.hu-app2 .hu-nav .hu-btn .hu-i { width: 18px; height: 18px; }
.hu-app2 .hu-btn-primary { background: linear-gradient(135deg, var(--hu-blue), #2a5cff); box-shadow: 0 10px 22px rgba(12, 49, 166, .28); }
.hu-app2 .hu-btn-primary:hover { box-shadow: 0 14px 28px rgba(12, 49, 166, .36); }
.hu-app2 .hu-btn-ghost { border-color: #dfe5ef; border-width: 1.5px; }

@media (max-width: 999px) {
  .hu-app.hu-app2 { grid-template-columns: 1fr; }
  .hu-side { display: none; }
}
@media (max-width: 640px) {
  .hu-main { padding: 18px 14px 0; border-radius: 18px; margin: 0 -4px; }
  .hu-app2 .hu-progress span { width: 38px; height: 38px; border-radius: 12px; }
  .hu-app2 .hu-progress li:not(:first-child)::before { top: 18px; }
  .hu-app2 .hu-progress em { display: none; }
  .hu-app2 .hu-progress li { flex: 1; }
  .hu-app2 .hu-tiles { grid-template-columns: 1fr; gap: 10px; }
  .hu-app2 .hu-tile { padding: 12px 12px 12px 14px; }
  .hu-ico { width: 42px; height: 42px; border-radius: 12px; }
  .hu-app2 .hu-h3 { font-size: 19px; }
  .hu-app2 .hu-nav { position: sticky; bottom: 0; z-index: 20; background: rgba(255, 255, 255, .96); backdrop-filter: blur(6px); margin: 18px -14px 0; padding: 12px 14px; border-top: 1px solid var(--hu-line); border-radius: 0 0 18px 18px; box-shadow: 0 -8px 20px rgba(15, 23, 42, .06); }
}
@media (prefers-reduced-motion: reduce) { .hu-app2 .hu-step { animation: none; } .hu-app2 .hu-tile, .hu-app2 .hu-svc, .hu-ico { transition: none; } }
/* ---------- Kopfbereich als Bildwechsler (1.3) ---------- */
.hu-slider .hu-slide-bg { opacity: 0; transition: opacity 1.2s ease; }
.hu-slider .hu-slide-bg.on { opacity: 1; }
.hu-slider .hu-slide-bg img { transform: scale(1.02); }
.hu-slider .hu-slide-bg.on img { animation: hu-kenburns 9s ease-out both; }
@keyframes hu-kenburns { from { transform: scale(1.02); } to { transform: scale(1.09); } }
.hu-slides { display: grid; }
.hu-slides > .hu-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease, visibility 0s linear .6s; }
.hu-slides > .hu-slide.on { opacity: 1; visibility: visible; transform: none; transition: opacity .7s ease .15s, transform .7s ease .15s, visibility 0s; }
.hu-slide-title, .hu-hero .hu-slide h1 { font-size: clamp(30px, 4.4vw, 50px); line-height: 1.1; margin: 0 0 14px; color: #fff; font-weight: 800; letter-spacing: -.02em; }
.hu-slider-nav { display: flex; align-items: center; gap: 12px; margin: 4px 0 22px; }
.hu-sl-arrow { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .45); background: rgba(255, 255, 255, .08); color: #fff; display: grid; place-items: center; cursor: pointer; transition: background .2s, border-color .2s, transform .2s; backdrop-filter: blur(4px); }
.hu-sl-arrow:hover { background: rgba(255, 255, 255, .2); border-color: #fff; transform: translateY(-1px); }
.hu-sl-dots { display: flex; gap: 8px; }
.hu-sl-dots button { width: 34px; height: 6px; padding: 0; border: 0; border-radius: 6px; background: rgba(255, 255, 255, .3); cursor: pointer; overflow: hidden; position: relative; }
.hu-sl-dots button i { position: absolute; inset: 0; width: 0; background: var(--hu-cyan); border-radius: 6px; }
.hu-sl-dots button.on i { width: 100%; }
.hu-slider.playing .hu-sl-dots button.on i { width: 0; animation: hu-dot var(--hu-sl-ms, 7000ms) linear forwards; }
.hu-slider.paused .hu-sl-dots button.on i { animation-play-state: paused; }
@keyframes hu-dot { to { width: 100%; } }
@media (max-width: 640px) { .hu-slider-nav { margin-bottom: 18px; } .hu-sl-arrow { width: 36px; height: 36px; } }
@media (prefers-reduced-motion: reduce) { .hu-slider .hu-slide-bg.on img { animation: none; } .hu-slides > .hu-slide { transition: none; } }
@media (max-width: 999px) {
  .hu-slider .hu-hero-bg::after { background: linear-gradient(180deg, rgba(7, 26, 92, .45) 0%, rgba(9, 34, 120, .72) 45%, rgba(12, 49, 166, .86) 100%); }
  .hu-slider .hu-hero-bg img { object-position: 60% 30%; }
}
/* ---------- 1.4: Google-Bewertung, Wisch-Leiste am Handy, Kontrast ---------- */
.hu-stars { position: relative; display: inline-block; letter-spacing: 1px; color: #d6dbe6; font-size: 1em; line-height: 1; }
.hu-stars::before { content: "★★★★★"; position: absolute; left: 0; top: 0; width: var(--r, 100%); overflow: hidden; color: #f5b301; white-space: nowrap; }
.hu-trust-g { display: flex; flex-direction: column; padding-left: 34px; position: relative; text-decoration: none; color: inherit; }
.hu-trust-g::before { content: "G"; position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 50%; background: #fff; color: #4285f4; font-weight: 800; font-size: 14px; display: grid; place-items: center; box-shadow: 0 1px 4px rgba(0, 0, 0, .15); }
.hu-trust-g b { font-weight: 700; }
.hu-trust-g span:not(.hu-stars) { color: var(--hu-blue); font-size: 14px; }
.hu-trust-g:hover span:not(.hu-stars) { text-decoration: underline; }
.hu-gcard { display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 14px 16px; background: #fff; border: 1px solid var(--hu-line); border-radius: 16px; text-decoration: none; color: var(--hu-ink); box-shadow: 0 6px 18px rgba(12, 49, 166, .06); transition: transform .2s, box-shadow .2s; }
.hu-gcard:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(12, 49, 166, .12); }
.hu-gcard-g { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; font-size: 22px; color: #4285f4; background: #f1f5ff; flex: none; }
.hu-gcard-t { flex: 1; display: flex; flex-direction: column; }
.hu-gcard-t b { font-size: 20px; display: flex; align-items: center; gap: 8px; }
.hu-gcard-t small { color: var(--hu-mut); font-size: 14px; }
.hu-gcard-a { color: var(--hu-blue); font-size: 20px; }
.hu-side-g { display: grid; grid-template-columns: auto auto 1fr; gap: 4px 8px; align-items: center; margin: 14px 6px 0; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--hu-line); text-decoration: none; color: var(--hu-ink); }
.hu-side-g b { font-size: 15px; }
.hu-side-g small { grid-column: 1 / -1; color: var(--hu-mut); font-size: 12.5px; }
.hu-side-g:hover { border-color: var(--hu-blue); }
.hu-alt .hu-kicker, .hu-section .hu-kicker { color: #06709f; }
@media (max-width: 640px) {
  /* Leistungen als Wisch-Leiste statt 9 Karten untereinander */
  .hu-grid3.hu-svc-cards { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 20px -16px 0; padding: 4px 16px 14px; scrollbar-width: none; }
  .hu-grid3.hu-svc-cards::-webkit-scrollbar { display: none; }
  .hu-svc-cards > .hu-card { flex: 0 0 78%; scroll-snap-align: start; }
  #leistungen .hu-h2::after { content: "← wischen →"; display: block; font-size: 13px; font-weight: 600; color: var(--hu-mut); letter-spacing: .04em; margin-top: 6px; }
}
/* ---------- 1.5: Seiten Entrümpelung / Haushaltsauflösung ---------- */
.hu-crumbs { font-size: 14px; opacity: .85; margin-bottom: 14px; }
.hu-crumbs a { color: #fff; text-decoration: none; }
.hu-crumbs a:hover { text-decoration: underline; }
.hu-areas .hu-card { border-top: 4px solid var(--hu-cyan); transition: transform .2s, box-shadow .2s; }
.hu-areas .hu-card:hover { transform: translateY(-3px); box-shadow: var(--hu-shadow); }
.hu-areas .hu-card h3 { margin-top: 0; }
.hu-prices { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 8px; }
.hu-price-card { background: #fff; border: 1px solid var(--hu-line); border-radius: 18px; padding: 18px; box-shadow: 0 8px 24px rgba(12, 49, 166, .06); display: flex; flex-direction: column; gap: 6px; }
.hu-price-card h3 { font-size: 16px; margin: 0; line-height: 1.35; }
.hu-price-card b { font-size: 22px; color: var(--hu-blue); font-weight: 800; margin-top: auto; }
.hu-price-card small { color: var(--hu-mut); font-size: 13px; }
.hu-related { margin-top: 22px; font-weight: 600; }
.hu-related a { color: var(--hu-blue); }
.hu-more-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 14px; font-weight: 600; }
.hu-more-links a { color: var(--hu-blue); text-decoration: none; }
.hu-more-links a:hover { text-decoration: underline; }
@media (max-width: 999px) { .hu-prices { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .hu-prices { grid-template-columns: 1fr; } }

/* 1.6.0 Kundenportal: Häkchen im Rechner und Hinweis nach dem Absenden */
.hu-portal-opt { background: #f5f8ff; border: 1.5px solid #dbe5ff; border-radius: 14px; padding: 12px 14px; }
.hu-portal-opt b { color: var(--hu-blue); }
.hu-portal-box { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 18px 0 6px; padding: 14px 16px; border-radius: 16px; background: linear-gradient(135deg, #eef4ff, #f5fbff); border: 1px solid #cfe0ff; text-align: left; }
.hu-portal-box > .hu-i { width: 28px; height: 28px; color: var(--hu-blue); flex: none; }
.hu-portal-box > div { flex: 1 1 220px; }
.hu-portal-box b { display: block; color: var(--hu-ink); }
.hu-portal-box span { font-size: 14px; color: var(--hu-mut); }
.hu-portal-soft { background: #f8fafc; border-color: var(--hu-line); }

/* 1.5.6 Hover: die Link-Farbe des Themes (a:hover dunkelblau) darf Knöpfe und Links auf blauem Grund nicht umfärben */
a.hu-btn-primary:hover, a.hu-btn-primary:focus { color: #fff; }
a.hu-btn-accent:hover, a.hu-btn-accent:focus { color: #032053; filter: brightness(1.06); }
a.hu-btn-ghost:hover, a.hu-btn-ghost:focus { color: inherit; background: rgba(255, 255, 255, .12); }
.hu-root a.hu-btn-ghost:hover, .hu-section a.hu-btn-ghost:hover, .hu-split a.hu-btn-ghost:hover { color: var(--hu-blue); background: rgba(12, 49, 166, .06); }
.hu-contact a.hu-btn-ghost:hover, .hu-contact a.hu-btn-ghost:focus { color: #fff; background: rgba(255, 255, 255, .12); }
.hu-hero a:not(.hu-btn):hover, .hu-contact a:not(.hu-btn):hover { color: #fff; text-decoration: underline; }
a.hu-gcard:hover { color: var(--hu-ink); }

/* 1.5.5 Symbole in Kontakt-Knöpfen (statt Emojis) */
.hu-btn .hu-i { width: 18px; height: 18px; flex: none; }

/* 1.5.2 Hinweis zu Google-Bewertungen (§ 5b Abs. 3 UWG) */
.hu-g-hint { display: block; font-style: normal; font-size: 12px; line-height: 1.4; color: var(--hu-mut); margin-top: 2px; }
.hu-trust .hu-g-hint { color: inherit; opacity: .7; }

/* 1.5.1 Handy: größere Tippflächen (mind. 44 px, Slider-Punkte 24 px) */
.hu-sl-dots button { height: 24px; background: transparent; overflow: visible; }
.hu-sl-dots button::before { content: ""; position: absolute; left: 0; right: 0; top: 9px; height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .3); }
.hu-sl-dots button i { top: 9px; bottom: auto; height: 6px; z-index: 1; }
@media (max-width: 768px) {
  .hu-sl-arrow { width: 44px; height: 44px; }
  .hu-faq summary { padding-top: 10px; padding-bottom: 10px; }
  .hu-faq summary::after { top: 7px; }
  .hu-share a, .hu-more-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; }
  .hu-share, .hu-more-links { row-gap: 0; }
  .hu-check input { width: 24px; height: 24px; }
  .hu-app2 .hu-progress button { padding: 3px 2px; }
}