@charset "UTF-8";
/*
Theme Name: beclaydung
Theme URI: https://beclaydung.iv-lehm.de/
Author: SIGN+DESIGN Werbeagentur
Author URI: https://www.signunddesign.com/
Description: Wozu lange um den „heißen Brei" reden: Unser Ziel ist Ihr Erfolg! Denn nur erfolgreiche Kunden sind auf Dauer glückliche Kunden. Und um Sie glücklich zu machen, richten wir unsere Energie auf Ihren stimmigen Auftritt und die Entwicklung zielführender Kommunikationsmaßnahmen. Werbung darf bei uns Spaß machen und ist trotzdem niemals Selbstzweck. Was zählt ist Ihr Erfolg! Die Früchte unserer Bemühungen: treue, langjährige Kunden und zahlreiche Weiterempfehlungen – mit ein Grund dafür, dass viele unserer Kunden aus dem Bereich Immobilien stammen. Und hier liegt auch seit über 20 Jahren ein Schwerpunkt unserer Arbeit.
Version: 2.1
*/

/* ========================================
   GLOBAL RESET
   ======================================== */

body, html, h1, h2, h3, h4, h5, h6, p, ul, ol, li {padding: 0;margin: 0;}
body, html {overflow: unset;width: 100%;-webkit-font-smoothing: antialiased;-webkit-overflow-scrolling: touch;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

/* ========================================
   CSS VARIABLES
   ======================================== */

* {
    /* Typography */
    --font-family: "helvetica-lt-pro", sans-serif;
    --font-family-c: "courier-std", monospace;
    --font-size: 16px;
    --line-height: calc(var(--font-size) * 1.8);

    /* Layout */
    --wrp-width: 1240px;
    --header-height: 80px;

    /* Colors */
    --primary-color: #225a38;
    --secondary-color: #bea574;
    --accent-green-mid: #8cc172;
    --accent-green-light: #c4db9b;
    --text-color: #1A1A1A;
    --bg-white: #fff;
    --bg-light-gray: #FAF9F7;
    --bg-lighter-gray: #f8f8f8;
    --bg-gray: #efefef;
    --border-gray: #dedede;
    --icon-gray: #a4a4a4;
    --text-dark: #555;

    /* Effects */
    --transition: .2s ease;
    --box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.3);
    --border-radius: 15px;
}

/* ========================================
   GLOBAL STYLES
   ======================================== */

html {scroll-behavior: smooth;background:var(--bg-light-gray)}
body {font-size: var(--font-size);font-family: var(--font-family), sans-serif;line-height: var(--line-height);color: var(--text-color);}
body.nav-open {overflow: hidden;}
img {-ms-interpolation-mode: bicubic;vertical-align: bottom;max-width: 100%;height: auto;}
svg {width: 100%;height: 100%;}
hr {border: none;height: 1px;background: #ddd;margin: 0;}
.wrp {max-width: var(--wrp-width);width: 90%;margin: 0 auto;position: relative;box-sizing: border-box;}

/* ========================================
   UTILITY CLASSES
   ======================================== */

/* Margins */
.mb {margin-bottom: 100px;}
.mb50 {margin-bottom: 50px;}

/* ========================================
   TYPOGRAPHY
   ======================================== */

h1, h2, h3, h4 {margin: 0;}
h1 {font-size: 48px;line-height: 1.2;}
h2 {font-size: 28px;line-height: 1.3;margin-bottom: 20px;font-weight: 600;}
h3 {font-size: 22px;line-height: 1.3;margin-bottom: 15px;font-weight: 600;}
h4 {font-size: 18px;line-height: 1.3;margin-bottom: 10px;font-weight: 600;}
a {text-decoration: none;outline: none;color: var(--text-color);transition: var(--transition);}
a:hover {color: var(--secondary-color);transition: var(--transition);}
.btn {padding: 5px 15px 5px 10px;background: #fff;border:1px solid var(--border-gray);display: inline-flex;align-items: center;gap: 8px;margin-top: 25px;font-family: var(--font-family-c);transition: var(--transition);}
.btn:hover {background: var(--accent-green-mid);border-color: var(--accent-green-light);}
.btn::before {content: '';display: inline-block;width: 9px;height: 9px;border-radius: 50%;background: var(--primary-color);flex-shrink: 0;}
p {margin-bottom: var(--line-height);}
p:last-child {margin-bottom: 0;}
address {font-style: normal;color: var(--text-color);}
address a {display: block;}
ol, ul {margin-bottom: var(--line-height);}
li {margin-left: 20px;}

/* ========================================
   HEADER
   ======================================== */

header {position: fixed;top: 0;width: 100%;z-index: 10;padding: 15px 0;box-sizing: border-box;background: var(--bg-white);box-shadow: var(--box-shadow);}
header .header-grid {display: grid;grid-template-columns: 200px auto;grid-template-rows: auto;justify-items: start;align-items: center;justify-content: space-between;}
header .header-grid .logo {width: 100%;}
header .header-grid .logo a {display: flex;align-items: center;}
header .header-grid .mainnav-toggle {display: none;justify-self: end;}

/* ========================================
   NAVIGATION - DESKTOP
   ======================================== */

#mainnav ul.mainnav.smart {display: none;}
#mainnav {display: block;transform: translate(0);}
#mainnav ul.mainnav.desktop li {list-style-type: none;margin-left: 6px;}
#mainnav ul.mainnav.desktop li:first-child {margin-left: 0;}
#mainnav ul.mainnav.desktop li a {display: block;color: var(--primary-color);transition: var(--transition);padding: 8px 18px;font-family: var(--font-family-c);font-size: 14px;border: 1px solid var(--border-gray);background: var(--bg-white);}
#mainnav ul.mainnav.desktop li a:hover {background: var(--secondary-color);color: var(--text-color);border-color: var(--secondary-color);}
#mainnav ul > li.current-menu-item > a {background: var(--primary-color);color: #fff;border-color: var(--primary-color);}

/* ========================================
   NAVIGATION - DESKTOP SUBMENU
   ======================================== */

@media (min-width: 1025px) {
    #mainnav ul.mainnav.desktop {display: flex;align-items: center;margin: 0;}
    html.scrolled #mainnav ul.mainnav li a {transition: var(--transition);}

    /* Submenu Level 1 — top:100% verhindert die Lücke zwischen Link und Untermenü */
    #mainnav ul.mainnav li.menu-item-has-children {position: relative;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu {position: absolute;top: 100%;left: 0;display: block;max-height: 0;overflow: hidden;min-width: 270px;background: var(--bg-white);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li {width: 100%;padding: 0;margin: 0;background: var(--bg-white);border-bottom: 1px solid var(--border-gray);transition: background var(--transition);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:last-child {border-bottom: none;margin-bottom: 0;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li a {display: block;padding: 11px 18px;color: var(--text-color);font-family: var(--font-family-c);font-size: 14px;background: none;border: none;transition: color var(--transition);}
    #mainnav ul.mainnav li.menu-item-has-children:hover > ul.sub-menu {max-height: 674px;overflow: visible;box-shadow: 0 8px 24px rgba(0,0,0,0.12);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover {background: var(--primary-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li:hover a {color: #fff;}

    /* Submenu Level 2 */
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu {position: absolute;left: 100%;top: 0;overflow: hidden;min-width: 230px;box-shadow: none;}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children:hover ul.sub-menu {overflow: visible;box-shadow: 0 8px 24px rgba(0,0,0,0.12);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li {background: var(--bg-light-gray);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li a {color: var(--text-color);}
    #mainnav ul.mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children ul.sub-menu li:hover a {color: var(--primary-color);}

    /* Hide mobile elements on desktop */
    #mainnav .head, #mainnav address.contact, #mainnav ul.mainnav li.back, #mainnav .opensubnav {display: none;}
}

/* ========================================
   NAVIGATION - MOBILE OFFCANVAS
   ======================================== */

@media (max-width: 1024px) {
    .mainnav.desktop {display: none;}

    /* Offcanvas Panel */
    #mainnav ul.mainnav.smart {display: block;}
    #mainnav {position: fixed;top: 0;right: 0;bottom: 0;background: var(--bg-white);width: 100%;max-width: 500px;transform: translateX(103%);transition: var(--transition);box-shadow: var(--box-shadow);z-index: 2;}
    #mainnav.active {transform: translateX(0);transition: var(--transition);}

    /* Offcanvas Header */
    #mainnav .head {display: grid;grid-template-columns: auto auto 55px;align-items: center;padding: 20px;box-sizing: border-box;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);}
    #mainnav .head p {margin: 0;font-size: 25px;color: var(--text-color);}
    #mainnav .head .buttons {display: flex;justify-content: center;justify-self: end;}
    #mainnav .head .buttons a {width: 50px;height: 50px;border-radius: 2px;background: var(--bg-light-gray);margin-left: 5px;display: flex;align-items: center;justify-content: space-around;}
    #mainnav .head .buttons a:first-child {margin-left: 0;}
    #mainnav .head .buttons a svg {width: 25px;height: 25px;}
    #mainnav .head .buttons a svg g path {stroke: var(--icon-gray);}

    /* Mobile Menu Items */
    #mainnav ul.mainnav li {padding: 0;box-sizing: border-box;margin: 0;background: var(--bg-gray);border-bottom: 1px solid var(--border-gray);list-style-type: none;}
    #mainnav ul.mainnav li a {font-size: var(--font-size);padding: 10px 45px 10px 5%;display: block;}

    /* Submenu Toggle Button */
    #mainnav .opensubnav {cursor: pointer;width: 49px;height: 49px;position: absolute;right: 0;background: var(--bg-white);display: block;z-index: 100;box-sizing: border-box;}
    #mainnav .opensubnav.active {background: var(--secondary-color);}
    #mainnav .opensubnav:after {content: '';transform: rotate(-45deg) translate(-50%, -50%);border: solid var(--secondary-color);border-width: 0 2px 2px 0;display: inline-block;padding: 3px;left: 50%;top: 42%;position: absolute;transition: var(--transition);}
    #mainnav .opensubnav.active:after {content: '';transform: rotate(45deg);-webkit-transform: rotate(45deg);border: solid var(--bg-white);border-width: 0 2px 2px 0;left: 19px;top: 18px;transition: var(--transition);}
    #mainnav address.contact {padding: 5%;box-sizing: border-box;display: block;}

    /* Submenu Level 1 */
    #mainnav li.menu-item-has-children ul.sub-menu {display: none;transition: var(--transition);margin-bottom: 0;}
    #mainnav li.menu-item-has-children.active ul.sub-menu {display: block;}
    #mainnav li.menu-item-has-children.active ul.sub-menu li a {background: var(--bg-white);padding-left: 10%;}
    #mainnav li.menu-item-has-children.active ul.sub-menu li ul.sub-menu li a {padding-left: 15%;}

    /* Submenu Level 2 */
    #mainnav li.menu-item-has-children ul.sub-menu li.menu-item-has-children .opensubnav {background: var(--bg-light-gray);}
    #mainnav li.menu-item-has-children.active ul.sub-menu li.menu-item-has-children ul.sub-menu {display: none;transition: var(--transition);}
    #mainnav li.menu-item-has-children.active ul.sub-menu li.menu-item-has-children.active ul.sub-menu {display: block;transition: var(--transition);}
    #mainnav ul.offcanvas-menu li.back a:before {display: none;}

    /* Hamburger Menu Toggle */
    .mainnav-toggle {border-radius: 2px;display: block;position: relative;z-index: 10;width: 50px;height: 50px;background: var(--primary-color);box-shadow: none;transition: var(--transition);}
    .mainnav-toggle.off {border-radius: 2px;display: block;position: absolute;z-index: 10;top: 50%;right: 0;transform: translateY(-50%);width: 50px;height: 50px;background: var(--primary-color);box-shadow: 1px 2px 10px 0px rgba(0, 0, 0, 0.3);transition: var(--transition);}
    .mainnav-toggle.off.active {display: none;}
    .mainnav-toggle .btn-mainnav-toggle {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 35px;cursor: pointer;}
    .mainnav-toggle .btn-mainnav-toggle span {display: block;width: 100%;box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.3);border-radius: 4px;height: 2px;background: var(--bg-white);transition: all .3s;position: relative;}
    .mainnav-toggle .btn-mainnav-toggle span + span {margin-top: 7px;}
    .mainnav-toggle .btn-mainnav-toggle.active span + span {margin-top: 13px;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(1) {animation: ease .7s top forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(1) {animation: ease .7s top-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(2) {animation: ease .7s scaled forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(2) {animation: ease .7s scaled-2 forwards;}
    .mainnav-toggle .btn-mainnav-toggle.active span:nth-child(3) {animation: ease .7s bottom forwards;}
    .mainnav-toggle .btn-mainnav-toggle.not-active span:nth-child(3) {animation: ease .7s bottom-2 forwards;}

    /* Hamburger Animations */
    @keyframes top {
        0% {top: 0;transform: rotate(0);}
        50% {top: 15px;transform: rotate(0);}
        100% {top: 15px;transform: rotate(45deg);}
    }

    @keyframes top-2 {
        0% {top: 15px;transform: rotate(45deg);}
        50% {top: 15px;transform: rotate(0deg);}
        100% {top: 0;transform: rotate(0deg);}
    }

    @keyframes bottom {
        0% {bottom: 0;transform: rotate(0);}
        50% {bottom: 15px;transform: rotate(0);}
        100% {bottom: 15px;transform: rotate(135deg);}
    }

    @keyframes bottom-2 {
        0% {bottom: 15px;transform: rotate(135deg);}
        50% {bottom: 15px;transform: rotate(0);}
        100% {bottom: 0;transform: rotate(0);}
    }

    @keyframes scaled {
        50% {transform: scale(0);}
        100% {transform: scale(0);}
    }

    @keyframes scaled-2 {
        0% {transform: scale(0);}
        50% {transform: scale(0);}
        100% {transform: scale(1);}
    }

    /* Overlay */
    #mainnav-overlay {position: fixed;top: 0;right: 0;left: 0;bottom: 0;background: rgba(0, 0, 0, 0.2);backdrop-filter: blur(7px);opacity: 0;z-index: -5;transition: var(--transition);visibility: hidden;}
    #mainnav-overlay.active {opacity: 1;z-index: 1;visibility: visible;transition: var(--transition);}
}

/* ========================================
   STAGE / HERO SECTIONS
   ======================================== */

.stage {position: relative;margin-top: var(--header-height);}
.stage.mb {margin-bottom: 50px}
.stage .stage-content h1 {font-size:60px;line-height:70px;color:var(--text-color);font-weight:400;}
.stage .stage-content h1 strong{color:var(--primary-color);font-weight:400;}
.stage .stage-content p {margin:0;max-width:650px;}
.stage .stage-content p strong {color:var(--primary-color);font-size:13px; text-transform: uppercase;font-family: var(--font-family-c)}

/* Fallback für Browser ohne aspect-ratio Support */
@supports not (aspect-ratio: 3/1) {
    .stage {padding-top: 33.33%;}
}

.stage .wrp {padding-top:50px;display:block;}
.stage img {width: 100%;height: 100%;object-fit: cover;object-position: center;}
.stage.subpage {width: 100%;position: relative;background: var(--bg-lighter-gray);padding: 40px 0;}
.stage.subpage .wrp {padding-top: 0;}
.stage.subpage .page-label {font-family: var(--font-family-c);font-size: 12px;text-transform: uppercase;letter-spacing: 0.08em;color: var(--primary-color);margin-bottom: 10px;font-weight: 400;}
.stage.subpage h1 {font-size: 42px;line-height: 1.15;font-weight: 400;margin-bottom: 0;}
.stage.subpage .page-subtitle {font-size: 42px;line-height: 1.15;font-weight: 400;color: var(--primary-color);margin-bottom: 0;}
.stage.subpage .stage-content h1 {font-size: 42px;line-height: 1.15;font-weight: 400;}
.stage.subpage .stage-content h1 strong {color: var(--primary-color);font-weight: 400;}
.stage.subpage .stage-content p {max-width: 700px;}
.stage.subpage .stage-content p strong {color: var(--primary-color);font-size: 13px;text-transform: uppercase;font-family: var(--font-family-c);}


/* ========================================
   SUB-PAGE TAB NAVIGATION
   ======================================== */

.subnav {border-bottom: 1px solid var(--border-gray);background: var(--bg-white);}
.subnav .wrp {display: flex;}
.subnav ul {display: flex;list-style: none;margin: 0;padding: 0;gap: 0;flex-wrap: wrap;}
.subnav ul li {margin: 0;}
.subnav ul li a {display: block;padding: 14px 22px;font-family: var(--font-family-c);font-size: 14px;color: var(--primary-color);border: 1px solid var(--border-gray);border-bottom: none;margin-right: 6px;margin-top: 8px;transition: var(--transition);background: var(--bg-white);}
.subnav ul li a:hover {background: var(--secondary-color);color: var(--text-color);}
.subnav ul li.active a {background: var(--primary-color);color: #fff;border-color: var(--primary-color);}

/* ========================================
   INTROBLOCK (Sub-page title area)
   ======================================== */

.introblock {padding: 50px 0 40px 0;}
.introblock .page-label {font-family: var(--font-family-c);font-size: 12px;text-transform: uppercase;letter-spacing: 0.08em;color: var(--primary-color);margin-bottom: 10px;font-weight: 400;}
.introblock h1 {font-size: 42px;line-height: 1.15;font-weight: 400;margin-bottom: 0;}
.introblock .page-subtitle {font-size: 42px;line-height: 1.15;font-weight: 400;color: var(--primary-color);margin-bottom: 20px;}
.introblock .page-desc {max-width: 700px;color: var(--text-dark);margin: 0;font-size: 15px;line-height: 1.7;}

/* ========================================
   PAGE LAYOUT
   ======================================== */

main.withsidebar .page-build {display: grid;grid-template-columns: 70% 25%;align-items: flex-start;justify-content: space-between;max-width: var(--wrp-width);width: 90%;margin: 0 auto;}
main.withsidebar .content .wrp {width: 100%;}

/* ========================================
   CONTENT BLOCKS
   ======================================== */

/* Text Block */
.text.multiple-col .wrp {-webkit-columns: 2 350px;-moz-columns: 2 350px;columns: 2 350px;-webkit-column-gap: 4em;-moz-column-gap: 4em;column-gap: 4em;}
.text.align-center {text-align: center;}

/* Text + Image Block */
.textbild .wrp {display: grid;align-items: center;gap: 60px;box-sizing: border-box;}
.textbild .text {box-sizing: border-box;}
.textbild .text h2.title {font-size: 28px;font-weight: 400;line-height: 1.3;margin-bottom: 20px;}
.textbild .bild {width: 100%;align-self: start;}
.textbild .bild img {width: 100%;height: auto;display: block;}

/* Teasercards */
/* ========================================
   TEASERCARDS COMPONENT
   ======================================== */

.teasercards {position: relative;}
.teasercards .wrp {position: relative;overflow: visible;}
.teasercards .cards.no-carousel {display: grid;grid-column-gap: 30px;grid-row-gap: 30px;margin: 0;}
.teasercards .cards.no-carousel li {list-style-type: none;margin: 0;}
.teasercards .splide {overflow: visible;position: relative;}
.teasercards .splide .splide__track {overflow: hidden;}
.teasercards .splide ul.cards {display: flex;grid-column-gap: unset;}

/* Card */
.teasercard-item {display: flex;flex-direction: column;background: var(--bg-white);border-radius: var(--border-radius);overflow: hidden;box-shadow: 0 2px 12px 0 rgba(0,0,0,.08);transition: box-shadow var(--transition);}
.teasercard-item:hover {box-shadow: 0 6px 24px 0 rgba(0,0,0,.16);}

/* Bild */
.teasercard-item .img-wrp {width: 100%;display: block;flex-shrink: 0;overflow: hidden;}
.teasercard-item .img-wrp img {width: 100%;height: auto;display: block;transition: transform .4s ease;}
.teasercard-item:hover .img-wrp img {transform: scale(1.04);}

/* Content-Bereich */
.teasercard-item .teasercard-content {display: flex;flex-direction: column;flex: 1;padding: 25px 25px 30px;}

/* Titel */
.teasercard-item .teasercard-content h3 {font-size: 22px;line-height: 1.3;color: var(--text-color);font-weight: 700;}

/* Subline */
.teasercard-item .teasercard-content .teasercard-subline {display: block;color: var(--primary-color);font-weight: 700;font-size: 13px;font-family: var(--font-family-c);margin-top: 8px;}

/* Excerpt */
.teasercard-item .teasercard-content p {color: var(--text-dark);font-size: var(--font-size);line-height: var(--line-height);margin-top: 14px;margin-bottom: 0;flex: 1;}

/* Button */
.teasercard-item .teasercard-content .btn {display: inline-flex;background: none;border: none;padding: 0;margin-top: 22px;color: var(--primary-color);font-weight: 700;font-size: 13px;font-family: var(--font-family-c);}
.teasercard-item .teasercard-content .btn::before {background: var(--primary-color);}

.teasercards .splide__arrow--prev {left: -100px;}
.teasercards .splide__arrow--next {right: -100px;}

/* Image Block */
.image img {display: block;width: 100%;height: 100%;max-height: 300px;object-fit: cover}
.bildtrenner {width: 100%;aspect-ratio: 3/1;overflow: hidden;position: relative;}

@supports not (aspect-ratio: 3/1) {
    .bildtrenner {padding-top: 33.33%;}
}

.bildtrenner img {width: 100%;height: 100%;object-fit: cover;object-position: center;}
.bildtrenner .wrp {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 2;}

/* ========================================
   GALLERY COMPONENT
   ======================================== */

/* Gemeinsame Overlay-Styles für Galerie und Video */
.gallery-overlay {width: 100%;position: absolute;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background: var(--accent-green-mid);opacity: 0;transition: var(--transition);}
.gallery-overlay .icon-wrp {position: absolute;top: 50%;left: 50%;width: 45px;height: 45px;transform: translate(-50%, -50%);}
.gallery-overlay .icon-wrp svg {width: 100%;height: 100%;transform: scale(0);transition: var(--transition);}
.gallery-overlay .icon-wrp svg path {fill: var(--bg-white);}

/* Gallery Heading */
.gallery-heading {font-size: 24px;font-weight: 400;margin-bottom: 25px;color: var(--text-color);}

/* Image Gallery */
.gallery .glightbox-gallery:not(.masonry) {display: grid;gap: 20px;margin-bottom: 0;}
.gallery .glightbox-gallery li {list-style-type: none;margin: 0;border-radius: 3px;overflow: hidden;aspect-ratio: 4/3;}

@supports not (aspect-ratio: 4/3) {
    .gallery .glightbox-gallery li {padding-top: 75%;position: relative;}
    .gallery .glightbox-gallery li a {position: absolute;top: 0;left: 0;width: 100%;}
}

.gallery .glightbox-gallery:not(.masonry) li {margin: 0;}
.gallery .glightbox-gallery li a {position: relative;display: block;overflow: hidden;height: 100%;}
.gallery .glightbox-gallery li a .overlay {width: 100%;position: absolute;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background: var(--accent-green-mid);opacity: 0;transition: var(--transition);}
.gallery .glightbox-gallery li a:hover .overlay {opacity: 0.6;transition: var(--transition);}
.gallery .glightbox-gallery li a .overlay .icon-wrp {position: absolute;top: 50%;left: 50%;width: 45px;height: 45px;transform: translate(-50%, -50%);}
.gallery .glightbox-gallery li a .overlay .icon-wrp svg {width: 100%;height: 100%;transform: scale(0);transition: var(--transition);}
.gallery .glightbox-gallery li a .overlay .icon-wrp svg path {fill: var(--bg-white);}
.gallery .glightbox-gallery li a:hover .overlay .icon-wrp svg {transform: scale(1);transition: var(--transition);}
.gallery .glightbox-gallery li img {width: 100%;height: 100%;object-fit: cover;}
.gallery .glightbox-gallery.masonry {gap: 25px;columns: 4;margin: 0 auto;}

/* Video Gallery */
.gallery .video-gallery-grid {display: grid;grid-column-gap: 50px;grid-row-gap: 50px;}
.gallery .video-gallery-grid .video-gallery-item {height: 220px;width: 100%;display: block;position: relative;overflow: hidden;}
.gallery .video-gallery-grid .video-gallery-item .overlay {width: 100%;position: absolute;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background: var(--accent-green-mid);opacity: 0;transition: var(--transition);z-index: 4;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay {opacity: 0.6;transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp {position: absolute;top: 50%;left: 50%;width: 45px;height: 45px;transform: translate(-50%, -50%);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg {width: 100%;height: 100%;transform: scale(0);transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg path {fill: var(--bg-white);}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay .icon-wrp svg {transform: scale(1);transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item img {height: 100%;width: 100%;object-fit: cover;object-position: center;transform: scale(1.2);}

/* ========================================
   EMBED / VIDEO
   ======================================== */

.embed .respo-video {position: relative;height: 0;overflow: hidden; padding-bottom: 56.25%;}
.embed .respo-video iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.embed .respo-video ._brlbs-cb-youtube {margin-bottom: -56.25%;}

/* ========================================
   ACCORDION
   ======================================== */

.accordion .item-accordion-head {cursor: pointer;position: relative;background: #f2f2f2;margin-bottom: 10px;padding: 10px 45px 10px 15px;border: 1px solid #f2f2f2;}
.accordion .item-accordion-head .item-accordion-title {font-size: 17px;font-weight: 600;margin: 0;line-height: 1.4;}
.accordion .active .item-accordion-head {background-color: var(--bg-lighter-gray);}
.accordion .item-accordion-btn {width: 26px;height: 26px;float: right;margin: 0;cursor: pointer;position: absolute;right: 5px;top: 50%;transform: translateY(-50%);}
.accordion .item-accordion-btn:before {content: '+';color: var(--text-dark);position: absolute;width: 26px;height: 26px;text-align: center;line-height: 22px;font-size: 24px;}
.accordion .item-accordion {margin-bottom: 5px;}
.accordion .item-accordion.hidden .item-accordion-btn:before {content: '+';line-height: 26px;}
.accordion .item-accordion.active .item-accordion-btn:before {content: '-';line-height: 22px;}
.accordion .item-accordion.hidden.active .item-accordion-btn:before {content: '-';line-height: 22px;}
.accordion .item-accordion.hidden .item-accordion-content {display: none;padding: 25px 20px;background: var(--bg-lighter-gray);margin-bottom: 10px;}
.accordion .item-accordion.hidden .item-accordion-content:after {display: block;width: 0;height: 0;border-right: 100px solid #037CA9;border-top: 50px solid transparent;border-bottom: 50px solid transparent;}
.accordion .item-accordion:not(.hidden) .item-accordion-content {padding: 25px 20px;background: var(--bg-lighter-gray);margin-bottom: 10px;}

/* ========================================
   TABLES (in text + shortcode blocks)
   ======================================== */

.text table, .shortcode table {width: 100%;border-collapse: collapse;margin-bottom: var(--line-height);font-size: 15px;}
.text table th, .shortcode table th {background: var(--primary-color);color: #fff;padding: 10px 15px;text-align: left;font-weight: 600;border: 1px solid var(--primary-color);}
.text table td, .shortcode table td {padding: 9px 15px;border: 1px solid var(--border-gray);vertical-align: top;}
.text table tr:nth-child(even) td, .shortcode table tr:nth-child(even) td {background: var(--bg-lighter-gray);}
.text table tr:hover td, .shortcode table tr:hover td {background: var(--bg-gray);}
.text table caption, .shortcode table caption {caption-side: top;text-align: left;font-weight: 600;font-size: 16px;margin-bottom: 10px;color: var(--text-color);}
.shortcode .wp-block-file {display: flex;align-items: center;gap: 10px;padding: 12px 15px;background: var(--bg-lighter-gray);border: 1px solid var(--border-gray);border-radius: 4px;margin-bottom: 10px;}
.shortcode .wp-block-file a {color: var(--primary-color);font-weight: 500;}

/* Tabelle Block (ACF Flex Layout) */
.tabelle-heading {font-size: 24px;font-weight: 400;margin-bottom: 20px;color: var(--text-color);}
.tabelle-scroll {width: 100%;overflow-x: auto;-webkit-overflow-scrolling: touch;}
.tabelle table {width: 100%;border-collapse: collapse;font-size: 15px;}
.tabelle table thead th {background: var(--primary-color);color: #fff;padding: 10px 15px;text-align: left;font-weight: 600;border: 1px solid var(--primary-color);vertical-align: top;}
.tabelle table tbody td {padding: 9px 15px;border: 1px solid var(--border-gray);vertical-align: top;}
.tabelle table tbody tr:nth-child(even) td {background: var(--bg-lighter-gray);}
.tabelle table tbody tr:hover td {background: var(--bg-gray);}
.tabelle table tbody tr.tabelle-trennung td {border-bottom-width: 3px;border-bottom-color: #ccc;}

/* Downloads Block (ACF Flex Layout) */
.downloads .downloads-heading {font-size: 24px;font-weight: 400;margin-bottom: 20px;color: var(--text-color);}

/* Downloads Section (legacy) */
.downloads-section {margin-bottom: 100px;}
.downloads-section h2 {font-size: 24px;font-weight: 400;margin-bottom: 20px;color: var(--text-color);}
.download-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 8px;}
.download-item {display: flex;align-items: center;gap: 12px;padding: 12px 16px;border: 1px solid var(--border-gray);background: var(--bg-white);transition: var(--transition);}
.download-item:hover {border-color: var(--primary-color);background: var(--bg-light-gray);}
.download-item::before {content: '';display: block;width: 20px;height: 24px;flex-shrink: 0;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 28'%3E%3Crect width='24' height='28' rx='2' fill='%23225A38' opacity='.15'/%3E%3Ctext x='3' y='20' font-size='7' font-family='sans-serif' fill='%23225A38' font-weight='700'%3EPDF%3C/text%3E%3C/svg%3E");background-repeat: no-repeat;background-size: contain;}
.download-item a {color: var(--text-color);font-size: 14px;font-family: var(--font-family-c);text-decoration: none;}
.download-item a:hover {color: var(--primary-color);}

/* Shortcode as downloads (wenn .download-grid class im HTML) */
.shortcode .download-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 8px;}

/* ========================================
   BLOG & SIDEBAR
   ======================================== */

main.withsidebar .content .blog-grid {display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 50px;grid-row-gap: 50px;}
main.withsidebar .content .blog-grid .post {width: 100%;}
main.withsidebar .content .blog-grid .post img {width: 100%;height: auto;object-fit: cover;}
article.singlepost .post-image img {width: 100%;height: auto;object-fit: cover;}

/* Sidebar */
main.withsidebar .sidebar {width: 100%;position: -webkit-sticky;position: sticky;top: 150px;background: var(--bg-light-gray);padding: 25px;box-sizing: border-box;}

/* ========================================
   FOOTER
   ======================================== */

/* Förder- & Partnerlogos – eine Zeile, weißer Hintergrund */
.funded-by {background: #fff;border-top: 1px solid var(--border-gray);padding: 22px 0;}
.funded-by .wrp {display: flex;align-items: center;justify-content: space-between;gap: 30px;flex-wrap: wrap;}
.funded-by__group {display: flex;align-items: center;gap: 20px;}
.funded-by__label {font-family: var(--font-family-c);font-size: 13px;color: var(--text-dark);white-space: nowrap;}
.funded-by__logo {height: 70px;width: auto;display: block;}

/* Partnerlogos */
.footer-partners {display: flex;align-items: center;gap: 18px;flex-wrap: wrap;}
.footer-partners__label, .footer-partners__connector {font-family: var(--font-family-c);font-size: 13px;color: var(--text-dark);white-space: nowrap;}
.partner-logo {display: block;width: auto;}
.partner-logo--iv-lehm {height: 55px;}
.partner-logo--tum {height: 45px;}

/* Footer Hauptbereich */
footer {background: var(--secondary-color);font-family: var(--font-family-c);font-size: 14px;padding: 30px 0;}
.footer-inner {display: flex;align-items: center;gap: 30px;flex-wrap: wrap;}

/* Bottom-Leiste */
.bottom .wrp {display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;font-size: 13px;font-family: var(--font-family-c);padding: 10px 0 20px 0;}
.bottom .wrp ul {list-style-type: none;margin: 0;}
.bottom .wrp ul li {display: inline-block;margin: 0;}

@media (max-width: 768px) {
    .funded-by .wrp {flex-direction: column;align-items: flex-start;gap: 20px;}
    .funded-by__logo {height: 55px;}
    .footer-partners {gap: 12px;}
    .partner-logo--iv-lehm {height: 40px;}
    .partner-logo--tum {height: 30px;}
    .footer-inner {flex-direction: column;align-items: flex-start;}
}

/* ========================================
   404 ERROR PAGE
   ======================================== */

.error404 .stage {display: none;}
.pageerror {padding: 250px 0 100px 0;text-align: center;}

/* ========================================
   CUSTOM SLIDER
   ======================================== */

.splide {position: relative;overflow: hidden;width: 100%;margin: 0;}
.splide .splide__track {overflow: visible;width: 100%;}
.splide .splide__list, .splide .cards {display: flex;margin: 0;padding: 0;list-style: none;width: 100%;transition: transform 0.5s ease;}
.splide .splide__slide, .splide .cards > * {flex-shrink: 0;margin: 0;list-style: none;}
.splide__arrow {position: absolute;top: 50%;transform: translateY(-50%);width: 50px;height: 50px;border-radius: 50%;background: var(--primary-color);color: var(--bg-white);border: none;font-size: 24px;cursor: pointer;z-index: 5;transition: var(--transition);display: flex;align-items: center;justify-content: center;box-shadow: var(--box-shadow);font-weight: 300;}
.splide__arrow:hover {background: var(--secondary-color);transform: translateY(-50%) scale(1.1);transition: var(--transition);}
.splide__arrow--prev {left: -25px;}
.splide__arrow--next {right: -25px;}
.splide__arrow:disabled {opacity: 0.3;cursor: not-allowed;}
.splide .clone {opacity: 1;}

/* ========================================
   CUSTOM LIGHTBOX
   ======================================== */

.custom-lightbox {position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 999999;opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;pointer-events: none;}
.custom-lightbox.active {opacity: 1;visibility: visible;pointer-events: auto;}
.lightbox-overlay {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, 0.95);backdrop-filter: blur(10px);z-index: 1;}
.lightbox-container {position: relative;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;z-index: 2;}
.lightbox-close {position: fixed;top: 20px;right: 20px;width: 50px;height: 50px;border-radius: 50%;background: rgba(255, 255, 255, 0.2);color: var(--bg-white);border: 2px solid rgba(255, 255, 255, 0.5);font-size: 30px;cursor: pointer;z-index: 999999;transition: var(--transition);display: flex;align-items: center;justify-content: center;line-height: 1;font-weight: 300;}
.lightbox-close:hover {background: var(--primary-color);border-color: var(--primary-color);transform: rotate(90deg);transition: var(--transition);}
.lightbox-prev, .lightbox-next {position: fixed;top: 50%;transform: translateY(-50%);width: 60px;height: 60px;border-radius: 50%;background: rgba(255, 255, 255, 0.2);color: var(--bg-white);border: 2px solid rgba(255, 255, 255, 0.5);font-size: 28px;cursor: pointer;z-index: 999999;transition: var(--transition);display: flex;align-items: center;justify-content: center;font-weight: 300;}
.lightbox-prev:hover, .lightbox-next:hover {background: var(--primary-color);border-color: var(--primary-color);transform: translateY(-50%) scale(1.1);transition: var(--transition);}
.lightbox-prev {left: 20px;}
.lightbox-next {right: 20px;}
.lightbox-counter {position: fixed;top: 20px;left: 50%;transform: translateX(-50%);background: rgba(0, 0, 0, 0.8);color: var(--bg-white);padding: 10px 20px;border-radius: 20px;font-size: 16px;z-index: 999999;backdrop-filter: blur(5px);font-weight: 500;}
.lightbox-image-wrapper {position: relative;max-width: 90%;max-height: 90%;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.lightbox-image {max-width: 100%;max-height: 90vh;object-fit: contain;transition: transform 0.3s ease;cursor: grab;}
.lightbox-image:active {cursor: grabbing;}
.lightbox-video-wrapper {position: relative;width: 90vw;max-width: 1280px;aspect-ratio: 16/9;}
.lightbox-video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: 8px;}
.lightbox-zoom-controls {position: fixed;bottom: 30px;left: 50%;transform: translateX(-50%);display: flex;gap: 10px;z-index: 999999;}
.lightbox-zoom-controls button {width: 45px;height: 45px;border-radius: 50%;background: rgba(255, 255, 255, 0.2);color: var(--bg-white);border: 2px solid rgba(255, 255, 255, 0.5);font-size: 20px;cursor: pointer;transition: var(--transition);display: flex;align-items: center;justify-content: center;font-weight: 300;}
.lightbox-zoom-controls button:hover {background: var(--primary-color);border-color: var(--primary-color);transform: scale(1.1);transition: var(--transition);}
.lightbox-thumbnails {position: fixed;bottom: 20px;left: 50%;transform: translateX(-50%);width: 90%;max-width: 900px;z-index: 999999;background: rgba(0, 0, 0, 0.8);padding: 15px;border-radius: 10px;backdrop-filter: blur(10px);}
.lightbox-thumbnails-wrapper {display: flex;gap: 10px;overflow-x: auto;overflow-y: hidden;scroll-behavior: smooth;padding: 5px 0;scrollbar-width: thin;scrollbar-color: rgba(255, 255, 255, 0.3) transparent;}
.lightbox-thumbnails-wrapper::-webkit-scrollbar {height: 6px;}
.lightbox-thumbnails-wrapper::-webkit-scrollbar-track {background: rgba(255, 255, 255, 0.1);border-radius: 3px;}
.lightbox-thumbnails-wrapper::-webkit-scrollbar-thumb {background: rgba(255, 255, 255, 0.3);border-radius: 3px;}
.lightbox-thumbnails-wrapper::-webkit-scrollbar-thumb:hover {background: rgba(255, 255, 255, 0.5);}
.lightbox-thumbnail {position: relative;flex-shrink: 0;width: 100px;height: 70px;border-radius: 6px;overflow: hidden;cursor: pointer;border: 3px solid transparent;transition: var(--transition);background: rgba(0, 0, 0, 0.5);}
.lightbox-thumbnail:hover {border-color: rgba(255, 255, 255, 0.5);transform: scale(1.05);transition: var(--transition);}
.lightbox-thumbnail.active {border-color: var(--primary-color);transform: scale(1.05);}
.lightbox-thumbnail img {width: 100%;height: 100%;object-fit: cover;}
.lightbox-thumbnail-video-icon {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 30px;height: 30px;background: rgba(0, 0, 0, 0.7);color: var(--bg-white);display: flex;align-items: center;justify-content: center;border-radius: 50%;font-size: 12px;pointer-events: none;}

/* ========================================
   MEDIA QUERIES - RESPONSIVE
   ======================================== */

/* Tablet Landscape & Below (1024px) */
@media (max-width: 1024px) {
    /* Page Layout */
    main.withsidebar .page-build {grid-template-columns: 100%;}
    main.withsidebar .page-build .sidebar {display: none;}

    /* Tables */
    .text table, .shortcode table {display: block;overflow-x: auto;-webkit-overflow-scrolling: touch;}

    /* Introblock / Subpage Stage */
    .introblock h1, .introblock .page-subtitle,
    .stage.subpage h1, .stage.subpage .page-subtitle {font-size: 32px;}
    .stage.subpage .stage-content h1 {font-size: 32px;}

    /* Frontpage stage heading */
    .stage .stage-content h1 {font-size: 38px; line-height: 1.15;}

    /* Headings */
    h1 {font-size: 36px;}
    h2 {font-size: 24px;}
    h3 {font-size: 20px;}

    /* Downloads */
    .download-grid {grid-template-columns: 1fr;}

    /* Teasercards */
    .teasercards .cards.no-carousel {grid-template-columns: repeat(2, 1fr) !important;}

    /* Gallery */
    .gallery .glightbox-gallery {grid-template-columns: repeat(3, 1fr) !important;}
    .gallery .video-gallery-grid {grid-template-columns: repeat(2, 1fr);}
    .gallery .filterrow {display: grid;grid-template-columns: 100%;gap: 25px;}
    .gallery .filterrow #filter {flex-wrap: wrap;}
}

/* Tablet Portrait & Below (768px) */
@media (max-width: 768px) {
    /* Text + Image */
    .textbild .text {order: 1 !important;}
    .textbild .bild {order: 2 !important;}
    .textbild .wrp {grid-template-columns: 100% !important;gap: 30px;}

    /* Introblock / Subpage Stage */
    .introblock {padding: 30px 0 20px 0;}
    .stage.subpage {padding: 30px 0;}
    .introblock h1, .introblock .page-subtitle,
    .stage.subpage h1, .stage.subpage .page-subtitle {font-size: 28px;}
    .stage.subpage .stage-content h1 {font-size: 28px;}

    /* Frontpage stage heading */
    .stage .stage-content h1 {font-size: 28px; line-height: 1.2;}
    .stage .wrp {padding-top: 30px;}

    /* Base headings */
    h1 {font-size: 30px;}
    h2 {font-size: 22px;}

    /* Subnav */
    .subnav ul li a {padding: 10px 14px;font-size: 13px;}

    /* Gallery */
    .gallery .glightbox-gallery {grid-template-columns: repeat(2, 1fr)!important;}

    /* Blog Grid */
    main.withsidebar .content .blog-grid {grid-template-columns: repeat(2, 1fr);}
}

/* Mobile & Below (550px) */
@media (max-width: 550px) {
    /* Gallery */
    .gallery .video-gallery-grid {grid-template-columns: 100%;}
    .gallery .glightbox-gallery {grid-template-columns: repeat(2, 1fr) !important;}
}

/* Mobile Small (500px) */
@media (max-width: 500px) {
    /* Margins */
    .mb {margin-bottom: 50px;}
    .mb50 {margin-bottom: 25px;}

    /* Headings */
    h1 {font-size: 26px;}
    h2 {font-size: 20px;}
    .stage .stage-content h1 {font-size: 24px; line-height: 1.2;}
    .introblock h1, .introblock .page-subtitle,
    .stage.subpage h1, .stage.subpage .page-subtitle,
    .stage.subpage .stage-content h1 {font-size: 24px;}

    /* Teasercards */
    .teasercards .splide__arrow--prev {left: 10px;}
    .teasercards .splide__arrow--next {right: 10px;}
    .teasercards .cards.no-carousel {grid-template-columns: 100% !important;}
}

/* Responsive Lightbox */
@media (max-width: 768px) {
    .lightbox-close {width: 40px;height: 40px;font-size: 24px;top: 10px;right: 10px;}
    .lightbox-prev, .lightbox-next {width: 45px;height: 45px;font-size: 22px;}
    .lightbox-prev {left: 10px;}
    .lightbox-next {right: 10px;}
    .lightbox-counter {font-size: 12px;padding: 6px 12px;top: 10px;}
    .lightbox-zoom-controls {bottom: 20px;gap: 8px;}
    .lightbox-zoom-controls button {width: 38px;height: 38px;font-size: 18px;}
    .lightbox-image-wrapper {max-width: 95%;max-height: 85%;}
    .lightbox-video-wrapper {width: 95vw;}
}

@media (max-width: 500px) {
    .splide__arrow--prev {left: 10px;}
    .splide__arrow--next {right: 10px;}
    .splide__arrow {width: 40px;height: 40px;font-size: 20px;}
}