.elementor-kit-2772{--e-global-color-primary:#1C1C1C;--e-global-color-secondary:#8F8989;--e-global-color-text:#3A3636;--e-global-color-accent:#B8B1AE;--e-global-color-b260d74:#F4F8F7;--e-global-color-f9a88a3:#F8F3EE;--e-global-color-bbb618d:#DCE7E5;--e-global-color-e1cb924:#FFFFFF;--e-global-color-a9b9c35:#F2F0EF;--e-global-color-231908c:#E8E1DE;--e-global-color-bdb1548:#D7CECA;--e-global-typography-primary-font-family:"Cormorant Garamond";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:#F2F0EF;color:var( --e-global-color-text );font-family:"Montserrat", Sans-serif;font-size:17px;font-weight:400;line-height:1.7em;}.elementor-kit-2772 e-page-transition{background-color:#FFBC7D;}.elementor-kit-2772 p{margin-block-end:4em;}.elementor-kit-2772 h1{font-family:"Cormorant Garamond", Sans-serif;font-size:58px;font-weight:500;line-height:1.05em;letter-spacing:1px;}.elementor-kit-2772 h2{font-family:"Cormorant Garamond", Sans-serif;font-size:46px;font-weight:500;}.elementor-kit-2772 h3{font-family:"Cormorant Garamond", Sans-serif;font-size:32px;font-weight:400;line-height:1.2em;}.elementor-kit-2772 h4{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:500;line-height:1.4em;letter-spacing:0.5px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;--container-default-padding-top:20px;--container-default-padding-right:20px;--container-default-padding-bottom:20px;--container-default-padding-left:20px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}@media(max-width:1024px){.elementor-kit-2772 h1{font-size:46px;}.elementor-kit-2772 h2{font-size:38px;}.elementor-kit-2772 h3{font-size:28px;}.elementor-kit-2772 h4{font-size:17px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;--container-default-padding-top:20px;--container-default-padding-right:20px;--container-default-padding-bottom:20px;--container-default-padding-left:20px;}}@media(max-width:880px){.e-con{--container-default-padding-top:20px;--container-default-padding-right:20px;--container-default-padding-bottom:20px;--container-default-padding-left:20px;}}@media(max-width:767px){.elementor-kit-2772{font-size:16px;}.elementor-kit-2772 h1{font-size:36px;}.elementor-kit-2772 h2{font-size:31px;}.elementor-kit-2772 h3{font-size:25px;}.elementor-kit-2772 h6{font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;--container-default-padding-top:16px;--container-default-padding-right:16px;--container-default-padding-bottom:16px;--container-default-padding-left:16px;}}
/* Start custom CSS *//* =========================================================
   HERO BACKGROUND IMAGE
   Class on outer hero container: hero-start
   ========================================================= */

/* Tablet Hochformat */
@media (max-width: 1024px) {
  .hero-start {
    min-height: 860px;
    background-size: auto 64% !important;
    background-position: center bottom !important;
  }
}

/* Mobile Querformat */
@media (max-width: 880px) and (orientation: landscape) {
  .hero-start {
    min-height: 620px;
    background-size: auto 72% !important;
    background-position: right bottom !important;
  }
}

/* Mobile Hochformat */
@media (max-width: 767px) and (orientation: portrait) {
  .hero-start {
    min-height: 860px;
    background-size: 108% auto !important;
    background-position: center bottom !important;
  }
}

/* Sehr kleine Smartphones */
@media (max-width: 390px) {
  .hero-start {
    min-height: 820px;
    background-size: 100% auto !important;
    background-position: center bottom !important;
  }
}


/* =========================================================
   REMOVE HORIZONTAL SCROLL
   ========================================================= */

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Prevent Elementor sections/containers from creating overflow */
.elementor,
.elementor-section,
.elementor-container,
.elementor-widget-wrap,
.e-con,
.e-con-inner {
  max-width: 100%;
}

/* Hero should never create horizontal scroll */
.hero-start {
  overflow-x: hidden !important;
}

/* Text and headings must not exceed viewport */
.hero-text,
.hero-title,
.hero-subtitle,
.hero-location,
.hero-title .elementor-heading-title,
.hero-subtitle .elementor-heading-title,
.hero-location .elementor-heading-title {
  max-width: 100% !important;
  box-sizing: border-box;
  overflow-wrap: normal;
}

/* Mobile safety */
@media (max-width: 767px) {
  .hero-text {
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
  }

  .hero-title .elementor-heading-title,
  .hero-subtitle .elementor-heading-title,
  .hero-location .elementor-heading-title {
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* =========================================================
   TEAM GRID LAYOUT
   Parent container class: team-grid
   Each Team Member Box widget class: team-card
   ========================================================= */

.team-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
  max-width: 1480px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 4 cards per row on desktop */
.team-grid > .elementor-element {
  flex: 0 0 calc((100% - 72px) / 4) !important;
  max-width: calc((100% - 72px) / 4) !important;
  min-width: 0 !important;
}

/* Make the actual widget fill its column */
.team-grid .team_member_box_overlay {
  width: 100% !important;
}

/* Tablet: 2 cards per row */
@media (max-width: 1024px) {
  .team-grid > .elementor-element {
    flex: 0 0 calc((100% - 24px) / 2) !important;
    max-width: calc((100% - 24px) / 2) !important;
  }
}

/* Mobile: 1 card per row */
@media (max-width: 767px) {
  .team-grid > .elementor-element {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}


/* =========================================================
   TEAM MEMBER BOX – SAFETY
   Class on each Team Member Box widget: team-card
   ========================================================= */

.team-card,
.team-card * {
  box-sizing: border-box;
}

.team-card {
  max-width: 100%;
  overflow: hidden;
}

.team-card img {
  max-width: 100%;
  height: auto;
  display: block;
}


/* =========================================================
   TEAM MEMBER BOX – OVERLAY VARIABLES
   Keeps the stronger overlay look, fixes readability.
   ========================================================= */

.team-card {
  --team-overlay-1: rgba(58, 54, 54, 0.2);
  --team-overlay-2: rgba(143, 137, 137, 0.2);
  --team-overlay-3: rgba(105, 99, 99, 0.2);

  --team-overlay-color: var(--team-overlay-1);
  --team-overlay-text-color: #ffffff;
}


/* =========================================================
   TEAM MEMBER BOX – AUTOMATIC OVERLAY ROTATION
   This should rotate the overlay color card by card.
   ========================================================= */

/* Card 1, 4, 7... */
.team-grid > .elementor-element:nth-child(3n + 1) .team-card {
  --team-overlay-color: var(--team-overlay-1);
}

/* Card 2, 5, 8... */
.team-grid > .elementor-element:nth-child(3n + 2) .team-card {
  --team-overlay-color: var(--team-overlay-2);
}

/* Card 3, 6, 9... */
.team-grid > .elementor-element:nth-child(3n + 3) .team-card {
  --team-overlay-color: var(--team-overlay-3);
}


/* =========================================================
   TEAM MEMBER BOX – MANUAL FALLBACK
   Use only if automatic rotation does not work.
   Add second class to widget:
   team-card overlay-1
   team-card overlay-2
   team-card overlay-3
   ========================================================= */

.team-card.overlay-1 {
  --team-overlay-color: var(--team-overlay-1);
}

.team-card.overlay-2 {
  --team-overlay-color: var(--team-overlay-2);
}

.team-card.overlay-3 {
  --team-overlay-color: var(--team-overlay-3);
}


/* =========================================================
   TEAM MEMBER BOX – APPLY OVERLAY + TEXT
   ========================================================= */

.team-card .uc_overlay,
.team-card .team-member-image-overlay {
  background-color: var(--team-overlay-color) !important;
}

.team-card .uc_container_overlay_text {
  color: var(--team-overlay-text-color) !important;
  font-family: "Montserrat", sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.3px;
  text-align: center;
  padding: 16px;
  box-sizing: border-box;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

/* =========================================================
   TEAM MEMBER BOX – force equal image/card ratio
   ========================================================= */

.team-card .team_member_box_overlay,
.team-card .uc_container_holder {
  width: 100% !important;
  aspect-ratio: 1 / 1;
  overflow: hidden !important;
  position: relative;
}

.team-card .team_member_box_overlay_image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center;
  display: block;
}

.hero-start {
  background-position: right bottom !important;
  background-repeat: no-repeat !important;
}

/* Tablet Hochformat */
@media (max-width: 1024px) {
  .hero-start {
    min-height: 860px;
    background-size: auto 64% !important;
    background-position: right bottom !important;
  }
}

/* Mobile Querformat */
@media (max-width: 880px) and (orientation: landscape) {
  .hero-start {
    min-height: 620px;
    background-size: auto 72% !important;
    background-position: right bottom !important;
  }
}

/* Mobile Hochformat */
@media (max-width: 767px) and (orientation: portrait) {
  .hero-start {
    min-height: 860px;
    background-size: 108% auto !important;
    background-position: right bottom !important;
  }
}

/* Sehr kleine Smartphones */
@media (max-width: 390px) {
  .hero-start {
    min-height: 820px;
    background-size: 100% auto !important;
    background-position: right bottom !important;
  }
}/* End custom CSS */