/*  ==================================================================
	Fluent Forms CSS =================================================
	==================================================================  */

.fluentform .ff_btn_style:focus, .fluentform .ff_btn_style:hover {
	opacity: 1!important;
}
/* END Fluent Forms CSS */

/*  ==================================================================
	Crisp CSS ========================================================
	==================================================================  */

div.cc-1nvun > div.cc-qqgts {
    opacity: 0;
	display: none !important;
}

a.cc-3yw77.cc-hshc7.cc-1cx9a:not(.cc-coh7k), span.cc-1djrv.cc-hshc7:not(.cc-f5i1a) {
    opacity: 0;
	width: 0px !important;
}
/* END Crisp CSS */

/*  ==================================================================
	German Market CSS =================================================
	==================================================================  */
.wgm-info.woocommerce-de_price_taxrate, .wgm-tax.product-tax  {
	display: none;
}
#german_market_privacy_declaration > span > a {
	color: var(--tws-lws-red);
}
/* END German Market CSS */

/*  ==================================================================
	Complianz CSS ====================================================
	==================================================================  */
div.cmplz-cookiebanner.cmplz-show {
    box-shadow: 0px 20px 36px -18px rgba(0,0,0,0.1);
}

div.cmplz-placeholder-1 {
    background-image: url(/wp-content/themes/Divi-child/complianz-gdpr/google-maps-custom-1280x920.jpg) !important;
}

button.cmplz-btn {
	height: unset!important;
	transition: all 0.2s;
	-webkit-transition: all 0.2s;
	font-size: 14px!important;
	letter-spacing: 1px!important;
}

button.cmplz-accept-service, .ff_step_nav_last button.ff-btn, .ff_step_nav_last button.ff-btn-secondary:not(.ff_btn_no_style) {
	transition: all 0.2s;
	-webkit-transition: all 0.2s;
	letter-spacing: 1px!important;
	font-size: 14px!important;
	background: var(--tws-lws-red);
	color: #fff;
	border: 1px solid #fff;
	border-radius: 3px!important;
	padding: 0.3em 1em !important;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}

button.cmplz-deny:hover, button.cmplz-view-preferences:hover, button.cmplz-accept-service:hover, .ff_step_nav_last button.ff-btn:hover, .ff_step_nav_last button.ff-btn-secondary:not(.ff_btn_no_style):hover {
	color: var(--tws-lws-red)!important;
	border-color: var(--tws-lws-red)!important;
	background-color: #fff!important;
}

button.cmplz-deny:hover, button.cmplz-view-preferences:hover {
	color: #fff!important;
	border-color: #fff!important;
	background-color: var(--tws-lws-red)!important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
	line-height: 1.7em!important;
	padding: 0.3em 1em !important;
}

@media only screen and (max-width: 980px) {
	.cmplz-cookiebanner {
		border-bottom-left-radius: 0px!important;
		border-bottom-right-radius: 0px!important;
	}
}
a.cmplz-link {
text-decoration: none!important;
}

.cmplz-blocked-content-container .cmplz-blocked-content-notice, .cmplz-wp-video .cmplz-blocked-content-notice {
    border-style: none!important;
    border-radius: 20px!important;
    padding: 20px!important;
	cursor: pointer;
}
/* END Complianz CSS */



/*  ==================================================================
	General CSS ======================================================
	==================================================================  */

@media (max-width: 980px) {
	.et_pb_row {
    	width: 95%!important;
	}
}

#main-content {
	min-height:	calc(100vh - 935px)!important;
}

#page-container {
	overflow-x: hidden!important;
	overflow-y: hidden!important;
}

div.woocommerce-message, div.woocommerce-error, div.woocommerce-info, div.woocommerce-notices-wrapper > div.woocommerce-message, div.woocommerce-notices-wrapper > div.woocommerce-error, div.woocommerce-notices-wrapper > div.woocommerce-info, div.woocommerce-notices-wrapper > ul.woocommerce-error {
    font-size: 16px !important;
    color: #000 !important;
    border: 1px solid!important;
    border-radius: 3px;
	background: #fff!important;
	text-align: center;
    margin-top: 40px;
    max-width: 90%;
    margin-left: auto!important;
    margin-right: auto!important;
    box-shadow: 0px 1px 10px 0px rgba(0,0,0,0.1)!important;
}

/* Custom Scrollbar */
@media only screen and (min-width: 980px) {
	::-webkit-scrollbar-track {
		border-radius: 0px;
		border-left: 5px solid;
		border-color: #ffffff;
	}
	
	::-webkit-scrollbar {
		width: 5px;
	}
	
	::-webkit-scrollbar-thumb {
		border-radius: 0px;
		border-color: var(--tws-lws-red)!important;
		border-left: 5px solid;
	}
}

/*END Custom Scrollbar */

/*Header CSS */

header .et_builder_inner_content {
	z-index: 3 !important;
}

header.et-l--header .close-pre-header-icon .et-pb-icon {
	font-weight: 600 !important;
	font-size: 24px !important;
}

.et-l.et-l--header {
  z-index: 9999;
  position: relative;
}

.menu-mieten > a {
	color: var(--tws-lws-red)!important;
	font-weight: 700!important;
	text-transform: uppercase;
}

@media only screen and (max-width: 980px) {
	.time-left {
		display: none;
	}
}

.et_pb_blurb_content {
    width: unset!important;
    max-width: unset!important;
  }
@media only screen and (min-width: 767px) {
	#order-cutoff-at > div > .et_pb_blurb_container:after {
		content: "";
		background: url(/wp-content/themes/Divi-child/resources/nachtzustellung_mm.svg);
		background-size: 32px 32px;
		width: 32px;
		height: 32px;
		position: absolute;
		right: -45px;
		top: 0px;
		display: block;
	}
}

li.header-profile > a > img {
	height: 25px;
	width: 25px;
}

#menu-header_main > li.header-favorites, #menu-header_main > li.header-profile {
	padding-right: 30px!important;
}

#header-login a:hover {
	transform: translateY(-2px);
}

a.et_pb_menu__cart-button {
	transition: all .4s ease-in-out;
	margin-right: -18px !important;
	margin-left: 0px !important;
}

/* Header Customization */
#menu-section > div.et_pb_row {
	width: 100%!important;
}

.merchant-login-popup-dropdown > a:nth-last-of-type(1), a.merchant-login-popup-toggle {
	display: inline-flex !important;
}

 @media all and (min-width: 980px) {
	 #menu-header_main > li > a:hover, #menu-header_main > li > a:focus, #menu-header_main > li > a:active {
		 text-decoration: none;
		 }
	 
	 #menu-header_main > li > a {
		 transition: color 0.1s, background-color 0.1s;
		 }
	 
	 #menu-header_main > li > a {
		 position: relative;
		 display: block;
		 transition: color 0.1s,background-color 0.1s,padding 0.2s ease-in;
	 }
	 
	 #menu-header_main > li > a:nth-last-of-type(1) {
		 display: inline-flex !important;
		 padding-bottom: 0px !important;
	 }
	 #menu-header_main > li > a:active:nth-last-of-type(1)::before {
		 background-color: transparent !important;
	 }
	 
	 #menu-header_main > li:not(.header-profile) > a::before {
		 content: '';
		 display: block;
		 position: absolute;
		 bottom: -5px;
		 left: 0;
		 height: 2px;
		 width: 100%;
		 background-color: var(--tws-lws-red);
		 transform-origin: top;
		 transform: scale(0, 1);
		 transition: color 0.1s,transform 0.2s ease-out;
	 }
	 
	 #menu-header_main > li > a:active::before {
		 background-color: var(--tws-lws-red);
		 }
	 
	 #menu-header_main > li > a:hover::before, #menu-header_main > li > a:focus::before, #menu-header_main > li.current-menu-item > a::before {
		 transform-origin: top;
		 transform: scale(1, 1);
		 }
}

.et-menu a:hover {
    opacity: 1!important;
}

/* END Header Customization */


.et-db #et-boc .et-l.et-l--body .et_builder_inner_content {
	z-index: 10 !important;
}

/* PRELOADER */ 
.preloader {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #fefefe; /*Deine Hintergrundfarbe*/
   z-index: 100000;
   height: 100%;
   width: 100%;
   overflow: hidden !important;
}
.preloader .status {
   width: 128px;
   height: 128px;
   position: absolute;
   left: 50%;
   top: 50%;
   background-image: url(/wp-content/themes/Divi-child/resources/preloader.svg);
   background-repeat: no-repeat;
   background-position: center;
   -webkit-background-size: cover;
   background-size: cover;
   margin: -64px 0 0 -64px;
}

@media only screen and (max-width: 980px) {
	.preheader {
		display: none!important;
	}
}
/* END General CSS */

/*  ==================================================================
	Woo Address Book =================================================
	==================================================================  */

#shipping_night_delivery_field, #shipping_latitude_field, #shipping_longitude_field {
	display: none!important;
}

#shipping_address_book_field > .woocommerce-input-wrapper {
	display: flex;
	flex-direction: column;
	gap: 0.3em;
	position: relative;
	text-indent: unset !important; /* Fix an Astra issue */
}

#shipping_address_book_field > .woocommerce-input-wrapper > input {
	display: none;
}

#shipping_address_book_field > .woocommerce-input-wrapper > input+label {
	padding: 0.5em;
	background-color: #fefefe;
	display: block;
	cursor: pointer;
	border: 1px solid #cccccc;
	border-radius: 3px;
	text-align: center;
}

#shipping_address_book_field > .woocommerce-input-wrapper > input:checked+label {
	padding: 0.5em;
	background-color: var(--tws-lws-red);
	color: white;
	border-color: var(--tws-lws-red);
}

.hidden {
	display: none!important;
	pointer-events: none;
}

#ship-to-different-address-checkbox {
	display: none!important;
}

h3#ship-to-different-address {
	pointer-events: none;
}
/* END Woo Address Book CSS */

/*  ==================================================================
	WooCommerce Customizations =======================================
	==================================================================  */

/* Bundles */
.from {
	display:none;
}

/* General */
.price-from, .woocommerce-price-suffix {
	font-size: 12px;
}

.price > span.from, .fwpl-item span.from, .tws-lws-home-product__price > span.from {
	display: none;
}

.woocommerce-price-suffix {
	position: relative;
	top: -5px;
}

.wceb-price-format {
	display: none!important;
}

.select2-container--default .select2-results__option[aria-selected=true],.select2-container--default .select2-results__option[data-selected=true] {
    background-color:var(--tws-lws-red);
	color: #fff;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color:var(--tws-lws-red);
    color:#fff
}

.select2-container .select2-selection--single {
    height: 44px;
	border: 1px solid #ddd!important
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 29px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    margin-top: 6px;
}

/* END General*/

/* Cart page */

div.woocommerce-cart table.cart img, div.woocommerce-checkout table.cart img {
    width: 81px;
}

table.woocommerce-cart-form__contents > tbody > tr:last-child > td > button.button:disabled[disabled] {
    color: #ffffff;
	font-size: 14px;
    background-color: var(--tws-lws-red);
    border-width: 1px!important;
    letter-spacing: 1px;
	padding-top: 0.3em!important;
    padding-right: 1em!important;
    padding-bottom: 0.3em!important;
    padding-left: 1em!important;
}

/*END Cart page */

/* Checkout page */
.woocommerce-checkout #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods li,
.woocommerce-order-pay #payment ul.payment_methods,
.woocommerce-order-pay #payment ul.payment_methods li {
	list-style: none !important;
	margin-left: 0 !important;
	padding-left: 0 !important;
}

.woocommerce-checkout #payment ul.payment_methods li::marker,
.woocommerce-order-pay #payment ul.payment_methods li::marker {
	content: '';
}

.woocommerce-checkout #payment ul.payment_methods li img {
	width: 40px;
}
/* END Checkout page */

/*Order */
/*.wc-item-meta:not(.wceb-item-meta):first-of-type {
	display: none;
}*/

th.download-remaining, td.download-remaining {
	display: none;
}
/*END Order */
/*END WooCommerce Customizations */


/*  ==================================================================
	Merchant CSS =====================================================
	==================================================================  */

/*.merchant-login-popup-content button.show-password-input {
    height: 12px;
    background-size: 12px 12px;
	background-repeat: no-repeat;
    border: none;
}

.merchant-login-popup-content button.show-password-input.display-password {
    background-image: url(/wp-content/themes/Divi-child/resources/checkbox_checked.png);
}

.merchant-login-popup-content button.show-password-input::after {
    position: absolute;
    transform: translate(9px, -7px);
    font-size: 10px;
}

.merchant-login-popup-content button.show-password-input:not(.display-password)::after {
    content: 'Passwort anzeigen';
}

.merchant-login-popup-content button.show-password-input.display-password::after {
    content: 'Passwort verbergen';
}*/

.merchant-login-popup-content .form-row {
	width: 100% !important;
}

.merchant-login-popup-footer {
	font-size: 16px;
}

.merchant-show>a.et_pb_button, .merchant-show>a.et_pb_button:hover {
	padding: .6em 1.5em !important;
    margin-left: 10px;
}

div.merchant-login-popup-body {
    max-height: 95vh;
}

div.merchant-login-popup-content form {
	grid-gap: 0px;
	margin-top: 10px;
}

div.merchant-login-popup-content {
    padding-top: 20px;
	padding-bottom: 10px;
}

div.merchant-login-popup-content label {
    margin-bottom: 0;
}

@media only screen and (max-width: 980px) {
	div.merchant-floating-side-mini-cart-widget ul.product_list_widget span.merchant-quantity-cart-meta dl.variation {
		display: list-item;
	}
}

div#payment {
	padding: 0 23px 0 1em!important;
	border-style: unset!important;
    border-color: unset!important;
	border: 1.5px solid #ddd!important;
}

div#payment > .wc_payment_methods {
	border: unset!important;
}

div.merchant-pro-sc-payment-methods ul {
    display: unset;
    border: unset;
    border-radius: unset;
    position: unset;
    overflow: unset;
    list-style: unset!important;
    margin: unset!important;
    padding: unset!important;
}

span.merchant-quantity-cart-price, .merchant-floating-side-mini-cart-widget div.merchant-quantity-inner>div.quantity, .merchant-quantity-cart-subtotal > .wgm-tax {
	display: none!important;
}

div.merchant-floating-side-mini-cart {
    z-index: 1000000000;
}

.header-profile > .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before, .header-profile >.merchant-login-popup-toggle::before, .header-main > .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before, .header-main >.merchant-login-popup-toggle::before, .login-icon-mobile .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before, .login-icon-mobile .merchant-login-popup-toggle::before {
    content: '';
    width: 28px;
    height: 28px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -8px;
    display: block;
    background-size: 28px 28px!important;
    transition: all .3s ease;
	cursor: pointer;
}

.mobile-menu ul.et-menu .header-profile .merchant-login-popup-button::before, .mobile-menu ul.et-menu .header-profile .merchant-login-popup-dropdown-button::before {
	margin-left: 0px;
	margin-right: 10px;
}
.mobile-menu ul.et-menu .header-profile .merchant-login-popup-button::before {
	background: url(/wp-content/themes/Divi-child/resources/user_logged_in_black.svg);
}
.mobile-menu ul.et-menu .header-profile .merchant-login-popup-toggle::before {
	background: url(/wp-content/themes/Divi-child/resources/user_logged_out_black.svg);
}
.mobile-menu ul.et-menu .header-profile .merchant-login-popup-button::after, .mobile-menu ul.et-menu .header-profile .merchant-login-popup-dropdown-button::after {
	display: none;
}

.mobile-menu ul.et-menu .merchant-login-popup-button, .mobile-menu ul.et-menu .merchant-login-popup-dropdown-button {
	font-size: 14px;
	display: flex;
}
.login-icon-mobile .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before, .login-icon-mobile .merchant-login-popup-toggle::before {
	margin-top: unset !important;
}

.login-icon-mobile .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button, .login-icon-mobile .merchant-login-popup-toggle, .menu-header-desktop .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button, .menu-header-desktop .merchant-login-popup-toggle {
	font-size: 0px !important;
}

.header-profile > .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before, .login-icon-mobile .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::before {
	background: url(/wp-content/themes/Divi-child/resources/user_logged_in.svg);
}

.login-icon-mobile .merchant-login-popup-dropdown > .merchant-login-popup-dropdown-button::after, .login-icon-mobile .merchant-login-popup-dropdown nav {
	display: none;
}

.header-profile > .merchant-login-popup-toggle::before, .login-icon-mobile .merchant-login-popup-toggle::before  {
	background: url(/wp-content/themes/Divi-child/resources/user_logged_out.svg);
}

.merchant-login-popup-show .merchant-login-popup {
    z-index: 10012;
}

.login-icon-mobile a.merchant-login-popup-toggle {
    display: flex;
}

.merchant-show > a:not(.merchant-login-popup-close) {
	color: #fff;
}

div.merchant-login-popup-dropdown-list {
    margin-right: 40px;
	text-align: center;
	transform: translateX(-40%);
}

div.merchant-login-popup-dropdown-list a {
	font-size: var(--gvid-8ska552998) !important;
	font-weight: unset !important;
	text-transform: unset !important;
}

div.merchant-login-popup-dropdown {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
	margin-bottom: unset;
}

div.merchant-login-popup-dropdown {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
	margin-bottom: unset;
}


.merchant-floating-side-mini-cart {
    max-width: 90%;
}

div.merchant-login-popup-show .merchant-login-popup {
    z-index: 99999;
}

@media all and (max-width: 980px) {
	div.merchant-login-popup-body {
		max-width: 95%;
		max-height: 85vh;
	}
}

.merchant-login-popup-body.merchant-show {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.merchant-login-popup-content, .merchant-login-popup-footer {
	width: 100%;
}

.merchant-login-popup-content {
	order: 2;
}

.merchant-login-popup-footer .merchant-show {
    display: flex;
    flex-direction: column;
	width: 100%;
	row-gap: 10px;
}

.merchant-login-popup-content > #customer_login > div.u-column1.col-1, .merchant-login-popup-content > #customer_login > div.u-column2.col-2 {
	width: 100%!important;
}

div.merchant-login-popup-content form .form-row input.input-text {
	width: 100%!important;
}

div.merchant-login-popup-content {
	padding-left: 10px;
	padding-right: 10px;
}

.merchant-login-popup-content .woocommerce-button {
	margin-right: 0px!important;
}

.merchant-login-popup-button:hover {
	color: var(--tws-lws-red) !important;
}

/* Floating Side Cart fix  */
.merchant-floating-side-mini-cart-widget .product_list_widget {
	padding: 40px!important;
}

.merchant-floating-side-mini-cart-widget .product_list_widget li a.remove {
    color: var(--mrc-fmci-side-cart-content-remove-color, #fff)!important;
}

.merchant-floating-side-mini-cart-widget .product_list_widget li>a:not(.remove) {
    align-items: flex-start!important;
    grid-gap: 15px!important;
    color: var(--mrc-fmci-side-cart-content-text-color, #212121)!important;
    margin-right: 20px!important;
}

.woocommerce ul.cart_list li a, .woocommerce ul.product_list_widget li a {
    font-weight: unset!important;
}

.merchant-floating-side-mini-cart-widget .product_list_widget li img {
    width: 81px!important;
	margin-left: unset!important;
}

.merchant-floating-side-mini-cart-widget .product_list_widget li {
    padding: 20px 0!important;
}

.woocommerce ul.cart_list li dl, .woocommerce ul.product_list_widget li dl {
    border-left: unset!important;
    margin: 0 0 1.5em;
}

.woocommerce ul.cart_list li dl dd, .woocommerce ul.product_list_widget li dl dd {
    padding: unset!important;
	margin-bottom: unset!important;
}

.woocommerce ul.cart_list li dl dt, .woocommerce ul.product_list_widget li dl dt {
    padding: unset!important;
	margin-bottom: unset!important;
}

@media only screen and (max-width: 980px) {
	.woocommerce ul.cart_list li, .woocommerce ul.product_list_widget li, .woocommerce-page ul.cart_list li, .woocommerce-page ul.product_list_widget li {
		padding: 6px 0;
		display: inline;
	}
	.woocommerce ul.cart_list li::before, .woocommerce ul.product_list_widget li::before {
    margin-top: 20px;
	}
}

/* END Floating Side Cart fix  */
/* END Merchant CSS */

/*  ==================================================================
	SEOPress Customizations ==========================================
	==================================================================  */
body #et-main-area div.et_pb_section_breadcrumbs {
	padding-top: 10px !important;
    padding-bottom: 10px !important;
	background-color: #fff;
}

body #et-main-area div.et_pb_row_breadcrumbs {
	padding: initial !important;
	width: 80%;
    max-width: 1280px;
    margin: auto;
    position: relative;
}
@media only screen and (max-width: 980px) {
	body #et-main-area div.et_pb_row_breadcrumbs, body #et-main-area div.et_pb_row_breadcrumbs .et_pb_column {
		max-width: 95% !important;
		gap: 0px !important;
	}
}

body #et-main-area .et_pb_text_breadcrumbs {
	text-transform: uppercase;
}

body #et-main-area ol.breadcrumb {
	padding: 0px !important;
}

body #et-main-area li.breadcrumb-item.active {
	background-color: unset;
}
/* END SEOPress */

/*  ==================================================================
	Mobile search vehicle select =====================================
	==================================================================  */

#unselect_vehicle_icon {
	 float: right;
	 cursor: pointer;
	 color: var(--tws-lws-red);
	 font-size: 24px!important;
}

#selected_vehicle_overlay {
    text-align: center;
    box-shadow: 0px 12px 36px 0px rgba(0,0,0,0.1);
    padding: 10px;
    border-radius: 20px;
	background-color: white;
  }  
  #selected_vehicle_overlay p {
      padding-bottom: unset;
  }
  @media all and (max-width: 980px) {
    #selected_vehicle_overlay > img {
      max-width: 100px;
      margin-top: -20px;
    }
    #selected_vehicle_overlay p {
      font-size: 12px;
      line-height: 1.7em;
    }
	#selected_vehicle_container {
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: calc(20px + env(keyboard-inset-height, 0vh));
		width: 90%;
		text-align: center;
	  }	  
  }
@media all and (min-width: 980px) {
	#selected_vehicle_container {
		width: 500px;
		transform: translateX(calc(50vh - 125px));
		bottom: 100px;
		position: fixed;
	}
	#selected_vehicle_container > h5 {
		font-size: 20px;
		text-align: center;
		color: white;
	}
	  }
/* END Custom CSS for mobile search vehicle select */

/*#hero-section > .hero-slider {
	width: 100%!important;
}

#menu-header_cart_profile > li > div > a.merchant-login-popup-button.merchant-login-popup-dropdown-button, #menu-header_main > li > div > a.merchant-login-popup-button.merchant-login-popup-dropdown-button, #menu-item-19896 > a.merchant-login-popup-button.merchant-login-popup-toggle {
	width: 28px;
	height: 28px;
	vertical-align: middle;
}*/

#menu-header_cart_profile > li > div > a.merchant-login-popup-button.merchant-login-popup-dropdown-button::after, #menu-header_main > li > div > a.merchant-login-popup-button.merchant-login-popup-dropdown-button::after {
	display: none;
}

/*#header-login > div > .merchant-login-popup-dropdown nav {
    left: unset!important; 
    right: 0px;
}

#header-login > div > .merchant-login-popup-dropdown nav > div > a {
    width: auto;
	height: auto;
	display: unset;
}*/

@media only screen and (max-width: 980px) {
	.et_pb_menu__search-button {
		display: none!important;
		}
}

.woocommerce-form-login, .woocommerce-form-register {
    border: 1px solid #cfc8d8;
    padding: 20px;
    margin: 2em 0;
    text-align: left;
    border-radius: 5px;
	border-color: #eeeeee;
}

.woocommerce-form-login__submit, .woocommerce-form-register__submit, .woocommerce-mini-cart__buttons > a, button.cmplz-accept, .merchant-show > a:not(.merchant-login-popup-close) {
	padding: 0.3em 1em !important;
	font-size: 14px;
    background-color: var(--tws-lws-red)!important;
    border: 1px solid #fff;
    letter-spacing: 1px;
	border-radius: 3px;
	-webkit-transition: all 0.2s;
    transition: all 0.2s;
	line-height: 1.7em;
    font-weight: 500;
}

.woocommerce-form-login__submit:hover, .woocommerce-form-register__submit:hover, .woocommerce-mini-cart__buttons > a:hover, button.cmplz-accept:hover, .merchant-show > a:not(.merchant-login-popup-close):hover {
    background-color: #fff!important;
	color: var(--tws-lws-red)!important;
    border: 1px solid var(--tws-lws-red)!important;
	opacity: 1!important;
	cursor: pointer;
}

.woocommerce form .form-row input.input-text, #vin-field, #engine-field, #kba1-field, #kba2-field, #username, #password, #reg_billing_first_name, #reg_billing_last_name, #reg_email, #reg_password, #reg_billing_phone {
    background-color: #fff;
    color: #666!important;
    line-height: unset!important;
	font-weight: 500;
    font-size: 14px;
    padding: 10px 22px 10px 8px!important;
    border-radius: 0px;
    border: 1px solid #9f9f9f;
	width: 100%;
}
nav.woocommerce-MyAccount-navigation > ul {
	padding: 0px;
	padding-bottom: 1em;
}

.woocommerce form .form-row input.input-text::placeholder {
	color: unset!important;
}

.woocommerce form .form-row {
    padding: 0px!important;
}

/*  ==================================================================
	FiboSearch =======================================================
	==================================================================  */
a.dgwt-wcas-details-product-title, a.dgwt-wcas-details-post-title {
	font-family: 'Roboto Slab',sans-serif;
	color: #333;
	display: block;
    line-height: 120%;
    margin: 10px 0 0;
    font-size: 21px;
    font-weight: 400;
    text-decoration: none;
    text-transform: none;
}

a.dgwt-wcas-details-product-title:hover, a.dgwt-wcas-details-post-title:hover {
    text-decoration: none;
}

div.dgwt-wcas-pd-addtc.js-dgwt-wcas-pd-addtc > form > p > a {
	color: #fff!important;
}

div.dgwt-wcas-pd-addtc.js-dgwt-wcas-pd-addtc > form > p > a::after {
	display: none!important;
}

div.dgwt-wcas-pd-addtc.js-dgwt-wcas-pd-addtc > form > p > a:hover {
	padding: 0.3em 1em;
}

.wcas_column_1, .wcas_column_2 {
	width: 50%;
	display: inline-flex;
}

div.dgwt-wcas-darkened-overlay {
	animation: opac 0.8s;
	opacity: 0.4;
}

@keyframes opac{
	from{
		opacity: 0
	} to {
		opacity: 0.4
	}
}

.dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::placeholder {
    opacity: 1!important;
    color: #666!important;
	font-weight: 400!important;
}

#dgwt-wcas-search-input-3.dgwt-wcas-search-input::placeholder {
    opacity: 1!important;
    color:black!important
}
#dgwt-wcas-search-input-3.dgwt-wcas-search-input::-webkit-input-placeholder {
	opacity: 1!important;
	color:#666!important
}
#dgwt-wcas-search-input-3.dgwt-wcas-search-input:-moz-placeholder {
    opacity: 1!important;
    color:black!important
}
#dgwt-wcas-search-input-3.dgwt-wcas-search-input::-moz-placeholder {
    opacity: 1!important;
    color:black!important
}
#dgwt-wcas-search-input-3.dgwt-wcas-search-input:-ms-input-placeholder {
    opacity: 1!important;
    color:black!important
}

.home-vehicle-select-row .dgwt-wcas-sf-wrapp input[type="search"] {
	font-size: 14px !important;
	padding: 20px 22px 20px 8px;
    background-color: #fff;
    border: 1px solid #9f9f9f;
    border-radius: 0;
}
    

/*@media only screen and (min-width: 980px) {
	div.dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
		border: 1px solid #000;
	}
}*/

.dgwt-wcas-stock.in-stock {
	color: #5fa644;
}

.dgwt-wcas-stock.out-of-stock {
	color: #666;
}

.dgwt-wcas-close, .dgwt-wcas-preloader  {
    right: 50px!important;
}

.dgwt-wcas-search-wrapp {
    color: #000;
	font-size: 12px;
}

.dgwt-wcas-search-icon {
    margin: auto;
	text-align: center;
	width: unset;
}

.dgwt-wcas-search-icon:after {
	content: 'Suche';
    display: block;
}

div.dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon {
	max-width: unset!important;
	margin-top: 0.05rem!important;
}

.dgwt-wcas-ico-magnifier-handler {
	display: none;
}

.dgwt-wcas-search-icon:before {
    background-size: 34px 34px!important;
	background: url(/wp-content/themes/Divi-child/resources/suche.svg);
}

/* END FiboSearch */

.et_pb_menu__search-button:after {
	background: url(/wp-content/themes/Divi-child/resources/suche-rot.svg);
	display: block;
	width: 24px;
    height: 24px;
    content: ""!important;
    background-size: 24px 24px;
}

.variation-MieteKauf {
	display: none!important;
}

@media (max-width: 767px) {
	.de_title_module.product_title {
		font-size: 16px;
	}
}

/*  ==================================================================
	FacetWP Customizations ===========================================
	==================================================================  */

.facetwp-type-search i.clear {
    position: absolute;
    right: 30px;
    height: 100%;
    line-height: 1;
    cursor: pointer;
    display: inline-block;
    opacity: 0.3;
    width: 24px;
    height: 100%;
    background: transparent url('/wp-content/plugins/facetwp/assets/images/icon-close.png') 6px 50% no-repeat;
    background-size: 14px 14px;
}
 
.facetwp-type-search i.clear:hover {
    opacity: 0.8;
}
 
/* no clear icon  while the Search facet is loading */
/* and when an auto-refresh is running */
.facetwp-type-search .f-loading + input + i.clear,
.facetwp-type-search .loading + i.clear {
    display: none !important;
}
 
.facetwp-facet input.facetwp-search {
    padding-right: 54px;
}

.facetwp-input-wrap, .facetwp-facet input.facetwp-search {
    width: 100%;
}

.facetwp-facet input.facetwp-search {
	padding: 10px;
}

div.facetwp-checkbox {
  background-image: url('/wp-content/themes/Divi-child/resources/checkbox.png');
  background-size: 16px 16px;
}

div.facetwp-checkbox:hover {
  background-image: url('/wp-content/themes/Divi-child/resources/checkbox_hover.png');
}
 
div.facetwp-checkbox.checked {
  background-image: url('/wp-content/themes/Divi-child/resources/checkbox_checked.png');
}

.facetwp-selections > ul {
	padding-top: 5px!important;
	padding-bottom: 5px!important;
	padding-left: 0px!important;
}

.fs-wrap {
	width: 100%!important;
}

.fs-wrap.multiple .fs-option.selected .fs-checkbox i {
    background-color: var(--tws-lws-red)!important;
}

/* END FacetWP Customizations */

/*.woocommerce-form-login-toggle {
	display: none;
}
*/
.button-variable-item {
    width: calc(97% / 2) !important;
    height: 30px !important;
    margin-right: 0px!important;
	line-height: 30px!important;
}

.button-variable-item:first-child {
	margin-right: 8px!important;
}

.variable-item {
    background-color: #ffffff;
    color: #000;
    outline: 1px solid #000;
	border-radius: 3px;
}

.variable-item.active {
    background-color: var(--tws-lws-red);
    color: #ffffff;
	outline: 1px solid var(--tws-lws-red);
}

.variable-items-wrapper {
	padding: 0px!important;
}

.color-variable-item-fade:not(.active) span {
    opacity: 1;
}

.woocommerce a.button.alt, .woocommerce-page a.button.alt {
    border-color: unset!important;
}

@media only screen and (max-width: 980px) {
	.four-columns .et_pb_column {
		width: 44%!important;
		}
	.four-columns > div {
		margin-right: 10px!important;
		margin-left: 10px!important;
		max-height: 120px!important;
	}
}

/*.vehicle_box {
	margin-top: 30px;
	font-size: 14px;
	display: inline-flex;
	padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    padding-left: 20px;
    box-shadow: 0px 12px 35px -6px rgba(0,0,0,0.1)!important;
}

.vehicle_box_left {
	width: 25%;
}

.vehicle_box_right {
	padding-left: 10px;
	width: 75%;
}*/

.in-stock::before, .dgwt-wcas-stock.in-stock::before {
	background-image: url("/wp-content/themes/Divi-child/resources/box.svg")!important;
    background-size: 32px 20px;
	width: 32px;
    height: 20px;
    margin-bottom: -5px;
	margin-left: -5px;
    content: ""!important;
    display: inline-block!important;
}

.stock_status_cont > div.in-stock {
	color: #5fa644!important;
	font-size: 14px;
}

.product_meta {
    font-size: 12px;
    line-height: 1.5;
}

/*  ==================================================================
	WooCommerce Easy Booking Custom CSS ==============================
	==================================================================  */

@media (max-width: 480px) {
	.wceb-stock-amount, .wceb-stock-status {
		display: block!important;
	}
}

.wceb_picker_wrap .form-row {
float: left;
clear: none !important;
}

@media all and (min-width: 980px) {
	.wceb_picker_wrap {
		display: grid;
	}
}

@media all and (min-width: 1100px) {
	.picker--opened .picker__frame {
		transform: translateY(-30%)!important;
	}
}

.wceb_datepicker {
	border-radius: 3px!important;
	color: #666!important;
	line-height: unset!important;
	font-weight: 500;
	font-size: 14px;
	padding: 10px 22px 10px 8px!important;
	border: 1px solid #ddd!important;
	width: 100%;
	text-align: center;
}

@media all and (max-width: 980px) {	
	.variations_form {
		margin-top: 10px!important;
		margin-bottom: 10px!important;
	}
	
	.picker.picker--opened.picker--focused > .picker__holder {
		overflow-y: visible!important;
		background: none!important;
		transform: translateY(-45vh)!important;
	}
	
	.variations, .wceb_picker_wrap {
		z-index: 9999999999!important;
		position: relative;
	}
	
	.woocommerce div.product form.cart .variations td select {
		width: 100%;
	}	
	.reset_dates {
		display: block;
		position: absolute;
		right: 0px;
		top: 5px;
	}
}

.picker__box {
	box-shadow: 0px 0px 36px -6px rgba(0,0,0,0.1)!important;
}
/* END WooCommerce Easy Booking Custom CSS */

.reset-filters.et_pb_button {
	text-align: center!important;
}

.et_pb_widget {
	margin-bottom: 0px!important;
}

.variations {
	margin-bottom: 0px!important;
}

.variations > tbody > tr > .label {
	display: none!important;
}

.woocommerce div.product form.cart .variations td select {
    background: none;
    border: 1px solid;
    border-radius: 0px;
    border-width: 1px;
    color: var(--tws-lws-red) !important;
}

/*  ==================================================================
	WooCommerce Cart Icon CSS ========================================
	==================================================================  */

/* Add custom cart image icon in Divi menu */
.et_pb_menu__cart-button:after { 
    font-size:0 !important; 
    background: url('/wp-content/themes/Divi-child/resources/cart.svg')
    no-repeat; 
    content: '' !important;
    background-size: cover;
}

@media only screen and (min-width: 768px) {
	.et_pb_menu__cart-button:after { 
    	height: 25px;
    	width: 25px;
		background-size: 25px 25px!important;
	}
	.et_pb_menu__cart-count {
		transform: translateY(-50%) translateX(-70%);
		font-size: 12px;
		line-height: 22px;
		height: 22px;
   		width: 22px;
	}
}

@media only screen and (max-width: 767px) {
	.et_pb_menu__cart-button:after { 
    	height: 20px;
    	width: 20px;
		background-size: 20px 20px!important;
	}
	.et_pb_menu__cart-count {
		transform: translateY(-50%) translateX(-80%);
		font-size: 10px;
		line-height: 18px;
		height: 18px;
		width: 18px;
	}
	.menu-profile-cart-mobile .merchant-login-popup-button::before, .menu-profile-cart-mobile .merchant-login-popup-toggle::before {
		width: 22px;
    	height: 22px;
		background-size: 22px 22px!important;
	}
	#menu-header_cart_profile > li.header-favorites, #menu-header_cart_profile > li.header-profile {
		padding-right: 20px!important;
	}
	.menu-profile-cart-mobile {
		align-self: center;
	}
}

.cart-contents:hover {
    text-decoration: none;
}

.et_pb_menu__cart-count {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	vertical-align: middle;
	text-align: center;
	color: #fff;
    background: var(--tws-lws-red);
    border-radius: 50%;
    padding: 1px;  
}

/* END WooCommerce Cart Icon CSS */

/*  ==================================================================
	Image zoom in effect =============================================
	==================================================================  */

.et_overlay:before {
	content: ""!important;
}

.dt-zoom-in.et_pb_image:hover img, .dt-zoom-in .et_pb_image_wrap:hover img, .dt-zoom-in a:hover img, .et_shop_image:hover img, .et_shop_image a:hover img, .dgwt-wcas-details-main-image:hover img, .et_pb_team_member_image:hover img {
	transform: scale(1.1);
	transition: all 1s 0s ease;
}

.et_overlay {
    background-color: rgba(0,0,0,0)!important;
	border: none!important;
}

.dt-zoom-in, .dt-zoom-in a, .et_shop_image, .et_shop_image a, .dgwt-wcas-details-main-image, .et_pb_team_member_image {
	overflow: hidden;
}

.dt-zoom-in.et_pb_image img, .dt-zoom-in .et_pb_image_wrap img, .dt-zoom-in a img, .et_shop_image img, .et_shop_image a img, .dgwt-wcas-details-main-image img, .et_pb_team_member_image img {
	transition: all 1s 0s ease;
}
/* END Image zoom in effect */

/* FacetWP Hover Image */
.product-image-link {
    display: block;
}

.product-image-frame {
    position: relative;
    display: block;
    width: 100%;
    height: 188px;
    overflow: hidden;
    background-color: #fff;
}

.product-image-layer {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-image-layer--primary {
    z-index: 1;
    transition: opacity 0.25s ease;
}

.product-image-layer--secondary {
    z-index: 2;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.product-image-element {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-image-link.has-secondary-image:hover .product-image-layer--primary,
.product-image-link.has-secondary-image:focus-visible .product-image-layer--primary {
    opacity: 0;
}

.product-image-link.has-secondary-image:hover .product-image-layer--secondary,
.product-image-link.has-secondary-image:focus-visible .product-image-layer--secondary {
    opacity: 1;
}
/*END FacetWP Hover Image*/

/* Laufband über dem Footer (10.09.2026): schwarzer Text statt weiss auf Grau,
   und 30 s statt 10 s je Modul, weil das Band mit sechs Aussagen gut doppelt
   so lang ist und sonst zu schnell liefe. Die Ausgangsregeln stehen als
   Inline-CSS im Theme Builder mit !important, deshalb hier mit body davor. */
body .ticker-column .ticker-content,
body .ticker-column .ticker-content p {
	color: #000 !important;
}
body .ticker-column .ticker-content {
	animation-duration: 30s !important;
}

/* Startseite: Vorteilsleiste unter dem Hero (Divi-Sektion mit dieser Klasse,
   10.09.2026). Rotes Häkchen im Kreis vor jeder Aussage, Text weiss. */
.hp-vorteilsleiste .et_pb_text_inner p {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	margin: 0;
	padding: 0;
	color: #fff;
}
.hp-vorteilsleiste .et_pb_text_inner p svg {
	flex: 0 0 auto;
	width: 19px;
	height: 19px;
	margin-top: 0;
}

/* Vorteilsleiste: Spalten sind im Builder auf "auto" gestellt und zentriert
   (Abstand 44px). Unter 1500px etwas kleiner, damit alle vier Punkte in einer
   Zeile bleiben statt zu umbrechen. */
@media (max-width: 1500px) {
  .hp-vorteilsleiste .et_pb_text_inner p { font-size: 13px; }
  .hp-vorteilsleiste .et_pb_row { column-gap: 30px !important; }
}
@media (max-width: 980px) {
  .hp-vorteilsleiste .et_pb_row { flex-wrap: wrap !important; justify-content: flex-start !important; }
}

/* Startseite: Produktreihen "Die beliebtesten Werkzeuge" und "Neu im Sortiment"
   (Divi-Shop-Module in den Sektionen mit der Klasse hp-werkzeuge, 10.09.2026,
   zweite Reihe 17.09.2026). Vier Karten nebeneinander, waagerecht scrollbar mit
   Einrasten, Pfeile aus js/hp-werkzeuge.js. Karten im Stil der Shop-Übersicht.
   Die Überschriften-Regel ist bewusst auf das Textmodul eingegrenzt: die
   Produkttitel in den Karten sind ebenfalls h2. */
.hp-werkzeuge .et_pb_text_inner h2 { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hp-werkzeuge .et_pb_text_inner h2 .hp-werkzeuge__alle { font: 500 14px/1.4 'Open Sans', Arial, sans-serif; color: var(--tws-lws-red); text-decoration: none; white-space: nowrap; }
.hp-werkzeuge .et_pb_text_inner h2 .hp-werkzeuge__alle:hover { text-decoration: underline; }
.hp-werkzeuge .hp-werkzeuge__vp { position: relative; }
.hp-werkzeuge ul.products {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 3 * 24px) / 4);
	column-gap: 24px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	margin: 0 !important;
	padding: 0 0 4px !important;
	list-style: none;
}
.hp-werkzeuge ul.products::-webkit-scrollbar { display: none; }
/* WooCommerce setzt ::before/::after als Clearfix auf die Liste. Im Raster
   werden daraus zwei leere Zellen, eine davon VOR der ersten Karte. */
.hp-werkzeuge ul.products::before,
.hp-werkzeuge ul.products::after { content: none !important; display: none !important; }
/* WooCommerce und Divi setzen die Kartenbreite mit !important und hoeherer
   Spezifitaet (…li.product:nth-child(n)). Im Raster muss die Karte aber ihre
   Zelle ausfuellen, sonst steht sie unter 981px nur auf halber Spurbreite.
   Die Klasse doppelt zu nehmen hebt die Spezifitaet gerade weit genug. */
.hp-werkzeuge ul.products li.product.product:nth-child(n) { width: auto !important; }
.hp-werkzeuge ul.products li.product {
	scroll-snap-align: start;
	display: flex !important;
	flex-direction: column;
	gap: 8px;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	min-width: 0;
	position: relative;
}
.hp-werkzeuge li.product .woocommerce-LoopProduct-link { display: flex; flex-direction: column; gap: 8px; text-decoration: none; position: relative; }
.hp-werkzeuge li.product .et_shop_image {
	display: flex; align-items: center; justify-content: center;
	aspect-ratio: 4 / 3; overflow: hidden; padding: 10px;
	background: #fff; border: 1px solid #e8e8e8;
}
.hp-werkzeuge li.product .et_shop_image img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.hp-werkzeuge li.product .et_overlay { display: none; }
.hp-werkzeuge li.product .werkzeugart {
	position: absolute !important; left: 10px !important; top: 10px !important; right: auto !important; bottom: auto !important;
	z-index: 2; margin: 0 !important; transform: none !important;
	background: #eee; color: #666; border-radius: 20px;
	font: 500 10px/1 'Open Sans', Arial, sans-serif; padding: 5px 10px;
}
.hp-werkzeuge li.product .woocommerce-loop-product__title {
	font-family: 'Roboto Slab', Georgia, serif; font-size: 18px; font-weight: 500; line-height: 23px; color: #333;
	margin: 0 !important; padding: 0 !important;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
	/* Drei Zeilen Platz halten, auch wenn der Titel kuerzer ist: sonst starten
	   Preis, Verfuegbarkeit und Knopf der Karten auf verschiedenen Hoehen. */
	min-height: 69px;
}
/* Divis Shop-Regel ist spezifischer als eine einfache Klassenkette und setzt
   Groesse und Farbe des Preises. Die doppelte Klasse hebt uns darueber. */
.hp-werkzeuge li.product .price,
.hp-werkzeuge li.product.product .price.price { margin: 0 !important; font: 700 16px/1.4 'Open Sans', Arial, sans-serif !important; color: #000 !important; }
.hp-werkzeuge li.product .price .woocommerce-price-suffix { font-weight: 400; color: #666; }
.hp-werkzeuge li.product .wgm-info,
.hp-werkzeuge li.product .wc-stripe-bnpl-shop-message,
.hp-werkzeuge li.product .gtm4wp_productdata { display: none !important; }
.hp-werkzeuge li.product .loop-stock,
.hp-werkzeuge li.product .loop-out-of-stock { margin: 0; font: 500 13px/1.5 'Open Sans', Arial, sans-serif; }
.hp-werkzeuge li.product .loop-out-of-stock { color: #9a9a9a; }
.hp-werkzeuge li.product a.fwp_product_btn.et_pb_button { margin-top: auto; }
.hp-werkzeuge__nav {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
	width: 40px; height: 40px; border-radius: 50%; border: 1px solid #d9dde2;
	background: #fff; color: #000; font: 400 26px/1 'Open Sans', Arial, sans-serif;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
	box-shadow: 0 2px 8px rgba(0,0,0,.12); padding: 0 0 3px;
}
.hp-werkzeuge__nav--prev { left: -20px; }
.hp-werkzeuge__nav--next { right: -20px; }
.hp-werkzeuge__nav:disabled { opacity: .35; cursor: default; }
.hp-werkzeuge__vp--voll .hp-werkzeuge__nav { display: none; }
@media (max-width: 980px) { .hp-werkzeuge ul.products { grid-auto-columns: calc((100% - 24px) / 2); } }
@media (max-width: 600px) { .hp-werkzeuge ul.products { grid-auto-columns: 86%; } .hp-werkzeuge__nav { display: none; } }

/* Startseite: zentrale Suche mit Reitern (11.09.2026). Die Karte ist die
   Divi-Zeile "home-vehicle-select-row" (weiss, 4px Radius, im Builder
   einstellbar); Reiter und Felder ordnet js/hp-suche.js an. Die Felder sind
   die Originale des Plugins tws-garage und werden hier nur neu gestaltet. */
.home-vehicle-select-row { text-align: left; }
.home-vehicle-select-row > .et_pb_column { row-gap: 0 !important; box-shadow: 0 12px 34px rgba(0,0,0,.12); overflow: visible !important; }
.home-vehicle-select-row .hp-suche__titel h3 { padding: 0; }
/* Den Knopf des Plugins nur in der Startseiten-Suche verstecken, dort haben
   die Reiter eigene Knöpfe. Ungebunden versteckte die Regel ihn auch in der
   Filterspalte des Shops, unter VIN, Motorcode und HSN/TSN. */
.home-vehicle-select-row .hps-leer, .home-vehicle-select-row #vehicle-select-btn { display: none !important; }

.hps__reiter { position: relative; display: flex; gap: 0; border-bottom: 2px solid #e6e9ed; margin-bottom: 26px; overflow-x: auto; scrollbar-width: none; }
.hps__reiter::-webkit-scrollbar { display: none; }
.hps__reiter-btn { appearance: none; border: 0; background: transparent; font-family: inherit; font-size: 14px; font-weight: 600; color: #5b6067; padding: 11px 18px 13px; cursor: pointer; line-height: 1.2; white-space: nowrap; transition: color .18s ease; }
.hps__reiter-btn:hover { color: #15171a; }
.hps__reiter-btn.ist-aktiv { color: var(--tws-lws-red); }
.hps__reiter-btn:focus-visible { outline: 2px solid var(--tws-lws-red); outline-offset: -2px; border-radius: 2px; }
.hps__linie { position: absolute; left: 0; bottom: -2px; height: 5px; width: 0; background: var(--tws-lws-red); border-radius: 3px 3px 0 0; transform: translateX(0); pointer-events: none; transition: transform .3s cubic-bezier(.22,.9,.24,1), width .3s cubic-bezier(.22,.9,.24,1); }
.hps__panel { display: none; }
.hps__panel.ist-aktiv { display: block; }

.hps__reihe { display: flex; align-items: center; gap: 16px 26px; flex-wrap: wrap; }
.hps__gruppe { display: flex; align-items: center; gap: 14px; min-width: 0; }
.hps__gruppe--eins { flex: 4 1 480px; }
.hps__gruppe--zwei { flex: 2 1 220px; padding-left: 22px; border-left: 1px solid #e6e9ed; }
.hps__nr { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: var(--tws-lws-red); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; line-height: 1; }
.hps__nr--zwei { background: #15171a; }
.hps__feld { display: flex; flex-direction: column; flex: 1 1 160px; min-width: 0; }
.hps__feld--schmal { flex: 0 1 150px; }

/* Eingabefelder: eigene und die des Plugins auf denselben Stand bringen */
.hps .hps__input, .hps .hps__select, .hps input.input-text, .hps .fs-label-wrap, .hps .dgwt-wcas-search-input, .hps-wahl__knopf {
  width: 100%; box-sizing: border-box; height: 46px; margin: 0; padding: 0 15px !important; border: 1px solid #cfd5db !important; border-radius: 3px !important;
  font-family: inherit; font-size: 14px !important; font-style: normal !important; line-height: 44px; color: #15171a; background: #fff !important; box-shadow: none; }
.hps .hps__select { appearance: none; padding-right: 34px !important; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2371767d' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 11px !important; }
.hps .hps__input:focus, .hps input.input-text:focus, .hps .dgwt-wcas-search-input:focus { outline: 0; border-color: var(--tws-lws-red) !important; box-shadow: 0 0 0 3px rgba(var(--tws-lws-red-rgb),.13); }
.hps .fs-wrap.fs-open .fs-label-wrap { outline: 0; border-color: #a9b2bb !important; }
.hps ::placeholder { color: #71767d; opacity: 1; font-style: normal; }
.hps .ist-fehlend { border-color: var(--tws-lws-red) !important; animation: hps-wackeln .5s ease; }
@keyframes hps-wackeln { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }

/* fSelect-Auswahl des Plugins (Hersteller / Modell / Typ) */
.hps #make-group, .hps #model-group, .hps #type-group { width: 100%; display: block; font-style: normal; }
.hps .fs-wrap { width: 100%; }
.hps .fs-label-wrap { display: flex; align-items: center; cursor: pointer; }
.hps .fs-label { padding: 0 22px 0 0 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #71767d; }
.hps .vehicle_selected .fs-label { color: #15171a; }
.hps .fs-arrow { right: 14px; border-top-color: #71767d; }
.hps .fs-dropdown { border: 1px solid #dfe3e8; border-radius: 4px; box-shadow: 0 16px 40px rgba(0,0,0,.19); margin-top: 6px; width: 100%; }

/* FiboSearch im Reiter "Freie Suche": ein schlichtes Feld wie die anderen
   Reiter. Den Suchknopf des Stils Solaris (schwarz, mit Lupe) ersetzt hier
   der rote Knopf "Werkzeuge anzeigen" daneben. */
.hps .dgwt-wcas-search-wrapp { width: 100%; max-width: none; }
.hps .dgwt-wcas-sf-wrapp { padding: 0; background: none; }
.hps .dgwt-wcas-search-submit, .hps .dgwt-wcas-voice-search { display: none !important; }
.hps .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input { height: 46px; padding: 0 15px !important; }
.hps .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::placeholder { font-style: normal !important; color: #71767d !important; }

/* Reparaturart: aufklappende Tafel */
.hps-wahl { position: relative; }
.hps-wahl__knopf { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #71767d; cursor: pointer; text-align: left; line-height: 1.2; }
.hps-wahl.ist-gewaehlt .hps-wahl__knopf { color: #15171a; }
.hps-wahl__knopf:hover { border-color: #a9b2bb !important; }
.hps-wahl.ist-offen .hps-wahl__knopf { border-color: #a9b2bb !important; }
.hps-wahl__wert { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hps-wahl__pfeil { flex: 0 0 auto; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #71767d; transition: transform .18s ease; }
.hps-wahl.ist-offen .hps-wahl__pfeil { transform: rotate(180deg); }
.hps-wahl__tafel { display: none; position: absolute; z-index: 60; top: calc(100% + 8px); left: 0; min-width: 440px; background: #fff; border: 1px solid #dfe3e8; border-radius: 4px; box-shadow: 0 16px 40px rgba(0,0,0,.19); padding: 8px; grid-template-columns: 1fr 1fr; gap: 2px; }
.hps-wahl.ist-offen .hps-wahl__tafel { display: grid; }
.hps-wahl__eintrag { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border: 0; border-radius: 3px; background: transparent; font-family: inherit; font-size: 14px; line-height: 1.25; color: #15171a; text-align: left; cursor: pointer; transition: background .12s ease, color .12s ease; }
.hps-wahl__eintrag:hover, .hps-wahl__eintrag:focus-visible { background: #f6f7f8; outline: none; }
.hps-wahl__eintrag.ist-aktiv { background: rgba(var(--tws-lws-red-rgb), 0.08); color: var(--tws-lws-red); font-weight: 600; }
.hps-wahl__text { min-width: 0; }

/* Hersteller: Tafel mit Logos, darunter aufklappbare A-Z-Liste */
.hps-marken { flex: 1.35 1 200px; }
.hps-versteckt { display: none !important; }
.hps-marken__tafel { min-width: 520px; grid-template-columns: 1fr; gap: 0; padding: 14px; }
.hps-marken__suche { position: relative; margin-bottom: 12px; }
.hps-marken__suche::before { content: ''; position: absolute; left: 13px; top: 50%; width: 15px; height: 15px; transform: translateY(-50%); background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2371767d' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat center / contain; pointer-events: none; }
.hps .hps-marken__eingabe { width: 100%; box-sizing: border-box; height: 42px; padding: 0 14px 0 38px; border: 1px solid #cfd5db; border-radius: 3px; font-family: inherit; font-size: 14px; color: #15171a; background: #fff; }
.hps .hps-marken__eingabe:focus { outline: 0; border-color: #a9b2bb; }
.hps-marken__tafel.ist-suche .hps-marken__kopf, .hps-marken__tafel.ist-suche .hps-marken__raster, .hps-marken__tafel.ist-suche .hps-marken__alle { display: none; }
.hps-marken__tafel.ist-suche .hps-marken__liste { display: grid; margin-top: 0; padding-top: 0; border-top: 0; }
.hps-marken__leer { margin: 4px; font-size: 13.5px; color: #71767d; }
.hps-marken__leer[hidden], .hps-marken__eintrag[hidden] { display: none; }
.hps-marken__kopf { margin: 0 0 10px; padding: 0 4px; font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: #71767d; line-height: 1.2; }
.hps-marken__raster { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.hps-marken__marke { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 12px 6px; border: 0; border-radius: 4px; background: transparent; font-family: inherit; cursor: pointer; transition: background .12s ease; }
.hps-marken__marke:hover, .hps-marken__marke:focus-visible { background: #f6f7f8; outline: none; }
.hps-marken__marke.ist-aktiv { background: rgba(var(--tws-lws-red-rgb), 0.08); }
.hps-marken__logo { display: flex; align-items: center; justify-content: center; width: 48px; height: 34px; border-radius: 3px; overflow: hidden; background: #fff; }
.hps-marken__logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; }
.hps-marken__logo--leer { background: #eef1f4; }
.hps-marken__kuerzel { font-size: 12px; font-weight: 700; letter-spacing: .3px; color: #71767d; }
.hps-marken__name { font-size: 12.5px; line-height: 1.25; color: #15171a; text-align: center; }
.hps-marken__marke.ist-aktiv .hps-marken__name { color: var(--tws-lws-red); font-weight: 600; }
.hps-marken__alle { display: block; width: 100%; margin-top: 10px; padding: 11px; border: 0; border-top: 1px solid #e6e9ed; background: transparent; font-family: inherit; font-size: 13.5px; font-weight: 600; color: var(--tws-lws-red); cursor: pointer; text-align: center; }
.hps-marken__alle:hover { background: #f6f7f8; }
.hps-marken__liste { display: none; grid-template-columns: repeat(3, 1fr); gap: 2px; max-height: 240px; overflow-y: auto; margin-top: 6px; padding-top: 6px; border-top: 1px solid #e6e9ed; }
.hps-marken__tafel.ist-alle .hps-marken__liste { display: grid; }
.hps-marken__eintrag { padding: 8px 10px; border: 0; border-radius: 3px; background: transparent; font-family: inherit; font-size: 13.5px; line-height: 1.25; color: #15171a; text-align: left; cursor: pointer; }
.hps-marken__eintrag:hover, .hps-marken__eintrag:focus-visible { background: #f6f7f8; outline: none; }
.hps-marken__eintrag.ist-aktiv { background: rgba(var(--tws-lws-red-rgb), 0.08); color: var(--tws-lws-red); font-weight: 600; }

/* Knopf: Divi-Button-Stile bewusst nicht verwenden */
.hps__cta { flex: 0 0 auto; appearance: none; border: 0; background: var(--tws-lws-red); color: #fff; font-family: inherit; font-size: 15px; font-weight: 600; letter-spacing: .3px; height: 46px; padding: 0 22px; border-radius: 3px; cursor: pointer; transition: background .12s; white-space: nowrap; }
.hps__cta:hover { background: var(--tws-lws-red); }
.hps__cta:disabled { opacity: .6; cursor: default; }
.hps__cta.ist-bereit { box-shadow: 0 0 0 4px rgba(var(--tws-lws-red-rgb),.18); }

@media (max-width: 980px) {
  .hps__gruppe--zwei { padding-left: 0; border-left: 0; }
  .hps__cta { flex: 1 1 100%; }
  .hps-wahl__tafel { min-width: 0; right: 0; grid-template-columns: 1fr; }
  .hps-marken__tafel { min-width: 0; }
  .hps-marken__raster { grid-template-columns: repeat(3, 1fr); }
  .hps-marken__liste { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .hps__gruppe { flex-wrap: wrap; }
  .hps__feld, .hps__feld--schmal { flex: 1 1 100%; }
  .hps__reiter-btn { padding: 10px 12px 12px; font-size: 13px; }
}

/* Leiste ganz oben im Header (11.09.2026): Code-Modul "Pre Header" im
   Theme Builder. Links steht die Ausgabe des Plugin-Shortcodes
   [order_countdown_header] (Länderweiche AT/EU, Bestellschluss), daneben zwei
   Vertrauenspunkte und Telefon. Das "Neu"-Etikett hängt nur an der
   Deutschland-Meldung (#order-cutoff-eu). */
#order-cutoff-at, #order-cutoff-eu, #order-cutoff-at .et_pb_blurb_content, #order-cutoff-eu .et_pb_blurb_content, #order-cutoff-at .et_pb_blurb_container, #order-cutoff-eu .et_pb_blurb_container { max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; height: auto !important; }
.tws-kopfleiste .et_pb_blurb, .tws-kopfleiste .et_pb_blurb_content, .tws-kopfleiste .et_pb_blurb_container { margin: 0 !important; padding: 0 !important; height: auto !important; min-height: 0 !important; }
/* Auf Shop- und Produktseiten legt Divi in sein kritisches Inline-CSS
   ".et-db #et-boc .et-l .et_pb_blurb_1_tb_header { padding: 10px 30px !important }".
   Die ID im Selektor schlägt die Regel oben; "Neu" rückte dadurch 30px nach
   rechts, und die Leiste brach bei 1440px um. Gleiche Kette plus eigene Klasse. */
.et-db #et-boc .et-l .tws-kopfleiste .et_pb_blurb { margin: 0 !important; padding: 0 !important; }
.tws-kopfleiste .et_pb_blurb_container { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 10px; }
.tws-kopfleiste .et_pb_blurb_content { display: block !important; }
.tws-kopfleiste__teil--neu { align-self: center; }
.tws-kopfleiste .et_pb_module_header, .tws-kopfleiste h4 { font-family: 'Open Sans', Arial, sans-serif !important; font-size: 13px !important; line-height: 1.35 !important; font-weight: 600 !important; color: #15171a !important; margin: 0 !important; padding: 0 !important; }
#order-cutoff-eu .et_pb_blurb_container::before { content: 'Neu'; background: var(--tws-lws-red); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; padding: 3px 7px; border-radius: 2px; line-height: 1.3; }
.tws-kopfleiste { display: flex; align-items: center; justify-content: space-between; gap: 10px 24px; flex-wrap: wrap; width: 100%; max-width: 1340px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; font-family: 'Open Sans', Arial, sans-serif; font-size: 13px; line-height: 1.35; color: #4a4f56; text-align: left; }
/* Bündig mit Logo, Menü und Suchfeld darunter (18.09.2026): Die Leiste stand
   bis 1340px breit mit eigenem Innenabstand, die Divi-Zeilen darunter sind
   80 % breit und höchstens 1280px. Bei 1440px stand „Neu" dadurch 76px links
   vom Logo. Ab 981px trägt die Leiste deshalb genau die Zeilenbreite.
   Ihre eigene Divi-Zeile hat im Builder links und rechts 5px Innenabstand,
   die 80 % rechnen deshalb von der vollen Breite (+10px), nicht von der
   verbleibenden Fläche — sonst stehen 4px Versatz. Unter 1100px reicht die
   Zeilenbreite nicht für den Inhalt; dort sitzt das Logo ohnehin mittig
   (Handy-Kopf), die Leiste läuft dann wie zuvor über die volle Breite. */
@media (min-width: 1100px) {
	.tws-kopfleiste { width: calc((100% + 10px) * .8); max-width: 1280px; padding: 0; }
}
.tws-kopfleiste__teil { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; }
.tws-kopfleiste__marke { background: var(--tws-lws-red); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; padding: 3px 7px; border-radius: 2px; line-height: 1.3; }
.tws-kopfleiste__text { font-weight: 600; color: #15171a; }
.tws-kopfleiste__punkt { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.tws-kopfleiste__icon { width: 13px; height: 13px; flex: 0 0 auto; color: var(--tws-lws-red); }
.tws-kopfleiste__teil--tel { gap: 4px 12px; }
.tws-kopfleiste__tel { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; color: #15171a !important; font-weight: 700; font-size: 14px; white-space: nowrap; }
.tws-kopfleiste__tel:hover { color: var(--tws-lws-red) !important; }
.tws-kopfleiste__zeiten { color: #71767d; white-space: nowrap; }
/* Seit die Leiste die Zeilenbreite trägt, reicht der Platz für beide Punkte
   erst ab rund 1390px (Inhalt 1058px plus Abstände in 80 % der Breite). */
@media (max-width: 1400px) { .tws-kopfleiste__punkt:nth-child(2) { display: none; } }
@media (max-width: 980px) { .tws-kopfleiste__teil--punkte { display: none; } }
@media (max-width: 600px) { .tws-kopfleiste { justify-content: center; } .tws-kopfleiste__zeiten { display: none; } }
/* Der Countdown lief bisher nur am Rechner: Zeile 183 blendet .time-left bis
   980px aus, der Style des Shortcodes noch einmal bis 767px. Er soll aber
   überall laufen, gerade am Telefon. Der ganze Nachsatz "Noch 3:39:12 Zeit für
   deine Bestellung." passt dort nicht neben die Meldung (bei 375px blieben
   nach Meldung und Innenabstand rund 130px übrig), deshalb steht unter 1100px
   nur die Zahl mit kurzem Vorsatz: Die Hülle bekommt Schriftgröße 0, die Zahl
   ihre Größe zurück. Sobald der Bestellschluss vorbei ist, schreibt das Skript
   ohnehin nur noch den Satz ohne Zahl. */
.tws-kopfleiste .time-left { display: inline !important; }
@media (max-width: 1099px) {
	.tws-kopfleiste .time-left { font-size: 0 !important; }
	.tws-kopfleiste .time-left-countdown { font-size: 13px; }
	.tws-kopfleiste .time-left-countdown::before { content: 'noch '; font-weight: 500; }
}
/* Zwischen 768 und 980px setzt der Shortcode die Meldung auf 14px, die Zahl
   soll gleich gross bleiben. */
@media (min-width: 768px) and (max-width: 980px) {
	.tws-kopfleiste .time-left-countdown { font-size: 14px; }
}
/* Am Telefon steht rechts oben das Kreuz zum Wegklicken, ein eigenes Divi-Modul
   über der Leiste. Damit die Meldung nicht darunter läuft und trotzdem mittig
   bleibt, ist rechts und links gleich viel Platz freigehalten. Die Schrift
   wächst dazwischen mit der Breite: bei 375px sind es rund 10,5px, bei 414px
   rund 11,6px, ab 430px die vollen 12px. Die Sekunden nimmt js/kopfleiste.js
   heraus, sonst springt die Zeile im Sekundentakt. */
@media (max-width: 767px) {
	.tws-kopfleiste { padding-left: 30px; padding-right: 30px; }
	/* Der Shortcode setzt hier #order-cutoff-at h4 mit 13px und !important.
	   Dagegen kommt nur eine Regel an, die die Kennung ebenfalls nennt. */
	.tws-kopfleiste #order-cutoff-at h4 { font-size: clamp(10px, 3.05vw, 13px) !important; }
	.tws-kopfleiste .time-left-countdown { font-size: clamp(10px, 3.05vw, 13px); }
}

/* Im österreichischen Blurb steht vor dem Satz noch ein Bild des Lieferwagens.
   Divi lässt es mit opacity 0 stehen, weil die Animation im Modul abgeschaltet
   ist: unsichtbar, aber 32px breit. Der Satz begann dadurch 32px weiter rechts
   als das Logo darunter, die Leiste stand also nicht in einer Flucht mit dem
   Kopf. Sichtbar ist ohnehin nur das Symbol, das hinter dem Satz sitzt
   (:after am Container, Zeile 194). Also weg mit dem leeren Platzhalter. */
.tws-kopfleiste #order-cutoff-at .et_pb_main_blurb_image { display: none; }

/* Österreich trägt in derselben Zeile den Countdown bis 16 Uhr. Gemessen am
   24.09.2026 bei 1440px: der Satz mit Countdown ist 526px breit, die beiden
   Vertrauenspunkte 543px, die Telefonnummer 310px, macht mit Abständen 1427px
   in einer Leiste von 1148px. Die Leiste brach dadurch auf zwei Zeilen um, und
   zwar auf jedem Desktop: ihre Breite ist bei 1280px gedeckelt. Der Countdown
   verkauft, die Punkte schmücken, also weichen die Punkte. Der zweite immer,
   der erste unter 1500px (darüber passt er mit 1159px gerade hinein). */
.tws-kopfleiste:has(#order-cutoff-at) .tws-kopfleiste__punkt:nth-child(2) { display: none; }
@media (max-width: 1500px) { .tws-kopfleiste:has(#order-cutoff-at) .tws-kopfleiste__teil--punkte { display: none; } }
/* Länderweiche (08.10.2026). Was nur für Österreich gilt, trägt die Klasse
   tws-nur-at, was für alle anderen gilt, tws-nur-eu. Das geht mit einzelnen
   Wörtern (span im Text) ebenso wie mit ganzen Divi-Modulen, Zeilen oder
   Sektionen: Erweitert → CSS-Klasse. Entschieden wird wie beim Countdown:
   Der Shortcode in der Kopfleiste gibt für Österreich #order-cutoff-at aus,
   sonst #order-cutoff-eu. Divi selbst kennt keine Länderbedingung, und das
   Cookie tws_ct fehlt bei Erstbesuchern.
   Anlass: "Über Nacht geliefert und wieder abgeholt" und "Hin- und
   Rücktransport inklusive" gelten nur für Österreich. Deutschland hat
   Tageszustellung in 2–3 Werktagen für 10 €, unter 20 kg bringt der Kunde
   das Werkzeug selbst zu DPD (So funktioniert's).
   Die Regeln blenden nur aus und setzen nie selbst ein display, damit jedes
   Element seine eigene Darstellung behält, ob span, Modul oder Flex-Zeile. */
body:not(:has(#order-cutoff-at)) .tws-nur-at { display: none !important; }
body:has(#order-cutoff-at) .tws-nur-eu { display: none !important; }
/* Am Telefon war die oberste Zeile abgeschnitten (Rückmeldung Ingo, 21.09.2026).
   Ursache: Die Zeile der Kopfzeilen-Vorlage steht in Divi auf fester Höhe,
   .et_pb_row_0_tb_header{height:50px}, ab 980px abwärts 30px. Auf 375px passen
   Meldung (211px) und Telefonnummer (140px) samt Abstand nicht nebeneinander,
   die Leiste bricht auf zwei Zeilen und wird 50px hoch. Sie lief damit aus der
   Zeile heraus, und deren oberer Rand schnitt die Meldung ab. Ab hier darf sie
   mitwachsen; die Leiste bleibt dafür kompakt. Geprüft bei 320 und 375px.
   Die Höhe hebt der Block auf allen vier Ebenen auf (Sektion, Zeile, Spalte,
   Code-Modul), weil im Livesystem eine andere davon gesetzt sein kann als im
   Test. Alle vier tragen dieselbe Null, und die vergibt Divi nach Reihenfolge:
   rutscht im Theme Builder eine Sektion davor, greift der Block ins Leere. */
@media (max-width: 600px) {
	.et-db #et-boc .et-l .et_pb_section_0_tb_header,
	.et-db #et-boc .et-l .et_pb_section_0_tb_header .et_pb_row,
	.et-db #et-boc .et-l .et_pb_section_0_tb_header .et_pb_column,
	.et-db #et-boc .et-l .et_pb_section_0_tb_header .et_pb_code { height: auto !important; min-height: 0 !important; }
	.tws-kopfleiste { padding: 5px 16px; gap: 2px 14px; font-size: 12px; }
	.tws-kopfleiste .et_pb_module_header, .tws-kopfleiste h4 { font-size: 12px !important; }
	.tws-kopfleiste__tel { font-size: 12.5px; }
}

/* Megamenü im Hauptmenü (11.09.2026). Aufbau und Texte kommen aus dem
   WordPress-Menü "Header_Main", die Klassen sind in inc/mm-anpassungen.php
   beschrieben. Nur Desktop; auf schmalen Schirmen bleibt das
   Mobilmenü des Themes zuständig (Abschnitt weiter unten). */
@media (min-width: 981px) {
  .menu-header-desktop .et-menu-nav li.mm-mega { position: relative; }
  .menu-header-desktop .et-menu-nav li.mm-mega:hover > a, .menu-header-desktop .et-menu-nav li.mm-mega:focus-within > a { color: var(--tws-lws-red) !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega.mm-zu > a { color: inherit !important; }

  /* Panel über die volle Fensterbreite, Oberkante setzt js/mega-menue.js */
  .menu-header-desktop .et-menu-nav li.mm-mega > ul.sub-menu {
    position: fixed !important; left: 0 !important; right: 0 !important; top: var(--mm-oben, 200px) !important; bottom: auto !important;
    width: auto !important; max-height: calc(100vh - var(--mm-oben, 200px) - 12px); overflow-y: auto; overscroll-behavior: contain;
    display: grid !important; align-items: stretch; box-sizing: border-box; margin: 0 !important;
    padding: 0 max(3%, calc((100% - 1340px) / 2)) !important;
    background: #fff !important; border-top: 3px solid var(--tws-lws-red) !important; border-radius: 0 !important; box-shadow: 0 26px 54px rgba(0,0,0,.16) !important;
    z-index: 9998; text-align: left; animation: none !important;
    visibility: hidden !important; opacity: 0 !important; transform: translateY(8px); pointer-events: none;
    transition: opacity .2s ease .16s, transform .2s cubic-bezier(.22,.9,.24,1) .16s, visibility 0s linear .36s;
  }
  /* 120 ms Verzögerung: wer auf dem Weg zu "News" nur darüberstreift,
     sieht kein aufblitzendes Menü. */
  .menu-header-desktop .et-menu-nav li.mm-mega:hover > ul.sub-menu,
  .menu-header-desktop .et-menu-nav li.mm-mega:focus-within > ul.sub-menu {
    visibility: visible !important; opacity: 1 !important; transform: none; pointer-events: auto;
    transition: opacity .2s ease .12s, transform .2s cubic-bezier(.22,.9,.24,1) .12s, visibility 0s linear .12s;
  }
  .menu-header-desktop .et-menu-nav li.mm-mega.mm-zu > ul.sub-menu { visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega--drei > ul.sub-menu { grid-template-columns: minmax(0,1.15fr) minmax(0,.72fr) minmax(0,1.13fr); }
  .menu-header-desktop .et-menu-nav li.mm-mega--zwei > ul.sub-menu { grid-template-columns: minmax(0,1.55fr) minmax(0,1fr); }

  /* Brücke und Schleier (Elemente aus js/mega-menue.js) */
  .menu-header-desktop .et-menu-nav li.mm-mega > .mm-bruecke { position: absolute; left: -30px; right: -30px; top: 100%; height: var(--mm-bruecke, 0); display: block; pointer-events: none; }
  .menu-header-desktop .et-menu-nav li.mm-mega:hover > .mm-bruecke { pointer-events: auto; }
  .menu-header-desktop .et-menu-nav li.mm-mega > .mm-schleier { position: fixed; left: 0; right: 0; bottom: 0; top: var(--mm-oben, 200px); z-index: 9997; background: rgba(10,10,12,.42); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease .12s, visibility 0s linear .34s; }
  .menu-header-desktop .et-menu-nav li.mm-mega:hover > .mm-schleier { opacity: 1; visibility: visible; transition: opacity .22s ease .12s, visibility 0s linear .12s; }
  .menu-header-desktop .et-menu-nav li.mm-mega.mm-zu > .mm-schleier { opacity: 0 !important; visibility: hidden !important; }

  /* Divis Dropdown-Regeln im Panel zurücknehmen.
     display braucht hier !important: Auf Produktseiten, der Seite
     Werkstattausrüstung und unter News legt Divi sein Modul-CSS zusätzlich in
     den Kopf der Seite, darunter `.et-db #et-boc .et-l .et-menu li
     {display:inline-block}`. Die Kennung #et-boc sticht jede Klassenkette, und
     die Einträge im Megamenü liefen dann als Fließtext ineinander
     (Rückmeldung Ingo, 25.09.2026). Auf Startseite, Shop und Kategorieseiten
     fehlt dieselbe Regel, deshalb fiel es lange nicht auf. */
  .menu-header-desktop .et-menu-nav li.mm-mega li { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; display: block !important; position: static; visibility: visible !important; opacity: 1 !important; line-height: 1.4; }
  .menu-header-desktop .et-menu-nav li.mm-mega ul ul { position: static !important; visibility: visible !important; opacity: 1 !important; display: block !important; width: auto !important; min-width: 0; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; transform: none !important; animation: none !important; left: auto !important; top: auto !important; z-index: auto; }
  .menu-header-desktop .et-menu-nav li.mm-mega li a { display: block; width: auto !important; padding: 0 !important; margin: 0; text-transform: none !important; letter-spacing: normal !important; font-size: 14.5px !important; font-weight: 500 !important; line-height: 1.35 !important; color: #15171a !important; background: none !important; opacity: 1 !important; text-decoration: none !important; border: 0 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li a::before, .menu-header-desktop .et-menu-nav li.mm-mega li a::after { display: none !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li a:hover { color: var(--tws-lws-red) !important; }
  .menu-header-desktop .mm-pfeil { width: 12px; height: 12px; flex: 0 0 auto; display: block; transition: transform .14s ease; }

  /* Spalten */
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte { min-width: 0; padding: 34px 0 36px !important; position: relative; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--gross, .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--karten { padding-right: 44px !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--klein { padding-left: 44px !important; padding-right: 44px !important; border-left: 1px solid #d9dde2; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-kopf { display: block; margin: 0 0 18px; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: 1.1px !important; text-transform: uppercase !important; color: #9aa1a9 !important; pointer-events: none; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte > ul > li.mm-alle { position: absolute !important; top: 34px; right: 44px; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-alle { display: inline-flex !important; align-items: center; gap: 7px; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: 1.1px !important; text-transform: uppercase !important; color: var(--tws-lws-red) !important; white-space: nowrap; line-height: 1.2 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-alle:hover .mm-pfeil { transform: translateX(3px); }

  /* Hauptkategorien, Untergruppen in einer Zeile */
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross { border-top: 1px solid #f0f2f4; padding: 11px 0 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-alle + li.mm-gross { border-top: 0; padding-top: 0 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-kat--gross { display: flex !important; align-items: center; }
  .menu-header-desktop .et-menu-nav li.mm-mega .mm-kat__name { font-family: 'Roboto Slab', Georgia, serif; font-size: 18.5px; font-weight: 700; letter-spacing: -.1px; color: #15171a; transition: color .12s ease; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-kat--gross:hover .mm-kat__name { color: var(--tws-lws-red); }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross > ul.sub-menu { margin: 5px 0 0 !important; font-size: 14px; line-height: 1.65; color: #5b6067; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross > ul > li { display: inline !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross > ul > li + li::before { content: '·'; color: #c8ced4; margin: 0 6px; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross > ul a { display: inline !important; font-size: 14px !important; line-height: 1.65 !important; color: #5b6067 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-gross > ul a:hover { color: var(--tws-lws-red) !important; text-decoration: underline !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--klein > ul > li > a { padding: 8px 0 !important; }

  /* Karten */
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--karten > ul.sub-menu { display: grid !important; gap: 10px; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-karte { display: flex !important; align-items: flex-start; padding: 14px 16px !important; border: 1px solid #e6e9ec !important; border-radius: 4px; transition: border-color .14s ease, background .14s ease; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-karte:hover { border-color: var(--tws-lws-red) !important; background: rgba(var(--tws-lws-red-rgb), 0.04) !important; }
  .menu-header-desktop .mm-karte__text { min-width: 0; }
  .menu-header-desktop .mm-karte__kopf { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
  .menu-header-desktop .mm-karte__name { font-family: 'Roboto Slab', Georgia, serif; font-size: 16px; font-weight: 700; color: #15171a; line-height: 1.25; transition: color .12s ease; }
  .menu-header-desktop .mm-karte:hover .mm-karte__name { color: var(--tws-lws-red); }
  .menu-header-desktop .mm-karte__neu { background: var(--tws-lws-red); color: #fff; border-radius: 2px; padding: 2px 7px; font-size: 10px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; line-height: 1.4; }
  .menu-header-desktop .mm-karte__t { display: block; margin-top: 3px; font-size: 13.5px; line-height: 1.5; color: #5b6067; }
  .menu-header-desktop .mm-karte__marke { display: inline-block; margin-top: 7px; font-size: 12px; font-weight: 700; color: var(--tws-lws-red); }

  /* Dunkler Block */
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel { margin: 34px 0 36px 44px !important; padding: 28px 30px 26px !important; background: #131212; border-radius: 5px; display: flex !important; flex-direction: column; align-items: stretch !important; box-sizing: border-box; }
  .menu-header-desktop .et-menu-nav li.mm-mega--zwei li.mm-spalte--dunkel { margin-left: 0 !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel > ul.sub-menu { flex: 1 1 auto; display: flex !important; flex-direction: column; align-items: stretch !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel a.mm-kopf { color: rgba(255,255,255,.5) !important; }
  .menu-header-desktop .mm-intro { display: block; margin: -4px 0 20px; font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,.6); }
  .menu-header-desktop .mm-band { display: flex; align-items: center; gap: 10px; margin: -28px -30px 20px; padding: 13px 30px; background: var(--tws-lws-red); border-radius: 5px 5px 0 0; font-size: 13.5px; font-weight: 700; line-height: 1.35; color: #fff; }
  .menu-header-desktop .mm-band .mm-svg { width: 17px; height: 17px; flex: 0 0 auto; }
  .menu-header-desktop .mm-band .mm-svg path { stroke-width: 2.8; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel > ul > li.mm-alle { position: static !important; margin-top: auto !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel a.mm-alle { display: flex !important; width: 100% !important; box-sizing: border-box; padding: 18px 0 0 !important; border-top: 1px solid rgba(255,255,255,.13) !important; font-size: 13px !important; letter-spacing: normal !important; text-transform: none !important; color: #fff !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-angebot { display: block !important; padding: 17px 0 !important; border-top: 1px solid rgba(255,255,255,.13) !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega li.mm-spalte--dunkel > ul > li:first-child > a.mm-angebot { border-top: 0 !important; padding-top: 0 !important; }
  .menu-header-desktop .mm-angebot__name { display: block; font-family: 'Roboto Slab', Georgia, serif; font-size: 16.5px; font-weight: 700; color: #fff; line-height: 1.3; margin-bottom: 5px; transition: color .12s ease; }
  .menu-header-desktop .mm-angebot:hover .mm-angebot__name { color: var(--tws-lws-red); }
  .menu-header-desktop .mm-angebot__text { display: block; font-size: 13.5px; line-height: 1.55; color: rgba(255,255,255,.68); }
  .menu-header-desktop .mm-angebot__kauf { display: flex; align-items: center; gap: 10px; margin-top: 9px; }
  .menu-header-desktop .mm-angebot__preis { flex: 0 0 auto; background: var(--tws-lws-red); color: #fff; border-radius: 2px; padding: 5px 10px; font-size: 13.5px; font-weight: 700; line-height: 1.2; transition: background .14s ease; }
  .menu-header-desktop .mm-angebot:hover .mm-angebot__preis { background: var(--tws-lws-red); }
  .menu-header-desktop .mm-angebot__takt { font-size: 11.5px; line-height: 1.3; color: rgba(255,255,255,.5); }
  .menu-header-desktop .mm-angebot__kauf .mm-pfeil { margin-left: auto; color: #fff; opacity: .55; }
  .menu-header-desktop .mm-angebot:hover .mm-angebot__kauf .mm-pfeil { opacity: 1; transform: translateX(3px); }
  .menu-header-desktop .mm-punkt-zeile { display: flex; align-items: flex-start; gap: 11px; padding: 9px 0; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.78); }
  .menu-header-desktop .mm-punkt-zeile .mm-svg { width: 16px; height: 16px; flex: 0 0 auto; margin-top: 2px; color: var(--tws-lws-red); }
  .menu-header-desktop .mm-punkt-zeile .mm-svg path { stroke-width: 2.6; }
  .menu-header-desktop .mm-cta-vor { display: block; margin: 18px 0 9px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.14); font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.6); }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-cta { display: inline-flex !important; align-items: center; gap: 8px; padding: 11px 18px !important; background: var(--tws-lws-red) !important; border-radius: 3px; font-size: 13.5px !important; font-weight: 700 !important; color: #fff !important; transition: background .14s ease; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-cta:first-child { margin-top: 16px; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-cta:hover { background: var(--tws-lws-red) !important; color: #fff !important; }
  .menu-header-desktop .et-menu-nav li.mm-mega a.mm-cta:hover .mm-pfeil { transform: translateX(3px); }
}
@media (min-width: 981px) and (max-width: 1150px) {
  .menu-header-desktop .et-menu-nav li.mm-mega--drei > ul.sub-menu { grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); }
  .menu-header-desktop .et-menu-nav li.mm-mega--drei li.mm-spalte--dunkel { grid-column: 1 / -1; margin: 0 0 30px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .menu-header-desktop .et-menu-nav li.mm-mega > ul.sub-menu, .menu-header-desktop .et-menu-nav li.mm-mega > .mm-schleier { transition: none !important; }
}
/* Megamenü im Mobilmenü (Akkordeon des Themes mit "+"): Spalten sind keine
   eigene Klappstufe, sondern graue Zwischenüberschriften, die Links darunter
   stehen direkt offen. Beschreibende Teile (Symbole, Texte, Aufzählungen)
   bleiben dem Desktop-Panel vorbehalten. */
@media (max-width: 1260px) {
  .mobile-menu .et-menu li.mm-mega li.mm-spalte.show-menu-items li { display: block !important; }
  /* Die Regel darüber macht beim Aufklappen jede Zeile sichtbar und schlug
     damit das Ausblenden der Aufzählung unten — die Haken standen dann ohne
     Größenvorgabe 250px gross im Menü. */
  .mobile-menu .et-menu li.mm-mega li.mm-spalte.show-menu-items li.mm-punkt { display: none !important; }
  .mobile-menu .et-menu li.mm-mega a.mm-kopf { pointer-events: none; padding-top: 14px !important; padding-bottom: 4px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 1px !important; text-transform: uppercase !important; color: #9aa1a9 !important; border: 0 !important; background: none !important; }
  .mobile-menu .et-menu li.mm-mega a.mm-kopf::after { display: none !important; }
  .mobile-menu .et-menu li.mm-mega li.mm-gross > ul.sub-menu { padding-left: 14px !important; }
  .mobile-menu .et-menu li.mm-mega .mm-intro, .mobile-menu .et-menu li.mm-mega .mm-band, .mobile-menu .et-menu li.mm-mega li.mm-punkt,
  .mobile-menu .et-menu li.mm-mega .mm-cta-vor, .mobile-menu .et-menu li.mm-mega .mm-karte__t,
  .mobile-menu .et-menu li.mm-mega .mm-karte__marke, .mobile-menu .et-menu li.mm-mega .mm-karte__neu, .mobile-menu .et-menu li.mm-mega .mm-angebot__text,
  .mobile-menu .et-menu li.mm-mega .mm-angebot__kauf, .mobile-menu .et-menu li.mm-mega .mm-pfeil, .mobile-menu .et-menu li.mm-mega > .mm-bruecke,
  .mobile-menu .et-menu li.mm-mega > .mm-schleier { display: none !important; }
}
/* Mobilmenü: Unterpunkte auf dem grauen Grund des Menüs, eingerückt wie die
   Hauptpunkte (30px), gleiche Schriftstärke. Das +/– des Themes rechts mittig
   statt über dem Text (bisher gab es keine Hauptpunkte mit Unterpunkten). */
@media (max-width: 1260px) {
  .mobile-menu .et-menu li.mm-mega > ul.sub-menu { padding: 0 20px 12px 30px !important; }
  .mobile-menu .et-menu li.mm-mega ul.sub-menu { background: transparent !important; }
  .mobile-menu .et-menu li.mm-mega li a { font-weight: 500 !important; padding: 7px 0 !important; line-height: 1.4 !important; }
  .mobile-menu .et-menu li.mm-mega > a::after, .mobile-menu .et-menu li.mm-mega > a.menu-switched-icon::after { left: auto !important; right: 24px !important; top: 50% !important; transform: translateY(-50%); padding-left: 0 !important; line-height: 1 !important; }
}
/* Hauptmenü-Breite (11.09.2026, gemessen): Neben dem Logo stehen etwa 59 %
   der Fensterbreite zur Verfügung, höchstens 942px. Darin müssen fünf Punkte,
   das Profil-Symbol und der Warenkorb des Menü-Moduls (57px) Platz finden.
   Ab 1301px wächst die Schrift mit dem Fenster (12 bis 15px), von 1261 bis
   1300px 12px mit kleineren Aufklapp-Pfeilen, bis 1260px übernimmt die mobile
   Kopfzeile (Sektions-Klassen kopf-desktop / kopf-mobil im Theme Builder). */
@media (min-width: 1301px) {
  .et_pb_menu .et-menu-nav > #menu-header_main > li { padding-left: 8px !important; padding-right: 8px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li > a { font-size: clamp(12px, calc(1.383vw - 6px), 15px) !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li.menu-item-has-children > a { padding-right: 16px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li.header-profile { padding-right: 12px !important; }
}
@media (min-width: 1261px) and (max-width: 1300px) {
  .et_pb_menu .et-menu-nav > #menu-header_main > li { padding-left: 6px !important; padding-right: 6px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li > a { font-size: 12px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li.menu-item-has-children > a { padding-right: 14px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li.menu-item-has-children > a::after { font-size: 13px !important; }
  .et_pb_menu .et-menu-nav > #menu-header_main > li.header-profile { padding-right: 10px !important; }
}
@media (min-width: 981px) and (max-width: 1260px) {
  .et-l--header .et_pb_section.kopf-desktop { display: none !important; }
  .et-l--header .et_pb_section.kopf-mobil { display: flex !important; }
  /* Ausklapp-Menü mit den Tablet-Werten: 40 % breit, das Öffnen verschiebt es
     um 250 % seiner Breite, also genau eine Fensterbreite. Mit der Desktop-
     Breite von 80 % landete es ausserhalb des Fensters. */
  .et-l--header .mobile-menu-row { width: 40% !important; max-width: 50% !important; }
}

/* Startseite: Vergleich "Ohne mobility market / Mit mobility market"
   (Sektion hp-vergleich, 17.09.2026). Jede Zeile ist eine eigene Divi-Zeile mit
   zwei gleich breiten Spalten — so bleiben beide Hälften automatisch gleich hoch
   und ein Paar bleibt beim Umbruch zusammen. Links das Problem auf Grau, rechts
   die Lösung auf Schwarz; die graue Hälfte läuft spitz in die schwarze hinein
   und zeigt so auf die Lösung. */
.hp-vergleich .et_pb_row { padding-top: 0 !important; padding-bottom: 0 !important; }
.hp-vergleich .hp-vergleich__ueberschrift { margin-bottom: 28px !important; }
.hp-vergleich .hp-vergleich__zeile { display: flex !important; flex-wrap: nowrap !important; column-gap: 0 !important; }
.hp-vergleich .hp-vergleich__zeile > .et_pb_column {
	width: 50% !important; max-width: 50% !important; margin: 0 !important; position: relative;
	display: flex; flex-direction: column; justify-content: center;
}
/* Divi gibt jeder Spalte z-index 2. Die rechte Spalte steht später im
   Quelltext und läge damit über der Spitze der linken — deshalb hier 3. */
.hp-vergleich .hp-vergleich__zeile > .et_pb_column:first-child { background: #f2f2f2; padding: 14px 44px 14px 32px; z-index: 3; }
.hp-vergleich .hp-vergleich__zeile > .et_pb_column:last-child { background: #000; padding: 14px 32px 14px 44px; }
.hp-vergleich .hp-vergleich__zeile + .hp-vergleich__zeile > .et_pb_column:first-child { border-top: 1px solid #e2e2e2; }
.hp-vergleich .hp-vergleich__zeile + .hp-vergleich__zeile > .et_pb_column:last-child { border-top: 1px solid #262626; }
/* Kopfzeile und Schlusszeile tragen die abgerundeten Ecken des Blocks. */
.hp-vergleich .hp-vergleich__kopf > .et_pb_column { padding-top: 28px; padding-bottom: 20px; }
.hp-vergleich .hp-vergleich__kopf > .et_pb_column:first-child { border-radius: 10px 0 0 0; }
.hp-vergleich .hp-vergleich__kopf > .et_pb_column:last-child { border-radius: 0 10px 0 0; }
.hp-vergleich .hp-vergleich__schluss > .et_pb_column { padding-bottom: 28px; }
.hp-vergleich .hp-vergleich__schluss > .et_pb_column:first-child { border-radius: 0 0 0 10px; }
.hp-vergleich .hp-vergleich__schluss > .et_pb_column:last-child { border-radius: 0 0 10px 0; }
/* Statt eines dritten Symbols verbindet die Form. */
.hp-vergleich .hp-vergleich__zeile:not(.hp-vergleich__kopf) > .et_pb_column:first-child::after {
	content: ""; position: absolute; right: 0; top: 50%; transform: translate(100%, -50%);
	border: 10px solid transparent; border-left-color: #f2f2f2; z-index: 2; pointer-events: none;
}
.hp-vergleich .hp-vergleich__kopf h3 {
	font-family: 'Roboto Slab', Georgia, serif; font-size: 22px; font-weight: 700; line-height: 1.3;
	margin: 0 !important; padding: 0 !important;
}
.hp-vergleich .hp-vergleich__kopf > .et_pb_column:first-child h3 { color: #333; }
.hp-vergleich .hp-vergleich__kopf > .et_pb_column:last-child h3 { color: #fff; }
.hp-vergleich .hp-vergleich__zeile .et_pb_text_inner p {
	display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 0;
	font: 500 15px/1.5 'Open Sans', Arial, sans-serif;
}
.hp-vergleich .hp-vergleich__zeile .et_pb_text_inner svg { flex: 0 0 auto; width: 21px; height: 21px; margin-top: 1px; }
.hp-vergleich .hp-vergleich__zeile > .et_pb_column:first-child .et_pb_text_inner p { color: #666; }
.hp-vergleich .hp-vergleich__zeile > .et_pb_column:last-child .et_pb_text_inner p { color: #fff; font-weight: 600; }
/* Schmal: Paare stapeln, Nachteil oben, Lösung direkt darunter, Spitze nach unten. */
@media (max-width: 980px) {
	/* Divi gibt jeder Zeile einen senkrechten Zeilenabstand (--vertical-gap,
	   40px). Gestapelt klaffte der IM Paar, waehrend die Paare aneinander
	   klebten — genau verkehrt herum. Also Zeilenabstand aus, Abstand
	   stattdessen unter die ganze Zeile. Divi setzt margin mit !important auf
	   0; die Klasse et_pb_row zusaetzlich zu nehmen gibt uns die hoehere
	   Spezifitaet, die dafuer noetig ist. */
	.hp-vergleich .hp-vergleich__zeile { flex-wrap: wrap !important; border-radius: 10px; overflow: hidden; row-gap: 0 !important; }
	.hp-vergleich .hp-vergleich__zeile.et_pb_row { margin-bottom: 14px !important; }
	.hp-vergleich .hp-vergleich__zeile:last-child.et_pb_row { margin-bottom: 0 !important; }
	.hp-vergleich .hp-vergleich__zeile > .et_pb_column {
		width: 100% !important; max-width: 100% !important; padding: 16px 22px !important;
		margin-bottom: 0 !important;
	}
	.hp-vergleich .hp-vergleich__zeile + .hp-vergleich__zeile > .et_pb_column { border-top: 0; }
	.hp-vergleich .hp-vergleich__kopf > .et_pb_column:first-child,
	.hp-vergleich .hp-vergleich__schluss > .et_pb_column:first-child { border-radius: 0; }
	.hp-vergleich .hp-vergleich__kopf > .et_pb_column:last-child,
	.hp-vergleich .hp-vergleich__schluss > .et_pb_column:last-child { border-radius: 0; }
	.hp-vergleich .hp-vergleich__zeile:not(.hp-vergleich__kopf) > .et_pb_column:first-child::after {
		right: auto; top: auto; left: 30px; bottom: 0; transform: translateY(100%);
		border-left-color: transparent; border-top-color: #f2f2f2;
	}
	/* Gestapelt steht in jedem Paar der Nachteil ueber der Loesung. Die beiden
	   Spaltenkoepfe darueber wuerden dann wie ein weiteres Paar aussehen. */
	.hp-vergleich .hp-vergleich__kopf { display: none !important; }
}

/* Seite "Werkstattausrüstung" (17.09.2026). Zielseite des gleichnamigen
   Megamenü-Punkts, der vorher ins Leere zeigte. Inhalte stehen im Divi-Builder
   der Seite, hier nur die Darstellung. Klassen mit Präfix wa-. */
/* Die Kopfzeile steht am Desktop fest (146px). Ohne Vorhalt landet die
   Ueberschrift nach einem Ankersprung dahinter. */
.wa-geraet { scroll-margin-top: 160px; }
@media (max-width: 980px) { .wa-geraet { scroll-margin-top: 100px; } }
.wa-kopf .wa-vorspann { font: 500 17px/1.6 'Open Sans', Arial, sans-serif; color: #4a4f56; max-width: 62ch; margin: 14px 0 0; }
.wa-geraet .wa-unter {
	font: 700 12px/1 'Open Sans', Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase;
	color: var(--tws-lws-red); margin: 10px 0 14px;
}
.wa-geraet .wa-text p:not(.wa-unter) { max-width: 62ch; }
.wa-geraet .wa-kaesten { margin-top: 4px !important; }
.wa-kasten {
	background: #fff; border: 1px solid #dfe3e8; border-radius: 4px; padding: 20px 22px; height: 100%;
}
.wa-geraet--grau .wa-kasten { border-color: #e2e2e2; }
.wa-kasten p { margin: 0 !important; padding: 0 !important; }
.wa-kasten .wa-kasten__titel {
	font: 700 11px/1 'Open Sans', Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase;
	color: #8a8a8a; margin-bottom: 10px !important;
}
.wa-kasten .wa-kasten__name { font-family: 'Roboto Slab', Georgia, serif; font-size: 17px; font-weight: 500; line-height: 1.35; color: #333; }
.wa-kasten .wa-kasten__preis { font: 700 22px/1.3 'Open Sans', Arial, sans-serif; color: #000; margin-top: 8px !important; }
.wa-kasten .wa-kasten__klein { font: 500 12.5px/1.5 'Open Sans', Arial, sans-serif; color: #6f6f6f; margin-top: 4px !important; }
/* Beide Knöpfe nebeneinander: die Divi-Spalte trägt sie untereinander. */
.wa-knoepfe .et_pb_column { display: flex; flex-direction: row; flex-wrap: wrap; gap: 14px; align-items: center; }
.wa-knoepfe .et_pb_button_module_wrapper { margin: 0 !important; }
.wa-kaufen h2 { color: #fff !important; }
.wa-kaufen .wa-punkte { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.wa-kaufen .wa-punkte li {
	color: #fff; font: 600 15px/1.5 'Open Sans', Arial, sans-serif; padding-left: 32px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12' fill='%23e30517'/%3E%3Cpath d='M6.6 12.4 10.3 16 17.4 8.7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 0 1px;
	background-size: 21px 21px;
}
.wa-hilfe .wa-text p { max-width: 70ch; }
.wa-hilfe a { color: var(--tws-lws-red); text-decoration: none; }
.wa-hilfe a:hover { text-decoration: underline; }
@media (max-width: 980px) {
	.wa-geraet .wa-kaesten .et_pb_column { margin-bottom: 16px; }
}
@media (max-width: 767px) {
	/* Ohne Wortliste trennt der Browser "Werkstattausruestung" an falscher
	   Stelle. Kleiner setzen statt falsch trennen. */
	.wa-kopf h1 { font-size: 30px !important; hyphens: manual; }
}

/* Startseite: Vorteilskarten (18.09.2026).
   Die Vorlage legt alle sechs Überschriften auf zwei Zeilen aus — sonst
   starten die Fließtexte nebeneinander auf verschiedenen Höhen. Zwischen 981
   und 1199px wird die Spalte so schmal, dass drei der sechs Titel auf drei
   Zeilen umbrechen. Dort halten wir die Höhe von drei Zeilen frei, damit die
   Karten im Gleichgewicht bleiben. */
@media (min-width: 981px) and (max-width: 1199px) {
	.hp-vorteile .et_pb_text_inner h3 { min-height: 4.4em; }
}

/* Startseite: sichtbarer Weg in den WhatsApp-Chat (18.09.2026).
   Der Link steckte bisher nur in der Telefonnummer mitten im Absatz —
   verlinkt war er, als Schaltfläche hat ihn niemand gelesen. Weiss auf dem
   roten Grund: kräftiger Kontrast, ohne eine dritte Farbe in den Block zu
   holen. */
.hp-whatsapp { margin: 22px 0 0 !important; }
.hp-whatsapp__knopf {
	display: inline-flex; align-items: center; gap: 10px;
	background: #fff; color: var(--tws-lws-red) !important;
	font: 700 16px/1 'Open Sans', Arial, sans-serif;
	padding: 15px 26px; border-radius: 4px; text-decoration: none !important;
	box-shadow: 0 6px 18px rgba(0,0,0,.18);
	transition: transform .14s ease, box-shadow .14s ease;
}
.hp-whatsapp__knopf:hover { transform: translateY(-1px); box-shadow: 0 9px 24px rgba(0,0,0,.26); }
.hp-whatsapp__symbol { width: 21px; height: 21px; flex: 0 0 auto; }
@media (max-width: 760px) {
	.hp-whatsapp__knopf { width: 100%; justify-content: center; box-sizing: border-box; }
}

/* Shop-Ergebnisseite: Suchstreifen und Ergebniskopf (18.09.2026).
   Die Vorlage folgeseite-vorschlag.html benennt das eigentliche Problem der
   Seite: Wer einmal gesucht hat, kommt nicht mehr zurück in die volle Suche —
   er kann nur noch verfeinern. Der dunkle Streifen über den Treffern zeigt
   deshalb, wonach gerade gesucht wird, und klappt auf Wunsch dieselbe
   Reiter-Suche auf wie die Startseite.
   Die Chips sind die eigenen Auswahlanzeigen von FacetWP (.facetwp-selections);
   sie werden hierher verschoben, nicht nachgebaut — dadurch bleibt das
   Wegklicken die Mechanik des Plugins. */
.mm-suchstreifen { background: #131212; }
.mm-suchstreifen__innen {
	width: 80%; max-width: 1280px; margin: 0 auto;
	display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; padding: 16px 0;
}
.mm-suchstreifen__titel {
	font: 700 12px/1.2 'Open Sans', Arial, sans-serif; letter-spacing: .8px; text-transform: uppercase;
	color: rgba(255,255,255,.6);
}
.mm-suchstreifen__chips { display: flex; gap: 10px; flex-wrap: wrap; flex: 1 1 auto; align-items: center; }
/* Im Streifen gelten diese Regeln über die IDs der beiden verschobenen
   Module: Ingos shop-page.css gestaltet dieselben Elemente als graue Pillen
   (teils mit !important oder ID im Selektor), FacetWP legt ein kleines Kreuz
   als Hintergrundbild an. Ausserhalb des Streifens bleibt alles, wie es war. */
.mm-suchstreifen #facet-selections .facetwp-selections { display: contents; }
.mm-suchstreifen #facet-selections ul.mm-ersatz:empty { display: none; }
.mm-suchstreifen #facet-selections .facetwp-selections ul,
.mm-suchstreifen #facet-selections ul.mm-ersatz {
	display: flex; gap: 10px; flex-wrap: wrap; align-items: center; list-style: none; margin: 0; padding: 0;
}
.mm-suchstreifen #facet-selections .facetwp-selections li,
.mm-suchstreifen #facet-selections .mm-ersatz li {
	display: inline-flex !important; align-items: center !important; gap: 9px;
	background: #fff; border-radius: 3px; padding: 7px 7px 7px 13px !important; margin: 0 !important;
	font: 400 14px/1.2 'Open Sans', Arial, sans-serif;
}
.mm-suchstreifen #facet-selections .facetwp-selection-label {
	display: inline-block !important; margin: 0; padding: 0 !important; line-height: 1.2 !important;
	font: 700 11px/1.2 'Open Sans', Arial, sans-serif; letter-spacing: .4px; text-transform: uppercase; color: #71767d;
}
.mm-suchstreifen #facet-selections .facetwp-selection-value {
	display: inline-flex !important; align-items: center; gap: 9px; margin: 0 !important;
	background: none !important; padding: 0 !important; border-radius: 0 !important;
	font-weight: 600; line-height: 1.2; color: #15171a; cursor: pointer;
}
/* Das Kreuz gehört zum anklickbaren Teil: FacetWP entfernt beim Klick darauf
   den Wert. Es wird deshalb nicht selbst zum Knopf gemacht. */
.mm-suchstreifen #facet-selections .facetwp-selection-value::after {
	content: "\00d7";
	width: 22px; height: 22px; border-radius: 50%;
	background: #eef1f4; color: #5b6067;
	font: 400 15px/22px 'Open Sans', Arial, sans-serif; text-align: center;
}
.mm-suchstreifen #facet-selections .facetwp-selection-value:hover::after { background: var(--tws-lws-red); color: #fff; }
.mm-suchstreifen__zuruecksetzen { margin-left: 2px; }
/* Das Divi-Modul um den Knopf trägt im Builder einen weissen Hintergrund. */
.mm-suchstreifen #facet-reset, .mm-suchstreifen #facet-selections { background: none !important; }
.mm-suchstreifen #facet-reset button.facetwp-reset {
	appearance: none; border: 0 !important; background: none !important; padding: 0 !important; border-radius: 0 !important;
	cursor: pointer; font: 600 13px/1.2 'Open Sans', Arial, sans-serif; color: rgba(255,255,255,.7) !important; text-decoration: underline;
}
.mm-suchstreifen #facet-reset button.facetwp-reset:hover { color: #fff !important; }
.mm-suchstreifen__schalter {
	display: inline-flex; align-items: center; gap: 9px;
	appearance: none; border: 1px solid rgba(255,255,255,.45); background: transparent; color: #fff;
	font: 600 14px/1.2 'Open Sans', Arial, sans-serif; padding: 10px 16px; border-radius: 3px; cursor: pointer;
	transition: background .14s ease, border-color .14s ease;
}
.mm-suchstreifen__schalter:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.mm-suchstreifen__pfeil {
	width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent;
	border-top: 6px solid currentColor; transition: transform .2s ease;
}
.mm-suchstreifen.ist-offen .mm-suchstreifen__pfeil { transform: rotate(180deg); }
.mm-suchstreifen__fach { display: none; border-top: 1px solid rgba(255,255,255,.16); }
.mm-suchstreifen.ist-offen .mm-suchstreifen__fach { display: block; }
.mm-suchstreifen__fach-innen { width: 80%; max-width: 1280px; margin: 0 auto; padding: 22px 0 26px; }

/* Kopf über den Treffern: die vorhandene Zeile mit Trefferzahl und Sortierung
   bekommt nur ihr Aussehen aus der Vorlage — gezählt und sortiert wird
   weiterhin von FacetWP. */
.mm-ergebniskopf .et_pb_column { margin-bottom: 0 !important; }
.mm-ergebniskopf {
	padding-bottom: 16px !important; margin-bottom: 18px !important;
	border-bottom: 1px solid #e6e9ed;
	align-items: center !important;
}
.mm-ergebniskopf .facetwp-facet-result_count {
	font: 600 14.5px/1.4 'Open Sans', Arial, sans-serif; color: #15171a; margin: 0 !important;
}
.mm-ergebniskopf .facetwp-facet-sortierung { margin: 0 !important; display: flex; align-items: center; gap: 9px; justify-content: flex-end; }
.mm-ergebniskopf .facetwp-facet-sortierung::before {
	content: "Sortieren";
	font: 700 12px/1.2 'Open Sans', Arial, sans-serif; letter-spacing: .5px; text-transform: uppercase; color: #71767d;
}
.mm-ergebniskopf .facetwp-sort-select {
	height: 40px; padding: 0 32px 0 12px; border: 1px solid #cfd5db; border-radius: 3px;
	font: 400 14px/1.2 'Open Sans', Arial, sans-serif; color: #15171a; background-color: #fff; appearance: none;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2371767d' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 12px center; background-size: 11px;
}
/* Die Module der Auswahl sind Divi-Code-Module; im Streifen zählen nur ihre
   Inhalte, nicht ihre Hüllen. */
.mm-suchstreifen__chips .et_pb_code, .mm-suchstreifen__zuruecksetzen .et_pb_code { margin: 0 !important; padding: 0 !important; }
.mm-suchstreifen__chips .et_pb_code, .mm-suchstreifen__chips .et_pb_code_inner { display: contents; }
/* Fahrzeug-Chip: FacetWP zeigt die rohe Fahrzeugnummer, garage.js hängt den
   Klartext mit eigenem Entfernen (unselectvehicle_shop) daneben. Sichtbar
   bleibt nur der Klartext. */
.mm-suchstreifen #facet-selections li[data-facet="haynespro"] .facetwp-selection-value { display: none !important; }
.mm-suchstreifen__chips .facetwp-selection-hp,
.mm-suchstreifen #facet-selections li[data-facet="haynespro"] > .facetwp-selection-hp {
	display: inline-flex !important; align-items: center; gap: 9px; width: auto !important;
	margin: 0 !important; padding: 0 !important; border-radius: 0 !important; background: none !important;
	font-weight: 600; line-height: 1.2; color: #15171a; cursor: pointer;
}
.mm-suchstreifen__chips .facetwp-selection-hp::after {
	content: "\00d7";
	width: 22px; height: 22px; border-radius: 50%;
	background: #eef1f4; color: #5b6067;
	font: 400 15px/22px 'Open Sans', Arial, sans-serif; text-align: center;
}
.mm-suchstreifen__chips .facetwp-selection-hp:hover::after { background: var(--tws-lws-red); color: #fff; }
/* garage.js hängt "Alle Filter zurücksetzen" als eigenen Eintrag an — der
   setzt auch das Fahrzeug zurück und ersetzt deshalb den Knopf von FacetWP. */
.mm-suchstreifen__chips #facetwp-reset-all { display: contents; }
.mm-suchstreifen__chips #facetwp-reset-all ul { list-style: none; margin: 0; padding: 0; display: flex; }
.mm-suchstreifen__chips #facetwp-reset-all li { background: transparent; padding: 0; }
.mm-suchstreifen__chips #facetwp-reset-all .facetwp-selection-label { display: none; }
.mm-suchstreifen__chips #facetwp-reset-all .facetwp-reset-all {
	font: 600 13px/1.2 'Open Sans', Arial, sans-serif; color: rgba(255,255,255,.7); text-decoration: underline; cursor: pointer;
}
.mm-suchstreifen__chips #facetwp-reset-all .facetwp-reset-all::after { content: none; }
.mm-suchstreifen__chips #facetwp-reset-all .facetwp-reset-all:hover { color: #fff; }
.mm-suchstreifen:has(#facetwp-reset-all) .mm-suchstreifen__zuruecksetzen { display: none; }
/* Ohne Auswahl: kein leerer Chip-Bereich, der Schalter bleibt rechts. */
.mm-suchstreifen:not(.hat-auswahl) .mm-suchstreifen__chips,
.mm-suchstreifen:not(.hat-auswahl) .mm-suchstreifen__zuruecksetzen { display: none; }
.mm-suchstreifen__schalter { margin-left: auto; }
/* Die Reiter-Suche liegt im Fach auf einer weissen Karte, wie auf der Startseite. */
.mm-suchstreifen__fach-innen .hps { background: #fff; border-radius: 4px; padding: 20px 24px 24px; }
/* Leere Zeile der alten Auswahl und ausgeliehene Fahrzeugklappe */
.mm-leer, .mm-verliehen { display: none !important; }
@media (max-width: 980px) {
	/* Die Shop-Zeile ist unter 981px 95 % breit (gemessen bei 375 bis 980px). */
	.mm-suchstreifen__innen, .mm-suchstreifen__fach-innen { width: 95%; }
	.mm-suchstreifen__fach-innen .hps { padding: 16px 16px 20px; }
	.mm-ergebniskopf { align-items: flex-start !important; }
}

/* Handy-Menü: volle Breite für die Einträge (18.09.2026).
   Die Schublade ist 300px breit, die Divi-Hülle .et_pb_menu__wrap zog sich
   aber auf ihren Inhalt zusammen (190px). Trennlinien endeten dadurch mitten
   in der Schublade, und das Plus der Unterpunkte hing in langen Wörtern wie
   "Werkstattausrüstung". Rechts bleibt Platz für das Plus. */
.mobile-menu-row .et_pb_menu__wrap { flex: 1 1 auto; width: 100%; }
.mobile-menu-row .et_pb_menu__menu,
.mobile-menu-row .et-menu-nav,
.mobile-menu-row .et-menu { width: 100%; }
.mobile-menu-row .et-menu .menu-item-has-children > a { padding-right: 52px !important; }