/*
 Theme Name:   Caleus Custom Theme
 Theme URI:    https://caleus.de
 Description:  Caleus Wordpress Theme
 Author:       AppsFactory
 Author URI:   https://appsfactory.de
 Template:     Total
 Version:      1.0.0
 Text Domain:  caleus
*/

:root {
  --color-dark-green: #0b391c;
  --color-light-green: #19c171;
  --color-ochre: #c8a64e;
  --color-teal: #90c0c2;
  --color-yellow: #e7ec05;
  --color-eggplant: #644557;
  --color-violet: #5427d3;
  --color-transparent: transparent;
  --color-sand: #e1ded6;
  --color-dust: #efefef;
  --color-black: #000;
  --color-white: #fff;

  --breakpoint-xl: 1300px;
  --breakpoint-lg: 1025px;
  --breakpoint-md: 960px;
  --breakpoint-sm: 767px;
  --breakpoint-xs: 560px;
}

.color-inherit {
  color: inherit !important;
}

.color-light-green {
  color: var(--color-light-green);
}
.color-white {
  color: var(--color-white);
}
.color-black {
  color: var(--color-black);
}

.bg-dark-green {
  background-color: var(--color-dark-green);
}
.bg-sand {
  background-color: var(--color-sand);
}

/* Reset */
.post-edit.wpex-my-40.wpex-print-hidden {
  display: none;
}

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6,
.wpex-h1,
.wpex-h2,
.wpex-h3,
.wpex-h4,
.wpex-h5,
.wpex-h6 {
  margin-top: 0;
}

h1 > em,
h2 > em,
h3 > em,
h4 > em,
h5 > em,
h6 > em {
  font-family: "PP Editorial New";
  font-style: italic;
  font-weight: 300;
}

h5,
.h5 {
  font-size: 28px;
  font-weight: normal;
  font-family: "Aeonik";
}

h6,
.h6 {
  font-size: 26px;
  font-weight: normal;
  font-family: "Aeonik";
}

#footer_top h6 {
  font-size: 20px;
}

.wpex-heading {
  font-family: "Aeonik";
  font-weight: 500;
}

.type-service .wpex-heading {
  font-size: 20px;
}
/*
=====================================================
My Custom Font Styles
=====================================================
*/


.aeonik-37 {
  font-family: 'Aeonik', sans-serif !important;
  font-weight: 400 !important;
  font-size: 37px !important;
}

/* --- Your 10px Style --- */
.aeonik-10 {
  font-family: 'Aeonik', sans-serif !important;
  font-weight: 400 !important;
  font-size: 10px !important;
}
/* --- Your 12px Regular (400) Style --- */
.aeonik-12-reg {
  font-family: 'Aeonik', sans-serif !important;
  font-weight: 400 !important;
  font-size: 12px !important;
}

/* --- Your 12px Medium (500) Style --- */
.aeonik-12-med {
  font-family: 'Aeonik', sans-serif !important;
  font-weight: 500 !important;
  font-size: 12px !important;
}
body.page-template-default {
  padding: 0 !important;
}
.my-padded-column {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 40px;
}
.my-padded-row {
    padding-left: 60px;
    padding-right: 60px;
    padding-top: 80px;
    padding-bottom: 80px;
}

.my-padded-tab-text {
    padding-left: 0px;
    padding-right: 60px;
    padding-top: 50px;
    padding-bottom: 60;
}
.my-padded-tab {
    padding-left: 60px;
    padding-right: 60px;
    padding-top: 40px;
}
.my-padded-tab-top {
    padding-top: 90px;
}

/* Responsive helper: 60px desktop, 40px tablet, 20px mobile */
.pad-top-60-40-20 {
  padding-top: 60px !important;
}

@media screen and (max-width: 1024px) {
  .pad-top-60-40-20 {
    padding-top: 40px !important;
  }
}

@media screen and (max-width: 767px) {
  .pad-top-60-40-20 {
    padding-top: 20px !important;
  }
}
/* Cookie Banner */
body #moove_gdpr_cookie_info_bar.moove-gdpr-light-scheme {
  border: none;
}

body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container {
  padding: 2.25em;
  font-size: 16px;
}

#moove_gdpr_cookie_info_bar
  .moove-gdpr-info-bar-container
  .moove-gdpr-info-bar-content
  p,
#moove_gdpr_cookie_info_bar
  .moove-gdpr-info-bar-container
  .moove-gdpr-info-bar-content
  p
  > a {
  font-size: inherit !important;
  line-height: 1.25 !important;
}

.mgbutton.moove-gdpr-infobar-allow-all {
  background-color: var(--color-yellow) !important;
  border: 1px solid var(--color-yellow) !important;
  color: #000 !important;
}

.mgbutton.moove-gdpr-infobar-reject-btn,
.mgbutton.moove-gdpr-infobar-settings-btn {
  color: #000 !important;
  border: 1px solid #000 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

.mgbutton {
  padding: 1em 1.5em !important;
  font-size: 18px !important;
}

.push-to-bottom {
  margin-top: auto;
}

/* Force columns to align to the top */
body .force-top-align {
    display: flex !important;
    align-items: flex-start !important; /* The magic command for "Top" */
}

/* Ensure the columns themselves act correctly */
body .force-top-align > .vc_column_container {
    vertical-align: top !important;
    justify-content: flex-start !important;
}

/* Language */
.wpml-ls-item.wpml-ls-current-language a {
  cursor: unset;
}
.wpml-ls-legacy-list-horizontal a {
  text-decoration: none !important;
  padding-right: 0;
  padding-left: 0;
}

.wpml-ls-item:not(.wpml-ls-current-language) a:not(:hover) {
  color: white;
}
.wpml-ls-legacy-list-horizontal ul > li:not(:last-child) > a:after {
  content: "|";
  display: inline;
  color: white;
  padding: 0.5rem;
}

.change-color .wpml-ls-item:not(.wpml-ls-current-language) a:not(:hover),
.change-color
  .wpml-ls-legacy-list-horizontal
  ul
  > li:not(:last-child)
  > a:after {
  color: white;
}

/* Slider overrides */
.vcex-image-slider-css-wrap {
  overflow: hidden;
}
.full-width-before-after-slider > img {
    width: 100%;
}

/* Misc */
.vcex-teaser-text {
  margin-top: 0 !important;
}

.otgs-development-site-front-end {
  display: none !important;
}
.no-margin {
  margin: 0;
}

.arrow-container {
  display: flex;
}

.behind {
  z-index: -1;
}

.text-center {
  text-align: center;
}

.admin-login {
  border: 1px solid;
  color: #fff;
  text-decoration: none !important;
  padding: 0.5em 1.75em;
  display: inline-block;
  margin-top: 1em;
  font-size: 20px;
}

body .owl-carousel.owl-loaded {
  display: flex;
  flex-direction: column;
}

.background-cover {
  background-position: center;
  background-size: cover;
}

.wpex-carousel .owl-nav {
  order: -1;
  margin-left: auto;
  margin-bottom: 1.5em;
  width: 90vw;
  max-width: 1200px;
  display: flex;
  justify-content: flex-end;
}

.wpex-carousel.arrwstyle-min .owl-nav__btn > * {
  display: none;
}

.wpex-carousel.arrwstyle-min .owl-nav__btn {
  background: url(/wp-content/uploads/2024/03/arrow-right.svg);
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  width: 48px;
  height: 48px;
}

button.owl-nav__btn.disabled {
  opacity: 0.2;
}

button.owl-nav__btn.owl-prev {
  transform: rotate(180deg);
  margin-right: 3em;
}

.image-white {
  filter: brightness(150);
}

.video_bg,
.video_bg > div {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.wpex-video-bg-wrap > video {
  object-fit: cover;
  max-height: 100vh;
  max-width: 100vw;
}

.ratio-2-1 {
  aspect-ratio: 2.2/1;
}

.float-right {
  float: right;
}

.social-media-logo a {
  display: flex;
  align-items: center;
  gap: 0.25em;
}

.social-media-logo a:hover:after {
  color: var(--color-light-green);
}

.social-media-logo a:after {
  vertical-align: middle;
  padding-left: 0.5em;
  color: var(--color-white);
  font-size: 16px;
}

.social-media-logo a[href*="linkedin"]:after {
  content: "LinkedIn";
}
.social-media-logo a[href*="instagram"]:after {
  content: "Instagram";
}
.social-media-logo a[href*="facebook"]:after {
  content: "Facebook";
}
.social-media-logo a[href*="x.com"]:after {
  content: "X (Twitter)";
}
.social-media-logo a[href*="youtube"]:after {
  content: "YouTube";
}
.social-media-logo a[href*="xing"]:after {
  content: "Xing";
}

.certificates h5 {
  font-size: 30px !important;
}

.text-overlay-hero .yellow-card {
  padding: 1em;
  width: 250px;
  aspect-ratio: 1;
  background-color: var(--color-yellow);
  line-height: 1.1;
}

.text-overlay-hero .yellow-card h4 {
  margin: 0;
  line-height: 1.2;
}

.vc_separator {
  gap: 2.5em;
}

.vc_separator h4 {
  padding: 0 !important;
  font-size: 32px !important;
}

.map-module h5 {
  font-size: 32px !important;
}

.map-module .vcex-feature-box {
  min-width: 220px;
  padding: 1em;
}

/* Utility: remove VC inner column bottom margin when explicitly needed */
.no-column-gap {
  --wpex-vc-column-inner-margin-bottom: 0 !important;
}

.yellow-card {
  background: var(--color-yellow);
  color: #000 !important;
}
.blue-card {
  background: var(--color-violet);
  color: var(--color-white) !important;
}
.green-card {
  background: var(--color-dark-green);
  color: var(--color-yellow) !important;
}
.sand-card {
  background: var(--color-sand);
  color: var(--color-dark-green);
}

.yellow-card *,
.blue-card *,
.green-card * {
  color: inherit;
}

.map-module .vcex-feature-box-media {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.map-module .vcex-feature-box-media img {
  max-width: 32px;
}

/* Header */
#site-header:not(.overlay-header) {
  background-color: var(--color-dark-green) !important;
  color: var(--color-white);
  transition: all 0.3s ease-in-out !important;
}
#site-header .menu-item > a {
  color: var(--color-white);
}
#site-header .menu-item > a:hover {
  color: var(--color-light-green) !important;
}

#site-header-sticky-wrapper.is-sticky #site-header.overlay-header, #site-header-sticky-wrapper.is-sticky.sushft-hidden #site-header.overlay-header:not(.change-color) {
	background-color: transparent;
}

#site-header.change-color {
  background-color: var(--color-dark-green) !important;
  color: var(--color-white);
  border-bottom: 1px solid rgba(0, 0, 0, 0.075);
}

body .wpex-sticky-header-holder.is-sticky #site-header {
    transform: none !important;
}

#site-header.change-color .menu-item > a {
  color: var(--color-white);
}

img.logo-img.hide-at-mm-breakpoint {
  margin-top: -3px;
}

/* Mobile Menu */
.mobile-menu-toggle__icon > span {
  display: none;
}

.mobile-menu-toggle__icon:after {
  content: "MENU";
  font-size: 18px;
  font-weight: 400;
}

#site-header.change-color .mobile-menu-toggle__icon:after {
  color: var(--color-white);
}

.mobile-menu-toggle__icon:hover:after {
  color: var(--color-light-green);
}

.full-screen-overlay-nav-close > span {
  display: none;
}

.full-screen-overlay-nav-close:after {
  content: "CLOSE";
  font-size: 18px;
  vertical-align: top;
  font-family: "Aeonik";
  line-height: 77px;
}

.full-screen-overlay-nav button.full-screen-overlay-nav-close {
  padding-right: 2rem;
  text-align: right;
}

.full-screen-overlay-nav-content {
  background-color: var(--color-sand);
  color: var(--color-black);
}

.full-screen-overlay-nav-content-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: left;
  font-weight: 400;
}

/* Hero */
.hero {
  padding-top: 4em;
  padding-bottom: 4em;
}

.hero-main {
  background-color: var(--color-dark-green);
  color: var(--color-white);
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 3em;
  max-height: 767px;
}

.hero-main h1,
.hero h1 {
  margin-top: 0;
}

.hero-main .video_bg {
  animation: fadeOut 0.5s 10s forwards;
  opacity: 1;
}

.hero-intro-title {
  color: var(--color-white);
}

/* This sets the main style for the whole block */
.my-hero-text {
  font-family: 'Aeonik', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 80px;
  line-height: 110%;
  letter-spacing: 0;
}

/* This overrides just the one word */
.my-hero-text .special-font {
  font-family: 'PP Editorial New', serif;
  font-weight: 200;
  font-style: italic;
}

.hero-calc-height.vc_row-o-full-height {
  min-height: calc(100vh - 76px) !important; 
}
/* Gallery */
.vcex-ib-content-wrap {
  text-align: left;
}
.vcex-ib-content-wrap .vcex-ib-caption {
  font-size: 18px;
}

.vcex-image-banner h2.vcex-ib-title {
  font-size: 100px;
  font-weight: 400;
}
.vcex-image-banner h2.vcex-ib-title > small {
  font-size: 36%;
}

.gallery-image-dark-green > .vcex-ib-content-wrap {
  background-color: var(--color-dark-green);
  color: var(--color-light-green);
}
.gallery-image-light-green > .vcex-ib-content-wrap {
  background-color: var(--color-light-green);
  color: var(--color-dark-green);
}
.gallery-image-yellow > .vcex-ib-content-wrap {
  background-color: var(--color-yellow);
  color: #000;
}

/* Footer */
#footer_top {
  background-color: var(--color-dark-green);
  color: var(--color-white);
  font-size: 18px;
  padding-top: 4em;
  padding-bottom: 4em;
}

#footer_top h1,
#footer_top h2,
#footer_top h3,
#footer_top h4,
#footer_top h5,
#footer_top h6 {
  color: var(--color-white);
}

#footer_top .vcex-button {
  color: var(--color-yellow);
  border: 1px solid !important;
  border-radius: 0;
  background-color: transparent;
  font-size: 18px;
  font-weight: 400;
}

/* --- START: Fix for Custom Feature Box --- */

/* 1. Crush the 50% width container */
/* The HTML had 'wpex-w-50' which forced a huge gap. This overrides it. */
.custom-feature-box .vcex-feature-box-media {
    width: auto !important; 
    flex: 0 0 auto !important; 
    max-width: none !important;
    margin-right: 0px !important; /* Sets the precise gap between icon and text */
}

/* 2. Resize the image to your desired "X" size */
/* Even though the file is huge (3x), we force it to look small and sharp */
.custom-feature-box .vcex-feature-box-image img {
    width: 40px !important; /* CHANGE THIS to 80px or 100px if you want it bigger */
    height: auto !important;
    display: block !important;
}

/* 3. Ensure the text aligns properly */
.custom-feature-box .vcex-feature-box-content {
    text-align: left !important;
    flex-grow: 1 !important; /* Tells text to fill the remaining space */
}

/* --- END: Fix for Custom Feature Box --- */

/* ---------------------------------- */
/* --- 3. GRADIENT OVERLAY SYSTEM --- */
/* ---------------------------------- */

/* 3A. The Base Class (Creates the layer) */
.row-gradient-overlay {
  position: relative;
  /* This forces the row's own background to stay at the bottom */
  z-index: 0; 
}

.row-gradient-overlay::before {
  content: "";
  position: absolute;
  display: block !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* --- THE FIX: Use a higher z-index --- */
  z-index: 2; 
}

/* 3B. The Content (Must be higher than the gradient) */
.row-gradient-overlay > .vc_column_container {
  position: relative;
  /* --- THE FIX: Use a higher z-index --- */
  z-index: 3; 
}


/* --- 3C. YOUR NEW MODIFIER CLASSES --- */

/* OVERRIDE: 40% Black Gradient */
.row-gradient-overlay.grad-40::before {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.4), 
    rgba(0, 0, 0, 0)  
  );
}

.row-gradient-overlay.grad-70::before {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.7), 
    rgba(0, 0, 0, 0.0)   
  );
}

.row-gradient-overlay.grad-60::before {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6),
    rgba(0, 0, 0, 0.0)   
  );
}

#footer_bottom {
  background-color: var(--color-light-green);
  color: var(--color-black);
  font-size: 16px;
  padding-top: 1.25em;
  padding-bottom: 1.25em;
}

#footer_bottom ul {
  display: flex;
  gap: 3em;
}

#footer_bottom ul a {
  color: inherit;
}

.footer-logo {
  max-width: 155px;
}

/* Scroll to top */
#site-scroll-top {
  background: url(/wp-content/uploads/2024/03/scroll-to-top.svg);
  width: 50px;
  height: 50px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  bottom: 1.5em;
  right: 1.5em;
}
#site-scroll-top * {
  display: none !important;
}

/* Popups */
.fancybox-toolbar {
  visibility: visible !important;
  opacity: 1 !important;
}

/*.fancybox-slide {
  display: flex;
  padding: 0 !important;
}

.fancybox-slide--iframe .fancybox-content {
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
} */

.fancybox-button {
  min-height: 60px;
  min-width: 60px;
}

button.fancybox-button.fancybox-button--close {
  background: var(--color-yellow);
  color: var(--color-dark-green);
}

/* Buttons */
.theme-button.outline {
  color: var(--color-dark-green);
  border-width: 1px;
  font-weight: normal;
  padding: 10px 20px;
}

.theme-button.expanded {
  padding: 0.6em 1em;
}

.pdf-button {
  border: 1px solid;
  color: var(--color-white);
  text-decoration: none !important;
  padding: 0.75em 1em;
  font-size: 16px;
}

/* Map */
.map {
  min-height: 900px;
}

/* Flex */
.flex {
  display: flex;
}

.content-between {
  justify-content: space-between;
}
body .fluid-one-line {
    /* 1. Force the text to stay on one line */
    white-space: nowrap !important;
    
    /* 2. The Magic: Fluid Font Size 
       Format: clamp(MINIMUM, PREFERRED, MAXIMUM);
    */
    font-size: clamp(50px, 2vw, 60px) !important;
    
    /* Optional: Safety net just in case it still overflows on tiny screens */
    overflow: hidden !important; 
    text-overflow: ellipsis !important;
}
.flex-between-container > div > .wpb_wrapper {
  display: flex;
  justify-content: space-between;
}

.vertical-mobile {
  display: flex;
  gap: 1em;
}

.vertical-mobile > div {
  width: auto;
}

.vertical-mobile:before,
.vertical-mobile:after {
  content: none;
}

.owl-carousel .owl-stage-outer {
  overflow: visible !important;
}
.owl-carousel {
  width: 85% !important;
}

.my-responsive-box-padding {
	padding: 60px !important;
}

/* Animations */
.show-after-video {
  animation: fadeInAndUp 0.5s 10s forwards;
  opacity: 0;
  transform: translateY(300px);
}

@keyframes fadeInAndUp {
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes fadeOut {
  to {
    opacity: 0;
  }
}

/* Responsive */
@media screen and (min-width: 1023px) {
  .vcex-image-banner > .vcex-ib-content-wrap {
    top: 100%;
    overflow: hidden;
  }
  .vcex-ib-content-wrap .vcex-ib-content {
    max-width: 220px;
  }
  .vcex-image-banner:hover > .vcex-ib-content-wrap {
    top: 0;
  }
}

@media screen and (min-width: 1023px) and (max-width: 1226px) {
  body h1,
  body .wpex-h1 {
    font-size: 100px;
  }
}

@media screen and (max-width: 1023px) {
  .vc_section.full-width-tablet .wpex-max-w-100[style*="width"] {
    width: 90% !important;
    margin: 0 auto;
  }
  .vcex-image-banner {
    display: flex;
    flex-direction: column-reverse;
  }
  .vcex-image-banner > img {
    aspect-ratio: 1.6;
    object-fit: cover;
  }
  .vcex-image-banner > .vcex-ib-content-wrap {
    position: relative;
    padding-bottom: 3em;
    padding-left: 5%;
    padding-right: 5%;
  }
  .full-width-tablet {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media screen and (min-width: 960px) {
  .show-at-mm-breakpoint {
    display: none !important;
  }

  .text-overlay-hero .yellow-card h4 {
    font-size: 40px !important;
  }
}

@media screen and (min-width: 767px) {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .wpex-h1,
  .wpex-h2,
  .wpex-h3,
  .wpex-h4,
  .wpex-h5,
  .wpex-h6 {
    margin-bottom: 20px;
  }

  .desktop-pull-up {
    margin-top: -6rem;
    position: relative;
  }

  .desktop-padding-top {
    padding-top: 2.5em;
  }

  .max-w-60-desktop {
    max-width: 60%;
  }
  .text-overlay-hero .mobile-reverse > div:first-child > .vc_column-inner {
    padding-right: 0;
  }
  .text-overlay-hero .mobile-reverse > div:last-child > .vc_column-inner {
    padding-left: 0;
  }

  .map-module {
    height: 600px;
  }

  .map-module .vcex-feature-box {
    aspect-ratio: 1;
  }

  .ratio-2-1-md {
    aspect-ratio: 2.2/1;
  }

  .horizontal-wrapper-md > div > .wpb_wrapper {
    display: flex;
    flex-direction: row;
  }
  #footer_bottom .horizontal-wrapper-md > div > .wpb_wrapper {
    gap: 3em;
  }

  main .theme-button.outline {
    min-width: 400px;
  }

  .type-service .wpex-card-excerpt {
    font-size: 14px;
  }
}

@media screen and (max-width: 960px) {
  .text-overlay-hero .yellow-card {
    width: 177px;
  }
.my-hero-text {
  font-size: 50px;
  line-height: 100%;  
}
  .hide-at-mm-breakpoint {
    display: none !important;
  }

  .vertical-mobile {
    display: flex;
    flex-direction: column;
    gap: 1em;
  }

  .vertical-mobile > div {
    width: 100%;
  }

  .mgbutton {
    font-size: 16px !important;
    padding: 0.5em 0.75em !important;
  }
}

@media screen and (max-width: 767px) {
  :root {
    --wpex-vc-column-inner-margin-bottom: 20px !important;
  }

  .no-gap-mobile {
    gap: 0 !important;
  }

  .pdf-button {
    padding: 0.5em 1em;
    font-size: 20px;
    text-align: center;
  }

  .desktop-pull-up {
    margin-top: 1em;
  }

  h5,
  .h5,
  h6,
  .h6 {
    font-size: 18px;
    font-weight: 500;
  }

  .vc_separator_align_left .vc_sep_holder {
    display: none;
  }
  .vc_separator h4 {
    font-size: 30px !important;
    text-align: center;
    margin: 0 auto;
  }

  .wpex-max-w-100[style*="width"] {
    width: 100% !important;
  }

  .full-width-mobile .wpex-max-w-100[style*="width"] {
    width: 90% !important;
    margin: 0 auto;
  }

  .map-module .vcex-feature-box {
    padding: 1em 5%;
    min-height: 160px;
  }
  .map-module .vc_column-inner {
    padding: 0;
  }

  .hero-main {
    min-height: 600px;
  }

  #footer_top {
    padding-top: 3em;
    padding-bottom: 1em;
    font-size: 16px;
  }

  #footer_bottom ul {
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.5rem;
  }

  .full-width-mobile {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .map {
    min-height: 0;
  }

  #site-scroll-top {
    right: 0;
    bottom: 0;
  }

  .type-service .wpex-heading {
    font-size: 28px;
  }

  .services-slider .owl-nav {
    margin: 0 auto;
    margin-bottom: 1em;
  }

  .theme-button.outline {
    width: 100%;
  }

  .services-slider img {
    aspect-ratio: 1;
    object-fit: cover;
  }

  body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container {
    padding: 1em;
  }

  .my-hero-text {
  font-size: 40px !important;
  line-height: 100%;  
}
.my-padded-column {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 20px !important;
    }
  .my-padded-row {
    padding-left: 30px !important;
    padding-right: 30px !important ;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}
.my-padded-tab-text {
    padding-left: 0px !important;
    padding-right: 10px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.my-padded-tab {
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 20px !important;
}
.my-padded-tab-top {
    padding-top: 0px !important;
}
  .mobile-reverse {
    flex-direction: column-reverse;
  }
	
  .my-responsive-box-padding {
    padding: 60px 25px !important;
  }
}

/* --- 1. LANGUAGE SWITCHER (Keep this) --- */
html[lang^="de"] .wpml-lang-en { display: none !important; }
html[lang^="en"] .wpml-lang-de { display: none !important; }


/* --- 2. CARD CONTAINER --- */
.showroom-card {
  width: 100%;
  max-width: 420px; /* Reduced standard width */
  background: #e7ec05; 
  padding: 0;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin: 0 auto; /* Centers the card if container is wide */
}

/* --- 3. COLORS & VARIANTS --- */
.showroom-card.bg-yellow { background: #E7EC05; }
.showroom-card.bg-teal { background: #90C0C2; }
.showroom-card.bg-green { background: #0B391C; }

/* Black Text Mode */
.showroom-card.text-black .showroom-card-content,
.showroom-card.text-black .showroom-card-title,
.showroom-card.text-black .showroom-card-subtitle,
.showroom-card.text-black .showroom-card-description {
  color: #000;
}

/* White Text Mode */
.showroom-card.text-white .showroom-card-content,
.showroom-card.text-white .showroom-card-title,
.showroom-card.text-white .showroom-card-subtitle,
.showroom-card.text-white .showroom-card-description {
  color: #fff;
}


/* --- 4. ICON / IMAGE AREA --- */
body div.showroom-card-icon {
  width: 100%;
  height: 240px !important; /* Change back to 240px (or 10px for testing) */
  overflow: hidden;
  position: relative;
  display: block;
}

body div.showroom-card-icon img {
  width: 100% !important;
  
  /* The Nuclear Option: Overrides any theme 'auto' height */
  height: 100% !important; 
  max-height: 240px !important; 
  min-height: 240px !important; /* Forces it to never shrink below this */
  
  object-fit: cover !important; 
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* --- 5. CONTENT & TYPOGRAPHY --- */
.showroom-card-content {
  padding: 40px 35px;
  text-align: left;
}

.showroom-card-title {
  font-family: 'Aeonik', sans-serif;
  font-size: 32px;
  font-weight: 500;
  margin: 0 0 10px 0;
  line-height: 1.2;
}

.showroom-card-subtitle {
  font-family: 'Aeonik', sans-serif;
  font-size: 18px;
  font-weight: 500;
  margin: 0 0 15px 0;
  line-height: 1.4;
}

.showroom-card-description {
  font-family: 'Aeonik', sans-serif;
  font-size: 18px;
  font-weight: 400;
  margin: 0;
  line-height: 1.4;
}


/* --- 6. RESPONSIVE (TABLETS) --- */
@media only screen and (max-width: 768px) {
    body div.showroom-card-icon {
    height: 180px !important; 
  }
  body div.showroom-card-icon img {
    max-height: 180px !important; 
    min-height: 180px !important;
  }
  .showroom-card-content {
    padding: 30px 25px; /* Reduced padding */
  }
  .showroom-card-title {
    font-size: 28px; /* Smaller title */
  }
}


/* --- 7. RESPONSIVE (MOBILE - UPDATED FONTS) --- */
@media only screen and (max-width: 480px) {
  .showroom-card {
    max-width: 100% !important;
  }

  body div.showroom-card-icon {
    height: 140px !important; 
  }
  body div.showroom-card-icon img {
    max-height: 140px !important; 
    min-height: 140px !important;
  }

  .showroom-card-content {
    padding: 20px 15px; /* Keeps the padding compact */
  }

  .showroom-card-title {
    font-size: 20px; /* Requested: 20px */
    margin-bottom: 5px;
    line-height: 1.2;
  }

  .showroom-card-subtitle {
    font-size: 12px; /* Requested: 12px */
    margin-bottom: 8px;
  }

  .showroom-card-description {
    font-size: 12px; /* Requested: 12px */
    line-height: 1.4;
  }
}

/* --- STOP PULSE/RIPPLE ON MOBILE --- */
/* --- STOP PULSE/RIPPLE ON MOBILE (Safe Version) --- */
@media only screen and (max-width: 480px) {

    /* 1. Stop the Icon itself from pulsing */
    body .imh-6310-point-icons,
    body [class*="blinking"] {
        animation: none !important;
        -webkit-animation: none !important;
        transform: none !important;
        /* Ensure the icon stays fully visible */
        opacity: 1 !important; 
    }

    /* 2. Make the "Ring" invisible, but DO NOT delete it */
    /* We target the pseudo-elements where the ring lives */
    body .imh-6310-point-icons::before,
    body .imh-6310-point-icons::after,
    body [class*="blinking"]::before,
    body [class*="blinking"]::after {
        
        /* Stop the expansion animation */
        animation: none !important;
        -webkit-animation: none !important;
        
        /* Remove the visual styling of the ring */
        box-shadow: none !important;  /* Hides the shadow ring */
        border: none !important;      /* Hides the border ring */
        background: transparent !important; /* Hides the green fill */
        
        /* CRITICAL CHANGE: We removed 'display: none' so the popup structure stays intact */
    }
}


body .shrink-my-container {
    width: fit-content !important;
    width: -moz-fit-content !important;
    margin: 0 auto; /* Optional: Centers it */
}

/* FINAL FIX: MAP CUTOFF ISSUE */
body .fix-map-contain img {
    /* 1. Force image to fit inside the parent */
    width: 100% !important;
    max-width: 100% !important;
    
    /* 2. THE FIX: Kill any minimum width rules that force it to be wide */
    min-width: 0 !important; 
    
    /* 3. Ensure height scales automatically */
    height: auto !important;
    
    /* 4. Reset positioning that might shift it off-screen */
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    left: auto !important;
    transform: none !important;
    
    /* 5. Force containment */
    object-fit: contain !important;
}

/* Ensure the wrapper isn't holding the space open */
body .fix-map-contain .vc_single_image-wrapper, 
body .fix-map-contain figure,
body .fix-map-contain {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important; /* Let us see if padding is the issue */
}



/* BREAKOUT: Force image to touch screen edges perfectly */
body .force-edge-to-edge {
    /* 1. Make it exactly the width of the screen */
    width: 100vw !important; 
    
    /* 2. Center it perfectly, ignoring the parent container */
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    
    /* 3. Ensure no padding/margin interferes */
    padding: 0 !important;
    box-sizing: border-box !important;
    display: block !important;
}

/* Apply the sizing to the image itself */
body .force-edge-to-edge img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    max-width: 100% !important;
}

/* OPTIONAL: Fix for horizontal scrollbar on Windows */
/* Sometimes 100vw triggers a tiny scrollbar. This hides it. */
body {
    overflow-x: hidden; 
}

/* Only apply to mobile devices */
@media only screen and (max-width: 767px) {

    /* 1. RESET ROW HEIGHT */
    .hero-calc-height.mobile-split-layout.vc_row-o-full-height {
        min-height: auto !important;
        height: auto !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* 2. IMAGE COLUMN - Use 'svh' for accurate mobile height */
    .mobile-split-layout .hero-image-col {
        /* Use 100svh (Small Viewport Height) to account for browser bars */
        /* Fallback to vh for older browsers */
        min-height: calc(100vh - 76px) !important;
        min-height: calc(100svh - 76px) !important; 
        
        display: flex !important;
        flex-direction: column;
        margin-bottom: 0 !important; /* Removes WPBakery default gap */
    }

    /* Fix Alignment & Remove Inner Spacing */
    .mobile-split-layout .hero-image-col > .vc_column-inner {
        min-height: calc(100svh - 76px) !important;
        flex-grow: 1;
        display: flex !important;
        flex-direction: column;
        justify-content: flex-start !important;
        margin-bottom: 0 !important;
    }

    /* 3. TEXT COLUMN */
    .mobile-split-layout .hero-text-col {
        min-height: auto !important;
        height: auto !important;
        margin-bottom: 0 !important;
    }

    .mobile-split-layout .hero-text-col > .vc_column-inner {
        justify-content: flex-start !important;
    }
}

/* 1. DEFINE THE SAFE ZONE (Padding from Edges) */
/* This targets the main header container */
#site-header-inner {
    width: 100% !important;
    max-width: none !important;
    padding-left: 50px !important;  /* Distance from Left Edge */
    padding-right: 50px !important; /* Distance from Right Edge */
    box-sizing: border-box;
}

/* 2. UNLOCK THE MENU WRAPPER */
/* We target the ID visible in your screenshot: #site-navigation-wrap */
#site-navigation-wrap {
    flex-grow: 1 !important;   /* Force it to eat up all available space */
    width: auto !important;    /* Allow it to expand */
    margin-right: 0 !important; /* CRITICAL: This overrides 'wpex-mr-auto' */
}

/* 3. SPREAD THE ITEMS (Justify) */
/* We target the list inside that wrapper */
#site-navigation .main-navigation-ul {
    width: 100% !important;    /* Make the list fill the wrapper we just expanded */
    display: flex !important;
    justify-content: space-between !important; /* The Magic: Spreads items evenly */
}

/* 4. OPTIONAL: Handle the Right Side (Language/Search) */
/* If you have items in the 'aside' (like language), this keeps them in check */
#site-header-flex-aside {
    flex-shrink: 0;
    margin-left: 40px; /* Adds a gap between the Menu and the DE|EN switcher */
}