/*
 * dk-autotechnik.at – Template dkat
 * Optik wie das fruehere Template "servicestation" (Werte aus dessen style.css/bootstrap.css),
 * mobile first. Breakpoints: 576 / 768 / 992 (Desktop-Menue) / 1200 px.
 */

/* ---------- Schriften (lokal) ---------- */
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap; src: url(../fonts/opensans-latin.woff2) format("woff2"); }
@font-face { font-family: "PT Sans Narrow"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/ptsansnarrow-400-latin.woff2) format("woff2"); }
@font-face { font-family: "PT Sans Narrow"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/ptsansnarrow-700-latin.woff2) format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/roboto-300-latin.woff2) format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/roboto-500-latin.woff2) format("woff2"); }

:root {
	--accent: #2cb5d5;
	--accent-dark: #1f8ca6;
	--text: #333;
	--muted: #999;
	--black: #000;
	--line: #eaeaea;
	--narrow: "PT Sans Narrow", "Arial Narrow", Arial, sans-serif;
	--sans: "Open Sans", Arial, Helvetica, sans-serif;
	--head: 56px;
}

/* ---------- Basis ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--head) + 10px); }
body { display: flex; flex-direction: column; min-height: 100vh; margin: 0; background: #fff; color: var(--text); font: 15px/1.6 var(--sans); overflow-wrap: break-word; }
img, video, iframe, embed, object { max-width: 100%; }
img { height: auto; border: 0; vertical-align: middle; }
a { color: var(--muted); text-decoration: none; transition: color .3s; }
a:hover, a:focus-visible { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
p { margin: 0 0 10px; }
strong, b { font-weight: 700; }
ul, ol { margin: 0 0 10px; padding-left: 25px; }
hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; }
table { border-collapse: collapse; }
h1, h2, h3, h4, h5, h6 { margin: 20px 0 10px; color: var(--text); line-height: 1.1; hyphens: auto; }
h1 { font: 500 clamp(26px, 6.5vw, 36px)/1.1 Roboto, Arial, sans-serif; }
h2, h3, h4, h5, h6 { font-family: var(--narrow); font-weight: 400; }
h2 { font-size: clamp(24px, 5.5vw, 30px); }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
h5 { font-size: 15px; }
h6 { font-size: 13px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 8px; top: -60px; z-index: 1000; padding: 10px 16px; background: #fff; color: #000; }
.skip-link:focus { top: 8px; }
.icon { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: -.125em; }
.container { width: 100%; max-width: 1170px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) { .container { padding: 0 22px; } }
@media (min-width: 1200px) {
	.container { padding: 0 15px; }
}
@media (min-width: 992px) {
	body { font-size: 14px; line-height: 1.5; }
}

/* ---------- Topbar ---------- */
.topbar { background: var(--black); font-size: 14px; }
@media (min-width: 992px) { .topbar { font-size: 13px; } }
.topbar .container { display: flex; justify-content: flex-end; align-items: center; gap: 8px; min-height: 38px; }
.topbar a { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; color: var(--muted); }
.topbar a:hover { color: #fff; }
.topbar .icon { width: 12px; height: 12px; }
.topbar-whatsapp img { width: auto; height: 18px; }
@media (min-width: 992px) { .topbar-whatsapp img { height: 15px; } }

/* ---------- Kopfzeile ---------- */
.site-header { position: sticky; top: 0; z-index: 100; background: var(--black); border-top: 1px solid #212121; }
.site-header .container { display: flex; align-items: center; justify-content: space-between; min-height: var(--head); }
.logo { display: block; padding: 6px 0; }
.logo img { display: block; width: 128px; height: auto; }
.nav-toggle, .nav-close { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-right: -10px; padding: 0; border: 0; background: none; color: #fff; font-size: 24px; cursor: pointer; }
.nav-toggle:hover, .nav-close:hover { color: var(--accent); }
/* Mobil: Anrufen bleibt im Sticky-Header erreichbar, wenn die Topbar weggescrollt ist */
.header-call { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-left: auto; color: #fff; font-size: 20px; }
.header-call:hover { color: var(--accent); }
@media (min-width: 992px) { .header-call { display: none; } }

/* Mobil: Menue als Seitenpanel von rechts */
.site-nav { position: fixed; top: 0; right: 0; bottom: 0; z-index: 210; display: flex; flex-direction: column; width: min(320px, 88vw); overflow-y: auto; background: #111; transform: translateX(100%); visibility: hidden; transition: transform .3s, visibility 0s .3s; }
.site-nav.is-open { transform: none; visibility: visible; transition: transform .3s; }
.nav-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 16px 4px 20px; border-bottom: 1px solid #222; }
.nav-title { color: #fff; font: 700 18px var(--narrow); text-transform: uppercase; letter-spacing: 1px; }
.nav-overlay { position: fixed; inset: 0; z-index: 200; background: rgba(0, 0, 0, .6); }
body.nav-open { overflow: hidden; }
/* der Header bildet (sticky) einen eigenen Stapelkontext: bei offenem Menue ueber das Overlay heben */
body.nav-open .site-header { z-index: 300; }
.site-nav .menu { margin: 0; padding: 0; list-style: none; }
.site-nav .menu li { position: relative; border-bottom: 1px solid #222; }
.site-nav .menu a { display: block; padding: 13px 56px 13px 20px; color: #fff; font: 17px var(--narrow); text-transform: uppercase; letter-spacing: .5px; }
.site-nav .menu .active > a, .site-nav .menu a:hover { color: var(--accent); }
.site-nav .sub-toggle { position: absolute; top: 0; right: 0; width: 52px; height: 49px; border: 0; border-left: 1px solid #222; background: none; color: #fff; cursor: pointer; }
.site-nav .sub-toggle .icon { width: 14px; height: 14px; transition: transform .2s; }
.site-nav .sub-toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
.site-nav .sub { display: none; margin: 0; padding: 0; list-style: none; background: #1a1a1a; }
.site-nav .sub.is-open { display: block; }
.site-nav .sub li { border-bottom: 0; border-top: 1px solid #222; }
.site-nav .sub a { padding-left: 34px; font-size: 16px; text-transform: none; }
.nav-contact { margin: auto 0 0; padding: 16px 20px 24px; list-style: none; }
.nav-contact a { display: flex; align-items: center; gap: 10px; min-height: 44px; color: #ccc; font-size: 15px; }
.nav-contact .icon { width: 18px; height: 18px; color: var(--accent); }

@media (min-width: 992px) {
	:root { --head: 64px; }
	.logo img { width: 171px; }
	.nav-toggle, .nav-head, .nav-contact, .nav-overlay { display: none !important; }
	.site-nav { position: static; display: block; width: auto; overflow: visible; background: none; transform: none; visibility: visible; transition: none; }
	.site-nav .menu { display: flex; margin-top: 10px; }
	.site-nav .menu > li { border: 0; margin: 0 10px; }
	.site-nav .menu > li > a { padding: 10px 15px 18px; border-bottom: 2px solid transparent; font-size: 14px; letter-spacing: 0; transition: color .3s; }
	.site-nav .menu > li.active > a { color: var(--accent); border-bottom-color: var(--accent); }
	.site-nav .menu > li > a:hover { color: var(--accent); border-bottom-color: transparent; }
	.site-nav .menu > li.has-sub > a { padding-right: 22px; }
	.site-nav .menu > li > .sub-toggle { top: 13px; right: 2px; width: 18px; height: 18px; border: 0; color: inherit; }
	.site-nav .menu > li > .sub-toggle .icon { width: 9px; height: 9px; vertical-align: top; }
	.site-nav .menu > li.has-sub:hover > .sub-toggle, .site-nav .menu > li.active > .sub-toggle { color: var(--accent); }
	.site-nav .sub { position: absolute; top: 100%; left: 9px; z-index: 110; display: block; min-width: 190px; background: var(--black); border-top: 2px solid var(--accent); border-left: 1px solid #d5d5d5; box-shadow: 0 2px 3px rgba(0, 0, 0, .12); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .25s, transform .25s, visibility 0s .25s; }
	.site-nav li:hover > .sub, .site-nav li:focus-within > .sub, .site-nav .sub.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .25s; }
	.site-nav .sub li { border-top: 1px solid var(--line); }
	.site-nav .sub li:first-child { border-top: 0; }
	.site-nav .sub a { padding: 8px 12px; font: 14px var(--narrow); text-transform: none; white-space: nowrap; }
	.site-nav .sub .active > a { color: var(--accent); }
}

/* ---------- Slider ---------- */
.dk-slider { position: relative; overflow: hidden; height: clamp(260px, 72vw, 340px); max-height: 768px; background: #111; touch-action: pan-y; }
.dk-slider .slide { position: absolute; inset: 0; visibility: hidden; transform: translateX(100%); transition: transform .5s ease, visibility 0s .5s; }
.dk-slider .slide.is-active { visibility: visible; transform: none; transition: transform .5s ease; }
.dk-slider .slide.is-prev { transform: translateX(-100%); }
.dk-slider .slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dk-slider .caption { position: absolute; left: 0; right: 0; bottom: 14px; padding: 8px 16px 10px; background: rgba(0, 0, 0, .5); color: #fff; text-align: center; }
.dk-slider .caption p { margin: 0; color: #fff; }
.dk-slider .caption-title { font: 400 26px/1.1 var(--narrow); text-transform: uppercase; }
.dk-slider .caption-text { margin-top: 2px !important; font-size: 14px; line-height: 1.3; }
.dk-slider .is-active .caption-title, .dk-slider .is-active .caption-text { animation: dk-zoom .6s ease both; }
.dk-slider .is-active .caption-text { animation-delay: .15s; }
@keyframes dk-zoom { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
.dk-slider .arrow { position: absolute; top: 50%; z-index: 3; display: none; width: 44px; height: 44px; margin-top: -22px; padding: 0; border: 0; background: rgba(0, 0, 0, .45); color: #fff; font-size: 26px; cursor: pointer; opacity: 0; transition: opacity .3s, background .3s; }
.dk-slider .arrow:hover { background: var(--accent); }
.dk-slider .arrow.prev { left: 10px; }
.dk-slider .arrow.next { right: 10px; }
.dk-slider:hover .arrow, .dk-slider .arrow:focus-visible { opacity: 1; }
@media (hover: hover) { .dk-slider .arrow { display: block; } }
.slider-dots { display: flex; justify-content: center; gap: 0; padding: 0; }
.slider-dots button { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 0; background: none; cursor: pointer; }
.slider-dots button::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: #333; transition: background .3s; }
.slider-dots button[aria-current="true"]::before, .slider-dots button:hover::before { background: var(--accent); }
@media (min-width: 600px) {
	.dk-slider { height: max(260px, 40vw); }
	.dk-slider .caption { bottom: 36%; padding: 10px 20px 14px; transform: translateY(50%); }
	.dk-slider .caption-title { font-size: clamp(36px, 5vw, 70px); }
	.dk-slider .caption-text { font-size: clamp(18px, 2.2vw, 30px); }
}

/* ---------- Inhalt ---------- */
.site-main a { color: #767676; }
.site-main a:hover, .site-main a:focus-visible { color: var(--accent-dark); }
.site-main { flex: 1 0 auto; padding-bottom: 20px; }
.site-main:focus { outline: 0; }
.item-page > :first-child, .item-page .intro > h1:first-child { margin-top: 20px; }
.page-header { display: none; }
.item-page ul li { margin-bottom: 0; }
.item-page .container { max-width: none; padding: 0; }
.row::after, .clearfix::after { content: ""; display: table; clear: both; }
.row { margin: 0; }
.hidden { display: none !important; }
.item-page img { margin: 0; }
a.lightbox { display: inline-block; }
a.lightbox img { max-width: 100%; margin: 0 0 10px; }
@media (min-width: 600px) { a.lightbox img { max-width: min(250px, 100%); margin-right: 20px; } }
figure.team { margin: 0; }
.col-md-6 { margin-bottom: 15px; }
@media (min-width: 768px) {
	.item-page .row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
	.item-page .row > .row { margin: 0; flex: 1 1 100%; }
	.col-md-6 { flex: 0 0 50%; max-width: 50%; padding: 0 15px; }
	.col.small-6 { flex: 0 0 50%; max-width: 50%; padding: 0 15px; }
	.col.small-12 { flex: 0 0 100%; padding: 0 15px; }
	.col.medium-6 { flex: 0 0 100%; padding: 0 15px 0 40px; }
}
.col.medium-6 { padding-left: 25px; }
.floatList { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 14px; margin: 0 0 15px; }
.floatList dd + dt { margin-top: 6px; }
@media (min-width: 480px) { .floatList { grid-template-columns: max-content minmax(0, 1fr); gap: 2px 14px; } .floatList dd + dt { margin-top: 0; } }
.floatList dt { font-weight: 700; }
.floatList dd { margin: 0; }

/* Google Maps und Routenplaner (Anfahrt) */
.googleMaps, #googlemaps-address iframe { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; max-height: 420px; border: 1px solid #ccc; }
@media (min-width: 768px) { .googleMaps, #googlemaps-address iframe { width: 600px; aspect-ratio: 3 / 2; } }
form.default fieldset { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0; padding: 0; border: 0; }
form.default label { font-weight: 700; font-size: 16px; }
form.default input[type="text"] { flex: 1 1 220px; max-width: 360px; min-height: 44px; padding: 8px 10px; border: 1px solid #ccc; font: 16px var(--sans); }
form.default button, .btn-primary, .dk-contact button[type="submit"] { min-height: 44px; padding: 8px 22px; border: 0; background: var(--accent-dark); color: #fff; font: 700 15px var(--sans); cursor: pointer; transition: background .3s; }
form.default button:hover, .btn-primary:hover, .dk-contact button[type="submit"]:hover { background: #156a7e; }

/* ---------- Startseite: Abschnitte ---------- */
.section-title { margin: 50px 0 30px; font: 400 clamp(28px, 7vw, 45px)/1.1 var(--narrow); text-transform: uppercase; text-align: center; }
.section .row { display: grid; grid-template-columns: 1fr; gap: 30px; }
.section .sixteen { display: grid; grid-template-columns: 1fr; gap: 34px; }
.section .sixteen > br { display: none; }
@media (min-width: 480px) { .section .sixteen { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .section .sixteen { grid-template-columns: repeat(4, 1fr); } }
.section_featured_texts { text-align: center; }
.section_featured_texts h4 { margin: 0 0 5px; font-size: 20px; text-transform: uppercase; }
.section_featured_texts p { margin: 0; }
.section_featured_texts .line { display: block; width: 75px; height: 3px; margin: 5px auto 10px; background: var(--accent); }
.icon_bgr { display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; margin: 0 auto 28px; border: 1px solid #252525; border-radius: 50%; background: #252525; color: #fff; transition: background .3s, color .3s; }
.icon_bgr:hover { background: #fff; color: #252525; }
.icon_bgr .fa-3x { font-size: 49px; }
.js .section_featured_texts { opacity: 0; transform: scale(0); transition: opacity .5s, transform .5s; }
.js .section_featured_texts.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.js .section_featured_texts { opacity: 1; transform: none; transition: none; }
	.dk-slider .slide, .dk-slider .is-active .caption-title, .dk-slider .is-active .caption-text { transition: none; animation: none; }
}

/* Unsere Projekte */
.projects { display: grid; grid-template-columns: 1fr; gap: 2px; max-width: 760px; margin: 0 auto; }
@media (min-width: 576px) { .projects { grid-template-columns: 1fr 1fr; } }
.projects a { position: relative; display: block; overflow: hidden; aspect-ratio: 3 / 2; background: #000; }
.projects img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s, opacity .5s; }
.projects .project-title { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: rgba(0, 0, 0, .55); color: #fff; font: 300 21px Roboto, Arial, sans-serif; text-transform: uppercase; opacity: 0; transition: opacity .5s; }
.projects .project-title .fa { font-size: 26px; }
.projects a:hover .project-title, .projects a:focus-visible .project-title { opacity: 1; }
.projects a:hover img { transform: scale(1.05); }
@media (hover: none) { .projects .project-title { inset: auto 0 0; padding: 8px; opacity: 1; font-size: 17px; } .projects .project-title .fa { display: none; } }

/* Firma */
.contact_info p { margin-bottom: 10px; }
.contact_info .fa { width: 14px; color: #333; }
.contact_info h4 { margin: 20px 0 10px; font-size: clamp(24px, 6vw, 30px) !important; }
.contact_info table td { padding: 1px 10px 1px 0; vertical-align: top; }
#paymentmethods { display: grid; grid-template-columns: repeat(auto-fill, minmax(58px, 1fr)); gap: 10px; max-width: 760px; }
#paymentmethods img { width: 100%; max-width: 70px; height: auto; }
@media (min-width: 768px) { #paymentmethods { display: flex; flex-wrap: wrap; gap: 0; } #paymentmethods img { width: 70px; margin: 0 20px 20px 0; } }

/* ---------- Galerie (plg_content_dkgallery) ---------- */
.dk-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin: 0 0 20px; padding: 0; list-style: none; }
.dk-gallery li { margin: 0; }
.dk-gallery a { position: relative; display: block; background: #000; }
.dk-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; transition: opacity .3s; }
.dk-gallery a::after { content: ""; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M416 208c0 46-15 88-40 123l127 126c12 13 12 33 0 46s-33 12-46 0L331 376c-35 26-77 40-123 40C93 416 0 323 0 208S93 0 208 0s208 93 208 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E") center / 28px no-repeat; opacity: 0; transition: opacity .3s; }
.dk-gallery a:hover img { opacity: .7; }
.dk-gallery a:hover::after { opacity: 1; }
@media (min-width: 768px) {
	.dk-gallery { display: flex; flex-wrap: wrap; gap: 1px; }
	.dk-gallery img { width: 200px; height: 160px; aspect-ratio: auto; }
}

/* ---------- Kontaktformular ---------- */
.dk-contact { max-width: none; }
.dk-contact fieldset { margin: 0 0 10px; padding: 0; border: 0; }
.dk-contact legend, .dk-contact .form-section { margin: 20px 0 12px; padding: 0; font: 700 22px var(--narrow); }
.dk-contact .control-group { margin-bottom: 14px; }
.dk-contact .control-label label, .dk-contact .control-label { display: block; margin-bottom: 4px; font-weight: 700; font-size: 14px; }
.dk-contact .star, .dk-contact .required-mark { color: #e00; }
.dk-contact input[type="text"], .dk-contact input[type="email"], .dk-contact input[type="tel"], .dk-contact textarea { width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid #ddd; border-radius: 2px; background: #fff; color: #333; font: 16px var(--sans); }
.dk-contact textarea { min-height: 120px; height: 140px; resize: vertical; }
.dk-contact .form-check { display: flex; align-items: center; gap: 8px; min-height: 32px; }
.dk-contact .form-check-input { width: 20px; height: 20px; margin: 0; accent-color: var(--accent); }
.dk-contact input:focus, .dk-contact textarea:focus { border-color: var(--accent); outline: 0; box-shadow: 0 0 0 2px rgba(44, 181, 213, .25); }
.dk-contact .checkbox-row { display: flex; align-items: flex-start; gap: 10px; margin: 12px 0; }
.dk-contact .checkbox-row input { flex: 0 0 auto; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--accent); }
.dk-contact .hint { margin: 0 0 4px; }
.dk-contact .invalid { border-color: #c00 !important; }
.dk-contact label.invalid { color: #c00; }
.dk-contact .form-errors { color: #c00; }

/* ---------- Systemmeldungen ---------- */
joomla-alert, .alert { display: block; margin: 20px 0; padding: 14px 18px; border-left: 4px solid var(--accent); background: #eef8fb; color: #222; }
joomla-alert[type="danger"], joomla-alert[type="error"], .alert-danger { border-color: #c00; background: #fdeeee; }
joomla-alert .joomla-alert--close, joomla-alert .joomla-alert-button--close { float: right; border: 0; background: none; font-size: 20px; cursor: pointer; }
.alert-heading { font-weight: 700; }

/* ---------- Footer ---------- */
.site-footer { margin-top: 40px; padding: 12px 0 18px; border-top: 1px solid var(--line); background: var(--black); color: var(--muted); }
.footer-menu .menu { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.footer-menu li + li { border-left: 1px solid #cecece; }
.footer-menu a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; color: #92999e; font: 15px var(--narrow); }
.footer-menu li:first-child a { padding-left: 0; }
.footer-menu a:hover, .footer-menu .active > a { color: var(--accent); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.copyright { margin: 0; font-size: 13px; }
.footer-facebook { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: -12px; color: var(--muted); font-size: 18px; }
@media (min-width: 992px) {
	.footer-menu a { min-height: 30px; font-size: 12px; }
	.site-footer { padding: 6px 0 10px; }
}

/* ---------- Mobil-Feinschliff (Plan 11): nur unter 992 px, Desktop bleibt unveraendert ---------- */
@media (max-width: 991.98px) {
	/* Links im Inhalt auf Touch-Geraeten als Link erkennbar */
	.site-main .item-page a:not(.lightbox):not(.dk-gallery a), .site-main .contact_info a, .site-main .contact-intro a, .dk-contact .checkbox-row a, .error-content a { color: #156a7e; text-decoration: underline; text-underline-offset: 2px; }
	.site-main .item-page a:not(.lightbox):not(.dk-gallery a):hover, .site-main .contact_info a:hover, .error-content a:hover { color: var(--accent-dark); }
	.item-page h4 { font-size: 21px; }
	.item-page h5 { font-size: 18px; }
	.item-page h6 { font-size: 16px; font-weight: 700; }
	.slider-dots button { width: 44px; height: 44px; }
	.dk-contact .form-check { min-height: 44px; }
	.dk-contact .form-check-label { padding: 10px 12px 10px 0; }
}
@media (max-width: 767.98px) {
	/* Fotopaare in Beitraegen nebeneinander, Seitenverhaeltnis bleibt (kein Beschnitt) */
	.item-page .row:has(> .col-md-6) { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 8px; margin: 0 0 15px; }
	.item-page .row > .col-md-6 { margin: 0; }
	.item-page a.lightbox { display: block; margin: 0 0 15px; }
	.item-page .row a.lightbox { margin: 0; }
	.item-page a.lightbox img { width: 100%; max-width: 100%; margin: 0; }
	#jform_com_fields_anschrift { height: 88px; min-height: 88px; }
	.dk-contact button[type="submit"] { width: 100%; }
	#paymentmethods { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 479.98px) {
	/* Dienstleistungen zweispaltig statt vier Kreise untereinander */
	.section .sixteen { grid-template-columns: 1fr 1fr; gap: 28px 12px; }
	.icon_bgr { width: 76px; height: 76px; margin-bottom: 16px; }
	.icon_bgr .fa-3x { font-size: 36px; }
	.section_featured_texts h4 { font-size: 18px; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
	.dk-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; }
	.dk-gallery img { width: 100%; height: auto; aspect-ratio: 5 / 4; }
	.googleMaps, #googlemaps-address iframe { width: 100%; aspect-ratio: 16 / 9; }
	#paymentmethods img { width: 64px; margin: 0 14px 14px 0; }
	.item-page .col-md-6 a.lightbox img { max-width: 100%; margin-right: 0; }
}
/* Querformat am Handy: Header schmaler, Slider passt auf den Bildschirm (Topbar 38 + Header 48 + Rand 1) */
@media (max-width: 991.98px) and (max-height: 500px) {
	:root { --head: 48px; }
	.logo { padding: 3px 0; }
	.logo img { width: 104px; }
	.dk-slider { height: max(200px, calc(100vh - 87px)); height: max(200px, calc(100svh - 87px)); }
}

/* ---------- Fehlerseite ---------- */
.error-content { padding: 20px 0 40px; }

/* ---------- Druck ---------- */
@media print {
	.topbar, .site-nav, .nav-toggle, .slider-wrap, .site-footer { display: none !important; }
	.site-header { position: static; background: none; }
	.logo img { filter: invert(1); }
}