/* =======================================================
   BLACK-LINER – CLEAN BASE (CLEANED)
   ======================================================= */

/* ---------- Farben & Fonts ---------- */
:root{
  --bl-bg:#0a0a0a;
  --bl-text:#909090;
  --bl-text-light:#cccccc;
  --bl-heading:#909090;
  --bl-accent:#4da3ff;
  --bl-accent-light:#80c4ff;
  --bl-active:#ff6600;
  --bl-border:#333333;
  --glow-white:rgba(255,255,255,.5);
  --glow-active:rgba(255,102,0,.5);

  /* Fonts */
  --bl-font:'Andale Mono','AndaleMono',monospace;                /* global */
  --bl-footer-font:'opensans-regular','Open Sans',Arial,sans-serif; /* Footer */
}

/* ---------- Typo / Grundlayout ---------- */
body{ background:var(--bl-bg); color:var(--bl-text); font-family:var(--bl-font) }
h1,h2,h3,h4,h5,h6{ color:var(--bl-heading); font-weight:600 }
p,li,dt,dd,blockquote{ color:var(--bl-text-light); line-height:1.6 }
a{ color:var(--bl-accent); text-decoration:none; transition:color .25s ease,text-shadow .25s ease }
a:hover{ color:var(--bl-accent-light); text-decoration:underline }
table,th,td,label,input,textarea{ color:#ddd }

/* --- Theme-Font-Resets (außer Footer) */
h1,h2,h3,h4,h5,h6,
p.lead,
label,legend,
.button,.btn,input[type="submit"],input[type="reset"],input[type="button"],
.pagination .page-numbers,
.stats-tabs li a,.stats-tabs li a b,
abbr,
.drop-cap:first-letter,
blockquote p,
strong,b,em,
#nav,#nav *,
.banner-text,.banner-text h1,.responsive-headline,
.page-body,.content,.bl-content{ font-family:inherit !important; }

em{ font-style:italic }
strong,b{ font-weight:600 }

/* --- Footer behält Open Sans (Icons ausnehmen) */
footer,
footer *:not(i):not(.fa):not([class^="icon-"]):not([class*=" icon-"]){
  font-family:var(--bl-footer-font) !important;
}

/* =======================================================
   HERO (Fullscreen) + Overlay
   ======================================================= */
#home{ position:relative; overflow:hidden; height:100vh; background:none !important }
.bl-hero__video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; background:#000; opacity:0; transition:opacity .8s ease;
}
.bl-hero__video.is-ready,.bl-hero__video[ready]{ opacity:1 }
#home::before{ content:""; position:absolute; inset:0; background:rgba(0,0,0,.45); z-index:1; pointer-events:none }
#home nav,#home .banner,#home .banner-text,#home .scrolldown,.hero-logo{ position:relative; z-index:2 }
.hero-logo{ text-align:center; margin:18px 0 6px }
.hero-logo img{ max-width:320px; width:40vw; height:auto }
/* Damit Overlays nie Menüs blockieren */
.hero-logo, #home .banner, #home .banner-text{ pointer-events:none; }

.scrolldown{ position:absolute; left:50%; transform:translateX(-50%); bottom:22px }

/* Fallback-Bild */
#home,.hero,.hero-section,.parallax{
  background:url("../images/blackliner-hero.jpg") center/cover no-repeat !important;
  background-color:#000 !important;
  background-attachment:fixed;
}
@media (max-width:900px){ #home,.hero,.hero-section,.parallax{ background-attachment:scroll } }

/* =======================================================
   NAVIGATION + SPRACHSCHALTER
   ======================================================= */
#nav{ display:flex; justify-content:center; align-items:center; gap:22px; flex-wrap:wrap; position:relative; width:100% }
#nav li a,#nav li a:link,#nav li a:visited{
  color:var(--bl-text-light) !important; text-decoration:none !important; transition:color .3s,text-shadow .3s;
}
#nav li a:hover,#nav li a:focus{ color:var(--bl-heading) !important; text-shadow:0 0 6px var(--glow-white) }
#nav li.current a{ color:var(--bl-active) !important; text-shadow:0 0 8px var(--glow-active); font-weight:700 }

/* Sprachschalter (weiter links) */
.lang-inline.moved-left{ position:absolute; right:200px; top:20px; z-index:30; }
.lang-inline a,.lang-inline .lang-sep{ color:var(--bl-text-light) !important; transition:color .3s,text-shadow .3s }
.lang-inline a:hover{ color:var(--bl-heading) !important; text-shadow:0 0 6px var(--glow-white) }
.lang-inline .active a{ color:var(--bl-active) !important; text-shadow:0 0 8px var(--glow-active) }
@media(max-width:900px){ .lang-inline.moved-left{ position:static; margin-top:12px; justify-content:center; width:100%; } }

/* =======================================================
   NAV DROPDOWN – gapless & click-safe
   ======================================================= */
#nav-wrap{ position:relative; z-index:2147483646; overflow:visible; }
#nav li{ position:relative; }

#nav > li.has-sub{ padding-bottom:0; }
#nav > li.has-sub > .parent-link{ position:relative; padding-right:1.6rem; }
#nav > li.has-sub > .parent-link::after{
  content:""; position:absolute; right:.25rem; top:50%;
  width:6px; height:6px; border-right:2px solid #bbb; border-bottom:2px solid #bbb;
  transform:translateY(-50%) rotate(45deg); transition:transform .2s, border-color .2s;
}
#nav > li.has-sub.open > .parent-link::after,
#nav > li.has-sub:hover > .parent-link::after{
  transform:translateY(-50%) rotate(225deg); border-color:#fff;
}

/* Mobile Toggle */
#nav li.has-sub .sub-toggle{
  position:absolute; right:.2rem; top:50%; transform:translateY(-50%);
  width:0; height:0; padding:0; margin:0; background:transparent !important; border:0 !important; box-shadow:none !important;
  opacity:0; pointer-events:none; appearance:none; -webkit-appearance:none;
}
@media (max-width:980px){
  #nav li.has-sub .sub-toggle{
    width:28px; height:28px; opacity:1; pointer-events:auto; cursor:pointer; background:transparent !important; border:0 !important; box-shadow:none !important;
  }
  #nav li.has-sub .sub-toggle::before{
    content:""; display:block; width:8px; height:8px; margin:auto; border-right:2px solid #bbb; border-bottom:2px solid #bbb; transform:rotate(45deg); transition:transform .2s, border-color .2s;
  }
  #nav li.has-sub.open > .sub-toggle::before{ transform:rotate(225deg); border-color:#fff; }
}

/* Submenü */
#nav .submenu{
  position:absolute !important; left:0 !important; top:100% !important; margin-top:0 !important; min-width:260px;
  background:rgba(10,10,10,.98); border:1px solid rgba(255,255,255,.10);
  border-radius:12px; box-shadow:0 18px 50px rgba(0,0,0,.7);
  display:flex; flex-direction:column; overflow:hidden;
  z-index:2147483647 !important; pointer-events:auto !important;
  opacity:0; visibility:hidden; transition:opacity .18s ease, visibility .18s ease;
}
#nav li.has-sub.open > .submenu{ opacity:1; visibility:visible; }
#nav .submenu li{ white-space:nowrap; }
#nav .submenu a{
  display:block; padding:.9rem 1.1rem; color:#eaeaea; text-decoration:none;
  font-weight:700; letter-spacing:.03em; text-transform:uppercase; font-size:.95rem;
  transition:background .15s ease, color .15s ease, padding-left .15s ease;
}
#nav .submenu a:hover{ background:rgba(255,255,255,.10); color:#fff; padding-left:1.25rem; }
#nav .submenu li.active > a{ color:#ff7a00; }
@media (max-width:980px){
  #nav li.has-sub.open > .submenu{
    position:relative !important; top:auto !important; left:auto !important; margin-top:.35rem !important; border-radius:10px;
  }
}

/* =======================================================
   CONTENT
   ======================================================= */
.content .container{ max-width:1100px; margin:0 auto; padding:40px 20px; text-align:left }
.content .page-title{ font-weight:800; line-height:1.15; margin:0 0 .6em; color:var(--bl-heading); font-size:clamp(1.8rem,2.5vw,2.4rem) }
.content h2{ font-size:clamp(1.5rem,2vw,2rem); line-height:1.25; margin:1.2em 0 .5em }
.content h3{ font-size:clamp(1.25rem,1.6vw,1.6rem); line-height:1.25; margin:1.1em 0 .45em }
.content h4{ font-size:1.125rem; margin:1em 0 .4em }
.content p,.content li,.content dd,.content dt,.content blockquote,.content td,.content th{ font-size:1rem; line-height:1.55; color:var(--bl-text-light); margin:0 0 .8em }
.content ul,.content ol{ margin:0 0 1em 1.2em; padding:0 }
.content a{ color:var(--bl-accent); text-decoration:underline }
.content a:hover{ color:var(--bl-accent-light) }
.content img{ max-width:100%; height:auto; display:block; margin:.8em 0 }
.content table{ width:100%; border-collapse:collapse; margin:1em 0; border:1px solid var(--bl-border) }
.content th,.content td{ border:1px solid var(--bl-border); padding:.6em .8em }
.content thead th{ background:#141414; color:var(--bl-heading) }
.content p + p{ margin-top:.3em }
.content h2 + p,.content h3 + p{ margin-top:.2em }

/* =======================================================
   BUTTONS & FOOTER
   ======================================================= */
.button,.btn,input[type=submit],input[type=button]{
  background:#111 !important; color:#fff !important; padding:12px 28px; border-radius:6px;
  display:inline-block; margin-top:15px; letter-spacing:.5px; border:1px solid transparent; transition:color .3s, background .3s, box-shadow .3s, text-shadow .3s;
}
.button:hover,.btn:hover,input[type=submit]:hover,input[type=button]:hover{
  background:var(--bl-active) !important; color:#fff !important; box-shadow:0 0 12px var(--glow-active); border-color:var(--bl-active);
}

#go-top a{ background:#222 !important; color:#fff !important; border-radius:50%; width:54px; height:54px; display:flex; align-items:center; justify-content:center; transition:all .3s }
#go-top a:hover{ background:var(--bl-active) !important; box-shadow:0 0 12px var(--glow-active); color:#fff !important }

footer a{ color:#bbb !important; text-decoration:none; transition:color .3s, text-shadow .3s }
footer a:hover{ color:#fff !important; text-shadow:0 0 8px var(--glow-white) }
footer p,footer li,footer span{ color:#ccc !important }

/* =======================================================
   GALLERY GRID + FEATHERLIGHT (schlank)
   ======================================================= */
.bl-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; margin-top:1rem }
.bl-g-item{ position:relative; overflow:hidden; border-radius:10px; border:1px solid #222; background:#111 }
.bl-g-item img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(100%); transition:transform .25s, filter .25s, opacity .25s; opacity:.9 }
.bl-g-item:hover img{ transform:scale(1.03); filter:grayscale(0); opacity:1 }

/* Featherlight dark */
.featherlight{ background:rgba(0,0,0,.92) !important }
.featherlight .featherlight-content{
  background:#1a1a1a !important; border:1px solid #333 !important; border-radius:8px; box-shadow:0 0 20px rgba(0,0,0,.7); padding:0; max-width:95vw; max-height:90vh;
}
.featherlight .featherlight-content img{ display:block; max-width:95vw; max-height:88vh; width:auto; height:auto; margin:0 auto }
.featherlight-previous,.featherlight-next{
  position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; line-height:44px; border-radius:999px;
  background:rgba(0,0,0,.6); color:#e0e0e0; text-align:center; font-size:20px; border:1px solid #333; cursor:pointer; user-select:none; z-index:9999; transition:background .2s,color .2s, box-shadow .2s;
}
.featherlight-previous{ left:12px } .featherlight-next{ right:12px }
.featherlight-previous:hover,.featherlight-next:hover{ background:#111; color:#fff; box-shadow:0 0 10px rgba(255,255,255,.15) }
.featherlight .featherlight-close-icon{ color:#ccc !important; font-size:26px; top:10px; right:15px; text-shadow:none }
.featherlight .featherlight-close-icon:hover{ color:#fff !important }
@media(max-width:640px){ .featherlight-previous,.featherlight-next{ width:40px; height:40px; line-height:40px } }

/* =======================================================
   MISC / UTILS
   ======================================================= */
.visually-hidden{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; white-space:nowrap !important; border:0 !important }
.scrolldown a i,.scrolldown a{ color:#fff !important; border-color:#fff !important; opacity:1; transition:opacity .3s, text-shadow .3s }
.scrolldown a:hover{ opacity:.75; text-shadow:0 0 10px rgba(255,255,255,.5) }

.bl-hero{ position:relative; height:100vh; }
@supports (height: 100svh){ .bl-hero{ height:100svh; } }
@media (max-aspect-ratio: 9/16){ .bl-hero__video{ object-fit:contain; } }
.bl-hero__overlay{ position:relative; z-index:2; }
@media (orientation: portrait){ .bl-hero__video{ object-fit:contain !important; } }
@supports not (height: 100svh){ .bl-hero{ height:-webkit-fill-available; } }

/* === Content-Strong-Fix global === */
.page-body b,.page-body strong{
  text-transform:none !important; font-size:inherit !important; letter-spacing:normal !important; font-weight:600 !important; color:#e6e6e6 !important;
}

/* =======================================================
   QUOTE-FORM – gezieltes Styling
   ======================================================= */
body[class*="page-quote"] #bl-quote-form label,
body[class*="page-quote"] #bl-quote-form .form-label,
body[class*="page-quote"] #bl-quote-form .form-field > label,
body[class*="page-quote"] #bl-quote-form legend,
body[class*="page-quote"] #bl-quote-form label.checkbox,
body[class*="page-quote"] #bl-quote-form .form-field.checkbox label{ color:#e0e0e0 !important; }
body[class*="page-quote"] #bl-quote-form label *,
body[class*="page-quote"] #bl-quote-form .form-label *{ color:inherit !important; }
body[class*="page-quote"] #bl-quote-form .required,
body[class*="page-quote"] #bl-quote-form .form-label .required,
body[class*="page-quote"] #bl-quote-form label .required,
body[class*="page-quote"] #bl-quote-form label span[aria-hidden="true"]{ color:#ff6600 !important; font-weight:600 !important; }

/* DSGVO-Checkbox bündig */
body[class*="page-quote"] #bl-quote-form label.checkbox{
  display:inline-block; line-height:1.5; text-align:left; vertical-align:top; position:relative; top:-1px; max-width:92%;
}
body[class*="page-quote"] #bl-quote-form label.checkbox,
body[class*="page-quote"] #bl-quote-form label.checkbox span{ text-indent:-1.4em; padding-left:1.4em; }

/* Datenschutzseiten: keine Einrück-Logik */
body:not([class*="page-quote"]) #content .page-body label.checkbox,
body:not([class*="page-quote"]) #content .page-body label.checkbox span{ text-indent:0 !important; padding-left:0 !important; }
body:not([class*="page-quote"]) #content .page-body label,
body:not([class*="page-quote"]) #content .page-body .form-label{ color:inherit !important; }

/* Robustes Grid für Checkboxvarianten */
body[class*="page-quote"] #bl-quote-form .form-field.checkbox{
  display:grid !important; grid-template-columns:auto 1fr !important; align-items:flex-start !important; gap:.65em !important; margin:0 !important; padding:0 !important;
}
body[class*="page-quote"] #bl-quote-form .form-field.checkbox input[type="checkbox"]{
  grid-column:1 !important; margin:.25em 0 0 0 !important; accent-color:#ff6600 !important;
}
body[class*="page-quote"] #bl-quote-form .form-field.checkbox > label,
body[class*="page-quote"] #bl-quote-form .form-field.checkbox > .checkbox > label{
  grid-column:2 !important; display:block !important; max-width:92% !important; line-height:1.45 !important; color:#e6e6e6 !important; margin:0 !important; padding:0 !important;
  white-space:normal !important; word-break:normal !important; text-indent:0 !important;
}
body[class*="page-quote"] #bl-quote-form label.checkbox,
body[class*="page-quote"] #bl-quote-form label[for*="consent"]{
  display:grid !important; grid-template-columns:auto 1fr !important; align-items:flex-start !important; gap:.65em !important; max-width:100% !important; margin:0 !important; padding:0 !important; color:#e6e6e6 !important;
}
body[class*="page-quote"] #bl-quote-form label.checkbox input[type="checkbox"],
body[class*="page-quote"] #bl-quote-form label[for*="consent"] input[type="checkbox"]{
  grid-column:1 !important; margin:.25em 0 0 0 !important; accent-color:#ff6600 !important;
}
body[class*="page-quote"] #bl-quote-form label.checkbox > span,
body[class*="page-quote"] #bl-quote-form label[for*="consent"] > span,
body[class*="page-quote"] #bl-quote-form label.checkbox > *:not(input),
body[class*="page-quote"] #bl-quote-form label[for*="consent"] > *:not(input){
  grid-column:2 !important; display:block !important; line-height:1.45 !important; text-indent:0 !important; padding-left:0 !important; white-space:normal !important; word-break:normal !important; color:inherit !important;
}

/* =======================================================
   Compact ZigZag – Black-Liner
   ======================================================= */
.bl-about.compact{ position:relative; padding:32px 0; }
.bl-about.compact::before{ content:""; position:absolute; top:0; bottom:0; left:50%; width:1px; background:rgba(255,255,255,.18); transform:translateX(-50%); pointer-events:none; }
.bl-about.compact .about-row{ display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start; margin-bottom:40px; }
.bl-about.compact .about-row:nth-child(even) .left{ order:2; text-align:right; }
.bl-about.compact .about-row:nth-child(even) .right{ order:1; text-align:left; }
.bl-about.compact .col{ padding:0 16px; max-width:46ch; }
.bl-about.compact .about-row:nth-child(even) .left{ margin-left:auto; }
.bl-about.compact .about-row:nth-child(odd) .right{ margin-right:auto; }
.bl-about.compact .col p{ margin:0 0 10px 0; line-height:1.6; color:var(--bl-text-light,#ccc); }
.bl-about.compact .col p + p{ margin-top:6px; }
.bl-about.compact h2{ margin:0 0 8px 0; color:var(--bl-heading,#909090); letter-spacing:.02em; }
.bl-about.compact strong{ color:var(--bl-heading,#e0e0e0); }
.bl-about.compact blockquote{ margin:0; padding:0 0 0 18px; border-left:3px solid var(--bl-accent,#4da3ff); font-style:italic; line-height:1.55; color:var(--bl-text,#aaa); opacity:.95; }
@media (max-width:900px){
  .bl-about.compact::before{ display:none; }
  .bl-about.compact .about-row{ grid-template-columns:1fr; gap:14px; margin-bottom:28px; }
  .bl-about.compact .col{ max-width:none; padding:0; text-align:left !important; margin:0 !important; }
}

/* === Matomo Opt-Out Iframe Styling === */
iframe[src*="module=CoreAdminHome&action=optOut"]{ background:#0a0a0a !important; border:1px solid #333 !important; color:#ddd !important; }
iframe[src*="module=CoreAdminHome&action=optOut"] body,
iframe[src*="module=CoreAdminHome&action=optOut"] label,
iframe[src*="module=CoreAdminHome&action=optOut"] span{ color:#ddd !important; }

/* =======================================================
   WELCOME MODAL (über Hero)
   ======================================================= */

/* Body sperren + Content verstecken, solange Modal offen ist */
.bl-modal-open{ overflow:hidden; }
.bl-modal-open .content{ display:none; }

/* Backdrop */
.bl-modal-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.72); display:none; opacity:0;
  z-index:2147483647; transition:opacity .25s ease;
}
.bl-modal-backdrop.open{ display:block; opacity:1; }

/* Startseite: etwas hellerer Backdrop */
#bl-welcome{ background:rgba(0,0,0,.35) !important; }

/* Modal-Box (links, leicht transparent, Glas-Effekt) */
.bl-modal{
  position:absolute; top:50%; left:24px; right:auto;
  transform:translateY(-50%) scale(.98);
  width:min(700px, calc(100vw - 64px));
  padding:18px 18px 14px;

  background-color:rgba(18,18,18,.55);
  border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(6px) saturate(1.15);
  backdrop-filter:blur(6px) saturate(1.15);
  background-clip:padding-box;
  box-shadow:0 22px 60px rgba(0,0,0,.45);

  color:var(--bl-text-light,#ddd);
  outline:none; transition:transform .22s ease;
  font-size:130%; /* Text im Modal ~+30% */
}
.bl-modal-backdrop.open .bl-modal{ transform:translateY(-50%) scale(1); }

/* Titel & Text */
.bl-modal__title{
  margin:0 36px 10px 0;
  font-weight:900 !important;
  font-size:clamp(1.8rem, 3vw, 2.2rem) !important;
  color:var(--bl-heading,#e6e6e6);
  line-height:1.2;
}
.bl-modal__body{ font-size:1em; line-height:1.6; max-width:64ch; }
.bl-modal__body p{ margin:0 0 .6em; }

/* Strong-Fix im Modal (Ceevee überschreibt sonst auf 15px) */
.bl-modal strong,.bl-modal b{
  font-size:inherit !important; line-height:inherit !important; font-family:inherit !important; font-weight:700 !important;
}
.bl-modal__title strong,.bl-modal__title b{
  font-weight:900 !important; font-size:inherit !important; line-height:inherit !important; font-family:inherit !important;
}

/* Close-Button – eckig */
.bl-modal__close{
  position:absolute; right:10px; top:10px;
  width:36px; height:36px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  border-radius:0 !important;
  border:1px solid rgba(255,255,255,.16) !important;
  background:rgba(0,0,0,.35) !important;
  color:#fff !important; font-size:22px; line-height:1;
  box-shadow:none !important; outline:none !important; -webkit-appearance:none !important; appearance:none !important;
}
.bl-modal__close:hover{ background:#111; box-shadow:0 0 12px rgba(255,255,255,.20); }
.bl-modal__close:active{ transform:scale(.98); }
.bl-modal__close::before,.bl-modal__close::after{ content:none !important; display:none !important; }

/* Links im Modal */
.bl-modal a{ color:var(--bl-accent,#4da3ff); text-decoration:underline; }
.bl-modal a:hover{ color:var(--bl-accent-light,#80c4ff); }

/* Mobile */
@media (max-width:520px){
  .bl-modal{ width:calc(100vw - 24px); left:12px; font-size:120%; }
  .bl-modal__title{ margin-right:42px; }
}

/* === GLOBAL: horizontales Überlaufen verhindern ================== */
html, body{
  max-width: 100%;
  overflow-x: hidden;    /* clippt alles, was raussteht */
}

/* Zur Sicherheit auch die Haupt-Wrapper begrenzen */
#content, .row, .container{
  max-width: 100%;
  overflow-x: hidden;
  position: relative;    /* verhindert „aus der Box“ positionierte Kinder */
}

/* === QUOTE-SEITE: Upload/Spalten nie breiter als Viewport ========= */
body[class*="page-quote"] #content,
body[class*="page-quote"] #content .row,
body[class*="page-quote"] #content .columns{
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* Dropzone/Upload: auf 100% einfangen (Grav nutzt .dropzone / .dz-*) */
body[class*="page-quote"] .dropzone,
body[class*="page-quote"] [class*="dropzone"],
body[class*="page-quote"] .dz-default,
body[class*="page-quote"] .dz-message{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Vorschauliste der Uploads: nicht nach rechts „wachsen“ */
body[class*="page-quote"] .dz-preview,
body[class*="page-quote"] .dz-preview *{
  max-width: 100% !important;
}

/* Falls ein Kind-Element frech mit 100vw arbeitet: neutralisieren */
body[class*="page-quote"] [style*="100vw"],
body[class*="page-quote"] [class*="100vw"]{
  width: 100% !important;
}

/* === CONTACT-SEITE: horizontales Scrollen verhindern =============== */
body[class*="page-contact"] #content,
body[class*="page-contact"] #content .row,
body[class*="page-contact"] #content .columns,
body[class*="page-contact"] .container{
  max-width: 100% !important;
  overflow-x: hidden !important;
  position: relative;
}

/* Form und Felder dürfen nie breiter werden als der Viewport */
body[class*="page-contact"] form,
body[class*="page-contact"] .form-field{
  max-width: 100% !important;
  width: 100%;
  box-sizing: border-box;
}
body[class*="page-contact"] input[type="text"],
body[class*="page-contact"] input[type="email"],
body[class*="page-contact"] input[type="tel"],
body[class*="page-contact"] select,
body[class*="page-contact"] textarea{
  max-width: 100% !important;
  width: 100%;
  box-sizing: border-box;
}

/* Falls es auf der Kontaktseite auch Upload/Dropzone gibt */
body[class*="page-contact"] .dropzone,
body[class*="page-contact"] [class*="dropzone"],
body[class*="page-contact"] .dz-default,
body[class*="page-contact"] .dz-message{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Iframes/Karten sauber einfangen */
body[class*="page-contact"] .map,
body[class*="page-contact"] .map iframe,
body[class*="page-contact"] iframe{
  width: 100% !important;
  max-width: 100% !important;
  display: block;
  box-sizing: border-box;
}

/* Notbremse gegen Elemente, die 100vw o. ä. verwenden */
body[class*="page-contact"] [style*="100vw"],
body[class*="page-contact"] [style*="vw"]{
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* === Klaro: Orange-Brand === */
#klaro .cm-btn{border-radius:12px !important; font-weight:600 !important; padding:.6rem 1rem !important;}

#klaro .cm-btn.cm-btn-accept,
#klaro .cm-btn.cm-btn-success{
  background:#ff7a00 !important;      /* ORANGE */
  border-color:#ff7a00 !important;
  color:#ffffff !important;            /* weiße Schrift */
}
#klaro .cm-btn.cm-btn-accept:hover{filter:brightness(.95) !important;}
#klaro .cm-btn.cm-btn-accept:focus{box-shadow:0 0 0 3px rgba(255,122,0,.3) !important;}

/* „Nur notwendige“ / Ablehnen dunkel lassen */
#klaro .cm-btn.cm-btn-decline,
#klaro .cm-btn.cm-btn-danger{
  background:#1e1e1e !important;
  border-color:rgba(255,255,255,.18) !important;
  color:#d0d0d0 !important;
}

/* Links & Switch auf Orange */
#klaro a{color:#ff7a00 !important;}
#klaro .cm-switch input:checked + .slider{background:#ff7a00 !important;}

/* =======================================================
   SIMPLE BLACK-LINER LIGHTBOX (passt zu custom-gallery.js)
   ======================================================= */

.bl-lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.9);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:2147483647; /* über allem */
}

.bl-lightbox.open{
  display:flex;
}

.bl-lightbox__inner{
  position:relative;
  max-width:90vw;
  max-height:90vh;
  outline:none;
}

.bl-lightbox__inner img{
  display:block;
  max-width:100%;
  max-height:100%;
  box-shadow:0 0 30px rgba(0,0,0,.8);
}

.bl-lightbox__inner .caption{
  margin-top:.6rem;
  text-align:center;
  color:#ccc;
  font-size:.9rem;
}

.bl-lightbox__inner .btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,.6);
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  width:44px;
  height:44px;
  border-radius:999px;
  cursor:pointer;
  font-size:1.4rem;
  display:flex;
  align-items:center;
  justify-content:center;
}

.bl-lightbox__inner .btn.close{
  top:-2.4rem;
  right:0;
  transform:none;
  width:34px;
  height:34px;
  border-radius:4px;
}

.bl-lightbox__inner .btn.prev{
  left:-56px;
}

.bl-lightbox__inner .btn.next{
  right:-56px;
}

@media(max-width:640px){
  .bl-lightbox__inner .btn.prev{
    left:4px;
  }
  .bl-lightbox__inner .btn.next{
    right:4px;
  }
}

/* ==========================================
   About/Service: Andale-Mono-Reste auf Verdana zwingen
   ========================================== */

/* Alle Elemente im Content, die im style-Attribut "andale mono"
   stehen haben, werden auf Verdana gestellt */
#content [style*="andale mono"],
#content [style*="Andale Mono"],
#content [style*="ANDALE MONO"] {
  font-family: Verdana, Geneva, sans-serif !important;
}

/* Fleet-Übersicht: Link-Buttons unter den Bildern */
.content a.fleet-click__button{
  font-size:1.8rem;
  color:var(--bl-heading);          /* hellgrau wie Überschriften */
  text-decoration:none;             /* keine Unterstreichung */
  font-weight:600;
  letter-spacing:.03em;
  text-transform:none;
  border-bottom:1px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}

.content a.fleet-click__button:hover{
  color:var(--bl-active);           /* dein Orange */
  border-bottom-color:var(--bl-active);
  text-decoration:none;
}

/* Fleet-Tabelle: keine sichtbaren Ränder, transparenter Hintergrund */
.fleet-table,
.fleet-table td,
.fleet-table th{
  border:none !important;
  background:transparent !important;
}