.elementor-kit-7{--e-global-color-primary:#051700;--e-global-color-secondary:#D6FF61;--e-global-color-text:#FFFFFF;--e-global-color-accent:#B4B9B2;--e-global-typography-primary-font-family:"Druk";--e-global-typography-primary-font-size:280px;--e-global-typography-primary-font-weight:500;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-line-height:240px;--e-global-typography-primary-letter-spacing:2.8px;--e-global-typography-secondary-font-family:"Druk";--e-global-typography-secondary-font-size:180px;--e-global-typography-secondary-font-weight:500;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-secondary-line-height:160px;--e-global-typography-secondary-letter-spacing:1.8px;--e-global-typography-text-font-family:"Druk";--e-global-typography-text-font-size:48px;--e-global-typography-text-font-weight:500;--e-global-typography-text-text-transform:uppercase;--e-global-typography-text-letter-spacing:1px;--e-global-typography-accent-font-family:"Druk";--e-global-typography-accent-font-size:28px;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:0.8px;--e-global-typography-98d396c-font-family:"Elza";--e-global-typography-98d396c-font-size:17px;--e-global-typography-98d396c-font-weight:400;--e-global-typography-98d396c-line-height:22px;--e-global-typography-98d396c-letter-spacing:0.35px;--e-global-typography-fea9429-font-family:"Elza";--e-global-typography-fea9429-font-size:12px;--e-global-typography-fea9429-font-weight:400;--e-global-typography-fea9429-text-transform:uppercase;--e-global-typography-fea9429-line-height:18px;--e-global-typography-fea9429-letter-spacing:0.25px;--e-global-typography-f6283bc-font-family:"Druk";--e-global-typography-f6283bc-font-size:32px;--e-global-typography-f6283bc-font-weight:500;--e-global-typography-f6283bc-text-transform:uppercase;--e-global-typography-f6283bc-letter-spacing:0.65px;background-color:var( --e-global-color-primary );--e-preloader-animation-duration:0ms;--e-preloader-delay:0s;--e-preloader-width:0px;--e-preloader-max-width:0px;--e-preloader-opacity:0;}.elementor-kit-7 e-page-transition{background-color:#FFFFFF00;}.elementor-kit-7 a{color:var( --e-global-color-text );}.elementor-kit-7 a:hover{color:var( --e-global-color-text );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-7{--e-global-typography-primary-font-size:220px;--e-global-typography-primary-line-height:180px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-7{--e-global-typography-primary-font-size:92px;--e-global-typography-primary-line-height:1.1;--e-global-typography-secondary-font-size:80px;--e-global-typography-secondary-line-height:72px;--e-global-typography-text-font-size:40px;--e-global-typography-text-line-height:44px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */body {
    font-family: "elza", sans-serif !important; 
}

.font-swap {
    font-family: "Druk", sans-serif ;
}

.space {
    margin-right: 48px !important;
}

@media only screen and (max-width: 768px) {
    .space {
        margin-right: 50% !important;
    }
    
    .e-n-accordion-item-title-text {
        line-height: 1.1 !important;
    }
}


/***** ACCORDIONS *****/
.elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title {
    transition: all .3s;
}


.line-vertical {
 left: 50% !important;
 transform: translateX(-50%) rotate(90deg) !important;
}


/***** TAGLINE *****/
#tagline .elementor-icon,
#tagline svg {
    width: 100% !important;
    height: auto !important;
}



/****** BUTTONS ******/
.elementor-field-type-submit {
    width: min-content !important;
    margin-top: 16px;
}

.elementor-button-content-wrapper,
#btn-form > span
{
    align-items: flex-end !important;
}


/****** FORM ******/

#form input, 
#form select {
    height: 50px !important;
    padding: 8px 14px;
    line-height: 1.3;
}

#form textarea {
    padding: 8px 14px;
} 


#form input::placeholder, 
#form select::placeholder,
#form textarea::placeholder {
    color: #000 !important;
    opacity: 1;
}


#form input:hover, 
#form select:hover,
#form textarea:hover {
    background-color: #D6FF61;
}


#form option {
    font-size: 16px !important;
}

/*
.elementor-field-group {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
*/


/*********************/
/****** TITLE REVEAL EFFECT ******/
/* CSS combining fade-in with upward sliding */
.elementor-title-reveal {
    overflow: hidden !important;
    position: relative;
    display: inline-block;
}

.elementor-title-reveal .elementor-heading-title {
    transform: translateY(100%);
    opacity: 0;  /* ← Fade-in effect applied */
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
                opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    display: block;
}

.elementor-title-reveal.animate .elementor-heading-title {
    transform: translateY(0%);
    opacity: 1;  /* ← Fade-in effect applied */
}

/* Transition delays for multiple title lines */
.title-line-1 .elementor-heading-title {
    transition-delay: 0.1s;
}

.title-line-2 .elementor-heading-title {
    transition-delay: 0.4s;
}

.title-line-3 .elementor-heading-title {
    transition-delay: 0.7s;
}

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

 .elementor-heading-title {
    line-height: 0.9 !important;
   }
}


/*********************/
/* HOVER EFFECT FOR MENU LINKS */
/* Rolling effect with underline for Elementor buttons (FIXED) */
.menu-button-roll {
    position: relative;
    overflow: hidden !important;
}

.menu-button-roll .elementor-button-content-wrapper {
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.menu-button-roll:hover .elementor-button-content-wrapper {
    transform: translateY(-100%); /* Moves out upwards */
}

.menu-button-roll::before {
    content: attr(data-text);
    position: absolute;
    top: 100%; /* Starts below visible area */
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    
    /* Matches the parent's button styling */
    color: #FFF;
    font-size: 28px;
    font-weight: 500;
    font-family: "Druk";
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    line-height: inherit;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1; /* Behind button to keep clickable */
    pointer-events: none; /* No interaction */
}

.menu-button-roll:hover::before {
    transform: translateY(-100%); /* Moves to normal position */
    z-index: 1; /* Comes in front only on hover */
}

/* Underline expands from left to right */
.menu-button-roll::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 1px;
    background: #FFF;
    transition: width 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 2;
    pointer-events: none; /* No interaction */
}

.menu-button-roll:hover::after {
    width: 100%;
}



/*********************/
/* SVG ROLL + UNDERLINE BUTTON EFFECT */

/* Rolling animation for SVG icon - applies to class and ID */
.button-svg-roll,
#btn-form {
    position: relative;
    overflow: hidden !important;
}

/* Horizontal alignment of button content */
.button-svg-roll .elementor-button-content-wrapper,
#btn-form .elementor-button-content-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 8px; /* Spacing between icon and text */
}

/* SVG icon container - fixed 16px size */
.button-svg-roll .elementor-button-icon,
#btn-form .elementor-button-icon {
    position: relative;
    overflow: hidden !important;
    display: inline-block;
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0; /* Prevent shrinking */
    vertical-align: middle; /* Vertically align with text */
}

/* Original SVG - absolutely positioned for pixel-perfect control */
.button-svg-roll .elementor-button-icon svg,
#btn-form .elementor-button-icon svg {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 16px !important;
    height: 16px !important;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Animation: original SVG moves exactly 16px up */
.button-svg-roll:hover .elementor-button-icon svg,
#btn-form:hover .elementor-button-icon svg {
    transform: translateY(-16px); /* Moves up by its height */
}

/* Duplicate SVG enters from below */
.button-svg-roll .elementor-button-icon::before,
#btn-form .elementor-button-icon::before {
    content: '';
    position: absolute;
    top: 16px; /* Starts exactly 16px below */
    left: 0;
    width: 16px;
    height: 16px;
    
    /* Your self-hosted SVG */
    background-image: url('/wp-content/uploads/arrow.svg');
    background-size: 16px 16px; /* Exact size */
    background-repeat: no-repeat;
    background-position: center;
    
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
    pointer-events: none;
}

/* Animation: duplicate SVG moves up 16px to position */
.button-svg-roll:hover .elementor-button-icon::before,
#btn-form:hover .elementor-button-icon::before {
    transform: translateY(-16px);
    z-index: 1;
}

/* Underline grows from left to right across entire button */
.button-svg-roll::after,
#btn-form::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 1px;
    background: #FFF; /* Adjust color as needed */
    transition: width 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 2;
    pointer-events: none;
}

.button-svg-roll:hover::after,
#btn-form:hover::after {
    width: 100%;
}


#course.placeholder-active {
  font-size: 32px;
  color: #888; /* optional: placeholder text color */
}


/*********************/
/***** STICKY HEADER *****/

.header-gradient {
    position: relative;
}

.header-gradient::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(5, 23, 0, 1) 0%, rgba(5, 23, 0, 0) 100%);
    opacity: 0;
    transition: opacity 1s ease;
    pointer-events: none;
    z-index: -1;
}

.header-gradient.show-gradient::before {
    opacity: 1;
}


/***** PRELOADER *****/

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #051700;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: all 0.8s ease-in-out;
}

#preloader.fade-out {
    opacity: 0;
    visibility: hidden;
}

.preloader-logo {
    width: 80px;
    height: 80px;
}

/* Locally hosted logo image */
.preloader-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-width: 80px;
    max-height: 80px;
}

@media only screen and (min-width: 747px) {
    .preloader-logo {
    width: 120px;
    height: 120px;
}

/* Locally hosted logo image */
.preloader-logo img {
    max-width: 120px;
    max-height: 120px;
}
}

body.loading {
    overflow: hidden;
}

body.loading .elementor-location-header,
body.loading .elementor-location-footer,
body.loading main {
    opacity: 0;
}



/***** PARALLAX HERO EFFECT *****/

.parallax-image-hero {
  position: relative;
  overflow: hidden;
  background-position: center center;
  background-attachment: scroll;
  background-repeat: no-repeat;
  min-height: 100vh; 
  background-size: cover;
  background-image: url('/wp-content/uploads/apnoe-voralbert-hero-hd-4.jpg');
}


 /* Effect applied on second Quote section
.parallax-image-quote {
 background-image: url('https://dev.somnium.design/apnoe-vlbg/wp-content/uploads/drowning-in-passion.jpg');
  background-size: 120% auto;
  background-position: center 40%; /* Starts slightly below center 
} */

/***** SMOOTH SCROLLING + PARALLAX EFFECT *****/
/*
.parallax-image-hero {
  position: relative;
  overflow: hidden;
}

.container-img  {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  z-index: 0;
  overflow: hidden;
}

.container-img .img {

  object-fit: cover;
}

html {
  scroll-behavior: auto !important;
  overflow: hidden;
}

body, html {
  height: auto;
  overflow: hidden;
}


[data-scroll] {
  will-change: transform;
  transition: transform 0.3s ease;
}

[data-scroll-container] {
  will-change: transform;
}


body.elementor-editor-active [data-scroll-container] {
  transform: none !important;
  will-change: auto !important;
  overflow: visible !important;
  position: static !important;
  height: auto !important;
}

*//* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Druk';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('/wp-content/uploads/Druk-Medium-Web.woff2') format('woff2');
}
/* End Custom Fonts CSS */