/*
Theme Name: SPL
Description: Template für SPL
Author: Daniel McDonald
Author URI: https://etrnl.de/
Author Email: daniel@etrnl.de
Version: 1.0.0
Text Domain: hello-elementor-child
Template: hello-elementor
*/
/*
Add your custom styles here
*/

/*FORM DONT DELETE*/
.spl-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	background: #fff;
	border-radius: 24px;
	padding: 28px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.spl-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 640px) {
	.spl-row { grid-template-columns: 1fr; }
}

.spl-field { display: block; }

.spl-form input[type="text"],
.spl-form input[type="email"] {
	width: 100%;
	background: #fff3c7;
	border: none;
	border-radius: 999px;
	padding: 16px 22px;
	font-size: 15px;
	color: #2a2a2a;
}
.spl-form input::placeholder { color: #2a2a2a; opacity: 0.85; }
.spl-form input:focus {
	outline: 2px solid #1ec8c8;
	outline-offset: 2px;
	color:#373737 !important;
}

.spl-event {
	background: #fff3c7;
	border-radius: 22px;
	padding: 18px 22px;
}
.spl-event-label {
	display: block;
	font-weight: 600;
	margin-bottom: 8px;
}
.spl-event select {
	width: 100%;
	border: none;
	background: transparent;
	font-size: 16px;
	font-weight: 600;
	padding: 6px 0;
	appearance: none;
	cursor: pointer;
}
.spl-event select option {
    background: red !important;
    color: yellow !important;
}

.spl-voraussetzung {
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.4;
	font-weight: 500;
}
.spl-voraussetzung input[type="checkbox"] {
	margin-right: 6px;
	accent-color: #1ec8c8;
}

.spl-form .wpcf7-submit {
	align-self: flex-end;
	background: #fff;
	border: none;
	color: #2a2a2a;
	border-radius: 999px;
	padding: 12px 36px;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: background 0.2s;
}
.spl-form .wpcf7-submit:hover { background: #e6fafa; }



.linegrow, .linegrow1, .linegrow2{
    position: relative;
    display: inline-block;
}

.linegrow::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 2px;
    background: #FFE66D;
    border-radius: 20px;
}


.linegrow1::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 5px;
    width: 100%;
    height: 2px;
    background: #FFE66D;
    border-radius: 20px;
}

.linegrow2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 2px;
    background: #FFE66D;
    border-radius: 20px;
}

.elementor-element-182219f{
    will-change: transform;
    transition: transform .4s ease;
}
.elementor-146 .elementor-element.elementor-element-5732011 .elementor-button:hover {
    border: 1px solid var(--e-global-color-primary) !important;
}

/* =========================
   Expanding Cards
========================= */

.expanding-cards {
    display: flex;
    gap: 30px;
    height: 500px !important;
    overflow: hidden;
}

.exp-card {
    width: 140px;
    flex-shrink: 0;
    border-radius: 24px;
    overflow: hidden;
    cursor: pointer;
    background-size: cover;
    background-position: center;
    transition: all .5s ease;
}


/* =========================
   Content Visibility
========================= */

/* Hidden by default */
.exp-card .expcont {
    display: none;
}

/* Rotated heading visible by default */
.exp-card .expcont1 {
    display: block;
}


/* =========================
   Active Card
========================= */

.exp-card.active {
    width: calc(70% - 400px);
}

/* Show main content */
.exp-card.active .expcont {
    display: block;
}

/* Hide rotated heading */
.exp-card.active .expcont1 {
    display: none;
}

/* Move icon */
.exp-card.active .elementor-element-8b6d5aa {
    left: 10% !important;
}


/* =========================
   Responsive
========================= */

/* 1440px */
@media (max-width: 1440px) {

    .exp-card.active {
        width: calc(75% - 320px);
    }
	.elementor-13 .elementor-element.elementor-element-1742358 {
    --padding-left: 6rem;
    --padding-right: 6rem;
}

}


/* 1024px */
@media (max-width: 1024px) {

    .expanding-cards {
        gap: 8px;
        height: 600px;
    }
	.elementor-13 .elementor-element.elementor-element-1742358 {
    --padding-left: 6rem;
    --padding-right: 6rem;
}

    .exp-card {
        width: 70px;
    }

    .exp-card.active {
        width: calc(80% - 220px);
    }
	.elementor-13 .elementor-element.elementor-element-1742358 {
    --padding-left: 2rem;
    --padding-right: 2rem;
}
	.elementor-13 .elementor-element.elementor-element-187c2ed {
    --padding-left: 4rem !important;
    --padding-right: 4rem !important;
}

}


/* =========================
   768px and below
========================= */

@media (max-width: 768px) {

    .expanding-cards {
        flex-direction: column !important;
        gap: 12px;
        height: auto !important;
    }


    .exp-card {
        width: 100% !important;
        height: 90px;
        border-radius: 18px;
        position: relative;
    }


    .exp-card.active {
        width: 100% !important;
        height: 500px;
    }


    /* Heading */
    .exp-card .expcont1 {
        --e-transform-rotateZ: 0deg !important;
        top: 50% !important;
        left: 5% !important;
        transform: translateY(-50%) !important;
    }


    /* Icon always top-right */
    .exp-card .elementor-widget-icon {

        position: absolute !important;
        top: 30% !important;
        left: auto !important;
        right: 10% !important;
        transform: none !important;
    }
	
    .exp-card.active .elementor-widget-icon {

        position: absolute !important;
        top: 10% !important;
        left: auto !important;
        right: 10% !important;
        transform: none !important;
    }
	.elementor-13 .elementor-element.elementor-element-187c2ed {
    --padding-left: 2rem;
    --padding-right: 2rem;
}

}


/* 425px */
@media (max-width: 425px) {

    .exp-card {
        height: 70px;
        border-radius: 14px;
    }

    .exp-card.active {
        width: 100%;
        height: 460px;
    }
	.elementor-13 .elementor-element.elementor-element-187c2ed {
    --display: auto;
}

}


/* =========================
   Elementor Inner Padding
========================= */

.elementor-13 .elementor-element.elementor-element-d8dec5d:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-05023c8:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-d54edd1:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-15453a0:not(.elementor-motion-effects-element-type-background) {
    padding: 4rem 2rem;
}

/* Any image widget with imageshadow class */
.imageshadow img {
    border-radius: 30px;
    box-shadow: 0 4px 21.3px rgba(4, 60, 104, 0.06);
}


/* Video overlay */
.homevideo{
    position: relative;
    overflow: hidden;
}

.homevideo::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(55, 55, 55, 0.4); /* #373737 with 40% opacity */
    z-index: 2;
    pointer-events: none;
}

/* keep video underneath */
.homevideo video{
    position: relative;
    z-index: 1;
}




/* ===============================
1440 laptop
=============================== */

@media screen and (max-width:1440px){

    .elementor-56 .elementor-element.elementor-element-8f9049f{
        margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 26%) -15% !important;
    }


    .elementor-element.elementor-element-ccc848f.elementor-hidden-tablet.elementor-hidden-mobile.elementor-widget.elementor-widget-heading{
        margin:22% 0 0 -15% !important;
    }


    .elementor-56 .elementor-element.elementor-element-2143a78{
        --padding-bottom:9%;
    }


    .elementor-56 .elementor-element.elementor-element-12927e0{
        --padding-top:6rem;
    }

}



/* ===============================
1024 tablet landscape
=============================== */

@media screen and (max-width:1024px){

    .elementor-56 .elementor-element.elementor-element-8f9049f{
        margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 22%) 22% !important;
    }


    .elementor-element.elementor-element-ccc848f.elementor-hidden-tablet.elementor-hidden-mobile.elementor-widget.elementor-widget-heading{
        margin:18% 0 0 8% !important;
    }


    .elementor-56 .elementor-element.elementor-element-2143a78{
        --padding-bottom:5%;
    }


    .elementor-56 .elementor-element.elementor-element-12927e0{
        --padding-top:12rem;
    }
	.elementor-13 .elementor-element.elementor-element-d8dec5d:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-05023c8:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-d54edd1:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-15453a0:not(.elementor-motion-effects-element-type-background) {
    padding: 4rem 4rem;
}

}



/* ===============================
767 tablet portrait
=============================== */

@media screen and (max-width:768px){

    .elementor-56 .elementor-element.elementor-element-8f9049f{
        margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 16%) 12% !important;
    }


    .elementor-element.elementor-element-ccc848f.elementor-widget.elementor-widget-heading{
        margin:12% 0 0 0 !important;
    }


    .elementor-56 .elementor-element.elementor-element-2143a78{
        --padding-bottom:9%;
    }
    .elementor-56 .elementor-element.elementor-element-12927e0{
        --padding-top:10rem;
    }
	.elementor-56 .elementor-element.elementor-element-8903c52 {
    --padding-bottom: 18%;
    --padding-left: 3%;
}
	.elementor-13 .elementor-element.elementor-element-d8dec5d:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-05023c8:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-d54edd1:not(.elementor-motion-effects-element-type-background),
.elementor-13 .elementor-element.elementor-element-15453a0:not(.elementor-motion-effects-element-type-background) {
    padding: 4rem 2rem;
}

}



/* ===============================
425 mobile
=============================== */

@media screen and (max-width:425px){

    .elementor-56 .elementor-element.elementor-element-8903c52 {
    --padding-bottom: 50.5%;
    --padding-left: 9%;
}
    .elementor-56 .elementor-element.elementor-element-12927e0{
        --padding-top:8rem;
    }
	.elementor-56 .elementor-element.elementor-element-2143a78 {
    --padding-bottom: 32%;
}
	.elementor-56 .elementor-element.elementor-element-2143a78 {
    --padding-left: 30%;
}

}


/* ===============================
svg css
=============================== */

.svg-wrap{

    width:100%;

    overflow:hidden;

}


.svg-wrap svg{

    width:100%;

    height:auto;

    display:block;

}


.brush{

    fill:none;
    stroke:#ffe66d;
    stroke-width:14;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:1;
    stroke-dashoffset:1;
    visibility:hidden;

}


.svg-wrap.is-visible .brush{

    visibility:visible;

    animation:draw 1.6s ease-in-out forwards;

}


@keyframes draw{

    to{

        stroke-dashoffset:0;

    }

}


@media (prefers-reduced-motion:reduce){

    .svg-wrap.is-visible .brush{

        animation:none;

        stroke-dashoffset:0;

    }

}


/* ============================================================
   Hero-SVG-Animations — global, einbinden via Theme-CSS oder
   Elementor Custom-Code (HEAD). Greift auf alle SVGs, die die
   Klassen .logo-badge / .scroll-btn / .ht verwenden.
   ============================================================ */

/* Schriftfamilie für SVG-Texte */
.ht{font-family:'Clash',system-ui,sans-serif}

/* Logo/Icon-Badge (oben rechts): einmaliges Fade-In + Scale */
.logo-badge{
  transform-box:fill-box;
  transform-origin:center;
  animation:logoIn 900ms cubic-bezier(.2,.8,.2,1) both;
}
@keyframes logoIn{
  0%  {opacity:0; transform:scale(.6)}
  60% {opacity:1}
  100%{opacity:1; transform:scale(1)}
}

/* Scroll-Down-Button (unten links): Fade-In + dauerhaftes Pulsieren */
.scroll-btn{
  transform-box:fill-box;
  transform-origin:center;
  cursor:pointer;
  animation:btnIn 700ms ease-out both 200ms,
            btnPulse 2.4s ease-in-out 1100ms infinite;
}
@keyframes btnIn{
  0%  {opacity:0; transform:scale(.7)}
  100%{opacity:1; transform:scale(1)}
}
@keyframes btnPulse{
  0%,100%{opacity:1;  transform:scale(1)}
  50%    {opacity:.78; transform:scale(1.06)}
}
.scroll-btn:hover{animation-play-state:paused}

/* Accessibility: bei reduced-motion alles statisch */
@media (prefers-reduced-motion:reduce){
  .logo-badge,.scroll-btn{animation:none}
}


#menu-container{
    position: fixed;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);
    transition: all .45s ease;
    z-index: 9998;
}

#menu-container.active{
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.menu-toggle {
    width: 40px;
    height: 30px;
    position: relative;
    cursor: pointer;
    z-index: 9999;
        
}

/* Hamburger-Linien: dunkelgrün, abgerundet, Transition für Animation */
.menu-toggle span {
    position: absolute;
    width: 38px;
    height: 4px;
    background: #ffffff;
    left: 0;
    transition: all 0.4s ease;
    border-radius: 10px;
}

/* Obere Linie */
.menu-toggle span:nth-child(1) {
    top: 6px;
}

/* Untere Linie */
.menu-toggle span:nth-child(2) {
    top: 18px;
}

/* Aktiver Zustand (Menü offen): helle Linienfarbe */
.menu-toggle.active span {
    background: #E5F8DA;
}

/* Obere Linie rotiert zu X (45°) */
.menu-toggle.active span:nth-child(1) {
    top: 12px;
    transform: rotate(45deg);
}

/* Untere Linie rotiert zu X (-45°) */
.menu-toggle.active span:nth-child(2) {
    top: 12px;
    transform: rotate(-45deg);
}


/* Form wrapper */
.spl-form{
    margin: 0;
    padding: 2rem;
}

.spl-form .spl-row {
    display: flex;
    gap: 24px;
    margin-bottom: 0px;
    align-items: center;
}

.spl-form .spl-field{
    flex: 1;
    margin: 0px;
    padding: 0;
}

.spl-form p{
    margin: 0 !important;
}

/* Inputs */
.spl-form input,
.spl-form select{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 3rd row button full right */
.spl-form .spl-submit-wrap{
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    margin-left: auto;
    flex: 1;
}

/* button */
.spl-form input[type="submit"]{
    margin: 0 !important;
}
span.wpcf7-spinner {
    display: none;
}

.spl-form .wpcf7-submit {
    border: 1px solid #18EDED;
}

.spl-event select {
    font-size: 15px;
    font-weight: 400 !important;
    padding: 0px 0px !important;
    
}

.spl-event {
    border-radius: 30px !important;
    padding: 18px 22px;
    background: #FFE66D35;
}

.ev-voraussetzung {
    margin-top: 1rem !important;
}

.spl-form input[type="text"], .spl-form input[type="email"] {
    background: #FFE66D35;
    border-radius: 999px;
    padding: 16px 22px;
    font-size: 15px;
    color: #373737 !important;
}

.spl-form input:focus {
    outline: 1px solid #18EDED !important;
    outline-offset: 1px;
}
.inputform br{
    display:none !important;
}

.inputform .spl-event{
    position:relative;
}

.inputform .spl-event::after{
    content:"+";
    position:absolute;

    right:16px;
    top:50%;
    transform:translateY(-50%);

    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#18EDED;
    border-radius:50%;

    font-size:24px;
    font-weight:300;
    line-height:1;
    color:#000;

    pointer-events:none;
    z-index:2;
}

.inputform .spl-event select{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;

    padding-right:70px !important;
}


@media (max-width: 767px){

    .inputform .spl-row{
        display:flex !important;
        flex-direction:column !important;
        gap:16px;
    }

    .inputform .spl-row > *{
        width:100% !important;
        flex:0 0 100% !important;
        max-width:100% !important;
    }

    .inputform .spl-row p{
        width:100%;
        margin:0;
    }

    .inputform .spl-field{
        width:100%;
        display:block;
    }

 
    .inputform .wpcf7-submit{
        width:100%;
    }
    .spl-form .spl-row {
    margin-top: 0rem;
}

}






/* ---------- KF Form ---------- */

.kf-form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.kf-form p {
    margin: 0;
}

.kf-form .wpcf7-form-control-wrap {
    display: block;
}

.kf-form input[type="hidden"] {
    display: none;
}

/* Layout */

.kf-row {
    display: flex;
    gap: 24px;
}

.kf-row--msg {
    align-items: flex-end;
}

.kf-col {
    flex: 1;
    min-width: 0;
    margin: 0;
    display: block;
}

.kf-col--drop {
    flex: 1 1 100%;
}

.kf-col--grow {
    flex: 0 1 65%;
}

.kf-col--submit {
    flex: 0 0 auto;
    margin-left: auto;
    align-self: flex-end;
}

/* Form Fields */

.kf-form input[type="text"],
.kf-form input[type="email"]{
    width: 100%;
    box-sizing: border-box;
    border: none;
    outline: none;
    background: #FFFBF5;
    border-radius: 20px;
    font-size: 18px;
    color: #373737;
}

.kf-form input[type="text"],
.kf-form input[type="email"] {
    height: 58px;
    padding: 0 24px;
}

.kf-form textarea {
    min-height: 220px;
    resize: vertical;
    padding: 22px 24px;
}

.kf-form input::placeholder,
.kf-form textarea::placeholder {
    color: #555;
    opacity: 1;
}

.kf-form input:focus,
.kf-form textarea:focus {
    outline: 1px solid #18EDED;
    outline-offset: 1px;
}



/* Custom Dropdown */

.kf-field {
    position: relative;
    width: 70%;
    max-width: 480px;
    background: #FFFBF5;
    border-radius: 24px;
}

.kf-native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.kf-select {
    display: flex;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    min-height: 58px;
    padding: 10px 12px 10px 24px;
    background: none;
    border: none;
    font: inherit;
    font-size: 18px;
    color: #373737;
    text-align: left;
    cursor: pointer;
}

.kf-select:focus-visible {
    outline: 2px solid #18EDED;
    outline-offset: 2px;
}

.kf-value {
    flex: 1;
}

.kf-value[data-empty="true"] {
    color: #555;
}

.kf-icon {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #18EDED;
    border-radius: 50%;
    font-size: 26px;
    font-weight: 300;
    line-height: 1;
    color: #000;
}

.kf-icon::before {
    content: "+";
}

.kf-select[aria-expanded="true"] .kf-icon::before {
    content: "−";
}

.kf-panel {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition:
        max-height .28s ease,
        opacity .2s ease;
}

.kf-panel.is-open {
    max-height: 560px;
    opacity: 1;
}

.kf-list {
    list-style: none;
    margin: 0;
    padding: 0 24px 16px;
}

.kf-option {
    padding: 9px 0;
    font-size: 20px;
    font-weight: 500;
    color: #1a1a1a;
    cursor: pointer;
    transition: opacity .12s ease;
    white-space: nowrap;
}

.kf-option:hover,
.kf-option.is-active {
    opacity: .55;
}

.kf-option[aria-selected="true"] {
    font-weight: 700;
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    .kf-panel {
        transition: none;
    }

}

/* Responsive */

@media (max-width: 767px) {

    .kf-row {
        flex-direction: column;
        gap: 18px;
    }

    .kf-col--grow {
        flex: 1 1 100%;
        width: 100%;
    }

    .kf-col--submit {
        margin-left: 0;
        align-self: stretch;
    }

    .kf-form input[type="submit"] {
        width: 100%;
    }

    .kf-option {
        white-space: normal;
    }

}


/* ===========================
   FORM LAYOUT
=========================== */

.kf-form{
    display:flex;
    flex-direction:column;
    gap:24px;
    width:100%;
}

.kf-form p{
    margin:0;
}

.kf-form .wpcf7-form-control-wrap{
    display:block;
}

.kf-row{
    display:flex;
    gap:24px;
    width:100%;
}

.kf-row--2>.kf-col{
    flex:1;
}

.kf-col{
    flex:1;
    min-width:0;
}

.kf-col--drop{
    width:100%;
}

.kf-col--grow{
    flex:1;
}

.kf-col--submit{
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
}


/* ===========================
   INPUTS
=========================== */

.kf-form input[type="text"],
.kf-form input[type="email"]{
    width:100%;
    box-sizing:border-box;

    background:#FFFBF5;
    color:#373737;

    border:none;
    outline:none;
    border-radius:20px;

    font-size:18px;
    font-family:inherit;
}

.kf-form textarea{
    width:100%;
    box-sizing:border-box;

    background:#FFFBF5;
    color:#373737;

    border:none;
    outline:none;
    border-radius:20px;

    font-size:18px;
    font-family:inherit;
}

.kf-form input[type="text"],
.kf-form input[type="email"]{
    height:58px;
    padding:0 20px;
}

.kf-form textarea{
    min-height:160px;
    padding:18px 20px;
    resize:vertical;
}

.kf-form input::placeholder,
.kf-form textarea::placeholder{
    color:#373737;
    opacity:.8;
}

.kf-form input:focus,
.kf-form textarea:focus{
    outline:2px solid #18EDED;
    outline-offset:2px;
}


/* ===========================
   DROPDOWN
=========================== */

.kf-field{
    width:70%;
    background:#FFFBF5;
    border-radius:20px;
    overflow:hidden;
}

.kf-native{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
}

.kf-select{
    width:100%;
    min-height:58px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 12px 0 20px;

    background:none;
    border:none;

    font:inherit;
    font-size:18px;
    color:#373737;

    cursor:pointer;
}

.kf-value{
    flex:1;
}

.kf-value[data-empty="true"]{
    color:#373737;
}

.kf-icon{
    width:36px;
    height:36px;

    flex:none;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#18EDED;
    border-radius:50%;
}

.kf-icon::before{
    content:"+";
    font-size:24px;
    color:#000;
    line-height:1;
}

.kf-select[aria-expanded="true"] .kf-icon::before{
    content:"−";
}

.kf-panel{
    background:#FFFBF5;
}

.kf-list{
    margin:0;
    padding:0 20px 18px;
    list-style:none;
}

.kf-option{
    padding:12px 0;
    font-size:18px;
    color:#373737;
    cursor:pointer;
    transition:.2s;
}

.kf-option:hover,
.kf-option.is-active{
    opacity:.6;
}

.kf-option[aria-selected="true"]{
    font-weight:600;
}


/* ===========================
   SUBMIT
=========================== */

.kf-form input[type="submit"]{
    background:#373737;
    color:#18EDED;

    border:1px solid transparent;
    border-radius:999px;

    padding:8px 24px;

    font-size:16px;
    font-weight:600;

    cursor:pointer;
    transition:.25s;
	margin-bottom:40%;
}

.kf-form input[type="submit"]:hover{
    background:transparent;
    color:#373737;
    border-color:#18EDED;
}

.kf-form .wpcf7-spinner{
    display:none;
}


/* ===========================
   REMOVE CF7 EXTRA BR/P
=========================== */

.kf-form p{
    display:contents;
}

.kf-form br{
    display:none;
}


/* ===========================
   MOBILE
=========================== */

@media(max-width:767px){

    .kf-row{
        flex-direction:column;
        gap:18px;
    }

    .kf-col--submit{
        justify-content:stretch;
    }

    .kf-form input[type="submit"]{
        width:100%;
    }

}
.kf-form input[type="submit"]:hover,
.kf-form input[type="submit"]:focus {
    background: #373737 !important;
    color: #18EDED !important;
    border-color: transparent !important;
}
[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover {
    color: #373737;
}

.kf-form button:hover,
.kf-form button:focus {
    background: inherit !important;
    color: inherit !important;
}

.kf-field{
    position:relative;
    width:70%;
    overflow:visible;
}

.kf-panel{
    position:absolute;
    top:100%;
    left:0;
    right:0;

    margin-top:8px;

    background:#FFFBF5;
    border-radius:20px;

    box-shadow:0 10px 30px rgba(0,0,0,.12);

    z-index:999;

    max-height:0;
    opacity:0;
    overflow:hidden;

    transition:.25s;
}

.kf-panel.is-open{
    max-height:500px;
    opacity:1;
    overflow:auto;
}

.kf-row--msg{
    display:flex;
    gap:24px;
    align-items:flex-end;
}

.kf-row--msg > p{
    flex:0 0 70%;
    max-width:70%;
    margin:0;
}

.kf-row--msg .kf-col--submit{
    flex:0 0 30%;
    max-width:30%;

    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
}

.kf-row--msg textarea{
    width:100%;
    box-sizing:border-box;
}

@media (max-width:767px){

    .kf-row--msg{
        flex-direction:column;
    }

    .kf-row--msg > p,
    .kf-row--msg .kf-col--submit{
        flex:0 0 100%;
        max-width:100%;
        width:100%;
    }

    .kf-row--msg .wpcf7-submit{
        width:100%;
    }
	.kf-field {
    width: 100%;
}

}

/* ===== Main Form ===== */

.spl-form{
    display:flex;
    flex-direction:column;
    gap:24px;
    width:100%;
}

.spl-form p{
    display:contents;
    margin:0;
}

.spl-form br{
    display:none;
}

.spl-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    width:100%;
}

.spl-field{
    width:100%;
}

/* ===== Inputs ===== */

.spl-form input[type="text"],
.spl-form input[type="email"]{
    width:100%;
    height:58px;
    border:none;
    outline:none;
    border-radius:18px;
    background:#FFE66DAB;
    padding:0 18px;
    font-size:18px;
    color:#373737 !important;
    box-sizing:border-box;
}

.spl-form input::placeholder{
    color:#373737;
}

/* ===== Last Row ===== */

.spl-row:last-child{
    display:grid;
    grid-template-columns:1fr 220px;
    gap:24px;
    align-items:center;
}

/* ===== Dropdown ===== */

.ev-field{
    position:relative;
    width:100%;
}

.ev-select{
    width:100%;
    height:58px;
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 14px 0 18px;

    border:none;
    border-radius:18px;
    background:#FFE66DAB !important;

    cursor:pointer;
    font-size:18px;
    color:#373737;
}

.ev-value{
    flex:1;
    text-align:left;
}

.ev-icon{
    width:34px;
    height:34px;
    border-radius:50%;
    background:#18EDED;

    display:flex;
    align-items:center;
    justify-content:center;
}

.ev-icon::before{
    content:"+";
    font-size:24px;
    color:#000;
    line-height:1;
}

.ev-select[aria-expanded="true"] .ev-icon::before{
    content:"−";
}

/* Popup */

.ev-panel{
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 8px);

    background:#F6E9B7;
    border-radius:18px;

    box-shadow:0 10px 25px rgba(0,0,0,.12);

    z-index:999;

    display:none;
}

.ev-panel.is-open{
    display:block;
}

.ev-list{
    margin:0;
    padding:10px 18px;
    list-style:none;
}

.ev-option{
    padding:10px 0;
    cursor:pointer;
    color:#373737;
}

.ev-option:hover{
    opacity:.7;
}

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

.spl-form input[type="submit"]{
    border:1.5px solid #18EDED;
    border-radius:999px;
    background:#fff;
    color:#373737;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
	padding:8px 24px !important;
}

.spl-form input[type="submit"]:hover{
    background:#18EDED;
    color:#373737;
}

/* ===== Mobile ===== */

@media(max-width:767px){

    .spl-row,
    .spl-row:last-child{
        grid-template-columns:1fr;
    }
	.spl-form {
    gap: 16px;
	}

}


/* ==========================================================
   Step Slider Section
========================================================== */

/* Section */

.elementor-13 .elementor-element.elementor-element-fa4a686 {
    --display: block !important;
    height: 500vh !important;
    min-height: 500vh !important;
    position: relative !important;
    padding: 0 !important;
}


/* Sticky Container */

.elementor-13 .elementor-element.elementor-element-ac2e74c {
    --display: grid !important;
    --container-widget-width: initial !important;

    grid-template-columns: 1fr 360px 1fr !important;
    gap: 60px !important;

    align-items: center !important;
    justify-items: center !important;

    position: sticky !important;
    top: 15rem !important;

    width: 100% !important;
    max-width: 1200px !important;
    min-height: 0 !important;

    align-self: start !important;

    margin: 0 auto !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* Columns */

.elementor-13 .elementor-element.elementor-element-bbccacb,
.elementor-13 .elementor-element.elementor-element-d622e80,
.elementor-13 .elementor-element.elementor-element-5309f13 {

    --width: auto !important;
    --min-height: 0 !important;

    width: 100% !important;
    min-height: 0 !important;

    position: relative !important;
    margin: 0 !important;
}


/* Image Column */

.elementor-13 .elementor-element.elementor-element-d622e80 {

    --width: 360px !important;
    width: 360px !important;
    height: 420px !important;
    margin: 0 auto !important;
    justify-self: center !important;
    position: relative !important;
}


/* Image Stack */

.elementor-13
.elementor-element.elementor-element-d622e80
> .speaker-img {

    position: absolute !important;
    inset: 0 !important;
    width: 318px !important;
    margin: auto !important;
    max-width: none !important;
}


/* Text Slides */

.step-slider-wrap > div {

    position: absolute;

    top: 50%;
    left: 0;

    width: 100%;

    opacity: 0;

    transform: translateY(-50%) translateY(30px);

    transition:
        opacity .6s ease,
        transform .6s ease;

    pointer-events: none;
}

.step-slider-wrap > div.active {

    opacity: 1;

    transform: translateY(-50%);

    z-index: 2;

    pointer-events: auto;
}


/* Image Animation */

.speaker-img {

    opacity: 0;

    transform:
        translateY(60px)
        scale(.95);

    transition:
        opacity .5s ease,
        transform .5s ease;
}

.speaker-img.active {
    opacity: 1;
}

.speaker-img:nth-of-type(1).active {
    transform: rotate(-4deg);
    z-index: 1;
}

.speaker-img:nth-of-type(2).active {
    transform: rotate(3deg);
    z-index: 2;
}

.speaker-img:nth-of-type(3).active {
    transform: rotate(-2deg);
    z-index: 3;
}

.speaker-img:nth-of-type(4).active {
    transform: rotate(4deg);
    z-index: 4;
}

.speaker-img:nth-of-type(5).active {
    transform: rotate(-3deg);
    z-index: 5;
}

.speaker-img img {

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: top center;

    border-radius: 40px;

    box-shadow:
        0 15px 35px rgba(0,0,0,.18);
}


/* Navigation Dots */

.step-dots {

    position: fixed;

    right: 28px;
    top: 50%;

    transform: translateY(-50%);

    display: flex;
    flex-direction: column;
    gap: 10px;

    z-index: 100;
}

.step-dot {

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #ccc;

    cursor: pointer;

    transition:
        background .3s,
        transform .3s;
}

.step-dot.active {

    background: #e07cae;

    transform: scale(1.4);
}


/* ==========================================================
   Responsive
========================================================== */

@media (max-width:1024px){

    .step-slider-sticky.step-slider-sticky{

        flex-direction:column;

        gap:24px;

        padding:20px;
    }

    .step-slider-wrap{

        width:100%;

        min-height:auto;
    }

    .step-slider-wrap>div{

        top:50%;
        left:50%;

        transform:
            translate(-50%,-50%)
            translateY(30px);

        visibility:hidden;
    }

    .step-slider-wrap>div.active{

        transform:
            translate(-50%,-50%);

        visibility:visible;
    }

    .speaker-img,
    .speaker-img img{

        width:218px;
        height:228px;
    }

    .step-dots{

        right:10px;
    }

}
@media (min-width: 769px) {
	
	.elementor-13 .elementor-element.elementor-element-bbccacb,
.elementor-13 .elementor-element.elementor-element-d622e80,
.elementor-13 .elementor-element.elementor-element-5309f13 {
    height: 0px !important;
}
	.elementor-13
.elementor-element.elementor-element-d622e80
> .speaker-img {
    height: 360px !important;
}
	
}

@media(max-width:768px)
{
.elementor-element.elementor-element-ac2e74c.e-con-full.step-slider-sticky.e-flex.e-con.e-child {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
}
	.elementor-13
.elementor-element.elementor-element-d622e80
> .speaker-img {
    height: 300px !important;
}

}

.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item.elementor-item-active, 
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item.elementor-item-active {
    font-weight: 600;
}
.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item{
    position: relative;
    text-decoration: none;
}

.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item::after,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background: #18EDED;
    transition: width .3s ease;
}

.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item:hover::after,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item:hover::after{
    width: 100%;
}

.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item:hover,
.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item.highlighted,
.elementor-75 .elementor-element.elementor-element-710c15e .elementor-nav-menu--main .elementor-item:focus,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item:hover,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item.highlighted,
.elementor-75 .elementor-element.elementor-element-051cf4f .elementor-nav-menu--main .elementor-item:focus{
    color: var(--e-global-color-primary);
    fill: var(--e-global-color-primary);
}
.elementor-nav-menu a, .elementor-nav-menu a:focus, .elementor-nav-menu a:hover,
.elementor-nav-menu--main .elementor-nav-menu a:hover {
    padding: 5px 20px;
	line-height:5px;
}