/*
Theme Name: Hello Elementor Child
Theme URI: https://example.com/
Description: Hello Elementor Child Theme
Author: Your Name
Template: hello-elementor
Version: 1.0.0
*/
 
/* Your CSS below */


/* Add your custom CSS below */
/* loader css */
.wp-singular .site-main {
	padding-top:var(--header-height-current);
}
header .elementor-button span.elementor-button-icon {
    display:none;
	}
@media(max-width:880px){
	header .elementor-button span.elementor-button-icon {
      display:block;
	}
	header .elementor-button .elementor-button-text{
		display:none;
	}
   header .elementor-button{
    width: 45px;
    height:45px;
    display: flex;
    align-items: center;
    justify-content: center;
    }

}
.wpcf7-spinner{display: none;}
@media screen and (min-width:1440px){
    .e-con {
	--content-width :1400px !important;
    }
}
.position-static{position:static;}
@media(max-width:1024px){
	.position-md-relative{position:relative;}
}
/* .hfe-flyout-wrapper .hfe-side.hfe-flyout-left{
	display: block !important;
    transition: all 0.3s ease-in-out;
} */

.news-event-carousel .owl-carousel .owl-item img{
	aspect-ratio:2/1.3;
	object-fit:cover;
}
.cssbuttons-io {
  position: relative;
  display: inline-block;
	border-radius:50px; 
  overflow: hidden;
}
.cssbuttons-io a{width:100%;}
.cssbuttons-io .elementor-button-content-wrapper {
  position: relative;
  z-index: 10;
  transition: color 0.4s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
	width:100%
}


.cssbuttons-io .elementor-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -10%;
  width: 120%;
  height: 100%;
  background: #000;
  transform: skew(30deg);
  transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);
  z-index: 0;
}

.cssbuttons-io .elementor-button:hover::before {
  transform: translate3d(100%, 0, 0);
}

.cssbuttons-io .elementor-button:hover {
  color: #fff !important;
}

/* .cssbuttons-io:active {
  transform: scale(0.95);
} */


.split_text .line , .splitText .line{
            overflow: hidden;
            line-height:1.1;
                      }
          .split_text .word , .splitText .word{ top: -5px; }
          .split_text , .splitText{
           visibility: hidden;
          }
          .fade-text , .fadeText {opacity: 0;  }

/* @media(max-width:1024px){
header nav {
        top: 0 !important;
        height: 100vh !important;
        position: absolute;
      	padding:10px;
        width: 50% !important;
        right: 100% !important;
        left: unset !important;
        transform: translateX(-100%);
        transition: all 0.3s ease-in-out;
    }
	header nav.menu-is-active{
		left: 0% !important;
        transform: translateX(0%);
	}
	header .hfe-nav-menu li, header .hfe-nav-menu ul{height:fit-content;}
} */
/* Default header */
.header-scroll {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background: transparent;
  transition: background-color 0.4s ease,
              box-shadow 0.4s ease,
              padding 0.4s ease;
}

/* Header after scroll */
/* .header-scroll.scrolled {
  background: var( --e-global-color-4361579 );
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  padding: 14px 0;
	border-bottom:2px solid ;
} */
.header-scroll .e-con-inner{
    transition: all 0.3s ease-in-out;
}
div.hfe-nav-menu-icon{
    width: 45px;
    height:45px;
    backdrop-filter: blur(10px);
    padding: 0px !important;
    border: 1px solid #aaa4b552;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* .header-scroll-inner{backdrop-filter: blur(10px);} */
div.hfe-nav-menu-icon svg , .hfe-site-logo-container .hfe-site-logo-img{vertical-align:middle;}
.header-scroll.scrolled .e-con-inner .header-scroll-inner {
	background-color:#fff !important;
}
body {
  cursor: none !important;
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 36px;
  height: 36px;
  border: 2px solid var(--e-global-color-primary );
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 99999;
  transition: all .2s ease;
}
.darktext{color:var( --e-global-color-primary );
}

.custom-cursor-dot {
  position: fixed;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  background: var( --e-global-color-primary);
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 100000;
}



@media (max-width: 768px) {
  .custom-cursor,
  .custom-cursor-dot {
    display: none;
  }

  body {
    cursor: auto !important;
  }
}


.py{
	padding-top:50px;
	padding-bottom:50px;
}
@media(max-width:1025px){
	.py {
    padding: 50px 20px;
}
}
@media(min-width:880px){
.sticky-scroll{
	  position: sticky;
    top: 0;
    height: 100vh;
}
}

.exipnos-subscribe p {
    margin-bottom: 0px;
    display: flex !important;
    gap: 5px;
}
.exipnos-subscribe .subscribe-btn {
    height: 40px !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1;			;
    display: flex;
    align-items: center;
    justify-content: center;
	padding:0px !important;
    transition: all 0.3s ease-in-out;
}
.exipnos-subscribe .subscribe-btn:hover {
    transform: translateX(10px) rotate(45deg);
    box-shadow: 0 10px 24px rgba(255, 255, 255, 0.22);
}
.contact-form textarea {
    border-radius: 25px;
	height: 100px;
}
.contact-form input[type=date], .contact-form  input[type=email], .contact-form input[type=number], .contact-form  input[type=search], .contact-form  input[type=tel], .contact-form  input[type=text], .contact-form  input[type=time], .contact-form  input[type=url],
.contact-form select,.contact-form  textarea {
	    border: 1px solid #ebebeb !important;
    /* box-shadow: -.25rem -.25rem .5rem hsla(0, 0%, 100%, .8), .25rem .25rem .5rem rgba(0, 0, 0, .25); */
    outline: 0 solid #826db0;
    outline-offset: 2px;
    outline-width: 0;
    padding: .625rem .75rem .625rem 1rem;
    transition-duration: .1s;
    transition-property: outline-width, outline-offset;
    transition-property: all;
    transition-timing-function: ease-in;
    transition-timing-function: ease-in-out;
	
}
.contact-form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 30px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 22px center;
    background-size: 20px;
}
.form-row {
    display: flex;
    gap: 20px;
    width: 100%;
}

.form-row .half-field {
    width: 50%;
}

@media (max-width: 767px) {

    .form-row {
        flex-direction: column;
        gap: 0;
    }

    .form-row .half-field {
        width: 100%;
    }

}
.contact-form  select{
	border-radius:50px;
	border-color: var(--e-global-color-primary);
}


.back-container {
    pointer-events: none;
    opacity: 0;
}
.gallery-section .elementor-gallery-item {	
	display: inline-block;
    width: 100%;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 12px;
    break-inside: avoid;
	  transform-origin: center center;
    will-change: transform;
}

/* .genetic-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
	 background:radial-gradient(circle at 50% 20%, rgba(126, 72, 220, 0.35) 0%, rgba(78, 54, 163, 0.18) 35%, rgb(255 255 255) 100%) ;
} */

#geneticCanvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;

    opacity: 0;

    transform: scale(1.05);

    transition:
        opacity 2s ease,
        transform 3s cubic-bezier(.16, 1, .3, 1);
}

.genetic-bg.loaded #geneticCanvas {
    opacity: 1;
    transform: scale(1);
}

/* .genetic-bg::after {
    content: "";
    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at center,
            transparent 20%,
            rgba(20, 8, 45, 0.25) 70%,
            rgba(10, 5, 25, 0.55) 100%
        );

    pointer-events: none;
} */


.footer-inner , #header-scroll-inner{
	    background: linear-gradient(90deg, #316EF9 0%, #4A4AEC 50%, #7F42E1 100%);
	 background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;

}
.white-logo{
	filter: brightness(0.5) invert(1);
}
.elementor-109 .elementor-element.elementor-element-1ee04c3 div.hfe-nav-menu-icon {   
    width: 65px;
    height: 65px;      
}

@media(max-width:880px){
	.elementor-109 .elementor-element.elementor-element-1ee04c3 div.hfe-nav-menu-icon {   
    width: 45px;
    height: 45px;      
}

}
/* #header-scroll-inner:before{
	content: "";
    width: 100%;
    height: 100%;
    border-radius: 60px;
    bordeR: 0px;
   
    backdrop-filter: blur(10px);
} */

.genetic-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
/* 	 background:radial-gradient(circle at 50% 20%, rgba(126, 72, 220, 0.35) 0%, rgba(78, 54, 163, 0.18) 35%, rgb(255 255 255) 100%) ; */
	 background:
        radial-gradient(
            circle at 75% 45%,
            rgba(91, 123, 255, 0.16) 0%,
            rgba(91, 123, 255, 0.07) 25%,
            transparent 55%
        ),
        radial-gradient(
            circle at 15% 20%,
            rgba(120, 160, 255, 0.10) 0%,
            transparent 45%
        ),
        radial-gradient(
            circle at 90% 100%,
            rgba(110, 145, 255, 0.12) 0%,
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f5f8ff 45%,
            #edf3ff 100%
        );
}
.blur-10{
	  backdrop-filter: blur(10px);
}
.elementor-image-box-img img{
	padding: 10px;
    background: #fff;
}


.genetic-intro {
    position: fixed;
    inset: 0;
    z-index: 999999;

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

    overflow: hidden;

    background:
        radial-gradient(
            circle at center,
            #4e36a3 0%,
            #261650 45%,
            #0d071c 100%
        );

    opacity: 1;
}

#geneticIntroCanvas {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
}

.genetic-intro-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.8);    
    width: 100%;
    max-width:500px;
    opacity: 0;
    visibility: hidden;
    z-index: 10;
    transition:
        opacity 0.8s ease,
        transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.genetic-intro-logo img {
    display: block;
    width: 100%;
    height: auto;
    filter: brightness(0.5) invert(1);
}

.genetic-intro-logo.show {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

/* When intro finishes */

.genetic-intro.hide {
    pointer-events: none;

    opacity: 0;

    transition:
        opacity 1.2s cubic-bezier(.76,0,.24,1);
}



.grid-mesh {
	position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    background-image: linear-gradient(90deg, oklch(18.4% .013 265 / .05) 1px, #0000 1px), linear-gradient(oklch(18.4% .013 265 / .05) 1px, #0000 1px);
    background-size: 64px 64px;
}

.horizontal-scroll {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.horizontal-scroll-inner {
    display: flex !important;
    flex-wrap: nowrap !important;

    width: max-content !important;
    max-width: none !important;

    gap: 40px;

    will-change: transform;
}


/*
========================================
EACH HORIZONTAL CARD
========================================
*/

.horizontal-scroll-inner > .e-con {
    flex: 0 0 auto !important;

    width: 420px;
    min-width: 420px;
}


/*
========================================
IMAGE
========================================
*/

.horizontal-scroll-inner img {
    width: 100%;
    height: auto;
    display: block;
}


/*
========================================
ELEMENTOR INNER CONTAINER
========================================
*/

.horizontal-scroll > .e-con-inner {
    overflow: visible !important;
}
.our-team .eael-team-item figure img {
    aspect-ratio: 2 / 1.5;
    object-fit: cover;
    object-position: top;
}
.our-team .eael-team-item a {
    color: var(---e-global-color-primary);
}
.our-team .eael-team-item {
    border-radius: 12px;
    box-shadow: 0px 0px 6px 2px #0000002b;
}



.form-field {
    margin-bottom: 15px;
}
.wpcf7 form>div, .wpcf7 form>p , .eael-contact-form-7 .wpcf7-form input[type="submit"] { margin-bottom: 0px !important;}
.eael-contact-form-7 .wpcf7-form p:nth-last-of-type(1){width:100%;}
.biocelain .elementor-image-carousel .swiper-slide-image {
    aspect-ratio: 0.8;
    object-fit: cover;
}
body.biocelain-cursor .custom-cursor-dot {
    background: #fff !important;
}

body.biocelain-cursor .custom-cursor {
    border-color: #fff !important;
}
.psacp-post-title, .psacp-post-desc, .eael-grid-post-excerpt p, .eael-entry-title{
	  width: 100%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.latest-posts-news .eael-posted-by{
	display:none;
}
.latest-posts-news .eael-grid-post-holder-inner{text-align:center;}
.latest-posts-news .eael-entry-meta{align-items:center;}

.latest-posts-news .eael-post-elements-readmore-btn{margin:10px auto !important; width: fit-content;}

.latest-posts-news .eael-grid-post-holder {
    overflow: hidden;
}
.latest-posts-news .eael-grid-post-holder{
	transition:all 0.3s ease-in-out;
}
.latest-posts-news .eael-grid-post-holder:hover {
    border-color: var(---e-global-color-primary) !important;
    box-shadow: 0px 13px 7px 7px #8e6caf21;
}
.psacp-post-carousel-wrap .owl-nav .owl-next:hover, .psacp-post-carousel-wrap .owl-nav .owl-prev:hover, .psacp-post-carousel-wrap .owl-nav .owl-next:focus, .psacp-post-carousel-wrap .owl-nav .owl-prev:focus{
	background:var( ---e-global-color-primary ) !important;
}
.biopolymers-overview  .elementor-image-carousel .swiper-slide-image{
	background:var(--e-global-color-2fcf363);
	height:170px;
  width:170px;
	object-fit: cover;
}
@media(min-width:992px){
    .processlp-itm {
    margin-top: 10px;
    position: relative;
}
.processlp-itm::before {
    height: 1px;
    width: calc(100% - 87px);
    position: absolute;
    top: 35px;
    background: 0 0;
    border-top: 1px dashed #ccb4bf;
    z-index: 0;
    left: calc(50% + 55px);
    content: "";
}
.processlp-itm .rightArrowPro {
    top: 25px;
}
.rightArrowPro {
    position: absolute;
    top: -15px;
    z-index: 9;
    animation: 2s ease-in-out infinite arrowProg;
}
.processlp-itm .rightArrowPro img {
    filter: invert(1);
    width: 15px;
}

@keyframes arrowProg{
	0% {
    right: 0;
}
100% {
    right: -50px;
}
}
}
