/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.10
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/


/* montserrat-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/montserrat/montserrat-v31-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/montserrat/montserrat-v31-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/montserrat/montserrat-v31-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat/montserrat-v31-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/montserrat/montserrat-v31-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/montserrat/montserrat-v31-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/montserrat/montserrat-v31-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/montserrat/montserrat-v31-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/montserrat/montserrat-v31-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/montserrat/montserrat-v31-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Borlabs-Cookie-Banner während des Startseiten-Intros ausblenden, danach zeigen */
html.dius-intro-on #BorlabsCookieBox,
html.dius-intro-on .brlbs-fixed { display: none !important; }

html{ scroll-behavior:smooth; }
:target{ scroll-margin-top:80px; }
section[id]{ scroll-margin-top:80px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body { font-family: 'Montserrat'; }

h1, h2, h3, h4, h5{ font-family: 'Montserrat'!important; }
p ul li{ font-family: 'Montserrat'!important; }

/* Header-Logo: nur auf der Startseite erst nach dem Hero einblenden, sonst immer sichtbar */
body:not(.home) .elementor-element-f188d35 .header-logo {
  opacity: 1!important;
  visibility: visible!important;
}

.impressum-datenschutz h2{ font-size:1.4vw!important; }
.impressum-datenschutz h3{ font-size:1.2vw!important; }
.impressum-datenschutz p,
.impressum-datenschutz ul li{ font-size:0.8vw!important; }

@media (max-width: 1400px) {
.impressum-datenschutz h2{ font-size:2vw!important; }
.impressum-datenschutz h3{ font-size:1.4vw!important; }
.impressum-datenschutz p,
.impressum-datenschutz ul li{ font-size:1.2vw!important; }
}
	
@media (max-width: 767px) {
.impressum-datenschutz h2{ font-size:4vw!important; }
.impressum-datenschutz h3{ font-size:3vw!important; }
.impressum-datenschutz p,
.impressum-datenschutz ul li{ font-size:2.4vw!important; }
}


/* Borlabs-Cookie-Banner immer über allem (auch Mobilmenü-Popup) */
#BorlabsCookieBox .brlbs-z-max,
#BorlabsCookieBox > div {
  z-index: 2147483647 !important;
}
.brlbs-cmpnt-widget {
  z-index: 2147483646 !important;
}

/* Mobilmenü-Popup: ungültigen Riesen-z-index (1.0E+22) entschärfen */
.elementor-3667 .elementor-element.elementor-element-69c6b5d {
  --z-index: 10 !important;
}

.schrift-gelb{ color: #ffd21e; }
.schrift-mint{ color: var( --e-global-color-accent ); }

.btn-transparent a{ background:none!important; border:1px solid #e4e4e4!important; font-weight:600!important; }
/*.btn-transparent a:hover{ color: var( --e-global-color-b8ced3a )!important; background-image: linear-gradient(90deg, var( --e-global-color-eca2cf3 ) 0%, var( --e-global-color-c36bc01 ) 100%)!important; }*/
.btn-weiss a{ background:#fff!important; border:1px solid var( --e-global-color-text )!important; color: var( --e-global-color-text )!important; font-weight:600!important; }

.btn-transparent-schrift-bronze a{ background:none!important; padding-left:0px!important; border:none!important; font-weight:600!important; color: var( --e-global-color-accent )!important; }
.btn-transparent-schrift-bronze a span.elementor-button-icon{ fill: var( --e-global-color-accent )!important; color: var( --e-global-color-accent )!important; }
.btn-fakten a.elementor-button{ background-image:none; background-color: #1E9A952B!important; font-weight:600; padding: 5px 10px 5px 10px!important; border-radius: 20px 20px 20px 20px!important; color: var( --e-global-color-c36bc01 )!important; fill: var( --e-global-color-c36bc01 )!important; text-transform:uppercase!important; font-size:12px!important; }
.btn-fakten .elementor-button-icon{ font-size:18px; }
.btn-fakten .elementor-button-text{ padding-top:3px; }

.accordeon-nr{ padding-right:20px; color: var( --e-global-color-accent )!important; }

.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text,
.elementor-widget-icon-list .elementor-icon-list-item > a{ font-family: 'Montserrat'!important; }

@keyframes wsoBob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(6px);} }
@keyframes wsoBob2{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(6px);} }

.wso-bob{ animation:wsoBob 1.8s ease-in-out infinite; }
.wso-bob2{ animation:wsoBob2 1.8s ease-in-out infinite; }

.header-titel{ display:inline-flex; align-items:center; gap:.6rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.8rem; color:#0c5f5c; }
.header-titel::before{ content:""; width:24px; height:2px; background:var( --e-global-color-eca2cf3 ); display:inline-block; flex:0 0 auto; }

.header-titel-hell{ display:inline-flex; align-items:center; gap:.6rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.8rem; color:#fff; }
.header-titel-hell::before{ content:""; width:24px; height:2px; background:#fff; display:inline-block; flex:0 0 auto; }

.bubble{ pointer-events:none; z-index:0; }
.bubble-front{ position:relative; z-index:2; }

.text-bronze{ color: var( --e-global-color-accent)!important; }
.text-blau{ color: var( --e-global-color-primary )!important; }

/* Contact Form 7 */

.wso-cf7 .row2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:520px){ .wso-cf7 .row2{ grid-template-columns:1fr; } }
.wso-cf7 p{ margin:0 0 .9rem; }
.wso-cf7 label{ display:block; font-size:16px; font-weight:400; color:#2a2d31; margin-bottom:15px; }
.wso-cf7 input.wpcf7-form-control:not([type=submit]):not([type=checkbox]),
.wso-cf7 textarea.wpcf7-form-control{ width:100%; margin-top:.35rem; border:1px solid #e3e7e6; border-radius:12px; padding:.8rem 1rem; font-family:inherit; font-size:.95rem; color:#030306; background:#f3faf9; transition:border-color .2s, background .2s; }
.wso-cf7 input.wpcf7-form-control:focus, .wso-cf7 textarea.wpcf7-form-control:focus{ outline:none; border-color:#219c97; background:#fff; }
.wso-cf7 textarea.wpcf7-form-control{ min-height:130px; resize:vertical; }
.wso-cf7 .consent{ display:flex; gap:.5rem; align-items:flex-start; font-size:.82rem; color:#5b6b69; }
.wso-cf7 .consent .wpcf7-list-item{ margin:0; }
.wso-cf7 .wpcf7-submit{ width:100%; margin-top:.4rem; border:none; cursor:pointer; background:linear-gradient(135deg,#219c97 0%,#0c5f5c 100%); color:#fff; font-weight:600; font-size:1rem; padding:.95rem 1.6rem; border-radius:100px; transition:transform .3s, box-shadow .3s; }
.wso-cf7 .wpcf7-submit:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(33,156,151,.32); }
.wso-cf7 .wpcf7-not-valid-tip{ color:#c0392b; font-size:1rem; margin-top:.25rem; }
.wso-cf7 .wpcf7-response-output{ border-radius:10px; padding:.8rem 1rem !important; margin:1rem 0 0 !important; font-size:.9rem; }
.wso-cf7 .wpcf7-mail-sent-ok{ border-color:#219c97 !important; background:#e4f4f2; color:#0c5f5c; }

.wso-cf7 a,
.wso-cf7 a:link,
.wso-cf7 a:visited{ color: var( --e-global-color-accent ); }


/* ==========================================================
   Bewerbungsformular (CF7 / Personio) – Stellen-Detailseite
   ========================================================== */
.dius-form { display: flex; flex-direction: column; gap: 28px; }
.dius-form p { margin: 0; }
.dius-form br { display: none; }

/* Zwei Spalten */
.dius-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px; }

/* Labels */
.dius-form__field { display: block; font-size: 15px; font-weight: 400; color: #001D3A; }
.dius-form__field small { font-weight: 400; opacity: .6; }
.dius-form__field .wpcf7-form-control-wrap { display: block; margin-top: 8px; }

/* Eingabefelder: dezenter Rahmen, kein Gold */
.elementor-kit-7 .dius-form input[type="text"],
.elementor-kit-7 .dius-form input[type="email"],
.elementor-kit-7 .dius-form input[type="date"] {
  width: 100%; padding: 14px 16px;
  border: 1px solid #d9dee3; border-radius: 4px;
  background: #fff; color: #16273A;
  font-family: inherit; font-size: 16px; font-weight: 400;
  box-shadow: none; transition: border-color .2s;
}
.elementor-kit-7 .dius-form input[type="text"]:focus,
.elementor-kit-7 .dius-form input[type="email"]:focus,
.elementor-kit-7 .dius-form input[type="date"]:focus {
  outline: none; border-color: #16273A;
  background-color: #f2f4fa;
}

/* Autofill des Browsers / Passwortmanagers ebenfalls in #f2f4fa statt Grau */
.dius-form input:-webkit-autofill,
.dius-form input:-webkit-autofill:hover,
.dius-form input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #f2f4fa inset;
  -webkit-text-fill-color: #16273A;
}


.dius-form input::placeholder { color: #9aa4ae; }

/* Datei-Upload */
.elementor-kit-7 .dius-form input[type="file"] {
  width: 100%; padding: 14px 16px;
  border: 1px dashed #d9dee3; border-radius: 4px;
    background: #f2f4fa; color: #16273A;
  font-family: inherit; font-size: 14px; font-weight: 400;
}
.dius-form input[type="file"]::file-selector-button {
  margin-right: 14px; padding: 8px 16px;
  border: 1px solid #16273A; border-radius: 4px;
  background: #fff; color: #16273A;
  font-family: inherit; font-weight: 600; cursor: pointer;
}

.elementor-kit-7 .dius-form input[type="submit"],
.elementor-kit-7 .dius-form input[type="submit"]:hover,
.elementor-kit-7 .dius-form input[type="submit"]:focus {
	padding: 16px 59px 16px 24px;
	border: 0;
	border-radius: 30px;
	background: #064B6E url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23fff' d='M313.941 216H12c-6.627 0-12 5.373-12 12v56c0 6.627 5.373 12 12 12h301.941v46.059c0 21.382 25.851 32.09 40.971 16.971l86.059-86.059c9.373-9.373 9.373-24.569 0-33.941l-86.059-86.059c-15.119-15.119-40.971-4.411-40.971 16.971V216z'/%3E%3C/svg%3E") no-repeat right 24px center / 15px 15px;
	color: #fff;
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 15px;
	cursor: pointer;
	box-shadow: none;
	transition: opacity .3s;
}
/* Solange die Datenschutz-Checkbox nicht angehakt ist */
.elementor-kit-7 .dius-form input[type=submit]:disabled {
  opacity: 1;
  cursor: not-allowed;
}


/* Fehlermeldungen & Antwort */
.dius-form .wpcf7-not-valid-tip { margin-top: 6px; font-size: 13px; font-weight: 400; }
.elementor-kit-7 .dius-form .wpcf7-not-valid { border-color: #c0392b; }
.wpcf7 form .wpcf7-response-output { margin: 24px 0 0; padding: 12px 16px; border-radius: 4px; font-size: 15px; }

/* Mobil: eine Spalte */
@media (max-width: 767px) {
  .dius-form__row { grid-template-columns: 1fr; }
}


/* Kontaktformular – Ergänzungen zu .dius-form */
.elementor-kit-7 .dius-form input[type="tel"],
.elementor-kit-7 .dius-form textarea {
  width: 100%; padding: 14px 16px;
  border: 1px solid #d9dee3; border-radius: 4px;
  background: #fff; color: #16273A;
  font-family: inherit; font-size: 16px; font-weight: 400;
  box-shadow: none; transition: border-color .2s, background-color .2s;
}
.elementor-kit-7 .dius-form textarea { min-height: 180px; resize: vertical; }
.elementor-kit-7 .dius-form input[type="tel"]:focus,
.elementor-kit-7 .dius-form textarea:focus {
  outline: none; border-color: #16273A; background-color: #f2f4fa;
}
.dius-form textarea::placeholder { color: #9aa4ae; }

/* Datenschutz-Checkbox */
.dius-form__accept { font-size: 14px; line-height: 1.5; color: #16273A; }
.dius-form__accept .wpcf7-list-item { margin: 0; }
.dius-form__accept label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.dius-form__accept input[type="checkbox"] {
  flex: 0 0 18px; width: 18px; height: 18px; margin-top: 2px;
  accent-color: #16273A; cursor: pointer;
}
.dius-form__accept a { color: #16273A; text-decoration: underline; }


/* Leiste */
.dl-filter{ background:rgba(251,251,249,.94); backdrop-filter:blur(10px); border-bottom:1px solid #e3e7e6; padding:.7rem 0; z-index:20; }

/* AKTIVER Chip = teal (überschreibt die Button-Optik) */
.dl-filter a.elementor-button.active{ background:linear-gradient(135deg,#219c97,#0c5f5c) !important; border-color:transparent !important; color:#fff !important; box-shadow:0 6px 16px rgba(33,156,151,.3); }


.dius-stack--on,
.dius-stack--on > .e-con-inner {
  display: block !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Jede Sektion klebt oben – die nächste schiebt sich darüber */
.dius-stack--on .dius-stack__section {
  position: sticky;
  top: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: transparent;
}

/* Nur der Inhalt faded, nicht die Sektion */
.dius-stack--on .dius-stack__section > * {
  opacity: var(--dius-a, 1);
  transform: translateY(var(--dius-y, 0px));
  will-change: opacity, transform;
}

.dius-stack--on .dius-stack__section {
  border-top: 0;
}

/* Trennlinie über die volle Fensterbreite */
.dius-stack--on .dius-stack__section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  height: 1px;
  background: rgba(255, 255, 255, .55);
  pointer-events: none;
}

.dius-stack--on .dius-stack__section:first-child::before {
  display: none;
}

/* ===== DIUS Prozess-Sektion ===== */
:root { --dius-top: 85px; }

.dius-process--on {
  position: relative;
}

/* Durchgehende Trennlinie über die ganze Sektion */
.dius-process--on::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--dius-linie, 50%);
  width: 1px;
  background: #001D3A;
  z-index: 2;
  pointer-events: none;
}

.dius-process--on .dius-process__stage {
  position: sticky;
  top: var(--dius-top);
  min-height: 0 !important;                  /* hebt Elementors 100vh auf */
  height: calc(100vh - var(--dius-top));     /* reicht exakt bis zum Bildschirmrand */
  overflow: hidden;
  background: transparent;
}

.dius-process--on .dius-process__list {
  position: relative;
}

.dius-process--on .dius-process__card {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-top: 1px solid #001D3A;
  will-change: transform, opacity;
}

/* Sichtbare Höhe statt vh – verhindert Sprünge durch die Adressleiste */
.dius-stack--on .dius-stack__section {
  min-height: 100vh;
  min-height: 100dvh;
}

.dius-process--on .dius-process__stage {
  height: calc(100vh - var(--dius-top));
  height: calc(100dvh - var(--dius-top));
}



/* ===== Text-Reveal ===== */
.dius-lines--bereit .dius-seg {
  display: block;                /* ersetzt dein <br> */
}
.dius-lines--bereit .dius-line {
  display: block;
  overflow: hidden;              /* Maske pro Zeile */
  padding-bottom: .14em;
  margin-bottom: -.14em;
}

/* Ausgangslage – und zugleich der Rückweg: zügig, ohne Staffelung */
.dius-lines--bereit .dius-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(-250%) skewY(-5deg);
  transition: opacity .45s ease, transform .45s ease;
  transition-delay: 0s;
  will-change: opacity, transform;
}

/* Hinweg – wie im Original: 1s, expo.out, gestaffelt */
.dius-lines--an .dius-word {
  opacity: 1;
  transform: translateY(0) skewY(0deg);
  transition: opacity   1s cubic-bezier(.16, 1, .3, 1),
              transform 1s cubic-bezier(.16, 1, .3, 1);
  transition-delay: var(--dly, 0s);
}

/* ==========================================================
   Section-Jump: Pagination rechts (.dius-dots, erzeugt von dius-jump.js)
   ========================================================== */
.dius-dots {
  --dius-dot: 12px;                 /* Punktgröße */
  --dius-dot-bg: #f2f4fa;           /* Zement */
  --dius-dot-border: #e4e4e4;       /* leicht grauer Rahmen + Linie */
  --dius-dot-active: #a58158;       /* Gold */

  position: fixed;
  top: 50%;
  right: clamp(12px, 2vw, 32px);
  z-index: 90;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transform: translateY(-50%);
  transition: opacity .3s;
}
/* Hintergrund-Ton (setzt dius-jump.js): auf Weiß Zement-Punkte (Standard), auf Zement weiße */
.dius-dots[data-tone="cement"] {
  --dius-dot-bg: #fff;
}
.dius-dots[data-tone="mid"] {
  --dius-dot-bg: #e4e4e4;
  --dius-dot-border: #c4c4c4;
}
.dius-dots[data-tone="dark"] {
  --dius-dot-bg: rgba(255, 255, 255, .25);
  --dius-dot-border: rgba(255, 255, 255, .55);
}
.dius-dots__line {
  transition: background-color .3s;
}

.dius-dots.is-off,
.dius-dots[hidden] {
  opacity: 0;
  pointer-events: none;
}

/* Linie vom ersten bis zum letzten Punkt, Goldfüllung wächst mit dem Scrollen */
.dius-dots__line {
  position: absolute;
  top: calc(var(--dius-dot) / 2);
  bottom: calc(var(--dius-dot) / 2);
  left: 50%;
  width: 2px;
  background: var(--dius-dot-border);
  transform: translateX(-50%);
  pointer-events: none;
}
.dius-dots__line::after {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: calc(var(--dius-progress, 0) * 100%);
  background: var(--dius-dot-active);
}

/* .dius-dots button… schlägt die Button-Styles von Hello/Elementor */
.dius-dots button.dius-dots__dot {
  position: relative;
  z-index: 1;                       /* über der Linie */
  box-sizing: border-box;
  width: var(--dius-dot);
  height: var(--dius-dot);
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 1px solid var(--dius-dot-border);
  border-radius: 50%;
  background: var(--dius-dot-bg);
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  appearance: none;
  transition: background-color .3s, border-color .3s;
}
.dius-dots button.dius-dots__dot::before {   /* größere Klickfläche */
  content: '';
  position: absolute;
  inset: -8px;
}
.dius-dots button.dius-dots__dot:focus {
  background: var(--dius-dot-bg);
}
.dius-dots button.dius-dots__dot.is-active {
  background: var(--dius-dot-active);
  border-color: var(--dius-dot-active);
}
.dius-dots button.dius-dots__dot:focus:not(:focus-visible) {
  outline: none;
}
.dius-dots button.dius-dots__dot:focus-visible {
  outline: 2px solid var(--dius-dot-active);
  outline-offset: 3px;
}

/* Beschriftung links neben dem Punkt, nur bei Hover.
   Nur auf Geräten mit echter Maus: auf Touch bleibt :hover nach dem Antippen hängen */
.dius-dots button.dius-dots__dot::after {
  content: attr(data-label);
  position: absolute;
  top: 50%;
  right: calc(100% + 14px);
  color: var(--dius-dot-active);
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  transform: translate(6px, -50%);
  transition: opacity .2s, transform .2s;
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .dius-dots button.dius-dots__dot:hover {
    background: var(--dius-dot-bg);
    border-color: var(--dius-dot-active);
  }
  .dius-dots button.dius-dots__dot.is-active:hover {
    background: var(--dius-dot-active);
  }
  .dius-dots button.dius-dots__dot:hover::after {
    opacity: 1;
    transform: translate(0, -50%);
  }
}

/* Touch-Bedienung (Klasse setzt dius-jump.js): nie eine Beschriftung zeigen */
.dius-touch .dius-dots button.dius-dots__dot::after {
  display: none;
}

@media (max-width: 767px) {
  .dius-dots { --dius-dot: 10px; right: 8px; gap: 12px; }
}



/* =========================================================
   Scroll-Pfeil unten mittig (JS: js/dius-scroll-down.js)
   ========================================================= */
.dius-scroll-down {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: 24px;
  display: grid;
  place-items: center;
  width: 56px;   /* unsichtbare Klickfläche */
  height: 56px;
  color: #a58158;
  text-decoration: none;
  transform: translateX(-50%);
  transition: opacity .5s ease, visibility 0s linear 0s, color .3s ease;
}
.dius-scroll-down svg {
  width: 30px;
  height: 30px;
  animation: dius-scroll-drift 2.8s ease-in-out infinite;
}
.dius-scroll-down:hover,
.dius-scroll-down:focus-visible { color: #001d3a; }
.dius-scroll-down:focus-visible {
  outline: 2px solid #a58158;
  outline-offset: 2px;
  border-radius: 4px;
}
/* Nach dem ersten Scrollen ausblenden */
.dius-scroll-down.is-off {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .5s ease, visibility 0s linear .5s;
}
/* Ganz sachtes Absinken und Zurückgleiten */
@keyframes dius-scroll-drift {
  0%, 100% { transform: translateY(-3px); opacity: .7; }
  50%      { transform: translateY(5px);  opacity: 1; }
}
@media (max-width: 767px) {
  .dius-scroll-down { bottom: 16px; width: 64px; height: 64px; }
  .dius-scroll-down svg { width: 42px; height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  .dius-scroll-down svg { animation: none; }
}


/* Scroll-Pfeil: nur auf der Startseite und nur am Desktop */
body:not(.home) .dius-scroll-down {
  display: none;
}
@media (max-width: 1024px) {
  .dius-scroll-down {
    display: none;
  }
}


/* Menü-Popup: kein Fokus-Rahmen um den automatisch fokussierten Link (iOS) */
.elementor-3667 a:focus,
.elementor-3667 a:focus-visible {
	outline: none;
	box-shadow: none;
}

/* Captcha-Icons: eng zusammen, rechtsbündig */
.dius-form .captcha-image {
	display: block;
	width: 100%;
	padding: 0;
}
.dius-form .cf7ic-sr-fs {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 2px;
}
.dius-form .cf7ic-sr-fs label {
	float: none !important;
	position: relative;
	margin: 0;
}
.dius-form .captcha-image label > input {
	position: absolute;
	-webkit-appearance: none;
	appearance: none;
}

/* Menü-Popup: Fokus färbt nicht mehr wie "aktive Seite" */
.elementor-3667 .elementor-nav-menu--main .elementor-item:focus:not(.elementor-item-active):not(:hover) {
	color: #f2f4fa;
}

/* iOS verlinkt Telefonnummern automatisch → Farbe des umgebenden Textes übernehmen */
.elementor-icon-box-description a,
a[href^="tel:"]:not([class]) {
	color: inherit;
	text-decoration: none;
}

/* Keil: Bild unten rechts 45° abschrägen wie im Layoutentwurf v11 (Team-Zitat).
   Klasse "dius-keil" am Elementor-Bild-Widget. Die Ecke zeigt den Hintergrund des Containers. */
.dius-keil img {
  --dius-keil: 8.5vw;
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--dius-keil)),
    calc(100% - var(--dius-keil)) 100%,
    0 100%
  );
}


/* Verlauf-Bild (Layoutentwurf v11, "Deine Skills"): Klasse "dius-fade" am Elementor-Bild-Widget.
   Das Bild reicht links hinter den Text (rechte Kante bleibt) und läuft dort weich ins Weiß aus.
   Nur ab 1025px – darunter stehen Bild und Text untereinander. */
@media (min-width: 1025px) {
  .dius-fade {
    --dius-fade-extend: 33%; /* so viel ragt das Bild nach links – in % der Bildspalte */
    margin-left: calc(-1 * var(--dius-fade-extend));
    width: calc(100% + var(--dius-fade-extend)) !important;
    max-width: none !important;
    --container-widget-width: calc(100% + var(--dius-fade-extend));
  }
  .dius-fade img {
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 40%);
    mask-image: linear-gradient(to right, transparent 0, #000 40%);
  }
  /* Textspalte über das Bild legen, damit der auslaufende Teil den Text nicht überdeckt */
  .e-con:has(> .e-con .dius-fade) > .e-con:not(:has(.dius-fade)) {
    position: relative;
    z-index: 1;
  }
}