/*
Theme Name: Hello Elementor Child
Description: Thème enfant pour les personnalisations du site Biocorium
Author: Agence Syril Digital
Author URI: https://syril-digital.fr
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

button.elementskit-menu-hamburger {
     background-color: transparent !important;
}

.current-menu-item a {
     font-weight: 700 !important;
}

/*************************
***** Animation menu *****
**************************/

.header-section .elementskit-navbar-nav>li {
     overflow: visible;
}

.header-section .elementskit-navbar-nav>li>a {
     position: relative;
     display: inline-block;
     padding-bottom: 14px;
     transition: color 0.3s ease;
}

.header-section .elementskit-navbar-nav>li>a::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -2px;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background-color: #f2c8b4;
     pointer-events: none;

     opacity: 0;
     transform: translateX(-28px) scale(0.75);
     transition:
          transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
          opacity 0.25s ease;
}

/* Hover : le point glisse vers le centre */
.header-section .elementskit-navbar-nav>li>a:hover::after {
     opacity: 1;
     transform: translateX(-50%) scale(1);
}

/* État actif : le point reste centré */
.header-section .elementskit-navbar-nav>li.current-menu-item>a::after,
.header-section .elementskit-navbar-nav>li.current_page_item>a::after,
.header-section .elementskit-navbar-nav>li.current_page_parent>a::after {
     opacity: 1;
     transform: translateX(-50%) scale(1);
}

@media (max-width: 1024px) {

     .header-section .elementskit-navbar-nav>li>a::after {
          left: 10%;
     }

     .header-section .elementskit-navbar-nav>li>a:hover::after,
     .header-section .elementskit-navbar-nav>li.current-menu-item>a::after,
     .header-section .elementskit-navbar-nav>li.current_page_item>a::after,
     .header-section .elementskit-navbar-nav>li.current_page_parent>a::after {
          transform: translate(0, 0) scale(1);
     }

}

@media (max-width: 1761px) {
     .header-section.e-con>.e-con-inner {
          max-width: 100% !important;
     }
}


/*************************
***** Hero page accueil **
**************************/

.js-hero-media {
     transform: scale(1.18);
     opacity: 0.65;
     filter: blur(16px) brightness(1.18);
}

.js-hero-media {
     overflow: hidden;
     will-change: transform, filter, opacity;
}

.js-hero {
     overflow: hidden;
}

.js-hero-panel {
     opacity: 0;
     visibility: hidden;
     will-change: transform, opacity;
     backface-visibility: hidden;
     transition: none !important;
}

/*************************
***** Bio page accueil ***
**************************/

.js-bio-media-wrap,
.js-bio-content,
.js-bio-bottom {
     opacity: 0;
     transform: translateY(0);
     will-change: transform, opacity;
}

.js-bio-section {
     overflow: hidden;
}

.js-bio-line {
     width: 1px !important;
     min-width: 1px !important;
     align-self: stretch;
     display: flex;
     overflow: hidden;
     background: none !important;
     border: none !important;
     transition: none !important;
}

.js-bio-line-inner {
     width: 1px;
     min-width: 1px;
     height: 0%;
     background: #5D7B62;
     will-change: height;
     backface-visibility: hidden;
     transition: none !important;
}

.js-bio-media-wrap {
     overflow: hidden;
     position: relative;
}

.js-bio-media img {
     display: block;
     width: 100%;
     height: 100%;
     object-fit: cover;
     transform: scale(1.18);
     will-change: transform;
}

/* Section icônes page d'accueil */
.js-feature-icon svg {
     transform-origin: center center;
     will-change: transform, opacity;
}

/* Parallax sur l'image avant footer */
.js-parallax-bg {
     background-size: cover;
     background-repeat: no-repeat;
     background-position: 50% 50%;
}

/* Animation de flottement pour les images des ingrédients */
@keyframes float-gentle {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-14px); }
  100% { transform: translateY(0px); }
}

.ingredient-float img {
  animation: float-gentle 6s ease-in-out infinite;
  will-change: transform;
}