/* Themify Customize Styling */
body {	background: none;
	background-color: #fafafa;
	font-family: "roboto";	font-weight:400;
	font-size:18px;
	line-height:1.4em;
 
}
:root {	
	--theme_accent: #0000ff;
	--theme_accent_semi: rgba(0,0,255,0.80);
	--theme_accent_hover: #ff0000; 
}
a, .post-nav .arrow {	
	color: #000000; 
}
body,h1,h2,h3,h4,h5,h6 {	
	color: #212121; 
}
.transparent-header #headerwrap a,.transparent-header #headerwrap.fixed-header a,#headerwrap a,#headerwrap.fixed-header a,#footerwrap a {	
	color: #212121; 
}
.transparent-header #headerwrap,.transparent-header #headerwrap.fixed-header,#headerwrap,#headerwrap.fixed-header,#footerwrap {	background: none;
	background-color: #ffffff;
	color: #000000; 
}
#content {	
	padding: 0em; 
}
h1 {	
	font-family: "montserrat";	font-weight:700;
	font-size:2rem;
 
}
h2 {	
	font-family: "montserrat";	font-weight:700;
	font-size:1.8rem;
 
}
h3 {	
	font-family: "montserrat";	font-weight:700;
	font-size:1.6rem;
 
}
h4 {	
	font-family: "montserrat";	font-weight:700;
	font-size:1.4rem;
 
}
h5 {	
	font-family: "montserrat";	font-weight:700;
 
}
h6 {	
	font-family: "montserrat";	font-weight:700;
 
}
#headerwrap {	
	border-bottom: 1px solid #ff0000; 
}
#headerwrap.fixed-header #site-logo a img {		width: 300px;
	height: 48px; 
}
body #site-logo a img {		width: 300px;
	height: 48px; 
}
#site-description {	display: none; 
}
#main-nav {	width: auto; 
}
#main-nav .current_page_item > a, #main-nav .current-menu-item > a {	background: none;
	background-color: #fafafa; 
}
#main-nav li > .sub-menu {	
	border: 1px solid #0000ff; 
}
.page-title {	
	padding-top: 1px;	font-size:2.5em;
	line-height:2em;
	text-align:center; 
}
#footerwrap {	
	border-top: 1px solid #0000ff; 
}
@media(max-width: 1024px) { /* Themify Customize Styling */
#headerwrap.fixed-header #site-logo a img {		width: 300px;
	height: 48px; 
}
body #site-logo a img {		width: 300px;
	height: 48px; 
}
 }@media(max-width: 768px) { /* Themify Customize Styling */
#headerwrap.fixed-header #site-logo a img {		width: 300px;
	height: 48px; 
}
body #site-logo a img {		width: 300px;
	height: 48px; 
}
 }@media(max-width: 600px) { /* Themify Customize Styling */
#headerwrap.fixed-header #site-logo a img {		width: 300px;
	height: 48px; 
}
body #site-logo a img {		width: 300px;
	height: 48px; 
}
 }
/* Themify Custom CSS */
:root{
  --theme_rounded: .5em !important;
  --theme_input_rounded: .5em !important;
  --theme_btn_rounded: .5em !important;
	--tb_rounded_corner: .5em !important;
}
#Startslider .module-slider, #carslide .module-slider{
	margin-bottom: 0 !important;
}
#Startslider .tf_carousel_nav_wrap, #carslide .tf_carousel_nav_wrap {
    margin-top: 0;
}

.dotfreelist li {
    list-style-type: none;
}
div[data-type="worker"] .ptb_module img {
    border-radius: 100%;
    height: auto;
    max-width: 100%;
}
.worker .ptb_items_wrapper.entry-content {
    padding: 0 1em;
    text-align: center;
}
.worker .ptb_items_wrapper.entry-content .gftop {
    padding: 0 5em;
    text-align: center;
}

.ptb_worker_jobtitel,.ptb_worker_e_mail{font-size:.8em}
#body{
	padding: 2em 0;
}
.cta_wrapper{
	display: none !important;
}
#body{padding:0;}
#main-nav li>.sub-menu {
    width: 250px;
}
.checklist {
  list-style: none;
  padding-left: 0;
}

.checklist li {
  position: relative;
  padding: 0;
	margin:0;
  padding-left: 1.8em;
}

.checklist li::before {
  content: "✅";
  position: absolute;
  left: 0;
}
.whiteRow{
	background-color: #fff;
}
.liste blockquote {
    border-left: 0;
    font-size: initial;
    line-height: initial;
	  margin-bottom:0;
    padding-top:0;
}
.liste blockquote ul li{
	padding:0;
	margin:0;
}
.leasingformular .forminator-repeater-label, .leasingformular .forminator-title{
    font-size:1.2em !important;
		line-height: 2em !important;
}
.leasingformular .forminator-repeater-description{
    font-size:.8em !important;
		line-height:1.2em !important;
}
.leasingformular .forminator-field-html p{
    font-size:.7em !important;
		line-height:1.2em !important;
}

/* ============================================================
   FAHRZEUGVORSTELLUNGEN (ts-veh-*)
   Begleit-CSS zu den Themify-Builder-Importen der Modellseiten.
   Setzt auf die Theme-Variablen auf (--theme_accent etc.).
   FIAT/Professional erben das rote Akzent; Abarth-Seiten mit
   Body-Klasse "veh-abarth" nutzen --theme_accent_alt (violett).
   ============================================================ */

.ts-veh-hero {
  --veh-accent: var(--theme_accent, #ed1e24);
  --veh-ink:    var(--theme_heading_color, #000);
}
.ts-veh--abarth.ts-veh-hero {
  --veh-accent: var(--theme_accent_alt, #7362e2);
}

/* ---- HERO (callout-Modul) ---- */
/* border-radius mit hoher Spezifität + !important erzwingen, da Themify
   dem Callout-Modul eine eigene (eckige) Regel gibt. */
.ts-veh-hero,
.module.module-callout.ts-veh-hero,
.ts-veh-hero.callout {
  background: var(--veh-accent, #ed1e24);
  color: #fff;
  border-radius: 1.25rem !important;
  padding: 3.2rem 2.6rem 2.8rem;
  position: relative;
  overflow: hidden;
}
/* Hero-Heading wirkt als Seiten-H1 (Größe/Gewicht).
   Der Builder rendert das Callout-Heading per title_tag direkt als <h1>. */
.ts-veh-hero .module_title,
.ts-veh-hero .callout-heading,
.ts-veh-hero h1,
.ts-veh-hero h2,
.ts-veh-hero h3 {
  font-size: clamp(2.3rem, 5.5vw, 3.6rem);
  font-weight: 800;
  line-height: 1.02;
  margin: 0 0 .8rem;
  color: #fff;
}
.ts-veh-hero p { color: rgba(255,255,255,.92); max-width: 48ch; font-size: 1.08rem; }
/* Button: echte Themify-Klasse ist .builder_button (+ .accent-color macht ihn
   sonst blau-auf-blau). Weißen Button mit Akzent-Schrift erzwingen. */
.ts-veh-hero .ui.button,
.ts-veh-hero .btn,
.ts-veh-hero a.button,
.ts-veh-hero .builder_button,
.ts-veh-hero a.builder_button,
.ts-veh-hero .builder_button.accent-color,
.ts-veh-hero a.ui.builder_button,
.ts-veh-hero .callout-button a {
  background: #fff !important;
  background-color: #fff !important;
  color: var(--veh-accent, #ed1e24) !important;
  border: none !important;
  border-radius: 1.875rem !important;
  font-weight: 700;
  padding: .7rem 1.6rem !important;
  margin-top: 1.6rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  transition: transform .15s ease, box-shadow .15s ease;
}
.ts-veh-hero .builder_button:hover,
.ts-veh-hero .callout-button a:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,.24);
}
.ts-veh-hero::after {
  content: ""; position: absolute; right: -60px; top: -60px;
  width: 240px; height: 240px;
  border: 2px solid rgba(255,255,255,.16); border-radius: 50%;
}

/* ---- Fließtext ---- */
.ts-veh-lede { font-size: 1.12rem; }
.ts-veh-lede strong { color: var(--theme_accent, #ed1e24); }
.ts-veh-block { color: var(--theme_heading_color, #1a1a1a); }

/* ---- H2 mit Akzentbalken (alle Abschnitts-Überschriften einheitlich) ---- */
/* h2 in text-Modulen mit ansprechen, damit Themify-Defaults nicht
   durchschlagen und alle Abschnitts-H2 gleich gewichtet sind.
   Oberer Abstand HIER setzen (gleiche Spezifität), sonst hebelt
   die margin-Kurzform den Abstand wieder aus. */
.ts-veh-h2,
.module-text h2.ts-veh-h2 {
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
  margin-top: 2.8rem !important;
  margin-bottom: 1.1rem !important;
  padding-left: 1rem;
  position: relative;
  color: var(--theme_heading_color, #1a1a1a) !important;
}
.ts-veh-h2::before {
  content: ""; position: absolute; left: 0; top: .2em;
  width: 5px; height: 1.05em;
  background: var(--theme_accent, #ed1e24);
  border-radius: 3px;
}

/* Abarth-Seiten: violetter Balken + Akzente (Body-Klasse "veh-abarth"). */
.veh-abarth .ts-veh-h2::before { background: var(--theme_accent_alt, #7362e2); }
.veh-abarth .ts-veh-lede strong,
.veh-abarth .ts-veh-card h3,
.veh-abarth .ts-veh-pc--con h3 { color: var(--theme_accent_alt, #7362e2); }
.veh-abarth .ts-veh-note { border-left-color: var(--theme_accent_alt, #7362e2); }

/* ---- Eckdaten-Grid (col6-1 ×6) ---- */
.ts-veh-spec {
  background: #fff;
  border: 1px solid var(--theme_input_border, rgba(0,0,0,.12));
  border-radius: 0.75rem;
  padding: 1.1rem 1rem;
  height: 100%;
  display: flex; flex-direction: column; gap: .35rem;
}
.ts-veh-spec__dt {
  font-size: .66rem; letter-spacing: .14em; text-transform: uppercase;
  color: #777; font-weight: 700;
}
.ts-veh-spec__dd {
  font-size: 1.4rem; font-weight: 700; line-height: 1.05;
  color: var(--theme_heading_color, #000);
}

/* ---- Tabellen (table-Modul) ----
   Die Themify-Tabelle rendert als .module-table .tb_table OHNE <thead>;
   die erste tr ist die Kopfzeile (Merkmal | Wert). Wir zielen daher auf
   die echten Themify-Klassen statt auf ts-veh-table. */
.module-table .tb_table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--theme_input_border, rgba(0,0,0,.12));
  border-radius: 0.75rem;
  overflow: hidden;
}
.module-table .tb_table td {
  padding: .8rem 1.1rem;
  border-bottom: 1px solid var(--theme_input_border, rgba(0,0,0,.10));
  font-size: .96rem;
  line-height: 1.45;
}
/* Erste Spalte = Merkmal (gedämpft), zweite = Wert (betont) */
.module-table .tb_table td:first-child { color: #555; width: 46%; }
.module-table .tb_table td:last-child  { font-weight: 600; color: var(--theme_heading_color,#1a1a1a); }

/* Kopfzeile (erste tr) deutlich als Header kennzeichnen */
.module-table .tb_table tr:first-child td {
  background: var(--theme_heading_color, #1a1a1a);
  color: #fff !important;
  font-weight: 700;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-bottom: none;
}
.module-table .tb_table tr:first-child td:first-child { color: #fff; }

/* Zebra-Streifen ab der ersten Datenzeile (= 3. tr, da nth-child mit Header zählt) */
.module-table .tb_table tr:nth-child(even) td { background: rgba(0,0,0,.035); }
/* letzte Zeile ohne Trennlinie */
.module-table .tb_table tr:last-child td { border-bottom: none; }
/* Abstand der Tabellen-Module nach unten */
.module-table { margin-bottom: 2.4rem; }

/* ---- Varianten-Karten (nested col4-2) ---- */
.ts-veh-card {
  border: 1px solid var(--theme_input_border, rgba(0,0,0,.12));
  border-radius: 1rem;
  padding: 1.5rem 1.6rem;
  background: #fff;
  height: 100%;
}
.ts-veh-card h3 { font-size: 1.2rem; margin: 0 0 .4rem; color: var(--theme_accent, #ed1e24); }
.ts-veh-card p  { margin: 0; font-size: .94rem; color: #555; }

/* ---- Pro / Contra ---- */
.ts-veh-pc {
  border: 1px solid var(--theme_input_border, rgba(0,0,0,.12));
  border-radius: 1rem;
  padding: 1.5rem 1.6rem;
  background: #fff; height: 100%;
}
.ts-veh-pc h3 { margin: 0 0 .3rem; font-size: 1.05rem; }
.ts-veh-pc ul { margin: .4rem 0 0; padding-left: 1.1rem; }
.ts-veh-pc li { margin-bottom: .45rem; font-size: .95rem; }
.ts-veh-pc--pro h3 { color: #2F7A4D; }
.ts-veh-pc--con h3 { color: var(--theme_accent, #ed1e24); }

/* ---- Hinweisbox ---- */
.ts-veh-note {
  background: rgba(0,0,0,.04);
  border-left: 4px solid var(--theme_accent, #ed1e24);
  border-radius: 0 0.75rem 0.75rem 0;
  padding: 1.2rem 1.4rem;
  font-size: .88rem; color: #666;
  margin-top: 2.4rem;
}

/* ---- Luftigere Abstände zwischen den Bereichen ----
   Robust am Themify-Modul-Wrapper ansetzen: jedes module-text, das eine
   Abschnitts-H2 enthält, bekommt oben Luft. So bleibt der Abstand auch
   erhalten, falls der margin an der H2 selbst vom Theme genullt wird. */
.ts-veh-hero { margin-bottom: 2.4rem; }
.ts-veh-lede { margin-bottom: 1.4rem !important; line-height: 1.7; }
.ts-veh-spec { margin: .2rem 0; }
/* Abschluss-/Hinweissätze (z. B. unter den Varianten-Karten) absetzen */
.ts-veh-block { margin-top: 1.4rem; line-height: 1.6; }

/* Row, die eine Abschnitts-Überschrift enthält, oben absetzen */
.module-text:has(.ts-veh-h2) { margin-top: 2.6rem; }
/* Fallback für Browser ohne :has() – H2 selbst bekommt ebenfalls Abstand */
.ts-veh-h2 { margin-top: 2.8rem !important; }

/* Abschluss-/Fließtext (.ts-veh-block) steht stets NACH Karten/Tabellen
   -> oberen Abstand geben, damit er nicht an den Karten klebt */
.module-text:has(.ts-veh-block) { margin-top: 1.4rem; }
.ts-veh-block { margin-top: 1.2rem; }

/* Varianten-/Pro-Contra-Karten-Subrow vom Vortext absetzen */
.module_subrow:has(.ts-veh-card),
.module_subrow:has(.ts-veh-pc) { margin-top: 1rem; margin-bottom: .4rem; }

/* Etwas Luft unter dem Eckdaten-Grid vor der ersten Überschrift */
.row_inner.tb_col_count_6 { margin-bottom: 1.4rem; }

/* ---- Mobile ---- */
@media (max-width: 680px) {
  .ts-veh-hero { padding: 2.2rem 1.5rem; }
  .ts-veh-spec__dd { font-size: 1.2rem; }
}
