.elementor-kit-5{--e-global-color-primary:#141414;--e-global-color-secondary:#141414;--e-global-color-text:#1C1F1D;--e-global-color-accent:#2F4F3E;--e-global-typography-primary-font-family:"Manrope";--e-global-typography-primary-font-size:30px;--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Manrope";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:300;--e-global-typography-text-font-family:"Manrope";--e-global-typography-text-font-size:15px;--e-global-typography-text-font-weight:300;--e-global-typography-accent-font-family:"Manrope";--e-global-typography-accent-font-size:15px;--e-global-typography-accent-font-weight:300;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{background-color:#000000D9;--lightbox-text-color:#FFFFFF;--lightbox-header-icons-size:30px;--lightbox-navigation-icons-size:50px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.mw-fixed-header {
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  transform: translate3d(0, var(--vv-top, 0px), 0);
  will-change: transform;
}
/* Elementor Lightbox – globales Design */
.elementor-lightbox {
  background-color: rgba(0, 0, 0, 0.90) !important;
}

/* Navigation (Pfeile links / rechts) */
.elementor-lightbox .elementor-swiper-button {
  font-size: 50px !important;
  opacity: 0.85;
}

/* Schließen-Icon */
.elementor-lightbox .dialog-close-button {
  font-size: 20px !important;
  opacity: 0.85;
}

/* Titel unter dem Bild */
.elementor-lightbox .elementor-lightbox-title {
  font-size: 15px;
  font-weight: 400;
  color: rgba(255,255,255,0.9);
  margin-top: 12px;
}
/* Elementor Galerie – Filter/Titles Mobile untereinander zentriert */ @media (max-width: 767px){

  /* GANZ gezielt nur dieses Galerie-Widget */
  .elementor-element-5c0221f .elementor-gallery__titles-container{
    text-align: center !important;
  }

  .elementor-element-5c0221f .elementor-gallery__titles-container a.elementor-gallery-title{
    display: block !important;      /* <- das ist der entscheidende Punkt */
    width: 100% !important;
    margin: 0 auto 10px !important; /* Abstand untereinander */
    float: none !important;
  }
}


/* Fluent Forms Multi-Step: PHONE ONLY (no impact on tablet/desktop) */
@media (max-width: 600px){

  /* Step button row */
  .fluentform_wrapper .ff-step-nav,
  .fluentform_wrapper .ff_step_nav,
  .fluentform_wrapper .ff-form-step-nav,
  .fluentform_wrapper .ff-step-actions,
  .fluentform_wrapper .ff_step_actions,
  .fluentform .ff-step-nav,
  .fluentform .ff_step_nav,
  .fluentform .ff-form-step-nav,
  .fluentform .ff-step-actions,
  .fluentform .ff_step_actions{
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  /* Buttons spacing */
  .fluentform_wrapper .ff-btn-prev,
  .fluentform_wrapper .ff-btn-next,
  .fluentform_wrapper .ff-btn-submit,
  .fluentform .ff-btn-prev,
  .fluentform .ff-btn-next,
  .fluentform .ff-btn-submit{
    margin: 0 0 10px 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 44px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  /* last button no extra gap */
  .fluentform_wrapper .ff-btn-submit,
  .fluentform .ff-btn-submit{
    margin-bottom: 0 !important;
  }
}

/* =========================================================
   Fluent Forms – FORCE Manrope 300 everywhere (Ultra-Target)
   ========================================================= */

.fluentform_wrapper,
.fluentform,
.fluentform-widget-wrapper,
.fluentform_wrapper * ,
.fluentform * ,
.fluentform-widget-wrapper * {
  font-family: "Manrope", sans-serif !important;
  font-weight: 300 !important;
  font-style: normal !important;
  font-variation-settings: "wght" 300 !important; /* important for variable Manrope */
}

/* specifically hit radio/checkbox labels + option text */
.fluentform_wrapper .ff-el-form-check,
.fluentform_wrapper .ff-el-form-check label,
.fluentform_wrapper .ff-el-form-check label *,
.fluentform_wrapper .ff-el-form-check-label,
.fluentform_wrapper .ff-el-form-check-label *,
.fluentform .ff-el-form-check,
.fluentform .ff-el-form-check label,
.fluentform .ff-el-form-check label *,
.fluentform .ff-el-form-check-label,
.fluentform .ff-el-form-check-label *{
  font-family: "Manrope", sans-serif !important;
  font-weight: 300 !important;
  font-variation-settings: "wght" 300 !important;
}
/* =========================================================
   Fluent Forms – Fix checkbox green background rectangle on :checked
   (overrides theme checkbox background/box-shadow)
   ========================================================= */

.fluentform_wrapper input[type="checkbox"],
.fluentform input[type="checkbox"],
.fluentform-widget-wrapper input[type="checkbox"]{
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Checked state (this is where the rectangle usually comes from) */
.fluentform_wrapper input[type="checkbox"]:checked,
.fluentform input[type="checkbox"]:checked,
.fluentform-widget-wrapper input[type="checkbox"]:checked{
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Keep your brand color for the checkmark */
.fluentform_wrapper input[type="checkbox"]{
  accent-color: var(--mw-primary, #2F4F3E) !important;
}

/* =========================================================
   GLOBAL – Remove underline from Elementor CTA widgets
   ========================================================= */

a.elementor-cta,
a.elementor-cta *{
  text-decoration: none !important;
}

/* =========================================================
   Portfolio CTA – Button Styling (Normal + Hover)
   ========================================================= */

.mw-cta-portfolio .elementor-cta__button{
  background-color: #FFFFFF90 !important;
  color: #141414 !important;
  border: 1px solid #141414 !important;
}

/* Hover state – IMPORTANT: hover is on the link wrapper */
.mw-cta-portfolio a.elementor-cta:hover .elementor-cta__button,
.mw-cta-portfolio a.elementor-cta:focus .elementor-cta__button{
  background-color: #FFFFFF90 !important;
  color: #141414 !important;
  border: 1px solid #141414 !important;
}
/* =========================================================
   Portfolio CTA – soft gradient behind text (premium)
   ========================================================= */

.mw-cta-portfolio .elementor-cta__content{
  position: relative;
  z-index: 2;
}

.mw-cta-portfolio .elementor-cta__content::before{
  content: "";
  position: absolute;
  inset: -20px; /* etwas größer als Text */
  background: radial-gradient(
    circle at center,
    rgba(0,0,0,0.65) 0%,
    rgba(0,0,0,0.45) 40%,
    rgba(0,0,0,0.0) 75%
  );
  z-index: -1;
  pointer-events: none;
}
.mw-cta-portfolio .elementor-cta__title,
.mw-cta-portfolio .elementor-cta__description{
  text-shadow: 0 4px 18px rgba(0,0,0,0.75);
}
/* =========================================================
   iOS/iPadOS – Force custom radios (markup: label > input + span)
   Applies to Fluent wrappers: fluentform_wrapper / fluentform / fluentform-widget-wrapper
   ========================================================= */
@supports (-webkit-touch-callout: none) {

  /* 1) Hide native radios visually (keep accessible state) */
  .fluentform_wrapper label.ff-el-form-check-label > input[type="radio"],
  .fluentform label.ff-el-form-check-label > input[type="radio"],
  .fluentform-widget-wrapper label.ff-el-form-check-label > input[type="radio"]{
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    pointer-events: none !important;
  }

  /* 2) Make room for the custom circle on the text span */
  .fluentform_wrapper label.ff-el-form-check-label > input[type="radio"] + span,
  .fluentform label.ff-el-form-check-label > input[type="radio"] + span,
  .fluentform-widget-wrapper label.ff-el-form-check-label > input[type="radio"] + span{
    position: relative !important;
    padding-left: 22px !important;
    line-height: 1.4 !important;
    display: inline-block !important;
  }

  /* 3) Outer circle */
  .fluentform_wrapper label.ff-el-form-check-label > input[type="radio"] + span::before,
  .fluentform label.ff-el-form-check-label > input[type="radio"] + span::before,
  .fluentform-widget-wrapper label.ff-el-form-check-label > input[type="radio"] + span::before{
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 999px !important;
    border: 1.5px solid var(--mw-primary, #2F4F3E) !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }

  /* 4) Inner dot (checked) */
  .fluentform_wrapper label.ff-el-form-check-label > input[type="radio"] + span::after,
  .fluentform label.ff-el-form-check-label > input[type="radio"] + span::after,
  .fluentform-widget-wrapper label.ff-el-form-check-label > input[type="radio"] + span::after{
    content: "" !important;
    position: absolute !important;
    left: 5px !important;
    top: 50% !important;
    transform: translateY(-50%) scale(0) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 999px !important;
    background: var(--mw-primary, #2F4F3E) !important;
    transition: transform .12s ease-in-out !important;
  }

  .fluentform_wrapper label.ff-el-form-check-label > input[type="radio"]:checked + span::after,
  .fluentform label.ff-el-form-check-label > input[type="radio"]:checked + span::after,
  .fluentform-widget-wrapper label.ff-el-form-check-label > input[type="radio"]:checked + span::after{
    transform: translateY(-50%) scale(1) !important;
  }
}

/* N-Menu – Soft 1px Underline (Refined Version) */

.elementor-widget-n-menu .e-n-menu-title-text{
  position: relative;
  display: inline-block;
}

.elementor-widget-n-menu .e-n-menu-title-text::after{
  content:"";
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  bottom:-6px;
  width:0%;
  height:1px;
  background: rgba(20,20,20,0.35); /* Active Grundstärke */
  border-radius: 1px;
  box-shadow: 0 4px 10px rgba(20,20,20,0.10);
  transition: width .35s cubic-bezier(.25,.8,.25,1),
              background .2s ease,
              box-shadow .2s ease;
}

/* Hover – minimal stärker */
.elementor-widget-n-menu .e-n-menu-title-container:hover
.e-n-menu-title-text::after{
  width:72%;
  background: rgba(20,20,20,0.50);
  box-shadow: 0 6px 14px rgba(20,20,20,0.15);
}

/* Active – etwas ruhiger als Hover */
.elementor-widget-n-menu .e-n-menu-title.e-current
.e-n-menu-title-text::after{
  width:72%;
  background: rgba(20,20,20,0.35);
  box-shadow: 0 4px 10px rgba(20,20,20,0.10);
}
/* Footer-Menü: kein aktiver Zustand (verhindert 'Impressum' dauer-aktiv) */
footer .e-n-menu-title.e-current .e-n-menu-title-text::after,
footer .e-n-menu-title.e-current .e-n-menu-title-text::before,
footer .e-n-menu-title.e-current .e-n-menu-title-container::after,
footer .e-n-menu-title.e-current .e-n-menu-title-container::before {
  width: 0% !important;
  display: none !important;
}

/* Falls klassisches WP-Menü verwendet wird */
footer .current-menu-item > a,
footer a[aria-current="page"],
footer a[aria-current="location"]{
  text-decoration: none !important;
  font-weight: inherit !important;
}/* End custom CSS */