/**
 * Teppich Service Berlin — calculator styles.
 *
 * Colours are chosen to pass WCAG AA. The site currently fails that audit
 * because its body links (#ff6600) measure only 2.94:1 against white; nothing
 * here repeats that mistake. Every text colour below is >= 4.5:1 on its
 * background, and the numbers are noted inline.
 */

.tsb-calc {
	--tsb-ink:    #1a2e5c;  /* 11.4:1 on white */
	--tsb-accent: #a62a2a;  /*  6.5:1 on white */
	--tsb-muted:  #4a5568;  /*  7.5:1 on white */
	--tsb-line:   #d8dee9;
	--tsb-bg:     #f7f9fc;

	max-width: 860px;
	margin: 2rem auto;
	padding: 1.5rem;
	border: 1px solid var(--tsb-line);
	border-radius: 12px;
	background: #fff;
	color: var(--tsb-ink);
	font-size: 1rem;
	line-height: 1.6;
}

.tsb-calc__title {
	margin: 0 0 .5rem;
	font-size: 1.5rem;
	line-height: 1.25;
	color: var(--tsb-ink);
}
.tsb-calc__intro { margin: 0 0 1.25rem; color: var(--tsb-muted); }

.tsb-calc__row { display: flex; flex-wrap: wrap; gap: 1rem; }
.tsb-calc__field { flex: 1 1 150px; display: flex; flex-direction: column; gap: .35rem; }
.tsb-calc__field label { font-weight: 600; font-size: .95rem; }

.tsb-calc__field input,
.tsb-calc__field select {
	padding: .6rem .7rem;
	border: 1px solid #9aa5b8;      /* 3:1 against white — meets the non-text contrast rule */
	border-radius: 8px;
	font-size: 1.05rem;
	background: #fff;
	color: var(--tsb-ink);
	width: 100%;
}
/* A visible focus ring is a WCAG requirement, not decoration. */
.tsb-calc :is(input, select, button, a):focus-visible {
	outline: 3px solid var(--tsb-accent);
	outline-offset: 2px;
}

.tsb-calc__fieldset { margin: 1.25rem 0 0; padding: 0; border: 0; }
.tsb-calc__fieldset legend { font-weight: 600; padding: 0; margin-bottom: .5rem; }

.tsb-calc__radio {
	display: flex; align-items: center; gap: .6rem;
	padding: .6rem .7rem; margin-bottom: .4rem;
	border: 1px solid var(--tsb-line); border-radius: 8px;
	cursor: pointer;
}
.tsb-calc__radio:hover { background: var(--tsb-bg); }
.tsb-calc__radio input { width: auto; margin: 0; }
.tsb-calc__radio-label { flex: 1; }
.tsb-calc__radio-price { font-weight: 700; color: var(--tsb-accent); white-space: nowrap; }

.tsb-calc__presets-label { margin: 1.25rem 0 .5rem; font-weight: 600; }
.tsb-calc__presets { display: flex; flex-wrap: wrap; gap: .5rem; }
.tsb-calc__preset {
	padding: .45rem .8rem;
	border: 1px solid #9aa5b8; border-radius: 999px;
	background: #fff; color: var(--tsb-ink);
	font-size: .9rem; cursor: pointer;
}
.tsb-calc__preset:hover { background: var(--tsb-ink); color: #fff; border-color: var(--tsb-ink); }

.tsb-calc__result { margin-top: 1.5rem; padding: 1.1rem; background: var(--tsb-bg); border-radius: 10px; }
.tsb-calc__result-grid { display: flex; flex-wrap: wrap; gap: 1rem; }
.tsb-calc__result-item { flex: 1 1 140px; }
.tsb-calc__result-label { display: block; font-size: .85rem; color: var(--tsb-muted); }
.tsb-calc__result-value { display: block; font-size: 1.35rem; font-weight: 700; }
.tsb-calc__result-item--total .tsb-calc__result-value { font-size: 1.9rem; color: var(--tsb-accent); }

.tsb-calc__note { margin: 1rem 0 0; font-size: .88rem; color: var(--tsb-muted); }

.tsb-calc__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }
.tsb-calc__btn {
	display: inline-block; padding: .75rem 1.25rem;
	border: 2px solid var(--tsb-ink); border-radius: 8px;
	color: var(--tsb-ink); background: #fff;
	font-weight: 600; text-decoration: none;
}
.tsb-calc__btn--primary { background: var(--tsb-ink); color: #fff; }
.tsb-calc__btn:hover { background: var(--tsb-accent); border-color: var(--tsb-accent); color: #fff; }

/* ---------- comparison ---------- */

.tsb-vergleich__intro { margin: 1.25rem 0 .75rem; font-weight: 600; }
.tsb-vergleich__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.tsb-vergleich__card { padding: 1rem; border: 1px solid var(--tsb-line); border-radius: 10px; background: #fff; }
.tsb-vergleich__card--own { border-color: var(--tsb-ink); border-width: 2px; background: var(--tsb-bg); }
.tsb-vergleich__title { margin: 0 0 .35rem; font-size: 1.05rem; }
.tsb-vergleich__price { margin: 0 0 .6rem; font-size: 1.25rem; font-weight: 700; color: var(--tsb-accent); }
.tsb-vergleich__ja, .tsb-vergleich__nein { margin: 0 0 .5rem; font-size: .9rem; }
.tsb-vergleich__ja span, .tsb-vergleich__nein span { font-weight: 700; }
.tsb-vergleich__nein { color: var(--tsb-muted); }
.tsb-vergleich__quelle { margin: .6rem 0 0; font-size: .78rem; color: var(--tsb-muted); }
.tsb-vergleich__fazit {
	margin: 1.25rem 0 0; padding: .9rem 1rem;
	border-left: 4px solid var(--tsb-accent); background: var(--tsb-bg);
	font-size: .95rem;
}

/* ---------- tables ---------- */

.tsb-table-wrap { overflow-x: auto; margin: 1.5rem 0; }
.tsb-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tsb-table caption { text-align: left; padding-bottom: .6rem; font-weight: 600; color: #1a2e5c; }
.tsb-table th, .tsb-table td { padding: .7rem .8rem; border-bottom: 1px solid #d8dee9; text-align: left; vertical-align: top; }
.tsb-table thead th { background: #f7f9fc; border-bottom: 2px solid #1a2e5c; }
.tsb-table tbody th { font-weight: 600; }
.tsb-table__quelle { font-size: .8rem; color: #4a5568; }
.tsb-table__stand { display: block; opacity: .85; }
.tsb-note { font-size: .9rem; color: #4a5568; }

@media (max-width: 600px) {
	.tsb-calc { padding: 1rem; margin: 1.25rem 0; }
	.tsb-calc__result-item--total .tsb-calc__result-value { font-size: 1.6rem; }
}

/* Respect the user's motion preference. */
@media (prefers-reduced-motion: reduce) {
	.tsb-calc * { transition: none !important; animation: none !important; }
}

/* ---------- internal-link hubs ---------- */

.tsb-hub, .tsb-related {
	max-width: 860px; margin: 2rem auto; padding: 1.25rem 1.5rem;
	border: 1px solid #d8dee9; border-radius: 12px; background: #f7f9fc;
	color: #1a2e5c;
}
.tsb-hub h2, .tsb-related h2 { margin: 0 0 .5rem; font-size: 1.25rem; }
.tsb-hub p, .tsb-related p { margin: 0 0 .9rem; color: #4a5568; }
.tsb-hub__list {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: .4rem .9rem; list-style: none; margin: 0; padding: 0;
}
.tsb-hub__list li { margin: 0; }
.tsb-hub__list a {
	display: block; padding: .4rem .1rem;
	color: #1a2e5c; text-decoration: underline; text-underline-offset: 2px;
}
.tsb-hub__list a:hover { color: #b23c00; }
.tsb-related__cta { margin: 1rem 0 0; font-size: .95rem; }

/* ---------- second-generation calculators ---------- */

.tsb-faktoren { list-style:none; margin:1rem 0 0; padding:0; font-size:.92rem; }
.tsb-faktoren li { display:flex; justify-content:space-between; gap:1rem; padding:.35rem 0; border-bottom:1px dashed #d8dee9; }
.tsb-faktoren li span:last-child { font-weight:700; color:#a62a2a; white-space:nowrap; }
.tsb-szenarien { list-style:none; margin:.6rem 0 0; padding:0; font-size:.86rem; }
.tsb-szenarien li { display:flex; justify-content:space-between; gap:.8rem; padding:.3rem 0; border-bottom:1px dashed #d8dee9; }
.tsb-szenarien li span:last-child { white-space:nowrap; font-weight:600; }

.tsb-quellen { margin-top:1.25rem; font-size:.88rem; }
.tsb-quellen summary { cursor:pointer; font-weight:600; color:#1a2e5c; padding:.4rem 0; }
.tsb-quellen ul { margin:.6rem 0 0 1.1rem; padding:0; }
.tsb-quellen li { margin-bottom:.5rem; }
.tsb-quellen__src { display:block; color:#4a5568; font-size:.82rem; }

/* ---------- diagnosis ---------- */

.tsb-diag { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; margin-top:1rem; }
.tsb-diag__item { padding:1rem; border:1px solid #d8dee9; border-radius:10px; background:#fff; }
.tsb-diag__title { margin:0 0 .6rem; font-size:1.05rem; display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.tsb-diag__badge { font-size:.72rem; font-weight:700; padding:.2rem .5rem; border-radius:999px; white-space:nowrap; }
.tsb-diag__badge--sehr-hoch { background:#8b1e22; color:#fff; }
.tsb-diag__badge--hoch      { background:#b23c00; color:#fff; }
.tsb-diag__badge--mittel    { background:#1a2e5c; color:#fff; }
.tsb-diag__badge--niedrig   { background:#e6ebf3; color:#1a2e5c; }
.tsb-diag__do   { margin:0 0 .5rem; font-size:.92rem; }
.tsb-diag__dont { margin:0 0 .5rem; font-size:.92rem; padding:.5rem .7rem; background:#fdf1f1; border-left:3px solid #8b1e22; }
.tsb-diag__we   { margin:0; font-size:.9rem; color:#4a5568; }

/* ---------- facts ---------- */

.tsb-fakten { max-width:1000px; margin:2.5rem auto; }
.tsb-fakten__intro { color:#4a5568; margin-bottom:1.25rem; }
.tsb-fakten__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.1rem; }
.tsb-fakt { padding:1.2rem; border:1px solid #d8dee9; border-radius:12px; background:#fff; }
.tsb-fakt__wert { margin:0 0 .4rem; }
.tsb-fakt__zahl { font-size:2rem; font-weight:800; color:#1a2e5c; line-height:1.1; display:block; }
.tsb-fakt__gegen { font-size:.9rem; color:#8b1e22; font-weight:600; }
.tsb-fakt__titel { margin:.3rem 0 .5rem; font-size:1.05rem; }
.tsb-fakt__text { margin:0 0 .7rem; font-size:.93rem; }
.tsb-fakt__quelle { margin:0 0 .5rem; font-size:.8rem; color:#4a5568; }
.tsb-fakt__caveat { margin:0; font-size:.8rem; color:#4a5568; padding:.55rem .7rem; background:#f7f9fc; border-left:3px solid #9aa5b8; border-radius:0 6px 6px 0; }

/* ---------- tenancy law ---------- */

.tsb-recht { max-width:1000px; margin:2.5rem auto; }
.tsb-recht__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1rem; margin:1.25rem 0; }
.tsb-recht__item { padding:1.1rem; border:1px solid #d8dee9; border-radius:10px; background:#fff; }
.tsb-recht__item h3 { margin:0 0 .5rem; font-size:1.02rem; }
.tsb-recht__item p { margin:0 0 .5rem; font-size:.93rem; }
.tsb-recht__az { font-size:.8rem; color:#4a5568; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.tsb-recht__disclaimer { padding:.9rem 1.1rem; background:#fdf6e7; border-left:4px solid #b8860b; border-radius:0 8px 8px 0; font-size:.9rem; }

/* ---------- trust strip / package ---------- */

.tsb-vertrauen { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:1rem; margin:1.75rem 0; }
.tsb-vertrauen__item { padding:1rem; border:1px solid #d8dee9; border-radius:10px; background:#f7f9fc; }
.tsb-vertrauen__item strong { display:block; font-size:1.15rem; color:#1a2e5c; margin-bottom:.35rem; }
.tsb-vertrauen__item span { font-size:.88rem; color:#4a5568; }

.tsb-paket { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.25rem; margin:1.5rem 0; }
.tsb-paket__block { padding:1.2rem; border:1px solid #d8dee9; border-radius:12px; background:#fff; }
.tsb-paket__block h3 { margin:0 0 .6rem; font-size:1.05rem; }
.tsb-paket__block ul { margin:0; padding-left:1.15rem; font-size:.93rem; }
.tsb-paket__block li { margin-bottom:.35rem; }

/* ---------- upholstery + B2B ---------- */

.tsb-polster__liste { display:grid; gap:.4rem; }
.tsb-polster__zeile { display:grid; grid-template-columns:1fr auto 90px; gap:.75rem; align-items:center;
	padding:.55rem .7rem; border:1px solid #d8dee9; border-radius:8px; }
.tsb-polster__zeile label { font-weight:600; font-size:.95rem; margin:0; }
.tsb-polster__spanne { font-size:.85rem; color:#4a5568; white-space:nowrap; }
.tsb-polster__zeile input { width:100%; padding:.4rem .5rem; border:1px solid #9aa5b8; border-radius:6px; }
@media (max-width:520px){
	.tsb-polster__zeile { grid-template-columns:1fr 80px; }
	.tsb-polster__spanne { grid-column:1/2; }
}

.tsb-branchen { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1rem; margin:1.25rem 0; }
.tsb-branche { padding:1rem; border:1px solid #d8dee9; border-radius:10px; background:#f7f9fc; }
.tsb-branche h4 { margin:0 0 .4rem; font-size:1.02rem; }
.tsb-branche p { margin:0; font-size:.9rem; color:#4a5568; }

/* ---------- homepage tools section ---------- */

.tsb-tools { background:#f7f9fc; border-top:1px solid #d8dee9; border-bottom:1px solid #d8dee9; padding:2.5rem 1rem; }
.tsb-tools__inner { max-width:1140px; margin:0 auto; }
.tsb-tools h2 { margin:0 0 .6rem; font-size:1.6rem; color:#1a2e5c; line-height:1.25; }
.tsb-tools__lead { margin:0 0 1.6rem; max-width:70ch; color:#4a5568; }
.tsb-tools__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); gap:1rem; }
.tsb-tool { display:flex; flex-direction:column; padding:1.1rem 1.2rem; background:#fff;
	border:1px solid #d8dee9; border-radius:12px; }
.tsb-tool__titel { margin:0 0 .45rem; font-size:1.08rem; line-height:1.3; }
.tsb-tool__titel a { color:#1a2e5c; text-decoration:none; }
.tsb-tool__titel a:hover { text-decoration:underline; }
.tsb-tool__text { margin:0 0 .9rem; font-size:.9rem; color:#4a5568; flex:1; }
.tsb-tool__cta { font-weight:600; font-size:.9rem; color:#a62a2a; text-decoration:none; }
.tsb-tool__cta:hover { text-decoration:underline; }
.tsb-tools__foot { margin-top:1.6rem; padding-top:1.2rem; border-top:1px solid #d8dee9; }
.tsb-tools__foot p { margin:0 0 .9rem; color:#4a5568; }
@media (max-width:600px){ .tsb-tools { padding:1.75rem .9rem; } .tsb-tools h2 { font-size:1.35rem; } }

/* ---------- footer sitemap ---------- */

.tsb-foot { background:#1a2e5c; color:#e6ebf3; padding:2.5rem 1rem 1.75rem; }
.tsb-foot__inner { max-width:1180px; margin:0 auto; }
.tsb-foot__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1.5rem 1.75rem; }
.tsb-foot__titel { margin:0 0 .6rem; font-size:.95rem; color:#fff; letter-spacing:.03em; text-transform:uppercase; }
.tsb-foot__col ul { list-style:none; margin:0; padding:0; }
.tsb-foot__col li { margin:0 0 .35rem; }
.tsb-foot__col a { color:#c7d3e8; text-decoration:none; font-size:.88rem; line-height:1.45; }
.tsb-foot__col a:hover, .tsb-foot__col a:focus-visible { color:#fff; text-decoration:underline; }
.tsb-foot__nap { margin-top:2rem; padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.18); font-size:.88rem; }
.tsb-foot__nap a { color:#fff; }
.tsb-foot__claim { margin:.5rem 0 0; color:#c7d3e8; }
@media (max-width:600px){ .tsb-foot { padding:1.75rem .9rem 1.25rem; } }