.astroid-offcanvas {width: 320px;} .astroid-offcanvas .dropdown-menus {width: 320px !important;}.st-effect-2.astroid-offcanvas-open .astroid-content{-webkit-transform:translate3d(320px, 0, 0);transform:translate3d(320px, 0, 0);}.st-effect-2.astroid-offcanvas-open .st-effect-2.astroid-offcanvas{-webkit-transform:translate3d(0%, 0, 0);transform:translate3d(0%, 0, 0);}.astroid-offcanvas-opened .astroid-wrapper{background:rgb(173, 181, 189);}.st-effect-2.astroid-offcanvas{z-index:0 !important;}.st-effect-2.astroid-offcanvas-open .st-effect-2.astroid-offcanvas{visibility: visible; -webkit-transition:-webkit-transform 0.5s;transition:transform 0.5s;}.st-effect-2.astroid-offcanvas::after{display:none;}.offcanvasDirRight .st-effect-2.astroid-offcanvas-open .astroid-content{-webkit-transform:translate3d(-320px, 0, 0);transform:translate3d(-320px, 0, 0);}.mobilemenu-slide.astroid-mobilemenu{visibility:visible;-webkit-transform:translate3d(-100%, 0, 0);transform:translate3d(-100%, 0, 0);}.mobilemenu-slide.astroid-mobilemenu-open .mobilemenu-slide.astroid-mobilemenu {visibility:visible;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);}.mobilemenu-slide.astroid-mobilemenu::after{display:none;}#top{padding-top:10px;padding-bottom:10px}#join{background-color:rgb(245, 245, 245);padding-top:5%;padding-bottom:5%}#ba1-y3lgxn9n8{padding-top:30px;padding-bottom:30px}#bab-em1369t3e{color:rgb(255, 255, 255);padding:0px 0px 0px 0px}#bab-em1369t3e a{color:rgb(255, 255, 255);}#bab-em1369t3e a:hover{color:rgb(255, 255, 255);}#bb1-48do7fz8h{color:rgb(255, 255, 255);}#team{padding:0% 0% 0% 0%}#be2-xcg7axca6{padding:20px 20px 20px 20px}#contact{background-color:rgb(34, 34, 34);color:rgb(255, 255, 255);padding-top:3%;padding-bottom:3%}#contact a{color:rgb(204, 204, 204);}#contact a:hover{color:rgb(255, 255, 255);}#f2c-qe89el34j{padding-top:4px;padding-bottom:4px}#f-oel6e1bpp{background-color:rgb(68, 68, 68);color:rgb(204, 204, 204);padding-top:10px;padding-bottom:10px}#f-oel6e1bpp a{color:rgb(170, 170, 170);}#f-oel6e1bpp a:hover{color:rgb(255, 255, 255);}body, .body{font-weight:400;text-transform:none;font-size:1px;letter-spacing:0em;line-height:1.7em;font-family:Abel, Arial, Helvetica, sans-serif;}h1, .h1{font-weight:800;text-transform:none;font-size:3px;letter-spacing:0.08em;line-height:1.3em;font-family:Dosis, Arial, Helvetica, sans-serif;}h2, .h2{font-weight:700;text-transform:none;font-size:30px;letter-spacing:0rem;line-height:1.3em;font-family:Ubuntu, Arial, Helvetica, sans-serif;}h3, .h3{font-weight:700;text-transform:none;font-size:24px;letter-spacing:0em;line-height:1.3em;font-family:Ubuntu, Arial, Helvetica, sans-serif;}h4, .h4{font-weight:300;text-transform:none;font-size:20px;letter-spacing:0em;line-height:1.4em;font-family:Ubuntu, Arial, Helvetica, sans-serif;}.astroid-nav > li > a, .astroid-sidebar-menu > li > a{font-weight:600;text-transform:uppercase;font-size:15px;letter-spacing:0px;line-height:1.6em;font-family:Abel, Arial, Helvetica, sans-serif;}.nav-submenu-container .nav-submenu > li, .jddrop-content .megamenu-item .megamenu-menu li, .nav-submenu{font-weight:500;text-transform:none;font-size:15px;letter-spacing:0px;line-height:1.6em;font-family:Abel, Arial, Helvetica, sans-serif;}body{background-color:rgb(246, 242, 235);color:rgb(17, 17, 17);}body a{color:rgb(17, 17, 17);}body a:hover{color:rgb(31, 191, 117);}header{color:rgb(255, 255, 255);}.astroid-header-section, .astroid-sidebar-header{background-color:rgb(17, 17, 17);}.astroid-logo-text .site-title{color:rgb(0, 0, 0);}.astroid-logo-text .site-tagline{color:rgb(44, 46, 54);}#astroid-sticky-header{background-color:rgb(47, 50, 56);}#astroid-sticky-header .astroid-nav .nav-link{color:rgb(255, 255, 255);}#astroid-sticky-header .astroid-nav .nav-link:hover{color:rgb(52, 152, 219);}#astroid-sticky-header .astroid-nav .nav-link:active, #astroid-sticky-header .astroid-nav .nav-link.active{color:rgb(52, 152, 219);}.astroid-nav .nav-link, .astroid-sidebar-menu .nav-link{color:rgb(255, 255, 255);}.astroid-nav .nav-link:hover, .astroid-sidebar-menu .nav-link:hover{color:rgb(31, 191, 117);}.astroid-nav .nav-link:focus, .astroid-sidebar-menu .nav-link:focus{color:rgb(31, 191, 117);}.astroid-nav .nav-link:active, .astroid-nav .nav-link.active, .astroid-sidebar-menu .nav-link:active, .astroid-sidebar-menu .nav-link.active{color:rgb(31, 191, 117);}.megamenu-container{background-color:rgb(17, 17, 17);}.megamenu-container .nav-submenu .nav-submenu{background-color:rgb(17, 17, 17);}.has-megamenu.open .arrow{border-bottom-color:rgb(17, 17, 17);}.megamenu-container li.nav-item-submenu > a{color:rgb(255, 255, 255);}.megamenu-container li.nav-item-submenu > a:hover{color:rgb(255, 255, 255);background-color:rgb(31, 191, 117);}.megamenu-container li.nav-item-submenu > a:active, .megamenu-container li.nav-item-submenu > a.active{color:rgb(255, 255, 255);background-color:rgb(31, 31, 31);}.astroid-offcanvas, .astroid-offcanvas .burger-menu-button, .astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .dropdown-menus{ background-color: rgb(255, 255, 255) !important;}.astroid-offcanvas { color: rgb(17, 17, 17) !important;}.astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item a, .astroid-offcanvas .menu-indicator{ color: rgb(17, 17, 17) !important;}.astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active > a, .astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active > .nav-header, .astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active > a, .astroid-offcanvas .astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active > a + .menu-indicator{ color: rgb(31, 191, 117) !important;}.astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active, .astroid-offcanvas .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active { background-color: rgb(246, 242, 235) !important;}.header-offcanvas-trigger.burger-menu-button .inner, .header-offcanvas-trigger.burger-menu-button .inner::before, .header-offcanvas-trigger.burger-menu-button .inner::after{background-color: rgb(17, 17, 17);}.astroid-offcanvas .burger-menu-button .inner, .astroid-offcanvas .burger-menu-button .inner::before, .astroid-offcanvas .burger-menu-button .inner::after{background-color: rgb(31, 191, 117);}.astroid-mobilemenu, .astroid-mobilemenu-container .astroid-mobilemenu-inner .dropdown-menus{ background-color: rgb(255, 255, 255) !important;}.astroid-mobilemenu { color: rgb(17, 17, 17) !important;}.astroid-mobilemenu .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item a, .astroid-mobilemenu .menu-indicator{ color: rgb(17, 17, 17) !important;}.astroid-mobilemenu .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active > a, .astroid-mobilemenu .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active > .nav-header, .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active > a, .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active > a + .menu-indicator{ color: rgb(31, 191, 117) !important;}.astroid-mobilemenu .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.active, .astroid-mobilemenu-container .astroid-mobilemenu-inner .menu-item.nav-item-active { background-color: rgb(246, 242, 235) !important;}.header-mobilemenu-trigger.burger-menu-button .inner, .header-mobilemenu-trigger.burger-menu-button .inner::before, .header-mobilemenu-trigger.burger-menu-button .inner::after{background-color: rgb(17, 17, 17);}.astroid-mobilemenu-open .burger-menu-button .inner, .astroid-mobilemenu-open .burger-menu-button .inner::before, .astroid-mobilemenu-open .burger-menu-button .inner::after{background-color: rgb(31, 191, 117);}.astroid-contact-info i[class*="fa-"]{color:rgb(253, 126, 20);}/* =====================================================
   FIN FINAL CLEAN CSS – DESKTOP + MOBILE FIX
   IMPORTANT: Replace ALL old Custom CSS with this one.
   Do not paste this below the old CSS.
   ===================================================== */

/* 1. GLOBAL */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
  color: #111111 !important;
}

*,
*::before,
*::after {
  box-sizing: border-box !important;
}

img,
video,
iframe {
  max-width: 100% !important;
}

h1, h2, h3, h4, h5, h6,
.astroid-heading,
.module-title {
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.5px;
}

/* 2. DESKTOP HEADER */
#astroid-header,
.astroid-header,
.astroid-header-section,
.astroid-header-sticky,
.header,
.navbar,
.navbar-default {
  background: #0f0f0f !important;
  border: none !important;
  min-height: 68px !important;
  height: 68px !important;
  padding: 0 !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 99999999 !important;
}

#astroid-header .container,
.astroid-header .container,
.astroid-header-section .container,
.navbar .container,
#astroid-header .container-fluid,
.astroid-header .container-fluid,
.astroid-header-section .container-fluid,
.navbar .container-fluid {
  width: 100% !important;
  max-width: 100% !important;
  height: 68px !important;
  min-height: 68px !important;
  margin: 0 auto !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
}

/* 3. LOGO */
#astroid-header .astroid-logo,
#astroid-header .astroid-logo a,
#astroid-header .navbar-brand,
.astroid-header .astroid-logo,
.astroid-header .astroid-logo a,
.astroid-header .navbar-brand,
.logo,
.header-logo {
  width: 120px !important;
  min-width: 120px !important;
  max-width: 120px !important;
  height: 68px !important;
  min-height: 68px !important;
  max-height: 68px !important;
  margin: 0 26px 0 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  flex-shrink: 0 !important;
}

#astroid-header .astroid-logo img,
#astroid-header .navbar-brand img,
.astroid-header .astroid-logo img,
.astroid-header .navbar-brand img,
.logo img,
.header-logo img {
  width: auto !important;
  min-width: auto !important;
  max-width: none !important;
  height: 47px !important;
  max-height: 47px !important;
  object-fit: contain !important;
  object-position: left center !important;
  display: block !important;
  transform: none !important;
}

#astroid-header .astroid-logo img:not(:first-of-type),
#astroid-header .navbar-brand img:not(:first-of-type),
.astroid-header .astroid-logo img:not(:first-of-type),
.astroid-header .navbar-brand img:not(:first-of-type) {
  display: none !important;
}

/* 4. DESKTOP MENU */
.astroid-nav,
.navbar-nav,
.nav.menu {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: calc(100vw - 150px) !important;
  overflow: visible !important;
}

.astroid-nav > li,
.navbar-nav > li,
.nav.menu > li {
  position: relative !important;
  overflow: visible !important;
}

.astroid-nav > li > a,
.navbar-nav > li > a,
.nav.menu > li > a,
#astroid-header a,
.astroid-header a,
.navbar a {
  color: #ffffff !important;
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2px !important;
  text-transform: uppercase !important;
  padding: 24px 6px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

.astroid-nav > li > a:hover,
.navbar-nav > li > a:hover,
.nav.menu > li > a:hover,
.astroid-nav .active > a,
.navbar-nav .active > a,
.nav.menu .active > a,
#astroid-header a:hover,
.astroid-header a:hover {
  color: #1fbf75 !important;
}

/* CTA last menu item */
.astroid-nav > li:last-child > a,
.navbar-nav > li:last-child > a,
.nav.menu > li:last-child > a {
  background: #1fbf75 !important;
  color: #ffffff !important;
  padding: 8px 13px !important;
  border-radius: 22px !important;
  font-weight: 900 !important;
  margin-left: 8px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 6px 18px rgba(31,191,117,0.25) !important;
  white-space: nowrap !important;
}

.astroid-nav > li:last-child > a:hover,
.navbar-nav > li:last-child > a:hover,
.nav.menu > li:last-child > a:hover {
  background: #ffffff !important;
  color: #111111 !important;
}

/* Hide desktop hamburger only on desktop */
@media (min-width: 992px) {
  .astroid-header .burger-menu-button,
  .astroid-header .offcanvas-toggle,
  .astroid-header .menu-toggler,
  .astroid-header .navbar-toggler,
  #astroid-header .burger-menu-button,
  #astroid-header .offcanvas-toggle,
  #astroid-header .menu-toggler,
  #astroid-header .navbar-toggler {
    display: none !important;
  }
}

/* 5. DESKTOP DROPDOWNS */
@media (min-width: 992px) {

  #astroid-header,
  .astroid-header,
  .astroid-header-section,
  .astroid-header-sticky,
  .navbar,
  .astroid-nav,
  .navbar-nav,
  .nav.menu,
  .astroid-nav li,
  .navbar-nav li,
  .nav.menu li {
    overflow: visible !important;
  }

  /* Normal dropdown, for Blog and small menus */
  .astroid-nav > li > ul,
  .navbar-nav > li > ul,
  .nav.menu > li > ul,
  .astroid-nav .dropdown-menu,
  .navbar-nav .dropdown-menu,
  .nav.menu .dropdown-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    transform: none !important;
    z-index: 999999999 !important;
    background: #1f1f1f !important;
    min-width: 260px !important;
    width: auto !important;
    max-width: 360px !important;
    padding: 14px 0 !important;
    margin-top: 0 !important;
    border: none !important;
    border-radius: 0 0 16px 16px !important;
    box-shadow: 0 18px 45px rgba(0,0,0,0.45) !important;
    overflow: visible !important;
  }

  .astroid-nav .dropdown-menu li,
  .navbar-nav .dropdown-menu li,
  .nav.menu .dropdown-menu li,
  .astroid-nav ul li,
  .navbar-nav ul li,
  .nav.menu ul li {
    background: transparent !important;
    display: block !important;
    width: 100% !important;
  }

  .astroid-nav .dropdown-menu li a,
  .navbar-nav .dropdown-menu li a,
  .nav.menu .dropdown-menu li a,
  .astroid-nav ul li a,
  .navbar-nav ul li a,
  .nav.menu ul li a {
    display: block !important;
    width: 100% !important;
    padding: 13px 18px !important;
    color: #ffffff !important;
    background: #1f1f1f !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: 0.3px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    border-radius: 0 !important;
  }

  .astroid-nav .dropdown-menu li a:hover,
  .navbar-nav .dropdown-menu li a:hover,
  .nav.menu .dropdown-menu li a:hover,
  .astroid-nav ul li a:hover,
  .navbar-nav ul li a:hover,
  .nav.menu ul li a:hover {
    background: #151515 !important;
    color: #1fbf75 !important;
  }

  /* Mega dropdown ONLY if dropdown has 6+ items.
     Blog stays normal because Blog has only 2 items. */
  .astroid-nav > li > ul:has(> li:nth-child(6)),
  .navbar-nav > li > ul:has(> li:nth-child(6)),
  .nav.menu > li > ul:has(> li:nth-child(6)),
  .astroid-nav .dropdown-menu:has(> li:nth-child(6)),
  .navbar-nav .dropdown-menu:has(> li:nth-child(6)),
  .nav.menu .dropdown-menu:has(> li:nth-child(6)) {
    width: 760px !important;
    min-width: 760px !important;
    max-width: 760px !important;
    padding: 18px !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px 14px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    border-radius: 0 0 18px 18px !important;
    box-shadow: 0 22px 55px rgba(0,0,0,0.55) !important;
  }

  .astroid-nav > li > ul:has(> li:nth-child(6)) li,
  .navbar-nav > li > ul:has(> li:nth-child(6)) li,
  .nav.menu > li > ul:has(> li:nth-child(6)) li,
  .astroid-nav .dropdown-menu:has(> li:nth-child(6)) li,
  .navbar-nav .dropdown-menu:has(> li:nth-child(6)) li,
  .nav.menu .dropdown-menu:has(> li:nth-child(6)) li {
    width: auto !important;
  }

  .astroid-nav > li > ul:has(> li:nth-child(6)) li a,
  .navbar-nav > li > ul:has(> li:nth-child(6)) li a,
  .nav.menu > li > ul:has(> li:nth-child(6)) li a,
  .astroid-nav .dropdown-menu:has(> li:nth-child(6)) li a,
  .navbar-nav .dropdown-menu:has(> li:nth-child(6)) li a,
  .nav.menu .dropdown-menu:has(> li:nth-child(6)) li a {
    width: auto !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
  }
}

/* 6. HOMEPAGE HERO / SLIDER DESKTOP */
#top-a,
.top-a,
.astroid-position-top-a,
.astroid-section-top-a,
section[class*="top-a"],
div[class*="top-a"] {
  position: relative !important;
  z-index: 1 !important;
  overflow: hidden !important;
}

.uk-slideshow,
.uk-slideshow-items,
.uk-slideshow-items > li,
.uk-slider,
.uk-slider-items,
.uk-slider-items > li,
.rev_slider_wrapper,
.rev_slider,
.tp-fullwidth-forcer,
.tp-revslider-mainul,
.tp-parallax-wrap,
.tp-loop-wrap,
.tp-mask-wrap {
  max-width: 100% !important;
  overflow: hidden !important;
}

.tp-caption,
.tp-caption h1,
.uk-slideshow h1,
.uk-slider h1,
.hero h1,
.slideshow h1,
.sprocket-features-title,
.sprocket-features-content h1 {
  font-family: "Montserrat", Arial, Helvetica, sans-serif !important;
  font-size: 64px !important;
  line-height: 1.08 !important;
  font-weight: 800 !important;
  letter-spacing: -1.5px !important;
  max-width: 1050px !important;
  white-space: normal !important;
  text-shadow: 0 8px 25px rgba(0,0,0,0.22) !important;
}

.home-hero-image {
  width: 100% !important;
  height: 620px !important;
  overflow: hidden !important;
  background: #f5f7f7 !important;
}

.home-hero-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

/* 7. TEXT VISIBILITY */
body p,
body .custom p,
body .item-page p,
body .module p,
body .moduletable p,
body article p,
body section p,
body div p {
  opacity: 1 !important;
  visibility: visible !important;
}

body a,
body .btn,
body button,
body input[type="submit"],
body input[type="button"] {
  opacity: 1 !important;
  visibility: visible !important;
}

body div[style*="background:white"] p,
body div[style*="background:#ffffff"] p,
body div[style*="background: white"] p {
  color: #555555 !important;
}

body div[style*="background:#111"] p,
body div[style*="background:#171717"] p,
body div[style*="background:#181818"] p,
body div[style*="background:#0f0f0f"] p {
  color: #d6d6d6 !important;
}

/* 8. TEAM SECTION */
#bottom-b p,
.bottom-b p,
[class*="bottom-b"] p,
body .uk-card p,
body [class*="team"] p,
body [class*="Team"] p {
  font-size: 15px !important;
  line-height: 1.6 !important;
  opacity: 1 !important;
  color: #d6d6d6 !important;
}

#bottom-b h3,
.bottom-b h3,
[class*="bottom-b"] h3 {
  font-size: 26px !important;
  line-height: 1.25 !important;
}

.fin-team-arrows {
  position: absolute;
  top: 42%;
  left: 0;
  right: 0;
  z-index: 99;
  pointer-events: none;
}

.fin-team-prev,
.fin-team-next {
  position: absolute;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: #1fbf75;
  color: #ffffff;
  font-size: 36px;
  line-height: 44px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(0,0,0,0.35);
  pointer-events: auto;
}

.fin-team-prev { left: 18px; }
.fin-team-next { right: 18px; }

.fin-team-prev:hover,
.fin-team-next:hover {
  background: #ffffff;
  color: #111111;
}

/* 9. SECTION SPACING */
#top-f,
.top-f,
.astroid-position-top-f,
.astroid-section-top-f,
section[class*="top-f"],
div[class*="top-f"],
#top-c,
.top-c,
.astroid-position-top-c,
.astroid-section-top-c,
section[class*="top-c"],
div[class*="top-c"] {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}

.fin-blog-section-clean,
div[style*="FIN Insights"],
div[style*="Mitarbeiter-Blog"] {
  margin-top: 0 !important;
  padding-top: 0 !important;
  position: relative !important;
  z-index: 50 !important;
}

/* 10. LAPTOP */
@media (max-width: 1200px) and (min-width: 992px) {
  .tp-caption,
  .tp-caption h1,
  .uk-slideshow h1,
  .uk-slider h1,
  .hero h1,
  .slideshow h1,
  .sprocket-features-title,
  .sprocket-features-content h1 {
    font-size: 52px !important;
    line-height: 1.1 !important;
  }

  .astroid-nav > li > a,
  .navbar-nav > li > a,
  .nav.menu > li > a {
    font-size: 11.5px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

  #astroid-header .astroid-logo,
  #astroid-header .navbar-brand,
  .astroid-header .astroid-logo,
  .astroid-header .navbar-brand {
    width: 112px !important;
    min-width: 112px !important;
    max-width: 112px !important;
    margin-right: 16px !important;
  }

  #astroid-header .astroid-logo img,
  #astroid-header .navbar-brand img,
  .astroid-header .astroid-logo img,
  .astroid-header .navbar-brand img {
    height: 44px !important;
    max-height: 44px !important;
  }
}

/* 11. MOBILE FIX */
@media (max-width: 991px) {

  html,
  body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    background: #101010 !important;
  }

  #astroid-wrapper,
  .astroid-wrapper,
  .astroid-container,
  .astroid-layout,
  .astroid-content,
  .site,
  .body-inner,
  main,
  #main,
  #content {
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: hidden !important;
  }

  .row {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .astroid-section,
  .astroid-position,
  .module,
  .moduletable,
  .custom,
  .item-page,
  .container,
  .container-fluid,
  section,
  article {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* Header mobile */
  #astroid-header,
  .astroid-header,
  .astroid-header-section,
  .navbar,
  .header {
    height: 86px !important;
    min-height: 86px !important;
    padding: 0 !important;
    background: #0f0f0f !important;
  }

  #astroid-header .container,
  .astroid-header .container,
  .astroid-header-section .container,
  .navbar .container,
  #astroid-header .container-fluid,
  .astroid-header .container-fluid,
  .astroid-header-section .container-fluid,
  .navbar .container-fluid {
    height: 86px !important;
    min-height: 86px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    justify-content: center !important;
    position: relative !important;
  }

  #astroid-header .astroid-logo,
  #astroid-header .navbar-brand,
  .astroid-header .astroid-logo,
  .astroid-header .navbar-brand,
  .logo,
  .header-logo {
    width: 130px !important;
    min-width: 130px !important;
    max-width: 130px !important;
    height: 86px !important;
    min-height: 86px !important;
    margin: 0 auto !important;
    justify-content: center !important;
  }

  #astroid-header .astroid-logo img,
  #astroid-header .navbar-brand img,
  .astroid-header .astroid-logo img,
  .astroid-header .navbar-brand img,
  .logo img,
  .header-logo img {
    height: 50px !important;
    max-height: 50px !important;
    width: auto !important;
    object-position: center center !important;
  }

  /* Show mobile hamburger, hide desktop menu */
  .astroid-nav,
  .navbar-nav,
  .nav.menu {
    display: none !important;
  }

  .astroid-header .burger-menu-button,
  .astroid-header .offcanvas-toggle,
  .astroid-header .menu-toggler,
  .astroid-header .navbar-toggler,
  #astroid-header .burger-menu-button,
  #astroid-header .offcanvas-toggle,
  #astroid-header .menu-toggler,
  #astroid-header .navbar-toggler {
    display: block !important;
    position: absolute !important;
    left: 22px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 999999999 !important;
  }

  /* Hide duplicated right hamburger if template creates two */
  #astroid-header .container > *:last-child .burger-menu-button,
  #astroid-header .container > *:last-child .offcanvas-toggle,
  #astroid-header .container > *:last-child .menu-toggler,
  #astroid-header .container > *:last-child .navbar-toggler,
  .astroid-header .container > *:last-child .burger-menu-button,
  .astroid-header .container > *:last-child .offcanvas-toggle,
  .astroid-header .container > *:last-child .menu-toggler,
  .astroid-header .container > *:last-child .navbar-toggler,
  .astroid-header-section .container > *:last-child .burger-menu-button,
  .astroid-header-section .container > *:last-child .offcanvas-toggle,
  .astroid-header-section .container > *:last-child .menu-toggler,
  .astroid-header-section .container > *:last-child .navbar-toggler {
    display: none !important;
  }

  /* Offcanvas mobile menu */
  .astroid-offcanvas,
  .offcanvas,
  .offcanvas-menu,
  .astroid-mobilemenu,
  .mobile-menu {
    background: #ffffff !important;
    color: #111111 !important;
    width: 84vw !important;
    max-width: 340px !important;
    overflow-x: hidden !important;
  }

  .astroid-offcanvas a,
  .offcanvas a,
  .offcanvas-menu a,
  .astroid-mobilemenu a,
  .mobile-menu a {
    color: #111111 !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    padding: 13px 18px !important;
    border-bottom: 1px solid #e8e8e8 !important;
    white-space: normal !important;
    text-decoration: none !important;
  }

  /* Hide old sample menu links in mobile drawer */
  .astroid-offcanvas a[href*="sample"],
  .offcanvas a[href*="sample"],
  .offcanvas-menu a[href*="sample"],
  .mobile-menu a[href*="sample"],
  .astroid-mobilemenu a[href*="sample"],
  .astroid-offcanvas li:has(a[href*="sample"]),
  .offcanvas li:has(a[href*="sample"]),
  .offcanvas-menu li:has(a[href*="sample"]),
  .mobile-menu li:has(a[href*="sample"]),
  .astroid-mobilemenu li:has(a[href*="sample"]) {
    display: none !important;
  }

  /* Mobile slider: show full image instead of ugly cropping */
  .uk-slideshow,
  .uk-slideshow-items,
  .uk-slideshow-items > li,
  .uk-slider,
  .uk-slider-items,
  .uk-slider-items > li {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    background: #101010 !important;
  }

  .uk-slideshow img,
  .uk-slideshow-items img,
  .uk-slider img,
  .uk-slider-items img,
  .uk-cover {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
  }

  .uk-background-cover,
  .uk-cover-container {
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #101010 !important;
  }

  /* Slider text */
  .tp-caption,
  .tp-caption h1,
  .uk-slideshow h1,
  .uk-slider h1,
  .hero h1,
  .slideshow h1,
  .sprocket-features-title,
  .sprocket-features-content h1 {
    font-size: 28px !important;
    line-height: 1.15 !important;
    max-width: 92vw !important;
    white-space: normal !important;
  }

  .uk-slideshow .uk-overlay,
  .uk-slider .uk-overlay,
  .uk-position-bottom,
  .uk-position-bottom-left,
  .uk-position-bottom-center,
  .uk-position-center-left,
  .uk-position-center {
    left: 14px !important;
    right: 14px !important;
    width: auto !important;
    max-width: calc(100vw - 28px) !important;
    margin: 0 !important;
    padding: 14px !important;
    transform: none !important;
    border-radius: 16px !important;
  }

  .home-hero-image {
    height: auto !important;
    min-height: 0 !important;
    background: #101010 !important;
  }

  .home-hero-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  h1 {
    font-size: 30px !important;
    line-height: 1.18 !important;
  }

  h2 {
    font-size: 26px !important;
    line-height: 1.22 !important;
  }

  h3 {
    font-size: 21px !important;
    line-height: 1.25 !important;
  }

  p,
  li {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  /* Inline custom sections: safe mobile fixes only */
  div[style*="max-width: 1180px"],
  div[style*="max-width: 1120px"],
  div[style*="max-width: 1050px"],
  div[style*="max-width: 900px"],
  div[style*="max-width: 760px"] {
    max-width: 100% !important;
    width: 100% !important;
  }

  div[style*="margin-top: -35px"] {
    margin-top: 0 !important;
  }

  div[style*="border-right"] {
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  }

  div[style*="width: 230px"][style*="height: 230px"] {
    width: 180px !important;
    height: 180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  div[style*="width: 135px"][style*="height: 135px"] {
    width: 118px !important;
    height: 118px !important;
  }

  div[style*="grid-template-columns: repeat(5,1fr)"],
  div[style*="grid-template-columns: repeat(auto-fit"] {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }

  div[style*="justify-content: space-between"] {
    align-items: flex-start !important;
    gap: 4px !important;
  }

  div[style*="justify-content: space-between"] span {
    display: block !important;
    margin-top: 3px !important;
  }

  a[style*="border-radius"] {
    max-width: 100% !important;
    white-space: normal !important;
    text-align: center !important;
  }

  a[style*="padding: 15px"],
  a[style*="padding: 14px"],
  a[style*="padding: 13px"] {
    padding: 11px 20px !important;
    font-size: 14px !important;
  }

  iframe,
  video {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    min-height: 0 !important;
    max-height: 260px !important;
    display: block !important;
  }

  .video,
  .video-container,
  .embed-responsive,
  .ratio {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
  }

  footer,
  .footer,
  .astroid-footer {
    text-align: center !important;
  }
}

/* 12. EXTRA SMALL PHONES */
@media (max-width: 575px) {
  #astroid-header,
  .astroid-header,
  .astroid-header-section,
  .navbar,
  .header,
  #astroid-header .container,
  .astroid-header .container,
  .astroid-header-section .container,
  .navbar .container,
  #astroid-header .container-fluid,
  .astroid-header .container-fluid,
  .astroid-header-section .container-fluid,
  .navbar .container-fluid {
    height: 82px !important;
    min-height: 82px !important;
  }

  #astroid-header .astroid-logo img,
  #astroid-header .navbar-brand img,
  .astroid-header .astroid-logo img,
  .astroid-header .navbar-brand img,
  .logo img,
  .header-logo img {
    height: 47px !important;
    max-height: 47px !important;
  }

  h1 { font-size: 26px !important; }
  h2 { font-size: 23px !important; }
  h3 { font-size: 20px !important; }

  .tp-caption,
  .tp-caption h1,
  .uk-slideshow h1,
  .uk-slider h1,
  .hero h1,
  .slideshow h1,
  .sprocket-features-title,
  .sprocket-features-content h1 {
    font-size: 24px !important;
  }

  div[style*="width: 230px"][style*="height: 230px"] {
    width: 165px !important;
    height: 165px !important;
  }
}
/* =====================================================
   FIN MOBILE HOMEPAGE HERO RESTORE
   Paste at VERY BOTTOM only
   This brings back homepage slider on mobile
   ===================================================== */

@media (max-width: 991px) {

  /* Show homepage hero/slider section again */
  #top-a,
  .top-a,
  .astroid-position-top-a,
  .astroid-section-top-a,
  section[class*="top-a"],
  div[class*="top-a"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #101010 !important;
  }

  /* Force slideshow visible on mobile */
  .uk-slideshow,
  .uk-slideshow-items,
  .uk-slideshow-items > li,
  .uk-slider,
  .uk-slider-items,
  .uk-slider-items > li,
  .rev_slider_wrapper,
  .rev_slider,
  .tp-fullwidth-forcer,
  .tp-revslider-mainul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: 440px !important;
    min-height: 440px !important;
    max-height: 440px !important;
    overflow: hidden !important;
    background: #101010 !important;
  }

  /* Slider image mobile fit */
  .uk-slideshow img,
  .uk-slideshow-items img,
  .uk-slider img,
  .uk-slider-items img,
  .uk-cover,
  .rev_slider img,
  .tp-bgimg {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: 440px !important;
    min-height: 440px !important;
    max-height: 440px !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* If slider uses background image instead of img */
  .uk-background-cover,
  .uk-cover-container,
  .tp-bgimg {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #101010 !important;
  }

  /* Slider text box mobile */
  .uk-slideshow .uk-overlay,
  .uk-slider .uk-overlay,
  .uk-position-bottom,
  .uk-position-bottom-left,
  .uk-position-bottom-center,
  .uk-position-center-left,
  .uk-position-center {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 18px !important;
    top: auto !important;
    width: auto !important;
    max-width: calc(100vw - 28px) !important;
    margin: 0 !important;
    padding: 14px 16px !important;
    transform: none !important;
    border-radius: 16px !important;
  }

  .uk-slideshow .uk-overlay h1,
  .uk-slideshow .uk-overlay h2,
  .uk-slideshow .uk-overlay h3,
  .uk-slider .uk-overlay h1,
  .uk-slider .uk-overlay h2,
  .uk-slider .uk-overlay h3 {
    font-size: 23px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    margin: 0 0 8px !important;
  }

  .uk-slideshow .uk-overlay p,
  .uk-slider .uk-overlay p {
    font-size: 13px !important;
    line-height: 1.45 !important;
    white-space: normal !important;
    margin: 0 !important;
  }
}

/* Smaller iPhones */
@media (max-width: 575px) {
  .uk-slideshow,
  .uk-slideshow-items,
  .uk-slideshow-items > li,
  .uk-slider,
  .uk-slider-items,
  .uk-slider-items > li,
  .rev_slider_wrapper,
  .rev_slider,
  .tp-fullwidth-forcer,
  .tp-revslider-mainul,
  .uk-slideshow img,
  .uk-slideshow-items img,
  .uk-slider img,
  .uk-slider-items img,
  .uk-cover,
  .rev_slider img,
  .tp-bgimg {
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
  }
}
/* =========================================
   FIN MOBILE HERO FINAL FIX
   fixes:
   1) image cut from left/right
   2) text box cut on mobile
   3) arrows/dots too messy
   Paste at VERY BOTTOM
   ========================================= */

@media (max-width: 991px) {

  /* HERO / SLIDER WRAPPER */
  .home-hero-image,
  .uk-slideshow,
  .uk-slideshow-items,
  .uk-slideshow-items > li,
  .uk-slider,
  .uk-slider-items,
  .uk-slider-items > li,
  .uk-cover-container,
  .rev_slider_wrapper,
  .rev_slider {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
    position: relative !important;
    background: #101010 !important;
  }

  /* IMPORTANT: stop cover-cropping on mobile */
  .home-hero-image img,
  .uk-slideshow-items img,
  .uk-slider-items img,
  .uk-cover,
  .rev_slider img,
  .tp-bgimg {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center top !important;
    display: block !important;
  }

  /* if slide uses background image */
  .uk-slideshow-items > li,
  .uk-slider-items > li {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
  }

  /* Make overlay text fit inside screen */
  .uk-position-bottom,
  .uk-position-bottom-left,
  .uk-position-bottom-center,
  .uk-position-center-left,
  .uk-position-center,
  .uk-overlay,
  .tp-caption,
  .sprocket-features-content,
  .sprocket-features-desc {
    left: 14px !important;
    right: 14px !important;
    bottom: 14px !important;
    top: auto !important;
    width: auto !important;
    max-width: calc(100% - 28px) !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    transform: none !important;
    box-sizing: border-box !important;
    border-radius: 16px !important;
  }

  /* Hero heading on mobile */
  .tp-caption h1,
  .uk-slideshow h1,
  .uk-slider h1,
  .hero h1,
  .slideshow h1,
  .sprocket-features-title,
  .sprocket-features-content h1 {
    font-size: 26px !important;
    line-height: 1.15 !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  /* Hero paragraph on mobile */
  .tp-caption p,
  .uk-slideshow p,
  .uk-slider p,
  .hero p,
  .slideshow p,
  .sprocket-features-content p,
  .sprocket-features-desc {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
  }

  /* Mobile arrows smaller and cleaner */
  .uk-slidenav,
  .uk-position-center-left,
  .uk-position-center-right,
  .tp-leftarrow,
  .tp-rightarrow {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Move dots to proper place */
  .uk-dotnav,
  .tp-bullets {
    bottom: 68px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: auto !important;
  }
}

/* extra small iPhone adjustment */
@media (max-width: 575px) {
  .tp-caption h1,
  .uk-slideshow h1,
  .uk-slider h1,
  .hero h1,
  .slideshow h1,
  .sprocket-features-title,
  .sprocket-features-content h1 {
    font-size: 24px !important;
  }

  .uk-overlay,
  .tp-caption,
  .sprocket-features-content,
  .sprocket-features-desc {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    max-width: calc(100% - 24px) !important;
    padding: 10px 12px !important;
  }
}
/* =====================================================
   FIN MOBILE SLIDER FIX
   Keeps images full width but stops slides appearing one under another
   Paste at VERY BOTTOM
   ===================================================== */

@media (max-width: 991px) {

  /* Slider wrapper: fixed natural mobile ratio */
  .uk-slideshow,
  .uk-slideshow-items,
  .uk-slider,
  .uk-slider-items {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 56.25vw !important;
    min-height: 250px !important;
    max-height: 430px !important;
    overflow: hidden !important;
    background: #101010 !important;
  }

  /* All slides stay in same place, not below each other */
  .uk-slideshow-items > li,
  .uk-slider-items > li {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  /* Only active slide visible */
  .uk-slideshow-items > li.uk-active,
  .uk-slider-items > li.uk-active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 2 !important;
  }

  /* Image full visible, no left-right cutting */
  .uk-slideshow-items > li img,
  .uk-slider-items > li img,
  .uk-slideshow img,
  .uk-slider img,
  .uk-cover {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
    background: #101010 !important;
  }

  /* For background-image sliders */
  .uk-slideshow-items > li,
  .uk-slider-items > li,
  .uk-background-cover,
  .uk-cover-container {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-color: #101010 !important;
  }

  /* Arrows clean */
  .uk-slidenav,
  .tp-leftarrow,
  .tp-rightarrow {
    width: 36px !important;
    height: 36px !important;
    opacity: 0.75 !important;
    z-index: 10 !important;
  }

  /* Dots clean */
  .uk-dotnav,
  .tp-bullets {
    z-index: 12 !important;
  }
}
/* =====================================================
   FIN MOBILE COMPACT FINAL PATCH
   Fixes:
   1. left/right empty side gaps
   2. blog/team/contact too narrow
   3. team cards in 2 columns
   4. contact details shorter and compact
   Paste at VERY BOTTOM
   ===================================================== */

@media (max-width: 991px) {

  /* ---------- remove ugly left/right gaps ---------- */
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    background: #101010 !important;
  }

  #astroid-wrapper,
  .astroid-wrapper,
  .astroid-content,
  .astroid-component-area,
  .astroid-layout,
  .site,
  .body-inner,
  main,
  #main,
  #content,
  .item-page,
  .custom,
  .moduletable,
  .module,
  .container,
  .container-fluid,
  .row {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: hidden !important;
  }

  /* All custom sections full mobile width */
  .custom > div,
  .item-page > div,
  article > div,
  section > div,
  div[style*="max-width: 1180px"],
  div[style*="max-width: 1050px"],
  div[style*="max-width: 900px"],
  div[style*="max-width: 760px"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* reduce huge mobile padding */
  div[style*="padding: 50px"],
  div[style*="padding: 45px"],
  div[style*="padding: 42px"],
  div[style*="padding: 38px"],
  div[style*="padding: 34px"],
  div[style*="padding: 30px"] {
    padding: 26px 14px !important;
  }

  /* ---------- Blog / cards full width and centered ---------- */
  div[style*="border-radius: 28px"],
  div[style*="border-radius: 26px"],
  div[style*="border-radius: 24px"],
  div[style*="border-radius: 22px"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* ---------- TEAM SECTION: make 2 columns on mobile ---------- */
  div[style*="grid-template-columns: repeat(5,1fr)"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 14px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Team cards compact */
  div[style*="grid-template-columns: repeat(5,1fr)"] > div {
    min-height: auto !important;
    padding: 0 4px !important;
  }

  /* Team images smaller */
  div[style*="grid-template-columns: repeat(5,1fr)"] img {
    width: 105px !important;
    height: 105px !important;
    max-width: 105px !important;
    max-height: 105px !important;
    margin-bottom: 10px !important;
  }

  /* Team names */
  div[style*="grid-template-columns: repeat(5,1fr)"] h3 {
    height: auto !important;
    min-height: 42px !important;
    font-size: 18px !important;
    line-height: 1.18 !important;
    margin-bottom: 6px !important;
  }

  /* Team role + description */
  div[style*="grid-template-columns: repeat(5,1fr)"] p {
    height: auto !important;
    font-size: 12.5px !important;
    line-height: 1.35 !important;
    margin-bottom: 7px !important;
  }

  /* Team phone */
  div[style*="grid-template-columns: repeat(5,1fr)"] a[href^="tel:"] {
    font-size: 12px !important;
    line-height: 1.25 !important;
    margin-bottom: 8px !important;
    display: block !important;
    word-break: break-word !important;
  }

  /* Team email button */
  div[style*="grid-template-columns: repeat(5,1fr)"] a[href^="mailto:"] {
    font-size: 11.5px !important;
    padding: 8px 10px !important;
    min-width: 110px !important;
    max-width: 135px !important;
    border-radius: 22px !important;
  }

  /* Last team member centered if odd number */
  div[style*="grid-template-columns: repeat(5,1fr)"] > div:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
    max-width: 55% !important;
    margin: 0 auto !important;
  }

  /* ---------- CONTACT SECTION: compact 2-column layout ---------- */

  /* Contact main 3 boxes become 2 columns instead of one long column */
  div[style*="background: #101010"] div[style*="display: flex"][style*="flex-wrap: wrap"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  /* Contact boxes */
  div[style*="background: #101010"] div[style*="display: flex"][style*="flex-wrap: wrap"] > div {
    min-width: 0 !important;
    width: 100% !important;
    padding: 16px 14px !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    background: #171717 !important;
  }

  /* Make direct Ansprechpartner full width because it has many names */
  div[style*="background: #101010"] div[style*="display: flex"][style*="flex-wrap: wrap"] > div:nth-child(3) {
    grid-column: 1 / -1 !important;
  }

  /* Contact headings compact */
  div[style*="background: #101010"] h2 {
    font-size: 26px !important;
    line-height: 1.15 !important;
  }

  div[style*="background: #101010"] h3 {
    font-size: 18px !important;
    line-height: 1.2 !important;
    margin-bottom: 8px !important;
  }

  div[style*="background: #101010"] p {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
  }

  /* Ansprechpartner rows: name left, number right but compact */
  div[style*="background: #101010"] div[style*="justify-content: space-between"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    align-items: center !important;
    font-size: 12.5px !important;
    line-height: 1.35 !important;
  }

  div[style*="background: #101010"] div[style*="justify-content: space-between"] span {
    display: block !important;
    margin: 0 !important;
    text-align: right !important;
    word-break: break-word !important;
  }

  /* Schellerten box compact */
  div[style*="Geschäftsstelle Schellerten"],
  div:has(> p[style*="Geschäftsstelle Schellerten"]) {
    padding: 16px 14px !important;
    border-radius: 18px !important;
    margin-top: 12px !important;
  }

  /* Footer links compact */
  div[style*="© FIN. 2026"] {
    text-align: center !important;
    justify-content: center !important;
  }
}

/* Very small iPhones */
@media (max-width: 430px) {

  /* Team still 2 columns but smaller */
  div[style*="grid-template-columns: repeat(5,1fr)"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 10px !important;
  }

  div[style*="grid-template-columns: repeat(5,1fr)"] img {
    width: 96px !important;
    height: 96px !important;
  }

  div[style*="grid-template-columns: repeat(5,1fr)"] h3 {
    font-size: 16px !important;
  }

  div[style*="grid-template-columns: repeat(5,1fr)"] p {
    font-size: 12px !important;
  }

  /* Contact 2 columns remain, but text smaller */
  div[style*="background: #101010"] div[style*="display: flex"][style*="flex-wrap: wrap"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  div[style*="background: #101010"] div[style*="display: flex"][style*="flex-wrap: wrap"] > div {
    padding: 14px 11px !important;
  }

  div[style*="background: #101010"] h3 {
    font-size: 16px !important;
  }

  div[style*="background: #101010"] p {
    font-size: 12px !important;
  }
}
/* =====================================================
   FIN OFFCANVAS MOBILE MENU VISIBILITY FIX
   Problem: menu panel opens but links are hidden
   Paste at VERY BOTTOM
   ===================================================== */

@media (max-width: 991px) {

  /* Hide ONLY desktop/header menu on mobile */
  #astroid-header .astroid-nav,
  #astroid-header .navbar-nav,
  #astroid-header > .nav.menu,
  .astroid-header .astroid-nav,
  .astroid-header .navbar-nav,
  .astroid-header > .nav.menu,
  .navbar > .nav.menu {
    display: none !important;
  }

  /* Show menu inside offcanvas */
  .astroid-offcanvas .nav.menu,
  .astroid-offcanvas .navbar-nav,
  .astroid-offcanvas .moduletable,
  .astroid-offcanvas .module,
  .offcanvas .nav.menu,
  .offcanvas .navbar-nav,
  .offcanvas .moduletable,
  .offcanvas .module,
  .offcanvas-menu .nav.menu,
  .offcanvas-menu .navbar-nav,
  .offcanvas-menu .moduletable,
  .offcanvas-menu .module {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Offcanvas panel design */
  .astroid-offcanvas,
  .offcanvas,
  .offcanvas-menu,
  .astroid-mobilemenu,
  .mobile-menu {
    background: #ffffff !important;
    color: #111111 !important;
    width: 84vw !important;
    max-width: 340px !important;
    min-height: 100vh !important;
    overflow-y: auto !important;
    z-index: 999999999 !important;
  }

  /* Menu list visible */
  .astroid-offcanvas ul,
  .offcanvas ul,
  .offcanvas-menu ul,
  .astroid-mobilemenu ul,
  .mobile-menu ul,
  .astroid-offcanvas .nav.menu,
  .offcanvas .nav.menu,
  .offcanvas-menu .nav.menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    list-style: none !important;
    margin: 80px 0 0 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  /* Menu items */
  .astroid-offcanvas li,
  .offcanvas li,
  .offcanvas-menu li,
  .astroid-mobilemenu li,
  .mobile-menu li {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Menu links */
  .astroid-offcanvas li a,
  .offcanvas li a,
  .offcanvas-menu li a,
  .astroid-mobilemenu li a,
  .mobile-menu li a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    color: #111111 !important;
    background: #ffffff !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 16px 24px !important;
    border-bottom: 1px solid #eeeeee !important;
    text-decoration: none !important;
    white-space: normal !important;
  }

  .astroid-offcanvas li a:hover,
  .offcanvas li a:hover,
  .offcanvas-menu li a:hover,
  .astroid-mobilemenu li a:hover,
  .mobile-menu li a:hover {
    color: #1fbf75 !important;
    background: #f7f7f7 !important;
  }

  /* Submenu inside mobile */
  .astroid-offcanvas li ul,
  .offcanvas li ul,
  .offcanvas-menu li ul,
  .astroid-mobilemenu li ul,
  .mobile-menu li ul {
    display: block !important;
    margin: 0 !important;
    padding: 0 0 0 14px !important;
    background: #f8f8f8 !important;
  }

  .astroid-offcanvas li ul li a,
  .offcanvas li ul li a,
  .offcanvas-menu li ul li a,
  .astroid-mobilemenu li ul li a,
  .mobile-menu li ul li a {
    font-size: 14px !important;
    font-weight: 700 !important;
    padding: 12px 24px !important;
    background: #f8f8f8 !important;
    color: #222222 !important;
  }

  /* Close button */
  .astroid-offcanvas .close,
  .offcanvas .close,
  .offcanvas-menu .close,
  .astroid-offcanvas .btn-close,
  .offcanvas .btn-close {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #111111 !important;
    z-index: 999999999 !important;
  }
}
/* =====================================================
   FIN FIX - Hide dropdown/menu buttons in desktop background
   Paste at VERY BOTTOM of Custom CSS
   ===================================================== */

@media (min-width: 992px) {

  /* Hide all desktop dropdown submenus by default */
  .astroid-nav > li > ul,
  .navbar-nav > li > ul,
  .nav.menu > li > ul,
  .astroid-nav .dropdown-menu,
  .navbar-nav .dropdown-menu,
  .nav.menu .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 99999 !important;
  }

  /* Show dropdown only when mouse is on parent menu item */
  .astroid-nav > li:hover > ul,
  .navbar-nav > li:hover > ul,
  .nav.menu > li:hover > ul,
  .astroid-nav li:hover > .dropdown-menu,
  .navbar-nav li:hover > .dropdown-menu,
  .nav.menu li:hover > .dropdown-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: #111111 !important;
    border-radius: 0 0 18px 18px !important;
    padding: 14px !important;
    box-shadow: 0 20px 45px rgba(0,0,0,0.35) !important;
  }

  /* Long Finanzvergleich dropdown: show as 3 columns ONLY on hover */
  .astroid-nav > li:hover > ul:has(> li:nth-child(6)),
  .navbar-nav > li:hover > ul:has(> li:nth-child(6)),
  .nav.menu > li:hover > ul:has(> li:nth-child(6)),
  .astroid-nav li:hover > .dropdown-menu:has(> li:nth-child(6)),
  .navbar-nav li:hover > .dropdown-menu:has(> li:nth-child(6)),
  .nav.menu li:hover > .dropdown-menu:has(> li:nth-child(6)) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    width: 760px !important;
    min-width: 760px !important;
    max-width: 760px !important;
    gap: 6px 14px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  /* Dropdown link design */
  .astroid-nav > li > ul li a,
  .navbar-nav > li > ul li a,
  .nav.menu > li > ul li a,
  .astroid-nav .dropdown-menu li a,
  .navbar-nav .dropdown-menu li a,
  .nav.menu .dropdown-menu li a {
    display: block !important;
    color: #ffffff !important;
    background: #1f1f1f !important;
    padding: 12px 16px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: normal !important;
  }

  .astroid-nav > li > ul li a:hover,
  .navbar-nav > li > ul li a:hover,
  .nav.menu > li > ul li a:hover,
  .astroid-nav .dropdown-menu li a:hover,
  .navbar-nav .dropdown-menu li a:hover,
  .nav.menu .dropdown-menu li a:hover {
    background: #1fbf75 !important;
    color: #ffffff !important;
  }
}
/* =====================================================
   FIN FIX - Hide dropdown buttons from mobile background
   but keep offcanvas mobile menu working
   ===================================================== */

@media (max-width: 991px) {

  /* Hide dropdown/submenu buttons that are leaking into mobile page */
  body .astroid-nav > li > ul,
  body .navbar-nav > li > ul,
  body .nav.menu > li > ul,
  body .astroid-nav .dropdown-menu,
  body .navbar-nav .dropdown-menu,
  body .nav.menu .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    z-index: -1 !important;
  }

  /* Keep the actual offcanvas mobile menu visible */
  .astroid-offcanvas .nav.menu,
  .astroid-offcanvas .navbar-nav,
  .offcanvas .nav.menu,
  .offcanvas .navbar-nav,
  .offcanvas-menu .nav.menu,
  .offcanvas-menu .navbar-nav {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: 999999 !important;
  }

  /* Show submenu items only inside offcanvas */
  .astroid-offcanvas .nav.menu > li > ul,
  .astroid-offcanvas .navbar-nav > li > ul,
  .offcanvas .nav.menu > li > ul,
  .offcanvas .navbar-nav > li > ul,
  .offcanvas-menu .nav.menu > li > ul,
  .offcanvas-menu .navbar-nav > li > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: 999999 !important;
  }
}
/* =====================================================
   FIN FIX - Hide dropdown buttons from mobile background
   but keep offcanvas mobile menu working
   ===================================================== */

@media (max-width: 991px) {

  /* Hide dropdown/submenu buttons that are leaking into mobile page */
  body .astroid-nav > li > ul,
  body .navbar-nav > li > ul,
  body .nav.menu > li > ul,
  body .astroid-nav .dropdown-menu,
  body .navbar-nav .dropdown-menu,
  body .nav.menu .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
    z-index: -1 !important;
  }

  /* Keep the actual offcanvas mobile menu visible */
  .astroid-offcanvas .nav.menu,
  .astroid-offcanvas .navbar-nav,
  .offcanvas .nav.menu,
  .offcanvas .navbar-nav,
  .offcanvas-menu .nav.menu,
  .offcanvas-menu .navbar-nav {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: 999999 !important;
  }

  /* Show submenu items only inside offcanvas */
  .astroid-offcanvas .nav.menu > li > ul,
  .astroid-offcanvas .navbar-nav > li > ul,
  .offcanvas .nav.menu > li > ul,
  .offcanvas .navbar-nav > li > ul,
  .offcanvas-menu .nav.menu > li > ul,
  .offcanvas-menu .navbar-nav > li > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: 999999 !important;
  }
}
/* =====================================================
   FIN DROPDOWN FIX - Vergleichsrechner in 2 columns
   Paste at VERY BOTTOM
   ===================================================== */

@media (min-width: 992px) {

  /* Make long Vergleichs- u. Finanzrechner dropdown 2 columns */
  body #astroid-header li:hover > ul:has(> li:nth-child(8)),
  body .astroid-header li:hover > ul:has(> li:nth-child(8)),
  body .navbar li:hover > ul:has(> li:nth-child(8)),
  body .astroid-nav li:hover > ul:has(> li:nth-child(8)),
  body .navbar-nav li:hover > ul:has(> li:nth-child(8)),
  body .nav.menu li:hover > ul:has(> li:nth-child(8)) {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    width: 620px !important;
    min-width: 620px !important;
    max-width: 620px !important;
    max-height: 78vh !important;
    overflow-y: auto !important;
    gap: 6px 12px !important;
    padding: 18px !important;
    background: #1f1f1f !important;
    border-radius: 0 0 18px 18px !important;
    box-shadow: 0 22px 55px rgba(0,0,0,0.55) !important;
    left: 50% !important;
    top: 100% !important;
    transform: translateX(-50%) !important;
    z-index: 999999999 !important;
  }

  /* Items inside 2-column dropdown */
  body #astroid-header li:hover > ul:has(> li:nth-child(8)) li,
  body .astroid-header li:hover > ul:has(> li:nth-child(8)) li,
  body .navbar li:hover > ul:has(> li:nth-child(8)) li,
  body .astroid-nav li:hover > ul:has(> li:nth-child(8)) li,
  body .navbar-nav li:hover > ul:has(> li:nth-child(8)) li,
  body .nav.menu li:hover > ul:has(> li:nth-child(8)) li {
    width: auto !important;
    display: block !important;
  }

  /* Text inside dropdown */
  body #astroid-header li:hover > ul:has(> li:nth-child(8)) li a,
  body .astroid-header li:hover > ul:has(> li:nth-child(8)) li a,
  body .navbar li:hover > ul:has(> li:nth-child(8)) li a,
  body .astroid-nav li:hover > ul:has(> li:nth-child(8)) li a,
  body .navbar-nav li:hover > ul:has(> li:nth-child(8)) li a,
  body .nav.menu li:hover > ul:has(> li:nth-child(8)) li a {
    display: block !important;
    width: 100% !important;
    padding: 12px 14px !important;
    color: #ffffff !important;
    background: #1f1f1f !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: normal !important;
  }

  body #astroid-header li:hover > ul:has(> li:nth-child(8)) li a:hover,
  body .astroid-header li:hover > ul:has(> li:nth-child(8)) li a:hover,
  body .navbar li:hover > ul:has(> li:nth-child(8)) li a:hover,
  body .astroid-nav li:hover > ul:has(> li:nth-child(8)) li a:hover,
  body .navbar-nav li:hover > ul:has(> li:nth-child(8)) li a:hover,
  body .nav.menu li:hover > ul:has(> li:nth-child(8)) li a:hover {
    background: #1fbf75 !important;
    color: #ffffff !important;
  }
}
/* =====================================================
   FIN BASE WEBSITE BACKGROUND COLOR
   Removes dark grey side/background behind modules
   Paste at VERY BOTTOM
   ===================================================== */

html,
body,
.astroid-wrapper,
.astroid-container,
.astroid-layout,
.astroid-content,
.astroid-component-area,
#astroid-main,
.main-body,
.site,
.body-wrapper,
main {
  background: #f6f2eb !important;
}
/* =====================================================
ONLY FIX MOBILE MENU / HAMBURGER
Paste at VERY BOTTOM. Do not change anything else.
===================================================== */

@media (max-width: 991px) {

/* Keep mobile header visible */
body #astroid-header,
body .astroid-header,
body .astroid-header-section,
body .navbar {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
background: #0f0f0f !important;
height: 78px !important;
min-height: 78px !important;
overflow: visible !important;
position: relative !important;
z-index: 999999999 !important;
}

body #astroid-header .container,
body .astroid-header .container,
body .astroid-header-section .container,
body .navbar .container,
body #astroid-header .container-fluid,
body .astroid-header .container-fluid,
body .astroid-header-section .container-fluid,
body .navbar .container-fluid {
height: 78px !important;
min-height: 78px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
position: relative !important;
overflow: visible !important;
}

/* Hide desktop menu on mobile */
body #astroid-header .astroid-nav,
body #astroid-header .navbar-nav,
body #astroid-header .nav.menu,
body .astroid-header .astroid-nav,
body .astroid-header .navbar-nav,
body .astroid-header .nav.menu {
display: none !important;
}

/* Show hamburger button again */
body #astroid-header .burger-menu-button,
body #astroid-header .offcanvas-toggle,
body #astroid-header .offcanvas-toggler,
body #astroid-header .astroid-offcanvas-toggler,
body #astroid-header .astroid-mobilemenu-toggler,
body #astroid-header .menu-toggler,
body #astroid-header .navbar-toggler,
body .astroid-header .burger-menu-button,
body .astroid-header .offcanvas-toggle,
body .astroid-header .offcanvas-toggler,
body .astroid-header .astroid-offcanvas-toggler,
body .astroid-header .astroid-mobilemenu-toggler,
body .astroid-header .menu-toggler,
body .astroid-header .navbar-toggler,
body .astroid-header-section .burger-menu-button,
body .astroid-header-section .offcanvas-toggle,
body .astroid-header-section .offcanvas-toggler,
body .astroid-header-section .astroid-offcanvas-toggler,
body .astroid-header-section .astroid-mobilemenu-toggler,
body .astroid-header-section .menu-toggler,
body .astroid-header-section .navbar-toggler {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
position: absolute !important;
right: 18px !important;
left: auto !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 44px !important;
height: 44px !important;
align-items: center !important;
justify-content: center !important;
background: transparent !important;
border: none !important;
color: #ffffff !important;
z-index: 2147483647 !important;
cursor: pointer !important;
}

/* Force icon visible even if template icon is hidden */
body #astroid-header .burger-menu-button::before,
body #astroid-header .offcanvas-toggle::before,
body #astroid-header .offcanvas-toggler::before,
body #astroid-header .astroid-offcanvas-toggler::before,
body #astroid-header .astroid-mobilemenu-toggler::before,
body #astroid-header .menu-toggler::before,
body #astroid-header .navbar-toggler::before,
body .astroid-header .burger-menu-button::before,
body .astroid-header .offcanvas-toggle::before,
body .astroid-header .offcanvas-toggler::before,
body .astroid-header .astroid-offcanvas-toggler::before,
body .astroid-header .astroid-mobilemenu-toggler::before,
body .astroid-header .menu-toggler::before,
body .astroid-header .navbar-toggler::before {
content: "☰" !important;
display: block !important;
color: #ffffff !important;
font-size: 30px !important;
line-height: 1 !important;
font-weight: 900 !important;
}

/* Make offcanvas menu content visible when opened */
body .astroid-offcanvas .nav.menu,
body .astroid-offcanvas .navbar-nav,
body .astroid-offcanvas ul.menu,
body .astroid-offcanvas ul.nav,
body .offcanvas .nav.menu,
body .offcanvas .navbar-nav,
body .offcanvas ul.menu,
body .offcanvas ul.nav,
body .offcanvas-menu .nav.menu,
body .offcanvas-menu .navbar-nav,
body .offcanvas-menu ul.menu,
body .offcanvas-menu ul.nav {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
list-style: none !important;
margin: 70px 0 0 0 !important;
padding: 0 !important;
width: 100% !important;
}

body .astroid-offcanvas li a,
body .offcanvas li a,
body .offcanvas-menu li a {
display: block !important;
color: #111111 !important;
background: #ffffff !important;
padding: 15px 22px !important;
border-bottom: 1px solid #eeeeee !important;
font-size: 16px !important;
font-weight: 800 !important;
text-decoration: none !important;
text-transform: uppercase !important;
}
}
/* =====================================================
FIN MOBILE HEADER ONLY FIX
Fix double FIN logo + show hamburger
Paste at VERY BOTTOM of Custom CSS
===================================================== */

@media (max-width: 991px) {

/* Mobile header clean height */
body #astroid-header,
body .astroid-header,
body .astroid-header-section,
body .navbar,
body .header {
background: #0f0f0f !important;
height: 78px !important;
min-height: 78px !important;
max-height: 78px !important;
overflow: hidden !important;
position: relative !important;
z-index: 999999999 !important;
}

body #astroid-header .container,
body .astroid-header .container,
body .astroid-header-section .container,
body .navbar .container,
body #astroid-header .container-fluid,
body .astroid-header .container-fluid,
body .astroid-header-section .container-fluid,
body .navbar .container-fluid {
height: 78px !important;
min-height: 78px !important;
max-height: 78px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
position: relative !important;
overflow: hidden !important;
}

/* Hide ALL logo containers first */
body #astroid-header .logo,
body #astroid-header .header-logo,
body #astroid-header .site-logo,
body #astroid-header .navbar-brand,
body .astroid-header .logo,
body .astroid-header .header-logo,
body .astroid-header .site-logo,
body .astroid-header .navbar-brand,
body .astroid-header-section .logo,
body .astroid-header-section .header-logo,
body .astroid-header-section .site-logo,
body .astroid-header-section .navbar-brand {
display: none !important;
}

/* Show ONLY Astroid main logo */
body #astroid-header .astroid-logo,
body #astroid-header .astroid-logo a,
body .astroid-header .astroid-logo,
body .astroid-header .astroid-logo a,
body .astroid-header-section .astroid-logo,
body .astroid-header-section .astroid-logo a {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
align-items: center !important;
justify-content: center !important;
width: 140px !important;
max-width: 140px !important;
height: 78px !important;
min-height: 78px !important;
max-height: 78px !important;
margin: 0 auto !important;
padding: 0 !important;
position: relative !important;
overflow: hidden !important;
z-index: 2 !important;
}

body #astroid-header .astroid-logo img,
body .astroid-header .astroid-logo img,
body .astroid-header-section .astroid-logo img {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
width: auto !important;
height: 50px !important;
max-height: 50px !important;
object-fit: contain !important;
object-position: center center !important;
}

/* Hide any second image inside logo */
body #astroid-header .astroid-logo img:not(:first-child),
body .astroid-header .astroid-logo img:not(:first-child),
body .astroid-header-section .astroid-logo img:not(:first-child) {
display: none !important;
}

/* Hide desktop menu */
body #astroid-header .astroid-nav,
body #astroid-header .navbar-nav,
body #astroid-header .nav.menu,
body .astroid-header .astroid-nav,
body .astroid-header .navbar-nav,
body .astroid-header .nav.menu {
display: none !important;
}

/* Show hamburger on right side */
body #astroid-header .burger-menu-button,
body #astroid-header .offcanvas-toggle,
body #astroid-header .offcanvas-toggler,
body #astroid-header .astroid-offcanvas-toggler,
body #astroid-header .menu-toggler,
body #astroid-header .navbar-toggler,
body .astroid-header .burger-menu-button,
body .astroid-header .offcanvas-toggle,
body .astroid-header .offcanvas-toggler,
body .astroid-header .astroid-offcanvas-toggler,
body .astroid-header .menu-toggler,
body .astroid-header .navbar-toggler {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
position: absolute !important;
right: 18px !important;
left: auto !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 44px !important;
height: 44px !important;
align-items: center !important;
justify-content: center !important;
background: transparent !important;
border: none !important;
color: #ffffff !important;
z-index: 999999999 !important;
}

/* Force hamburger icon visible */
body #astroid-header .burger-menu-button::before,
body #astroid-header .offcanvas-toggle::before,
body #astroid-header .offcanvas-toggler::before,
body #astroid-header .astroid-offcanvas-toggler::before,
body #astroid-header .menu-toggler::before,
body #astroid-header .navbar-toggler::before,
body .astroid-header .burger-menu-button::before,
body .astroid-header .offcanvas-toggle::before,
body .astroid-header .offcanvas-toggler::before,
body .astroid-header .astroid-offcanvas-toggler::before,
body .astroid-header .menu-toggler::before,
body .astroid-header .navbar-toggler::before {
content: "☰" !important;
color: #ffffff !important;
font-size: 30px !important;
line-height: 1 !important;
font-weight: 900 !important;
}
}
/* =====================================================
ONLY MOBILE OFFCANVAS SUBMENU FIX
Shows Vergleichs- u. Finanzrechner sub-options in mobile menu
Paste at VERY BOTTOM of Custom CSS
===================================================== */

@media (max-width: 991px) {

/* Force submenu items visible inside mobile/offcanvas menu */
.astroid-offcanvas li.parent > ul,
.astroid-offcanvas li.deeper > ul,
.astroid-offcanvas li.dropdown > ul,
.astroid-offcanvas .dropdown-menu,
.offcanvas li.parent > ul,
.offcanvas li.deeper > ul,
.offcanvas li.dropdown > ul,
.offcanvas .dropdown-menu,
.offcanvas-menu li.parent > ul,
.offcanvas-menu li.deeper > ul,
.offcanvas-menu li.dropdown > ul,
.offcanvas-menu .dropdown-menu {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
position: static !important;
width: 100% !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
margin: 0 !important;
padding: 0 0 0 18px !important;
background: #f7f7f7 !important;
box-shadow: none !important;
border: none !important;
}

/* Parent item style */
.astroid-offcanvas li.parent > a,
.astroid-offcanvas li.deeper > a,
.offcanvas li.parent > a,
.offcanvas li.deeper > a,
.offcanvas-menu li.parent > a,
.offcanvas-menu li.deeper > a {
font-weight: 900 !important;
color: #111111 !important;
background: #ffffff !important;
}

/* Submenu link style */
.astroid-offcanvas li.parent ul li a,
.astroid-offcanvas li.deeper ul li a,
.astroid-offcanvas .dropdown-menu li a,
.offcanvas li.parent ul li a,
.offcanvas li.deeper ul li a,
.offcanvas .dropdown-menu li a,
.offcanvas-menu li.parent ul li a,
.offcanvas-menu li.deeper ul li a,
.offcanvas-menu .dropdown-menu li a {
display: block !important;
color: #333333 !important;
background: #f7f7f7 !important;
padding: 12px 22px !important;
border-bottom: 1px solid #e6e6e6 !important;
font-size: 14px !important;
line-height: 1.35 !important;
font-weight: 700 !important;
text-transform: none !important;
text-decoration: none !important;
}

.astroid-offcanvas li.parent ul li a:hover,
.astroid-offcanvas li.deeper ul li a:hover,
.offcanvas li.parent ul li a:hover,
.offcanvas li.deeper ul li a:hover,
.offcanvas-menu li.parent ul li a:hover,
.offcanvas-menu li.deeper ul li a:hover {
color: #1fbf75 !important;
background: #ffffff !important;
}
}
/* =====================================================
MOVE "HIER ANFRAGEN" TO TOP IN MOBILE MENU ONLY
Paste at VERY BOTTOM of Custom CSS
===================================================== */

@media (max-width: 991px) {

/* Make mobile menu order controllable */
.astroid-offcanvas .nav.menu,
.astroid-offcanvas ul.menu,
.offcanvas .nav.menu,
.offcanvas ul.menu,
.offcanvas-menu .nav.menu,
.offcanvas-menu ul.menu {
display: flex !important;
flex-direction: column !important;
}

/* Move last menu item = HIER ANFRAGEN to top */
.astroid-offcanvas .nav.menu > li:last-child,
.astroid-offcanvas ul.menu > li:last-child,
.offcanvas .nav.menu > li:last-child,
.offcanvas ul.menu > li:last-child,
.offcanvas-menu .nav.menu > li:last-child,
.offcanvas-menu ul.menu > li:last-child {
order: -10 !important;
margin: 0 0 18px 0 !important;
}

/* Style HIER ANFRAGEN as top green button */
.astroid-offcanvas .nav.menu > li:last-child > a,
.astroid-offcanvas ul.menu > li:last-child > a,
.offcanvas .nav.menu > li:last-child > a,
.offcanvas ul.menu > li:last-child > a,
.offcanvas-menu .nav.menu > li:last-child > a,
.offcanvas-menu ul.menu > li:last-child > a {
background: #1fbf75 !important;
color: #111111 !important;
border-radius: 4px !important;
padding: 16px 26px !important;
margin: 0 12px 8px 12px !important;
text-align: center !important;
font-size: 16px !important;
font-weight: 900 !important;
letter-spacing: 0.5px !important;
text-transform: uppercase !important;
border-bottom: none !important;
box-shadow: 0 8px 20px rgba(31,191,117,0.25) !important;
}
}
/* =====================================================
FORCE "HIER ANFRAGEN" TO TOP OF MOBILE MENU
This targets the Beratung-Anfrage link directly
Paste at VERY BOTTOM of Custom CSS
===================================================== */

@media (max-width: 991px) {

/* Make all possible mobile menu lists sortable */
.astroid-offcanvas ul,
.astroid-offcanvas .nav,
.astroid-offcanvas .menu,
.astroid-offcanvas .nav.menu,
.astroid-offcanvas .navbar-nav,
.offcanvas ul,
.offcanvas .nav,
.offcanvas .menu,
.offcanvas .nav.menu,
.offcanvas .navbar-nav,
.offcanvas-menu ul,
.offcanvas-menu .nav,
.offcanvas-menu .menu,
.offcanvas-menu .nav.menu,
.offcanvas-menu .navbar-nav {
display: flex !important;
flex-direction: column !important;
}

/* Give normal menu items default order */
.astroid-offcanvas li,
.offcanvas li,
.offcanvas-menu li {
order: 10 !important;
}

/* Move HIER ANFRAGEN / Beratung-Anfrage link to the top */
.astroid-offcanvas li:has(a[href*="beratung-anfrage"]),
.offcanvas li:has(a[href*="beratung-anfrage"]),
.offcanvas-menu li:has(a[href*="beratung-anfrage"]) {
order: -999 !important;
margin: 0 0 16px 0 !important;
}

/* Make HIER ANFRAGEN look like a top button */
.astroid-offcanvas li:has(a[href*="beratung-anfrage"]) > a,
.offcanvas li:has(a[href*="beratung-anfrage"]) > a,
.offcanvas-menu li:has(a[href*="beratung-anfrage"]) > a {
background: #1fbf75 !important;
color: #111111 !important;
border-radius: 4px !important;
padding: 16px 24px !important;
margin: 0 14px 8px 14px !important;
text-align: center !important;
font-size: 16px !important;
font-weight: 900 !important;
text-transform: uppercase !important;
border-bottom: none !important;
box-shadow: 0 8px 22px rgba(31,191,117,0.25) !important;
}
}
/* =====================================================
   HEADER BUTTON "HIER ANFRAGEN" COLOR CHANGE ONLY
   Desktop top menu button
   ===================================================== */

@media (min-width: 992px) {

  #astroid-header a[href*="beratung-anfrage"],
  .astroid-header a[href*="beratung-anfrage"],
  .astroid-nav a[href*="beratung-anfrage"],
  .navbar-nav a[href*="beratung-anfrage"],
  .nav.menu a[href*="beratung-anfrage"] {
    background: linear-gradient(135deg, #f3e2bf 0%, #d6b36c 100%) !important;
    color: #111111 !important;
    border-radius: 6px !important;
    padding: 15px 22px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    box-shadow: 0 10px 24px rgba(214, 179, 108, 0.28) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
  }

  #astroid-header a[href*="beratung-anfrage"]:hover,
  .astroid-header a[href*="beratung-anfrage"]:hover,
  .astroid-nav a[href*="beratung-anfrage"]:hover,
  .navbar-nav a[href*="beratung-anfrage"]:hover,
  .nav.menu a[href*="beratung-anfrage"]:hover {
    background: linear-gradient(135deg, #ffffff 0%, #ead8bd 100%) !important;
    color: #111111 !important;
  }
}
/* =====================================================
   FIX HEADER MENU: ONLY "HIER ANFRAGEN" SHOULD BE GOLD
   Paste at VERY BOTTOM of Custom CSS
   ===================================================== */

@media (min-width: 992px) {

  /* Reset normal top menu items */
  #astroid-header .astroid-nav > li > a,
  #astroid-header .navbar-nav > li > a,
  #astroid-header .nav.menu > li > a,
  .astroid-header .astroid-nav > li > a,
  .astroid-header .navbar-nav > li > a,
  .astroid-header .nav.menu > li > a {
    background: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
  }

  /* Remove active/highlight color from normal menu items */
  #astroid-header .astroid-nav > li.active > a,
  #astroid-header .astroid-nav > li.current > a,
  #astroid-header .navbar-nav > li.active > a,
  #astroid-header .navbar-nav > li.current > a,
  #astroid-header .nav.menu > li.active > a,
  #astroid-header .nav.menu > li.current > a {
    background: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
    border: none !important;
  }

  /* Apply gold style ONLY to HIER ANFRAGEN */
  #astroid-header a[href*="beratung-anfrage"],
  .astroid-header a[href*="beratung-anfrage"],
  .astroid-nav > li > a[href*="beratung-anfrage"],
  .navbar-nav > li > a[href*="beratung-anfrage"],
  .nav.menu > li > a[href*="beratung-anfrage"] {
    background: linear-gradient(135deg, #f3e2bf 0%, #d6b36c 100%) !important;
    color: #111111 !important;
    border-radius: 6px !important;
    padding: 15px 22px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    box-shadow: 0 10px 24px rgba(214,179,108,0.28) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
  }

  #astroid-header a[href*="beratung-anfrage"]:hover,
  .astroid-header a[href*="beratung-anfrage"]:hover {
    background: linear-gradient(135deg, #ffffff 0%, #ead8bd 100%) !important;
    color: #111111 !important;
  }
}@media (max-width: 991.98px) {body, .body{font-size:1rem;letter-spacing:0em;line-height:1.7em;}h1, .h1{font-size:3rem;letter-spacing:0em;line-height:1.3em;}h2, .h2{font-size:30px;letter-spacing:0em;line-height:1.3em;}h3, .h3{font-size:24px;letter-spacing:0em;line-height:1.3em;}h4, .h4{font-size:20px;letter-spacing:0em;line-height:1.2em;}.astroid-nav > li > a, .astroid-sidebar-menu > li > a{font-size:15px;letter-spacing:0em;line-height:1.6em;}.nav-submenu-container .nav-submenu > li, .jddrop-content .megamenu-item .megamenu-menu li, .nav-submenu{font-size:14px;letter-spacing:0em;line-height:1.6em;}}@media (max-width: 767.98px) {body, .body{font-size:1rem;letter-spacing:0em;line-height:1.7em;}h1, .h1{font-size:3rem;letter-spacing:0em;line-height:1.3em;}h2, .h2{font-size:30px;letter-spacing:0em;line-height:1.3em;}h3, .h3{font-size:20px;letter-spacing:0em;line-height:1.2em;}h4, .h4{font-size:18px;letter-spacing:0em;line-height:1.2em;}.astroid-nav > li > a, .astroid-sidebar-menu > li > a{font-size:14px;letter-spacing:0em;line-height:1.6em;}.nav-submenu-container .nav-submenu > li, .jddrop-content .megamenu-item .megamenu-menu li, .nav-submenu{font-size:15px;letter-spacing:0em;line-height:1.6em;}}