/* LD Tools (ABS) – module Services: service section on the product pages (Reparatur / Vor Ort / Ersatzgerät / Austausch / Neu /
   Schieberkasten + info panel) in the new style – version C approved on the local demo (Lorens Digital, 2026-10-08).
   Loaded only on single posts (products). Built from ld-product-demo 1.3.3 + services-absp.css + services-auswahl.css by build-services-css.py. */

:root body ul.tabs { display:flex; flex-wrap:nowrap; justify-content:center; height:auto !important; margin:0; padding:0; border:0; }
:root body ul.tabs::before, :root body ul.tabs::after { content:none; }
:root body ul.tabs > li { float:none; flex:0 1 190px; min-width:0; height:auto !important; margin:0 !important; padding:0 !important; }
:root body ul.tabs > li:not(:has(> a)) { display:none !important; }
:root body ul.tabs > li > a { position:relative; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; width:100% !important; height:auto !important; margin:0 !important; top:0; text-align:center; text-decoration:none !important; line-height:1.3; transition:background .15s, border-color .15s, box-shadow .15s, transform .15s; }
:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten) { width:auto !important; height:auto !important; margin:0 !important; display:flex; flex-direction:column; align-items:center; }
:root body ul.tabs span.info { display:inline-block; margin:8px 0 6px; font-size:12px; font-weight:600; line-height:1.4; }
:root body ul.tabs span.rot { display:block; font-size:16px; font-weight:700; }
:root body ul.tabs-content { margin:0 0 21px !important; }
:root body ul.tabs-content .preis { width:auto; display:inline-block; padding:6px 16px; border-radius:6px; font-size:20px; }
:root body ul.tabs-content .rechts img[src*="-zahlung"] { border:1px solid #dcdcde; border-radius:6px; margin:4px 4px 0 0 !important; }
:root body .auswahl-info { background:none !important; color:#323232 !important; font-size:20px; font-weight:700; padding:0; margin:6px 0 16px; }
:root body .auswahl-info i { color:#323232 !important; }
:root body ul.tabs { gap:12px; }
:root body ul.tabs > li > a { min-height:178px; padding:94px 10px 14px !important; color:#323232 !important; background:radial-gradient(circle at 50% 46px, #fff 31px, transparent 32px), #f4f4f4 !important; border:1px solid #dcdcde !important; border-radius:10px; }
:root body ul.tabs > li > a:hover { background:radial-gradient(circle at 50% 46px, #fbecee 31px, transparent 32px), #fff !important; border-color:#c9c9cc !important; box-shadow:0 8px 20px -10px rgba(0,0,0,.25); transform:translateY(-2px); }
:root body ul.tabs > li > a.active { background:radial-gradient(circle at 50% 46px, rgba(255,255,255,.2) 31px, transparent 32px), #bf1414 !important; border-color:#bf1414 !important; color:#fff !important; box-shadow:0 10px 24px -12px rgba(191,20,20,.7); }
:root body ul.tabs > li > a.active::after { content:""; position:absolute; left:50%; bottom:-8px; width:14px; height:14px; margin-left:-7px; background:#bf1414; transform:rotate(45deg); border-radius:0 0 3px 0; }
:root body ul.tabs > li > a > span.reparatur { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14.7%206.3a1%201%200%200%200%200%201.4l1.6%201.6a1%201%200%200%200%201.4%200l3.77-3.77a6%206%200%200%201-7.94%207.94l-6.91%206.91a2.12%202.12%200%200%201-3-3l6.91-6.91a6%206%200%200%201%207.94-7.94l-3.76%203.76z%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs > li > a > span.vorort { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2010c0%206-8%2012-8%2012s-8-6-8-12a8%208%200%200%201%2016%200Z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs > li > a > span.ersatzgeraet { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m7.5%204.27%209%205.15%22%2F%3E%3Cpath%20d%3D%22M21%208a2%202%200%200%200-1-1.73l-7-4a2%202%200%200%200-2%200l-7%204A2%202%200%200%200%203%208v8a2%202%200%200%200%201%201.73l7%204a2%202%200%200%200%202%200l7-4A2%202%200%200%200%2021%2016Z%22%2F%3E%3Cpath%20d%3D%22m3.3%207%208.7%205%208.7-5%22%2F%3E%3Cpath%20d%3D%22M12%2022V12%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs > li > a > span.austausch { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m17%202%204%204-4%204%22%2F%3E%3Cpath%20d%3D%22M3%2011v-1a4%204%200%200%201%204-4h14%22%2F%3E%3Cpath%20d%3D%22m7%2022-4-4%204-4%22%2F%3E%3Cpath%20d%3D%22M21%2013v1a4%204%200%200%201-4%204H3%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs > li > a > span.neu { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9.94%2015.5A2%202%200%200%200%208.5%2014.06l-6.14-1.58a.5.5%200%200%201%200-.96L8.5%209.94A2%202%200%200%200%209.94%208.5l1.58-6.14a.5.5%200%200%201%20.96%200L14.06%208.5A2%202%200%200%200%2015.5%209.94l6.14%201.58a.5.5%200%200%201%200%20.96L15.5%2014.06a2%202%200%200%200-1.44%201.44l-1.58%206.14a.5.5%200%200%201-.96%200z%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten) { padding:0 !important; background:none !important; font-size:15px; font-weight:700; color:inherit !important; position:static !important; }
:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten)::before { content:""; position:absolute; left:50%; top:46px; width:30px; height:30px; margin:-15px 0 0 -15px; -webkit-mask:var(--pd-ico) center / contain no-repeat; mask:var(--pd-ico) center / contain no-repeat; background:#bf1414; }
:root body ul.tabs > li > a.active > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten)::before { background:#fff; }
:root body ul.tabs span.info { padding:3px 12px; border-radius:20px; background:#e3e3e5 !important; color:#333 !important; font-weight:600; }
:root body ul.tabs a.active span.info { background:rgba(255,255,255,.22) !important; color:#fff !important; }
:root body ul.tabs span.rot { color:#bf1414 !important; font-size:17px; }
:root body ul.tabs a.active span.rot { color:#fff !important; }
:root body ul.tabs-content { background:#f6f7f8 !important; border:1px solid #e3e5e8 !important; border-radius:10px; margin-top:16px !important; padding:6px 16px 18px !important; }
:root body ul.tabs-content .links { background:#fff; border:1px solid #e3e5e8; border-radius:10px; padding:16px 12px 14px; box-sizing:border-box; width:180px; vertical-align:top; }
:root body ul.tabs-content .links h2 { width:auto; font-size:17px; font-weight:700; color:#323232; margin:0 0 12px; }
:root body ul.tabs-content .links img { display:none; }
:root body ul.tabs-content .links { position:relative; }
:root body ul.tabs-content .links:has(img[src*="reparatur_gr"]) { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14.7%206.3a1%201%200%200%200%200%201.4l1.6%201.6a1%201%200%200%200%201.4%200l3.77-3.77a6%206%200%200%201-7.94%207.94l-6.91%206.91a2.12%202.12%200%200%201-3-3l6.91-6.91a6%206%200%200%201%207.94-7.94l-3.76%203.76z%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs-content .links:has(img[src*="vor_ort_gr"]) { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2010c0%206-8%2012-8%2012s-8-6-8-12a8%208%200%200%201%2016%200Z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs-content .links:has(img[src*="austausch_gr"]) { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m17%202%204%204-4%204%22%2F%3E%3Cpath%20d%3D%22M3%2011v-1a4%204%200%200%201%204-4h14%22%2F%3E%3Cpath%20d%3D%22m7%2022-4-4%204-4%22%2F%3E%3Cpath%20d%3D%22M21%2013v1a4%204%200%200%201-4%204H3%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs-content .links:has(img[src*="neu_gr"]) { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9.94%2015.5A2%202%200%200%200%208.5%2014.06l-6.14-1.58a.5.5%200%200%201%200-.96L8.5%209.94A2%202%200%200%200%209.94%208.5l1.58-6.14a.5.5%200%200%201%20.96%200L14.06%208.5A2%202%200%200%200%2015.5%209.94l6.14%201.58a.5.5%200%200%201%200%20.96L15.5%2014.06a2%202%200%200%200-1.44%201.44l-1.58%206.14a.5.5%200%200%201-.96%200z%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs-content .links:has(img[src*="ersatzgeraet"]) { --pd-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m7.5%204.27%209%205.15%22%2F%3E%3Cpath%20d%3D%22M21%208a2%202%200%200%200-1-1.73l-7-4a2%202%200%200%200-2%200l-7%204A2%202%200%200%200%203%208v8a2%202%200%200%200%201%201.73l7%204a2%202%200%200%200%202%200l7-4A2%202%200%200%200%2021%2016Z%22%2F%3E%3Cpath%20d%3D%22m3.3%207%208.7%205%208.7-5%22%2F%3E%3Cpath%20d%3D%22M12%2022V12%22%2F%3E%3C%2Fsvg%3E"); }
:root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"]) > p { padding-top:84px; }
:root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"])::before { content:""; position:absolute; left:50%; top:52px; width:68px; height:68px; margin-left:-34px; border-radius:50%; background:#fbecee; }
:root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"])::after { content:""; position:absolute; left:50%; top:86px; width:34px; height:34px; margin:-17px 0 0 -17px; -webkit-mask:var(--pd-ico) center / contain no-repeat; mask:var(--pd-ico) center / contain no-repeat; background:#bf1414; }
:root body ul.tabs-content .links p { margin:0; font-size:12px; color:#6b7280; }
:root body ul.tabs-content .links b { display:inline-block; margin-top:4px; padding:3px 10px; border-radius:20px; background:#fbecee; color:#bf1414; font-size:12px; }
:root body ul.tabs-content div.rechts { font-size:13px !important; width:calc(100% - 206px) !important; margin:20px 0 0 18px !important; }
:root body ul.tabs-content .rechts ol { counter-reset:pd; padding-left:0; margin:0; }
:root body ul.tabs-content .rechts ol > li { list-style:none; position:relative; padding:0 0 10px 34px; margin:0; line-height:1.5; }
:root body ul.tabs-content .rechts ol > li::before { counter-increment:pd; content:counter(pd); position:absolute; left:0; top:-1px; width:22px; height:22px; border-radius:50%; background:#bf1414; color:#fff; font-size:12px; font-weight:700; line-height:22px; text-align:center; }
:root body ul.tabs-content a.button-fertig, :root body ul.tabs-content a.button-fertig:hover { background:#419f00; border:0; border-radius:6px; padding:11px 22px; margin:10px 0 0; font-size:17px; line-height:1.3; color:#fff; box-shadow:0 8px 18px -10px rgba(65,159,0,.9); transition:background .15s, transform .15s; }
:root body ul.tabs-content a.button-fertig:hover { background:#368500; transform:translateY(-1px); }
@media (max-width:780px) {
	:root body ul.tabs { gap:8px; }
	:root body ul.tabs > li { flex:1 1 0; }
	:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten) { font-size:13px; }
	:root body ul.tabs span.info { font-size:11px; padding-left:8px; padding-right:8px; }
	:root body ul.tabs span.rot { font-size:14px; }
	:root body ul.tabs > li > a { min-height:150px; padding:78px 4px 10px !important; background:radial-gradient(circle at 50% 38px, #fff 26px, transparent 27px), #f4f4f4 !important; }
	:root body ul.tabs > li > a:hover { background:radial-gradient(circle at 50% 38px, #fbecee 26px, transparent 27px), #fff !important; }
	:root body ul.tabs > li > a.active { background:radial-gradient(circle at 50% 38px, rgba(255,255,255,.2) 26px, transparent 27px), #bf1414 !important; }
	:root body ul.tabs > li > a > span::before { top:38px; width:26px; height:26px; margin:-13px 0 0 -13px; }
	:root body ul.tabs-content .links { width:100%; }
	:root body ul.tabs-content div.rechts { width:100% !important; margin:16px 0 0 !important; }
	:root body ul.tabs-content { padding:4px 12px 14px !important; }
}
:root body ul.tabs > li > a { padding:16px 10px 14px !important; background:#f4f4f4 !important; }
:root body ul.tabs > li > a:hover { background:#fff !important; }
:root body ul.tabs > li > a.active { padding:16px 10px 14px !important; background:#bf1414 !important; }
:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten) { min-width:100px; padding:74px 0 0 !important; background-repeat:no-repeat !important; background-position:center 0 !important; background-size:100px auto !important; }
:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten)::before { content:none !important; }
:root:root body ul.tabs > li > a > span.reparatur { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/reparatur.png") !important; }
:root:root body ul.tabs > li > a.active > span.reparatur { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/reparatur_weiss.png") !important; }
:root:root body ul.tabs > li > a > span.vorort { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/vor_ort.png") !important; }
:root:root body ul.tabs > li > a.active > span.vorort { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/vor_ort_weiss.png") !important; }
:root:root body ul.tabs > li > a > span.ersatzgeraet { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/ersatzgeraet.png") !important; }
:root:root body ul.tabs > li > a.active > span.ersatzgeraet { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/ersatzgeraet_weiss.png") !important; }
:root:root body ul.tabs > li > a > span.austausch { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/austausch.png") !important; }
:root:root body ul.tabs > li > a.active > span.austausch { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/austausch_weiss.png") !important; }
:root:root body ul.tabs > li > a > span.neu { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/neu.png") !important; }
:root:root body ul.tabs > li > a.active > span.neu { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/neu_weiss.png") !important; }
:root:root body ul.tabs > li > a > span.schieberkasten { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/schieberkasten.png") !important; }
:root:root body ul.tabs > li > a.active > span.schieberkasten { background-image:url("/wp-content/themes/ABS-Steuergeraete/images/schieberkasten_weiss.png") !important; }
:root body ul.tabs-content { background:#f4f4f4 !important; border-color:#dcdcde !important; }
:root body h4:has(+ .auswahl-info) { margin:28px 0 16px; padding:0; text-align:center; font-size:22px; font-weight:700; line-height:1.3; color:#323232; }
:root body h4:has(+ .auswahl-info)::after { content:""; display:block; width:44px; height:3px; margin:10px auto 0; border-radius:2px; background:#bf1414; }
:root body .auswahl-info { position:relative; display:table; width:auto; margin:0 auto 24px !important; padding:10px 28px !important; background:#3b3e44 !important; border:1px solid #3b3e44; border-radius:10px; color:#fff !important; font-size:16px; font-weight:700; line-height:1.4; }
:root body .auswahl-info i { display:none !important; }
:root body .auswahl-info::after { content:""; position:absolute; left:50%; bottom:-7px; width:14px; height:14px; margin-left:-7px; background:#3b3e44; border-radius:0 0 3px 0; transform:rotate(45deg); }
:root body .auswahl-info + br { display:none; }
:root body ul.tabs-content .rechts ol > li { padding-left:24px; }
:root body ul.tabs-content .rechts ol > li::before { content:counter(pd) "."; top:0; width:18px; height:auto; border-radius:0; background:none; color:#bf1414; font-size:14px; font-weight:700; line-height:1.5; text-align:right; }
:root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"])::before, :root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"])::after { content:none !important; }
:root body ul.tabs-content .links:has(img[src*="_gr"], img[src*="ersatzgeraet"]) > p { padding-top:0; }
:root body ul.tabs-content .links img { display:block !important; width:96px; height:auto; margin:2px auto 12px !important; }
@media (max-width:780px) {
	:root body ul.tabs > li > a { min-height:150px; padding:12px 4px 10px !important; background:#f4f4f4 !important; }
	:root body ul.tabs > li > a:hover { background:#fff !important; }
	:root body ul.tabs > li > a.active { padding:12px 4px 10px !important; background:#bf1414 !important; }
	:root body ul.tabs > li > a > span:is(span.reparatur, span.vorort, span.ersatzgeraet, span.austausch, span.neu, span.schieberkasten) { min-width:0; padding-top:62px !important; background-size:80px auto !important; }
}

/* ═════════ fault code template (theme includes/weichen/fehlercode-auswahl.php + absp/absp.css, DQ200 posts) in the version C look ═════════
   Own markup (.absp-*), so separate rules; absp.css of the theme stays as it is – these rules win by specificity (":root body .absp …").
   Fault list and number check as grey cards, service cards like ul.tabs (grey, theme icons, selected = red with pointer),
   info panel grey with a white price card, red step numbers, green rounded button. */
:root body .absp-infobox { background:#f4f4f4; border:1px solid #dcdcde; border-radius:10px; padding:16px 18px 18px; margin:0 0 22px; }
:root body .absp .absp-infobox-titel { color:#323232; font-size:15px; font-weight:700; }
:root body .absp .absp-infobox-titel::before { background:#bf1414; }
:root body .absp .absp-infobox-titel--fuss { margin:14px 0 0; }
:root body .absp .absp-infobox-titel a { color:#bf1414; font-weight:600; }
:root body .absp .absp-fehler li.absp-fehler-gruppe { margin:16px 0 8px; padding:5px 12px; background:#fbecee; border:0; border-radius:6px; font-size:12px; letter-spacing:.04em; color:#bf1414; }
:root body .absp .absp-fehler li.absp-fehler-gruppe:first-child { margin-top:0; }
:root body .absp .absp-fehler li + li:not(.absp-fehler-gruppe) { margin-top:4px; }
:root body .absp .absp-fehler-btn { border-radius:8px; padding:8px 12px 8px 38px; }
:root body .absp .absp-fehler-btn::before { left:12px; top:10px; width:16px; height:16px; border-color:#c9c9cc; border-radius:4px; }
:root body .absp .absp-fehler-btn::after { left:16px; top:14px; }
:root body .absp .absp-fehler-btn:hover { background:#fff; border-color:#dcdcde; box-shadow:0 4px 12px -8px rgba(0,0,0,.3); }
:root body .absp .absp-fehler-btn[aria-pressed="true"] { background:#fff; border-color:#bf1414; box-shadow:0 6px 16px -10px rgba(191,20,20,.6); }
:root body .absp .absp-auswahl-hinweis { border-color:#dcdcde; border-left-color:#bf1414; border-radius:8px; padding:10px 12px; }
:root body .absp .absp-auswahl-zuruecksetzen { color:#bf1414; }

/* service cards */
:root body .absp .absp-tabs { gap:12px; margin:0 0 16px; }
:root body .absp .absp-tab { position:relative; padding:16px 10px 14px; background:#f4f4f4; border:1px solid #dcdcde; border-radius:10px; color:#323232;
	transition:background .15s, border-color .15s, box-shadow .15s, transform .15s; }
:root body .absp .absp-tab:hover { background:#fff; border-color:#c9c9cc; box-shadow:0 8px 20px -10px rgba(0,0,0,.25); transform:translateY(-2px); }
:root body .absp .absp-tab[aria-selected="true"] { background:#bf1414; border-color:#bf1414; color:#fff; box-shadow:0 10px 24px -12px rgba(191,20,20,.7); transform:none; }
:root body .absp .absp-tab[aria-selected="true"]::after { content:""; position:absolute; left:50%; bottom:-8px; width:14px; height:14px; margin-left:-7px; background:#bf1414; transform:rotate(45deg); border-radius:0 0 3px 0; }
:root body .absp .absp-tab-bild { height:66px; margin:0 auto 8px; background-size:100px auto; background-position:center top; }
:root body .absp .absp-tab-name { font-size:15px; font-weight:700; }
:root body .absp .absp-tab-info { display:inline-block; margin:8px 0 6px; padding:3px 12px; border-radius:20px; background:#e3e3e5; color:#333; font-size:12px; font-weight:600; line-height:1.4; }
:root body .absp .absp-tab[aria-selected="true"] .absp-tab-info { background:rgba(255,255,255,.22); color:#fff; }
:root body .absp .absp-tab-preis { padding:0; font-size:17px; color:#bf1414; }
:root body .absp .absp-tab[aria-selected="true"] .absp-tab-preis { color:#fff; }

/* info panel */
:root body .absp .absp-panel { background:#f4f4f4; border:1px solid #dcdcde; border-radius:10px; padding:18px 16px 20px; }
@media (min-width:781px) {
	:root body .absp .absp-panel--aktiv { grid-template-columns:190px 1fr; gap:8px 22px; }
}
:root body .absp .absp-links { background:#fff; border:1px solid #e3e5e8; border-radius:10px; padding:16px 12px 14px; }
:root body .absp .absp-panel-titel { margin:0 0 12px; font-size:17px; font-weight:700; color:#323232; }
:root body .absp .absp-panel-bild { width:96px; height:72px; margin:2px auto 12px; }
:root body .absp .absp-preisbox { margin:0; }
:root body .absp .absp-preis { padding:6px 16px; border-radius:6px; font-size:20px; }
:root body .absp .absp-preis-mwst { font-size:12px; color:#6b7280; }
:root body .absp .absp-garantie { display:inline-block; margin-top:8px; padding:3px 10px; border-radius:20px; background:#fbecee; color:#bf1414; font-size:12px; }
:root body .absp:not(.absp--gewaehlt) .absp-preisbox::before { background:#f6f7f8; border:1px solid #e3e5e8; border-left:3px solid #bf1414; border-radius:8px; font-size:12px; }
:root body .absp .absp-rechts { padding-top:4px; }
:root body .absp .absp-schritte li { padding:0 0 10px 24px; line-height:1.5; }
:root body .absp .absp-schritte li::before { width:18px; color:#bf1414; font-size:14px; font-weight:700; line-height:1.5; }
:root body .absp .absp-cta, :root body .absp .absp-cta:hover { border-radius:6px; padding:11px 22px; margin:10px 0 0; font-size:17px; line-height:1.3; color:#fff;
	box-shadow:0 8px 18px -10px rgba(65,159,0,.9); transition:background .15s, transform .15s; }
:root body .absp .absp-cta:hover { background:#368500; transform:translateY(-1px); }
:root body .absp .absp-zahlung-block img[src*="-zahlung"] { border:1px solid #dcdcde; border-radius:6px; margin:4px 4px 0 0 !important; }

/* "Ist Ihre Nummer dabei?" – standalone card and inside the part numbers box */
:root body .absp .absp-suche { background:#f4f4f4; border:1px solid #dcdcde; border-radius:10px; padding:16px 18px 18px; }
:root body .absp--im-kasten .absp-suche { background:#f4f4f4; border:1px solid #dcdcde; border-radius:10px; padding:16px 18px 18px; }
:root body .absp .absp-suche-titel { color:#323232; }
:root body .absp .absp-suche-feld { border-color:#c9c9cc; border-radius:6px; }
:root body .absp .absp-suche-knopf { border-radius:6px; }
:root body .absp .absp-suche-ergebnis { border-radius:8px; }
:root body .absp .absp-nummern { border-color:#e3e5e8; border-radius:8px; }
:root body .absp .absp-nummern-alle, :root body .absp .absp-suche-kontakt a { color:#bf1414; }

@media (max-width:640px) {
	:root body .absp-infobox { padding:12px 10px 14px; }
	:root body .absp .absp-fehler-btn { padding:8px 8px 8px 34px; }
	:root body .absp .absp-fehler-btn::before { left:9px; top:9px; }
	:root body .absp .absp-fehler-btn::after { left:13px; top:13px; }
	:root body .absp .absp-tabs { gap:8px; }
	:root body .absp .absp-tab { padding:12px 4px 10px; }
	:root body .absp .absp-tab-bild { height:54px; background-size:80px auto; }
	:root body .absp .absp-tab-name { font-size:13px; }
	:root body .absp .absp-tab-info { padding:3px 8px; font-size:11px; }
	:root body .absp .absp-tab-preis { font-size:14px; }
	:root body .absp .absp-panel { padding:14px 12px 16px; }
	:root body .absp .absp-suche, :root body .absp--im-kasten .absp-suche { padding:14px 12px 16px; }
}

/* ═════════ (1.3.0) heading above the service cards = one block like "Fahrzeugmarke wählen" on the home page:
   the h4 ("Reparatur von Ihrem Blue&Me Modul") as the title, "Wählen Sie Ihre (Reparatur-)Variante aus" as a grey subtitle –
   red separator between them (1.3.1), subtitle bold (1.3.1); no arrows, no dark box (1.2.0: plain heading with ↓ on both sides – owner: two competing headings) ═════════ */
:root body h4:has(+ .auswahl-info) { margin:24px 0 10px; font-size:22px; font-weight:700; line-height:1.3; color:#323232; text-align:center; text-wrap:balance; }
:root body h4:has(+ .auswahl-info)::after { content:""; display:block; width:44px; height:3px; margin:10px auto 0; border-radius:2px; background:#bf1414; }
:root body .auswahl-info { display:block; width:auto; margin:0 0 18px !important; padding:0 !important; background:none !important; border:0; border-radius:0;
	color:#6b7280 !important; font-size:15px; font-weight:700; line-height:1.5; text-align:center; }
:root body .auswahl-info::after { content:none; }
@media (max-width:780px) {
	:root body h4:has(+ .auswahl-info) { margin-top:18px; font-size:19px; }
	:root body .auswahl-info { font-size:14px; }
}