/* ==========================================================
   Landingpage
   ========================================================== */

body.landingpage {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.landingpage {
    width: 100%;
}



.elementor-location-header,
.elementor-location-footer {
    display: none;
}


.lp-hero .hero-image{
	width:100%;
	max-width:100%;
	height:auto;
	margin-top:-2px;
}

.landingpage select,
.landingpage select option{
	font-size: 14px !important;	
}

/* ==========================================================
   Landingpage Badge
   ========================================================== */

.landing-badge {
    display:grid;
    place-items:center;	
    position: absolute;
    bottom: -120px;
    right: 80px;
    width: 350px;
    height: 350px;
    background: #1d1d1b;
    color: #fff;
    border: 5px solid #6daa45;
    border-radius: 50%;
    text-align: center;
    padding: 30px 40px 65px;
    box-sizing: border-box;
    box-shadow: 0 20px 40px rgba(0,0,0,.35);
    z-index: 20;
	overflow:hidden;
}

.landing-badge p {
    margin: 0;
}

.landing-badge p + p {
    margin-top: 10px;
}

.landing-badge h1,
.landing-badge h2,
.landing-badge h3,
.landing-badge h4,
.landing-badge h5,
.landing-badge h6 {
    margin: 0 0 10px;
    color: inherit;
}

.landing-badge strong {
    font-weight: 700;
}

.landing-badge * {
    color: inherit;
}

.landing-badge-headline-green {

    color: #73b72b;

    font-size: 30px;
    font-weight: 700;
    line-height: 1.05;

    margin-bottom: 8px;

}

.landing-badge-inner{
    width:100%;
    text-align:center;
}


/* ------------------------------------------
   Überschrift weiß
------------------------------------------ */

.landing-badge-headline-white {
    color: #fff;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.05;
    margin-bottom: 4px;
    background: linear-gradient(
        90deg,
        #8d0f1d 0%,
        #c81f35 50%,
        #8d0f1d 100%
    );
    padding: 7px 20px 5px;
    margin: 9px 0;
	display:inline-block;
}

.landing-badge-headline-green,
.landing-badge-headline-white,
.landing-badge-content {

    overflow-wrap: anywhere;
    word-wrap: break-word;

}

.landing-badge-content p{
    margin: 0;
    padding: 0;
}


.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output{
	font-size:14px !important;	
}


.landing-footer{
	background-color:#000;	
}

.landing-footer .footer-info {
    display: grid;
    justify-content: center;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    text-align: center;
}

.landing-footer .footer-info div{
	font-size:20px;
	color:#FFF;
}

.landing-footer .footer-info div span{
	font-size:20px;
	color:#40AB3A;
	white-space:nowrap;
}

.landing-footer-nav{
    background-color: #000;
    border-top: 1px solid #646464;	
}

.landing-footer .footer-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px;
	padding:10px 0;
}

#menu-footer-landingpage{
	margin-bottom:0;	
    text-align: center;
    padding: 5px 10px;	
}

#menu-footer-landingpage li{
	list-style:none;
	display:inline-block;
	margin-right:20px;
}

#menu-footer-landingpage li:last-child{
	margin-right:0;
}


#menu-footer-landingpage li a{
	font-weight:normal;	
	color: #a9a5a5;
	font-size:16px;
}

#menu-footer-landingpage li a::after{
	content: '|';
	position:relative;
	left:12px;
}

#menu-footer-landingpage li:last-child a::after{
	content: '';
}

#menu-footer-landingpage li a:hover{
	color: #a9a5a5;
	text-decoration:underline;
}


/* ==========================================================
   Anfrageformular - Landingpage
   ========================================================== */

.lp-anfrageformular {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: start;
}

	
.lp-anfrageformular .left-side,
.lp-anfrageformular .right-side {
    min-width: 0;
}

.lp-anfrageformular .anfrage-interesse > span{
	display:block;	
}

.content-left-side {
    width: 40% !important;
    max-width: 720px;
    min-width: 500px;
	background-color:#000;
}

.content-left-side .c-headline h2{
	margin-top:65px !important;	
	margin-bottom:55px !important;	
	text-transform:uppercase;
}

.content-left-side ul li{
	color:#fff;	
}

.content-left-side .iwithtext .iwt-text strong{
	color:#fff;	
	white-space:nowrap;
}

.content-left-side .iwithtext{
    display: grid;
    grid-template-columns: 40px 1fr;
	height:45px;
	margin-bottom:10px;
	align-items:center;
}


.content-left-side .iwithtext .iwt-icon img{
	width:45px !important;	
}

.content-right-side{
	width:60% !important;
	max-width: 1720px;
}	

.content-right-side .headline-beratung,
.content-right-side .headline-beratung span{
	font-size:4rem;
	font-weight:bold;
	color:#000;
	text-transform:uppercase;
}

.content-right-side .headline-beratung{
	margin-top:170px;
	margin-bottom:60px !important;
}

.content-right-side .form-headline p {
    font-weight: 600;
    font-size: 2rem;
}

.content-right-side p br{
	display:none;
}

.content-right-side p span{
	margin-bottom:20px;
	margin-left:0;
}

.content-right-side .form-accepted{
	margin-bottom:20px;	
}
	
.content-right-side .form-accepted p span{
	margin-bottom:0;	
}

.content-right-side .form-accepted p{
	padding-bottom:5px;	
}


.content-right-side .headline-beratung span{
	color:#6daa45;
}

.lp-hero .hover-wrap{
	margin-bottom:0 !Important;	
}

.why-arei{
	margin: 80px 100px 40px !important;	
}

.why-arei + .why-arei{
	margin: 50px 100px 40px !important;	
}

/* Spalte */
.why-arei-element {
    display: grid;
	flex: 0 0 20%;
}

@media (max-width: 1450px) {
	.why-arei{
		margin: 80px 25px 40px !important;	
	}

	.why-arei + .why-arei{
		margin: 50px 25px 40px !important;	
	}

	.why-arei-element {
        flex: 0 0 33.333%;
    }
		
}


@media (max-width: 1260px) {
	.why-arei{
		margin: 80px 25px 40px !important;	
	}

	.why-arei + .why-arei{
		margin: 50px 25px 40px !important;	
	}

	.why-arei-element {
        flex: 0 0 33.333%;
    }
		
}



@media (max-width: 900px) {

    .why-arei-element {
        flex: 0 0 50%;
    }

}

@media (max-width: 600px) {
	.why-arei + .why-arei{
		margin: 50px 25px 40px !important;	
	}

    .why-arei-element {
        flex: 0 0 100%;
    }

}


@media (max-width: 600px) {

    .why-arei-element {
        flex: 0 0 100%;
    }

}

/* Innerer Container */
.why-arei-element > .vc_column-inner {
    display: grid;
    height: 100%;
}

/* WPBakery Wrapper */
.why-arei-element .wpb_wrapper {
    display: grid;
    align-content: center;   /* vertikal */
    height: 100%;
}

/* Standardabstände entfernen */
.why-arei-element p {
    margin: 0;
}

.why-arei-element .iwithtext .iwt-icon{
	display:grid;
	align-items:center;
	height:100%;
}

.iwithtext .iwt-text{
	padding-left:0 !important;	
}

.content-left-side .iwithtext .iwt-text{
	padding-left:55px !important;	
}

.why-arei-element:nth-child(1) .iwithtext .iwt-text{
    text-transform: uppercase;
    font-size: 32px;	
	color:#40AB3A;
}

.why-arei-element:nth-child(2) .iwithtext,
.why-arei-element:nth-child(3) .iwithtext,
.why-arei-element:nth-child(4) .iwithtext{
	width:240px;	
}


.why-arei + .why-arei > div + div{
	/*height:100%;	*/
	flex-direction:column;
}

.why-arei-element:nth-child(1) .iwithtext .iwt-text{
	/*padding-left:0 !important;	 */
	line-height:1rem;
}

.why-arei-element:nth-child(5) .iwithtext{
	width:300px;	
}


.section-why-arei {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.section-why-arei__item {
    display: flex;
    align-items: center;   /* vertikal zentriert */
    gap: 16px;
    padding: 15px 0;
}

.section-why-arei__item img {
    width: 35px;
    height: auto;
    flex-shrink: 0;
}

.section-why-arei__item strong {
    line-height: 1.3;
}



/* Formularbutton */
/* ==========================================================
   Submit
   ========================================================== */

.lp-submit-outer{
	display:grid;
	justify-content: center;
}

.lp-submit{
    display:grid;
    grid-template-columns:60px 1fr;
    gap:25px;
    align-items:center;
	background-color:#42ac3c;
	justify-self:start;
	padding:15px;
	border-radius:8px;
}
.lp-submit-text p{
	padding:0;
}

.lp-submit-text{
	position:relative;	
}

.lp-submit-text::before{
	content:'';
	position:absolute;
	width:1px;
	height:100%;
	left:-20px;
	background-color: #fff;
}

.lp-submit-icon{
    border-radius:50%;
    display:grid;
    place-items:center;
}

.lp-submit-icon p{
	padding:0;		
}

.wpcf7 form.submitting .lp-submit-icon p{
	height:18px;
}

.lp-submit-icon img{

    width:54px;
    height:auto;

}

.lp-submit .lp-submit-text button{
    all:unset;
    cursor:pointer;
    font-family:inherit;
    text-transform:uppercase;
    font-weight:800;
    line-height:1;
	background-color:transparent !important;
	padding:0;
}

.lp-submit .lp-submit-text button:hover{
	background-color:transparent !important;
}

.lp-submit-text button span{
    color:#fff !important;
	font-size:28px;
	font-weight:600;
}

.lp-submit-text button strong{
    color:#fff;
    margin-left:5px;
	font-size:28px;
	font-weight:600;	
}

.lp-submit-info{
    font-size:16px;
    line-height:1.35;

}

.lp-submit-info p{
    font-size:16px !important;
	color:#fff;
}

.lp-submit{

    cursor:pointer;
    transition:.25s;

}

.lp-submit:hover{
    transform:translateY(-2px);	
}

.lp-submit:hover .lp-submit-icon{

    transform:scale(1.05);

}


.why-arei__item {
    flex: 1 1 25%;
    display: flex;
    align-items: center;   /* vertikal zentriert */
    justify-content: center;
    gap: 16px;
    padding: 15px 0;
    box-sizing: border-box;
    text-align: left;
}

.why-arei__item img {
    width: 35px;
    flex-shrink: 0;
}

.why-arei__item strong {
    line-height: 1.3;
}



/* ===========================================
   Badge Wrapper
=========================================== */

.landing-badge-wrapper{
    position:relative;
}


/* ===========================================
   Ribbon
=========================================== */
.landing-badge-ribbon {
    position: absolute;
    bottom: 20px;
    width: 100%;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(
        90deg,
        #8d0f1d 0%,
        #c81f35 50%,
        #8d0f1d 100%
    );
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}




/* ===========================================
   Submit Button
=========================================== */

.lp-submit-button{

    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;

}


/* ===========================================
   Spinner
=========================================== */

.lp-spinner{

    width:18px;
    height:18px;

    border:2px solid rgba(255,255,255,.35);
    border-top:2px solid #ffffff;

    border-radius:50%;

    animation:lp-spinner .7s linear infinite;

    display:none;

    flex-shrink:0;

}

@keyframes lp-spinner{

    to{
        transform:rotate(360deg);
    }

}


/* ===========================================
   Während Contact Form 7 sendet
=========================================== */

.wpcf7 form.submitting .lp-spinner{

    display:block;

}

.wpcf7 form.submitting .lp-button-label{

    opacity:.75;

}

.wpcf7 form.submitting .lp-submit-button{

    cursor:wait;

}


.wpcf7 form.submitting .lp-submit-image{
    display:none;
}

.wpcf7 form.submitting .lp-spinner{
    display:block;
}



@media (max-width: 768px) {
    .why-arei__item {
        flex: 1 1 50%;
    }
}

@media (max-width: 576px) {
    .why-arei__item {
        flex: 1 1 100%;
    }
}

@media (max-width: 1300px) {

	.content-left-side {
		width: 40% !important;
		max-width: 420px;
		min-width: 420px;
	}
	
	.c-headline h2,
	.headline-beratung,
	.headline-beratung span{
		font-size:30px !important;	
	}
	

}

@media (max-width: 1024px) {

	.content-left-side {
		width: 100% !important;
		max-width: 100%;
		min-width: 100%;
	}

	.content-right-side{
		width:100% !important;	
		padding:0 20px !important;
	}
	
	.content-right-side .headline-beratung{
		margin-top:0 !important;	
	}

}


/* Tablet + Smartphone */
@media (max-width: 991px) {

    .lp-anfrageformular {
        grid-template-columns: 1fr;
        gap: 30px;
    }

}

@media (max-width: 1250px) {
    .landing-badge {
         bottom: -140px;
    }
}

@media (max-width: 1130px) {
    .landing-badge {
        bottom: auto;
		bottom:auto;
		left:5px;
		top:5px;
    }
}

@media (max-width: 991px) {

    .landing-badge-headline-green{

        font-size:24px;

    }

    .landing-badge-headline-white{
        font-size:24px;
    }

    .landing-badge-content{
        font-size:15px;
    }

}

@media (max-width: 767px) {

    .landing-badge {
		border-radius: 0;
		transform: rotate(0);
		width: fit-content;
		height: auto;
		padding: 15px 15px 70px;;
		display: inline-block;
		margin-right: 215px;
    }
	
	.landing-badge-ribbon{
		bottom:10px;	
	}

}

.badge-mobile{
	display:none;
}

@media (max-width: 600px) {
	.badge-desktop{
		display:none;
	}
	
	.badge-mobile{
		display:block;
	}
	
	.badge-mobile .landing-badge {
		position:relative;
		border-radius: 0;
		transform: rotate(0);
		width: 94%;
		height: auto;
		padding: 15px 15px 75px;
		display: inline-block;
		margin: 0 3%;
		overflow: auto;
		left: 0;
		margin-top:20px;
		margin-bottom:25px !important;
	}
}

@media (max-width: 480px) {
	.landing-badge-headline-green,
	.landing-badge-headline-white{
		font-size:18px;
	}
}

@media (max-width: 480px) {
	.lp-submit-text button span,
	.lp-submit-text button strong{
		font-size: 18px;		
	}
	
	.lp-submit-info p{
		font-size:14px !important;
		line-height:16px;
	}
	
	.c-headline h2{
		font-size:26px !important;
	}
}


.wpforms-field-container{

    display:grid;

    grid-template-columns:1fr 1fr;

    column-gap:40px;

}


#wpforms-4195-field_4-container,
#wpforms-4195-field_9-container,
#wpforms-4195-field_5-container,
#wpforms-4195-field_6-container,
#wpforms-4195-field_2-container,
#wpforms-4195-field_7-container,
#wpforms-4195-field_3-container{

    grid-column:1;

}

#wpforms-4195-field_11-container,
#wpforms-4195-field_12-container{
    grid-column:1 / -1;
}

#wpforms-4195-field_8-container{

    grid-column:2;
    grid-row:1 / span 7;

}

#wpforms-4195-field_12-container textarea{
	background-color:transparent;
	border:none;
    color: rgba(0, 0, 0, 0.85);
	padding:0;
	max-height:70px;
}

#wpforms-4195-field_8-container fieldset legend{
    margin-bottom: 25px;
    font-size: 20px;	
}

.wpforms-field.wpforms-field-readonly textarea{
	color: rgba(0, 0, 0, 0.85) !important;
	opacity:1 !important;
}

.wpforms-submit-container{

    text-align:center;
	display:table !important;
	width:100% !important;

}

.wpforms-submit {
    position: relative !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-width: 340px;
    height: 90px !important;
    padding: 5px 110px 30px 90px !important;
    background: #42ac3c !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-size: 28px !important;
    font-weight: 600 !important;	
	margin:0 auto !important;
}

.c-anfrageform .wpforms-submit:hover {
	background-color: #42ac3c !important;
}

.wpforms-submit:hover{
    transform:translateY(-2px);	
}

.wpforms-submit::before{

    content:"";

    position:absolute;

    left:25px;
    top:50%;

    transform:translateY(-50%);

    width:50px;
    height:50px;

    background:url('/wp-content/themes/2do-digital/assets/images/send-icon.png') center/contain no-repeat;

}


.wpforms-submit::after, .wpforms-submit:focus::after {
    content: "Ihre Daten werden vertraulich behandelt" !important;
    position: absolute !important;
    left: 60px !important;
    top: 50px !important;
    font-size: 16px;
    font-weight: 400;
    white-space: nowrap;
    color: #fff;
    opacity: .9;
	right:0 !important;
	border:0 !important;
}

.wpforms-confirmation-container-full{
	font-size:14px !important;	
}


@media (max-width: 768px) {

    .wpforms-field-container {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    #wpforms-4195-field_4-container,
    #wpforms-4195-field_9-container,
    #wpforms-4195-field_5-container,
    #wpforms-4195-field_6-container,
    #wpforms-4195-field_2-container,
    #wpforms-4195-field_7-container,
    #wpforms-4195-field_3-container,
    #wpforms-4195-field_8-container {
        grid-column: 1;
        grid-row: auto;
    }

}