@charset "utf-8";
/*
 Theme Name:   Dentario Child
 Theme URI:    http://dentario.themerex.net/
 Description:  Dentario - Fully Responsive and Mobile Friendly theme
 Author:       ThemeRex
 Author URI:   http://themerex.net
 Template:     dentario
 Version:      1.0
 Tags:         light, inheritable theme-options
 Text Domain:  themerex
*/


@import url("../dentario/style.css");



/* =Theme customization starts here
-------------------------------------------------------------- */
.top_panel_top_user_area {
    display: none;
}
.vc_btn3.vc_btn3-color-grey, .vc_btn3.vc_btn3-color-grey.vc_btn3-style-flat  {
	background-color: #8A1B35 !important;
	color: #fff !important;
	border-radius: 80px;
}
.teambtn {
	min-height: 72px !important;
}
.teambtn a {
	padding-top: 0 !important;
	padding-bottom: 25px !important;
}
.scheme_original strong a {
	color: #ffffff;
}
form.wpcf7-form textarea[name="your-message"] {
	min-height: 250px;
}
form.wpcf7-form textarea,
form.wpcf7-form input,
form.wpcf7-form input[name="your-name"],
form.wpcf7-form input[name="your-email"],
form.wpcf7-form input[name="your-message"],
form.wpcf7-form input[name="your-subject"] {
	padding: 0.8em;
}
.member-details-position {
	font-size: 24px;
}
.member-details-name {
	margin: -5px 0 0 0;
	padding: 0;
	font-size: 35px;
}
.single-team-spacer {
	height: 100px;
}
div.vc_images_carousel a.vc_carousel-control {
	top: 0;
	height: 60px;
	width: 60px;
	border-radius: 50%;
	background-color: #8A1B35;
	opacity: 1;
}
div.vc_images_carousel a.vc_carousel-control:hover {
	background-color: #646363;
}
div.vc_images_carousel a.vc_carousel-control.vc_right {
	left: calc(50% + 50px);
}
div.vc_images_carousel a.vc_carousel-control.vc_left {
	left: calc(50% - 110px);
}
.vc_images_carousel .vc_carousel-inner {
	padding-top: 100px;
}
div.vc_images_carousel a.vc_carousel-control .icon-next:before {
	content: '\e901';
	top: 0;
	line-height: 30px;
	left: 2px;
	color: #ffffff;
}
div.vc_images_carousel a.vc_carousel-control .icon-prev:before {
	content: '\e8ff';
	top: 0;
	line-height: 30px;
	right: 2px;
	color: #ffffff;
}
@media only screen and (max-width: 415px) {
	div.vc_images_carousel a.vc_carousel-control .icon-prev:before {
		line-height: 25px;
		right: 6px;
	}
	div.vc_images_carousel a.vc_carousel-control .icon-next:before {
		line-height: 25px;
		left: 0;
	}
}
.vc_carousel-inner .vc_item .vc_inner a {
	 text-align: center;
	 margin: 0 auto;
}
.vc_carousel-inner .vc_item .vc_inner a img {
	border: 1px solid  #324353;
	box-shadow: 0 0 0 10px rgba(50,67,83,0);
	border-radius: 50%;
}
.vc_carousel-inner .vc_item .vc_inner a img:hover {
	animation: pulse_zmt 1s infinite;
}
.vc_images_carousel.vc_per-view-more .vc_carousel-slideline .vc_carousel-slideline-inner>.vc_item>.vc_inner {
	min-height: 275px;
	vertical-align: middle;
	padding: 25px;
}
.scheme_original a.sc_button.sc_button_style_filled:hover {
	background-color: #324353;
}
@keyframes pulse_zmt {
	0% {
		box-shadow: 0 0 0 #646363;
	}
	100% {
		box-shadow: 0 0 1.5em #646363;
	}
}
.slider-title {
	font-size: 60px;
	font-weight: 700;
	margin-bottom: 25px;
	display: block;
	line-height: 1;
	text-shadow: 3px 3px 0px #6515275e;
}
.slider-text {
	font-size: 24px;
	line-height: 30px;
	text-shadow: 2px 2px 0px #6515275e;
}
.vc_is-hover {
	box-shadow: 0 0 1em #646363;
}
.vc_is-hover .vc_gitem-zone {
	transform: scale(1.01);
	transition-duration: 500ms;
}
.scheme_original .header_mobile .side_wrap div.contact_phone .contact_phone a {
	color: #ffffff;
}
.header_mobile div.menu_button:hover {
	color: #8A1B35 !important;
}
.slicknav-flex {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: 1000;
}
.slicknav_nav li, .slicknav_nav ul {
	display: block;
	border-bottom: 1px solid white;
}

.slicknav_btn {
	transform: rotate(-90deg);
	transform-origin: right;
	border: 1px solid black;
	border-radius: 15px;
	position: relative;
	display: block;
	vertical-align: middle;
	float: right;
	padding: 0.5em 1.4em;
	line-height: 1.125em;
}

.slicknav_menu {
	position: fixed;
	top: 100px !important;
	right: -100%;
	width: 300px;
	height: 100%;
	background-color: rgb(144,27,53);
	transition: right 0.3s;
	z-index: 9999;
	opacity: 0.9;
}
.slicknav_menu .slicknav_icon {
	height: 2.5em;
}

.slicknav_open {
	right: 0;
}

.menu-unsere-leistungen-container{
	top: 50px;
	position: relative;
}

.page_content_wrap {
	padding: 50px 0 0 0;
}

.vc_grid-filter.vc_grid-filter-color-green>.vc_grid-filter-item.vc_active, .vc_grid-filter.vc_grid-filter-color-green>.vc_grid-filter-item:hover {
	background-color: #901B35 !important;
}
.scheme_original h4 {
	color: white !important;
}
div.vc_custom_1419328663991 {
	background-color: #901B35 !important;
	color: white !important;
}

.member-details-name, .member-details-position {
	background-color: #901B35;
	color: white !important;
	padding: 5px 10px;
	margin: auto;
}

.scheme_original .scroll_to_top, .scheme_original .scroll_to_top:hover {
	opacity: 0;
}

.top_panel_top_open_hours.icon-calendar-light {
	float: right;
}

.top_panel_top_contact_area.icon-mobile-light {
	margin-left: 27em;
}

.vc_row .noTopPadding {
	padding: 0px;
}

/*
@media screen and (min-width: 1024px) and (max-width: 1199px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}@media screen and (min-width: 991px) and (max-width: 1023px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}@media screen and (min-width: 768px) and (max-width: 990px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}
@media screen and (min-width: 640px) and (max-width: 767px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}
@media screen and (min-width: 480px) and (max-width: 639px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}

@media (max-width: 479px){
	.vc_images_carousel .vc_carousel-inner .vc_carousel-slideline .vc_carousel-slideline-inner {
		left: 55px !important;
		position: relative;
		width: 91% !important;
	}
}
*/

/* ============================================================
   Sidora AG - Anpassungen 02.09.2026
   Hinweis: dentario-child/style.css wird VOR less/skin.css geladen.
   Die Selektoren sind deshalb bewusst spezifischer als die
   Theme-Regeln, damit sie ohne !important greifen.
   ============================================================ */

:root {
	--zmt-link-hover:   #6e1428; /* dunkles Bordeaux, Kontrast 10.8:1 auf #f6f6f6 */
	--zmt-link-abstand: 0.35em;
}

/* Footer-Widgets: Das Skin setzt fuer jedes Schema
   a:hover { color: #f6f6f6 }. Der Footer traegt zwar die Klasse
   scheme_dark, hat aber den hellen Hintergrund #f6f6f6 - die Links
   waren beim Hover also unsichtbar (Kontrastverhaeltnis 1:1). */
footer.footer_wrap .widget .textwidget a:hover,
footer.footer_wrap .widget_text .textwidget a:hover {
	/* !important ist hier noetig: Das generierte Theme-CSS (less/skin.css)
	   setzt die Farbe mit dem Selektor
	   .scheme_dark .footer_wrap_inner.widget_area_inner .widget_text a:not(.sc_button):hover
	   und damit der Spezifitaet (0,7,1). Ein noch laengerer Selektor waere
	   ein Wettruesten gegen generiertes Fremd-CSS und wuerde beim naechsten
	   Theme-Update brechen. */
	color: var(--zmt-link-hover) !important;
	text-decoration: underline;
}

/* "Datenschutzerklaerung" und "Impressum" stehen je in einem eigenen
   <p>; Abstand zwischen den Link-Zeilen verringern. */
footer.footer_wrap .widget_text .textwidget p:has(> a) {
	margin-bottom: var(--zmt-link-abstand);
}

/* Impressum: Im Elementor-Icon-List-Block stehen Telefon, E-Mail und
   Webadresse je in einem eigenen <p> mit rund 20px margin-bottom,
   waehrend die Adresse darueber per <br> umbrochen ist. Dadurch klaffen
   die Kontaktzeilen auseinander - hier an die Adresszeilen angleichen. */
.elementor-widget-icon-list .elementor-widget-container p {
	margin-bottom: 0;
}


/* ============================================================
   Leistungsuebersicht und globale Link-Sichtbarkeit
   Sidora AG, 02.09.2026
   Hinweis zur Spezifitaet: dentario-child/style.css wird VOR
   less/skin.css geladen. Eigene Klassen werden deshalb ueber den
   Container mitadressiert (.zmt-cards .zmt-card h3), damit sie
   Theme-Regeln gleicher Spezifitaet nicht unterliegen.
   ============================================================ */

:root {
	--zmt-akzent:       #901b35; /* Bordeaux, Grundfarbe des Auftritts */
	--zmt-akzent-dunkel:#6e1428;
	--zmt-linie:        #e2dcde;
	--zmt-text-leise:   #4a4a4a;
	--zmt-flaeche:      #faf7f8;
	--zmt-hover:        #6e1428; /* Hover-Farbe auf hellem Grund, s. unten */
}

/* ---------- Globale Link-Sichtbarkeit beim Hover ----------
   Das Theme setzt a:hover in jedem Farbschema auf #f6f6f6. Das passt
   nur auf dunklem Grund. Saemtliche Inhaltsflaechen dieser Website sind
   hell, dort werden Links beim Hover unsichtbar (Kontrast 1:1).
   Einzige Ausnahme ist der Copyright-Streifen mit Bordeaux-Hintergrund,
   der bleibt unangetastet.
   !important ist noetig, weil skin.css generierte Selektoren bis zur
   Spezifitaet (0,7,1) verwendet und spaeter geladen wird. */
.page_content_wrap a:not(.sc_button):not(.zmt-card):not(.zmt-btn):not([class*="vc_btn"]):not([class*="sc_button"]):hover,
.sidebar a:not(.sc_button):hover,
.top_panel_wrap a:not(.sc_button):not([class*="sc_button"]):hover {
	color: var(--zmt-hover) !important;
}

/* Kontextabhaengige Hover-Farbe statt gestapelter Ausnahmen:
   Auf hellem Grund (Normalfall) das dunkle Bordeaux. In Sektionen und
   Zeilen mit farbiger Fuellung sowie auf den Karussell-Pfeilen ist der
   Grund selbst Bordeaux, dort bleibt die helle Farbe des Themes richtig.
   Die Variable wird vererbt, die Regel oben bleibt dadurch eine einzige. */
[class*="-has-fill"],
[class*="-has-fill"] *,
.vc_carousel-control,
.vc_carousel-control * {
	--zmt-hover: #f6f6f6;
}

/* ---------- Karten ---------- */
.zmt-lead {
	font-size: 1.06em;
	line-height: 1.7;
}

.zmt-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(225px, 1fr));
	gap: 1.25rem;
	margin: 1.5rem 0 2.75rem;
}

.zmt-cards .zmt-card {
	position: relative; /* Bezug fuer das Klick-Overlay des Titel-Links */
	display: block;
	padding: 1.35rem 1.45rem 1.5rem;
	background: #fff;
	border: 1px solid var(--zmt-linie);
	border-top: 3px solid var(--zmt-akzent);
	transition: border-color .18s ease, transform .18s ease;
}

.zmt-cards .zmt-card h3 {
	margin: 0 0 .55rem;
	font-size: 1.1rem;
	line-height: 1.35;
}

.zmt-cards .zmt-card h3 a {
	color: var(--zmt-akzent);
	text-decoration: none;
}

/* Die ganze Karte klickbar machen, ohne den Linktext aufzublaehen:
   ein unsichtbares Overlay des Titel-Links deckt die Karte ab.
   Screenreader lesen weiterhin nur den Titel als Linktext vor. */
.zmt-cards .zmt-card h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.zmt-cards .zmt-card p {
	margin: 0;
	font-size: .93rem;
	line-height: 1.6;
	color: var(--zmt-text-leise);
}

.zmt-cards .zmt-card:hover,
.zmt-cards .zmt-card:focus-within {
	border-color: var(--zmt-akzent);
	transform: translateY(-2px);
}

.zmt-cards .zmt-card:hover h3 a {
	color: var(--zmt-akzent-dunkel);
}

/* Tastaturfokus muss sichtbar bleiben (Frontend-Standard) */
.zmt-cards .zmt-card:focus-within {
	outline: 2px solid var(--zmt-akzent);
	outline-offset: 3px;
}

/* ---------- Terminblock am Seitenende ---------- */
.zmt-cta {
	margin: 1.25rem 0 0;
	padding: 1.5rem 1.7rem;
	background: var(--zmt-flaeche);
	border-left: 3px solid var(--zmt-akzent);
}

.zmt-cta .zmt-cta__text {
	margin: 0 0 1.1rem;
	color: var(--zmt-text-leise);
}

.zmt-cta .zmt-cta__aktionen {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .7rem;
}

.zmt-cta .zmt-btn {
	display: inline-block;
	padding: .7rem 1.4rem;
	background: var(--zmt-akzent);
	color: #fff;
	text-decoration: none;
	transition: background-color .18s ease;
}

.zmt-cta .zmt-btn:hover,
.zmt-cta .zmt-btn:focus-visible {
	background: var(--zmt-akzent-dunkel);
	color: #fff;
}

.zmt-cta .zmt-btn--zweit {
	background: transparent;
	color: var(--zmt-akzent);
	border: 1px solid var(--zmt-akzent);
}

.zmt-cta .zmt-btn--zweit:hover,
.zmt-cta .zmt-btn--zweit:focus-visible {
	background: var(--zmt-akzent);
	color: #fff;
}

.zmt-cta .zmt-btn:focus-visible {
	outline: 2px solid var(--zmt-akzent-dunkel);
	outline-offset: 2px;
}

/* ---------- Leistungsnavigation in der rechten Spalte ---------- */
.sidebar .widget_nav_menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sidebar .widget_nav_menu li {
	/* Masse des Eintrags als Variablen, damit der Pfeil unten daraus
	   berechnet werden kann und keine Magic Numbers noetig sind. */
	--zmt-nav-abstand: .62rem; /* Innenabstand des Links oben und unten */
	--zmt-nav-zeile:   1.33rem; /* Zeilenhoehe des Linktextes */
	margin: 0;
	border-bottom: 1px solid var(--zmt-linie);
}

/* Der Pfeil ist ein absolut positioniertes li:before des Themes mit
   top: 0 und sitzt dadurch am oberen Rand statt neben dem Text.
   Er wird an der Mitte der ersten Textzeile ausgerichtet: Innenabstand
   des Links plus halbe Zeilenhoehe. Das ist unabhaengig davon, welches
   padding-bottom das Theme dem li sonst noch mitgibt. */
.sidebar .widget_nav_menu li:before {
	top: calc(var(--zmt-nav-abstand) + var(--zmt-nav-zeile) / 2);
	transform: translateY(-50%);
}

.sidebar .widget_nav_menu li:last-child {
	border-bottom: 0;
}

.sidebar .widget_nav_menu li a {
	display: block;
	padding: var(--zmt-nav-abstand) .2rem;
	font-size: .95rem;
	line-height: var(--zmt-nav-zeile);
	transition: padding-left .16s ease;
}

.sidebar .widget_nav_menu li a:hover {
	padding-left: .55rem;
}

.sidebar .widget_nav_menu li.current-menu-item a {
	color: var(--zmt-akzent-dunkel);
	font-weight: 600;
}

/* ---------- Bewegung nur, wenn erwuenscht ---------- */
@media (prefers-reduced-motion: reduce) {
	.zmt-cards .zmt-card,
	.sidebar .widget_nav_menu li a,
	.zmt-cta .zmt-btn {
		transition: none;
	}
	.zmt-cards .zmt-card:hover,
	.zmt-cards .zmt-card:focus-within {
		transform: none;
	}
	.sidebar .widget_nav_menu li a:hover {
		padding-left: .2rem;
	}
}

/* ---------- Schmale Bildschirme ---------- */
@media (max-width: 479px) {
	.zmt-cards {
		grid-template-columns: 1fr;
		gap: 1rem;
	}
	.zmt-cta {
		padding: 1.25rem 1.2rem;
	}
	.zmt-cta .zmt-btn {
		width: 100%;
		text-align: center;
	}
}