/*
Theme Name:   Landeseiten Design Child
Theme URI:    #
Description:  Child theme for Hello Elementor for Landeseiten Design projects.
Author:       Your Name
Author URI:   #
Template:     hello-elementor
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  landeseiten-design-child
*/

/*----------------------------------------------------------------*/
/* Add your custom CSS below this line
/*----------------------------------------------------------------*/

/*----------------------------------------------------------------*/
/* Footer color gradient
/*----------------------------------------------------------------*/
.site-footer
{
	background: #FFFFFF;
background: linear-gradient(108.91deg, #2D5E7B 19.83%, #21475D 118.68%);
background: linear-gradient(90deg, rgba(42, 167, 225, 0.1) 0%, rgba(39, 163, 221, 0.1) 25%, rgba(32, 151, 211, 0.1) 49%, rgba(20, 132, 195, 0.1) 72%, rgba(4, 104, 172, 0.1) 96%, rgba(1, 99, 167, 0.1) 100%);
}

/* =========================================
   HERO SECTION + COUNTER 70
   ========================================= */

/* 1. BASE STYLES (Applies to all screens unless overridden below) */
.counter70 {
    position: relative;
    z-index: 101 !important;
    margin-left: auto;
    margin-right: auto;
    transform: translate(-40px, -30px) scale(1) !important;
}

.counter70::before {
    content: "";
    position: absolute;
    background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/Fram.svg');
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1; 
    
    height: 600px;
    width: 78%; 
    margin-bottom: 300px;
    margin-left: 10px !important;
    margin-right: 10px !important;
    transform: translate(7px, -50px) !important;
}

/*  2. RESPONSIVE */

@media (max-width: 1366px) {
    .counter70::before {
        transform: translate(5px, -49px) !important;
    }
}

@media (max-width: 1280px) {
    .counter70 {
        transform: translate(-20px, -30px) scale(1) !important;
    }
    .counter70::before {
        transform: translate(0px, -45px) !important;
    }
}

@media (max-width: 1024px) {
    .counter70 {
        margin-bottom: 460px !important;
        transform: translate(40px, 70px) scale(1.2) !important;
    }
    .counter70::before {
        width: 70%; 
        transform: translate(55px, -53px) !important;
    }
}

@media (max-width: 960px) {
    .counter70 {
        margin-bottom: 360px !important;
    }
    .counter70::before {
        transform: translate(48px, -45px) !important;
    }
}

@media (max-width: 860px) {
    /* .counter70 inherits the 360px margin and scale(1.2) from 960px perfectly */
    .counter70::before {
        transform: translate(37px, -40px) !important;
    }
}

@media (max-width: 767px) {
    .counter70 {
        transform: translate(0px, 70px) scale(0.9) !important;
    }
    .counter70::before {
        width: 85%; 
        transform: translate(-28px, -45px) !important;
    }
}
@media (min-width: 390px) and (max-width: 519) {
	.counter70 {
		overflow: hidden !important;
		margin-left: auto;
        margin-right: auto;
		margin-bottom: 200px !important;
		transform: translate(0px, 30px) scale(1) !important;}
	.counter70::before { transform: translate(-42px, -30px) !important;
			width: 90%; 
		height: 200px;}}
@media (max-width: 600px) {
    .counter70 {
        margin-bottom: 250px !important;
        transform: translate(0px, 40px) scale(1) !important;
    }
    .counter70::before {
        width: 90%; 
        transform: translate(-45px, -40px) !important;
    }
}

@media (max-width: 520px) {
    .counter70 {
        margin-bottom: 200px !important;
     margin-top: -20px !important;
		padding-right: -30px !important;
    }
    .counter70::before {
        transform: translate(-42px, -22px) !important;
    }
}
@media (min-width: 390px) and (max-width: 519) {
	.counter70 {
		margin-left: auto;
        margin-right: auto;
		margin-bottom: 200px !important;
		transform: translate(0px, 30px) scale(1) !important;}
	.counter70::before { transform: translate(-42px, -30px) !important;
			width: 90%; 
		height: 600px;}}

@media (min-width: 1025px) and (max-width: 1599px) {
	.heroleftcont { margin-left: 20px !important;
	}
}

/*----------------------------------------------------------------*/
/* Containers custom settings
/*----------------------------------------------------------------*/
.wp_bg_1::before {
  top: unset !important;
  overflow: visible;
  margin-left: -700px;
}
.wp_jahre .elementor-counter-title {
  width: 100%;
  max-width: 164px;
	margin-top: 8px !important;
	margin-left: 10px;
}
.wp_jahre .elementor-counter-number-wrapper {
  width: 100%;
  max-width: 164px;
}
.wp_jahre .elementor-counter {
  width: 435px;
  margin: auto;
  position: relative;
}
.wp_jahre .elementor-counter::after {
  content: '';
  background: url(https://www.sharedconx.com/wp-content/uploads/2026/02/left-rectangle.png);
    background-repeat: repeat;
    background-size: auto;
  width: 70px;
  height: 78px;
  background-size: 50px;
  background-repeat: no-repeat;
  top: 10px;
  position: relative;
	background-repeat:no-repeat;
}
.wp_jahre .elementor-counter::before {
  content: '';
  background: url(https://www.sharedconx.com/wp-content/uploads/2026/02/right-rectangle.png);
    background-repeat: repeat;
    background-size: auto;
  width: 70px;
  height: 78px;
  background-size: 50px;
  background-repeat: no-repeat;
  top: 10px;
  position: relative;
	background-repeat:no-repeat;
	right: -20px;
}
.wp_das_box{
box-shadow: 0px 0px 20px 0px rgba(30, 137, 166, 1) !important;
	background: rgba(236, 242, 245, 0.06);
	backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);

}
.back_color_1{
	background: linear-gradient(90deg, #06819E 0%, #2D5E7B 99%);
	box-shadow: 0px 10px 16px 0px rgba(22, 49, 64, 0.15);

backdrop-filter: blur(19px)
}
.img_full img {
  width: 100% !important;
}
.wp_bg3{
	backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
	background: rgba(255, 255, 255, 0.06) !important;
}

/*----------------------------------------------------------------*/
/* Elementor button
/*----------------------------------------------------------------*/
.elementor-button {background: linear-gradient(257deg, #296384 0%, #2F8DB2 26%, #4A9AB8 64%, #1E89A6 100%);
}	

/*----------------------------------------------------------------*/
/* Advanced Accordion Blur Background 
/*----------------------------------------------------------------*/
.eael-adv-accordion .eael-accordion-list .eael-accordion-content {
border-radius: 0 0 20px 20px !important;
backdrop-filter: blur(10px) !important;
}

 .eael-accordion-header {
     backdrop-filter: blur(10px);
	 -webkit-backdrop-filter: blur(10px);
}
/*----------------------------------------------------------------*/
/* SharedConX image in hero
/*----------------------------------------------------------------*/

@media (max-width: 4000px) {
  .elementor img.SharedConX1 {
    height: 0.75em;
    vertical-align: -2px;
  }
}
@media (max-width: 1600px) {
  .elementor img.SharedConX1 {
    height: 0.75em;
    vertical-align: -2px;

  }
}

@media (max-width: 1024px) {
  .elementor img.SharedConX1 {
    height: 0.75em;
    vertical-align: -1px;
    margin: 0 5px;
  }
}

@media (max-width: 767px) {
  .elementor img.SharedConX1 {
    height: 0.75em;
    vertical-align: -1px;
    margin: 0 2px;
  }
}
/*----------------------------------------------------------------*/
/* SharedConX Uber section
/*----------------------------------------------------------------*/
@media (max-width: 4000px) {
  .elementor img.SharedConX3 {
    height: 18px !important;
    vertical-align: -1px;
	margin-left: 3px !important;
  }
}
@media (max-width: 1600px) {
  .elementor img.SharedConX3 {
    height: 0.8em;
    vertical-align: -1px;

  }
}

@media (max-width: 1030px) {
  .elementor img.SharedConX3 {
    height: 16px !important;
    vertical-align: -1px;
    margin: 2px -3px 0px 0px;
  }
}

@media (max-width: 767px) {
  .elementor img.SharedConX3 {
    height: 14px !important;
    vertical-align: -1px;
    margin: 0 -2px;
  }
}
/* =========================================
   START - SECTION 5 Schritten Postfach
   ========================================= */
.step-box {
    position: relative;
    overflow: visible;
	}
.cont1 { 
    position: relative !important; 
    z-index: 50 !important; 
}
.cont2 { 
    position: relative !important; 
    z-index: 40 !important; 
}
.cont3 { 
    position: relative !important; 
    z-index: 30 !important; 
}
.cont4 { 
    position: relative !important; 
    z-index: 20 !important; 
}
.cont5 { 
    position: relative !important; 
    z-index: 10 !important; 
}
/* DEFAULT / DESKTOP (1601px and up) */
.line-step-1::after {
    content: ''; position: absolute; left: 100%; top: 50%; 
    background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/Line-svg1n.webp');
    background-repeat: no-repeat; background-position: top left; background-size: 100% auto; 
    width: 59%; height: 800px; transform: translateY(-15px); margin-left: -13px; z-index: 4; 
}
.line-step-2::after {
    content: ''; position: absolute; right: 50%; top: 100%; 
    background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/Line-svg2n.webp');
    background-repeat: no-repeat; background-position: top right; background-size: 100% auto; 
    width: 58.9%; height: 500%; transform: translateY(-13px); margin-right: -16px; z-index: 4; 
}
.line-step-3::after {
    content: ''; position: absolute; left: 50%; top: 100%; 
    background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/Line-svg3n.webp');
    background-repeat: no-repeat; background-position: top left; background-size: 100% auto; 
    width: 110%; height: 500%; transform: translateY(-17px); margin-left: -15px; z-index: 4; 
}
.line-step-4::after {
    content: ''; position: absolute; right: 50%; top: 100%; 
    background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/Line-svg4n.webp');
    background-repeat: no-repeat; background-position: top right; background-size: 100% auto; 
    width: 110%; height: 500%; transform: translateY(-17px); margin-right: -20px; z-index: 4; 
}

/* TABLET (Up to 1024px) */
@media (max-width: 1024px) {
    .line-step-1::after { width: 75%; height: 800px; margin-left: -9px; }
    .line-step-2::after { width: 74.5%; height: 1000px; margin-right: -13px; transform: translateY(-10px); }
    .line-step-3::after { width: 530px; height: 100%; margin-right: -13px; transform: translateY(-12px); }
    .line-step-4::after { width: 530px; height: 100%; margin-right: -13px; transform: translateY(-12px); }
}

/* MOBILE (Up to 767px) */
@media (max-width: 767px) {
    .line-step-1::after, .line-step-2::after, .line-step-3::after, .line-step-4::after {
        background-image: url('https://www.sharedconx.com/wp-content/uploads/2026/03/mobile-dash-line.svg');
        background-repeat: no-repeat; background-position: top center; 
        position: absolute; left: 50%; right: auto; top: 100%; 
        height: 100px; width: 31px; 
        transform: translateX(-50%) translateY(-15px); 
        margin-left: 0; margin-right: 0; z-index: 4; 
    }
}

/* Images in boxes for mobile up 767px */
@media (max-width: 767px) {
  .simage1, .simage2, .simage3, .simage4, .simage5 { display: none !important; }
}
@media (min-width: 768px)  {
  .msimage1, .msimage2, .msimage3, .msimage4, .msimage5 { display: none !important; }
}
@media (max-width: 767px) {
  .msimage1 { display: block; width: 80%; margin: -30px auto 15px auto; }
}

/* =========================================
   Section Containers Margins
   ========================================= */

/* 1451px to 1580px */
@media (min-width: 1451px) and (max-width: 1580px) {
	.cont1 { margin-top: 30px !important; }
	.cont2 { margin-top: 88px !important; }
	.cont3 { margin-top: 95px !important; }
	.cont4 { margin-top: 160px !important; }
	.cont5 { margin-top: 130px !important; }
}


/* 1281px to 1366px */
@media (min-width: 1280px) and (max-width: 1367px) {
	.cont1 { margin-top: 30px !important; }
	.cont2 { margin-top: 52px !important; }
	.cont3 { margin-top: 60px !important; }
	.cont4 { margin-top: 130px !important; }
	.cont5 { margin-top: 95px !important; }
}

/* 1025px to 1280px */
@media (min-width: 1025px) and (max-width: 1280px) {
	.cont1 { margin-top: 25px !important; }
	.cont2 { margin-top: 47px !important; }
	.cont3 { margin-top: 80px !important; }
	.simage2, .simage3, .simage4, .simage5 { 
    width: 45% !important; height: 100%; 
  }
	.cont4 { margin-top: 140px !important; }
	.cont5 { margin-top: 110px !important; }
}
/* Shared styles across ALL breakpoints (768px to 900px) */
@media (min-width: 768px) and (max-width: 900px) {
	.cont1 { margin-top: 25px !important; }
	
	.line-step-1 { width: 45% !important; padding-bottom: 10px !important; }
	.line-step-1::after { width: 80%; height: 800px; transform: translateY(-11px); margin-left: -8px; z-index: 4; }
	
	.line-step-2 { width: 45% !important; padding-bottom: 20px !important; }
	.line-step-2::after { width: 79.5%; height: 800px; transform: translateY(-9px); margin-right: -9px; z-index: 4; }
	
	.line-step-3 { width: 45% !important; padding-bottom: 20px !important; }
	.line-step-3::after { width: 125%; height: 800px; transform: translateY(-10px); margin-left: -5px; z-index: 4; }
	
	.line-step-4 { width: 45% !important; padding-bottom: 20px !important; }
	.line-step-4::after { width: 126%; height: 800px; transform: translateY(-10px); margin-right: 0px; z-index: 4; }
	
	.line-step-5 { width: 45% !important; padding-bottom: 20px !important; }
	
	.simage2, .simage3, .simage4, .simage5 { width: 45% !important; height: 100%; }
}

/* Specific Margin Adjustments */

/* 831px to 900px */
@media (min-width: 831px) and (max-width: 900px) {
	.cont2 { margin-top: 55px !important; }
	.cont3 { margin-top: 75px !important; }
	.cont4 { margin-top: 126px !important; }
	.cont5 { margin-top: 114px !important; }
}

/* 820px to 830px */
@media (min-width: 820px) and (max-width: 830px) {
	.cont2 { margin-top: 48px !important; }
	.cont3 { margin-top: 60px !important; }
	.cont4 { margin-top: 114px !important; }
	.cont5 { margin-top: 114px !important; }
}

/* 786px to 819px */
@media (min-width: 786px) and (max-width: 819px) {
	.cont2 { margin-top: 47px !important; }
	.cont3 { margin-top: 60px !important; }
	.cont4 { margin-top: 110px !important; }
	.cont5 { margin-top: 110px !important; }
}

/* 768px to 785px */
@media (min-width: 768px) and (max-width: 785px) {
	.cont2 { margin-top: 40px !important; }
	.cont3 { margin-top: 60px !important; }
	.cont4 { margin-top: 105px !important; }
	.cont5 { margin-top: 106px !important; }
}

/* =========================================
   bottom section margins
   ========================================= */

/* 1451px to 1580px */
@media (max-width: 1366px) {
	.botcont { max-height: 10px !important; }
	.botspace {max-height: 50px !important;}
	.wascont { margin-top: -270px !important; }
	
}
/* =========================================
   END - SECTION 5 Schritten Postfach
   ========================================= */