/* Header */



.k-header {
    min-height: max(70px, 5vw);
    z-index: 1000;
    background-color: #DBCFC3;
}

.home .k-header {
   
    background: #211E1E;
}

/* Navigation principale */
.k-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    /*background: rgba(255, 255, 255, 0.50);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(10.2px);
    -webkit-backdrop-filter: blur(10.2px);
    border: 1px solid rgba(255, 255, 255, 0.39);*/
    margin: auto;
    position: fixed;
    top: max(1rem, 1.5vw);
    left: 0;
    right: 0;
    z-index: 1000;
    gap: 2rem;
   /* position: relative;*/
}

.wrapper-main-nav{
 display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}


@media (min-width:992px){

.wrapper-main-nav{
    background: rgba(255, 255, 255, 0.50);
   /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);*/
    backdrop-filter: blur(10.2px);
    -webkit-backdrop-filter: blur(10.2px);
    border: 1px solid rgba(255, 255, 255, 0.39);
        justify-content: center;
        width: auto;

   
        border-radius: 999px;
            padding:0;
            padding: 0.5rem;
            gap: 2rem;
            position: relative;


}
}


/* Logo */
.k-logo {
    font-weight: 700;
    color: #000;
    font-size: max(1.2rem, 1.3vw);
    padding-left: 2rem;
}

.k-logo svg {
    margin-top: -6px;
    width: max(120px, 8vw);
    height: auto;
}

 .main-menu{
    display: flex;
    align-items: center;
    gap: 30px;
    list-style: none;
    padding: 0;
    margin-bottom: 0;
  }



/* LIENS */
.k-link, .k-link-cta {
    position: relative;
    z-index: 1;
    font-size: max(1rem, 1.1vw);
    text-decoration: none;
    transition: color .3s ease;
    white-space: nowrap;
}

/* Couleurs par défaut */




/* ====================================
   TABLETTE (768px - 1199px)
   ==================================== */
@media (max-width: 1199px) and (min-width: 768px) {
    .k-header {
        min-height: 80px;
    }
    
    .k-nav {
        padding: max(0.5rem, 1vw) max(1rem, 1.3vw);
        top: 1.25rem;
    }
    
    .k-logo {
        font-size: max(1.1rem, 1.5vw);
    }
    
    .k-logo svg {
        width: max(110px, 10vw);
    }
    
    .k-link, .k-link-cta {
        font-size: max(1rem, 1.3vw);
    }
}


  

/* ====================================
   TRÈS PETIT MOBILE (< 480px)
   ==================================== */
@media (max-width: 479px) {
    .k-header {
        min-height: 65px;
        padding: 0.875rem 0;
    }
    
    .k-logo {
        font-size: 1.3rem;
        padding: 0.5rem 1rem;
    }
    
    .k-logo svg {
        width: 90px;
    }
    
        
    
}

/* ====================================
   TRÈS GRAND ÉCRAN (> 1920px)
   ==================================== */
@media (min-width: 1920px) {
    .k-header {
        min-height: max(90px, 4.5vw);
    }
    
    .k-nav {
      /*  padding: max(0.8rem, 0.2vw) max(1rem, 1.2vw);*/
        top: max(1.5rem, 1.2vw);
    }
    
    .k-logo {
        font-size: max(1.3rem, 1.2vw);
    }
    
    .k-logo svg {
        width: max(130px, 7vw);
    }
    
    .k-link, .k-link-cta {
        font-size: max(1.2rem, 1vw);
    }
}

/* ====================================
   ULTRA GRAND ÉCRAN (> 2560px)
   ==================================== */
@media (min-width: 2560px) {
    .k-header {
        min-height: max(95px, 4vw);
    }
    
    .k-nav {
        top: max(1.75rem, 1vw);
    }
    
    .k-logo {
        font-size: max(1.4rem, 1.1vw);
    }
    
    .k-logo svg {
        width: max(140px, 6.5vw);
    }
    
    .k-link, .k-link-cta {
        font-size: max(1.3rem, 0.95vw);
    }
}

/* ====================================
   Protection contre le zoom
   ==================================== */
@media (min-resolution: 1.5dppx) and (min-width: 1200px) {
    .k-nav {
        /*padding: max(0.5rem, 0.8vw) max(0.9rem, 1vw);*/
        padding: 0;
    }
    
    .k-link, .k-link-cta {
        font-size: max(1rem, 1vw);
    }

    .effect-cta-header{
      padding: 5px;
    }
}




html.has-mobile-menu-open,
html.has-mobile-menu-open body {
  overflow: hidden;
}
.k-burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  width: 44px;
  height: 44px;
  position: relative;
}

.k-burger span {
  position: absolute;
  left: 50%;
  width: clamp(1.5rem, 2vw, 55px);
  height: 2px;
  background: #000;
  transform: translateX(-50%);
  transition: transform 0.4s ease, opacity 0.3s ease;
}

.k-burger span:nth-child(1) { top: 14px; }
.k-burger span:nth-child(2) { top: 21px; }
.k-burger span:nth-child(3) { top: 28px; }

/* =========================
   MENU HOVER EFFECT (DESKTOP)
   ========================= */
@media (min-width: 992px) {

  .k-link {
    position: relative;
    display: inline-block;
    overflow: hidden;
   /* line-height: 1.2;*/
    /*height: 1.2em; /* 🔑 hauteur verrouillée */
    padding: 0 10px;
  }

  .k-nav ul li{
  
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

}

  .k-link span {
    display: block;
    transition: transform 0.45s cubic-bezier(.4,0,.2,1);
  }

  .k-link:not(.contact-menu-trigger):after {
    content: attr(data-hover);
    position: absolute;
    left: 0;
    top: 0; /* 🔑 ancrage */
    width: 100%;
    transform: translateY(120%);
    color: #E1551E;
    text-align: center;
    transition: transform 0.45s cubic-bezier(.4,0,.2,1);
    pointer-events: none;
  }

  .k-link:hover span {
    transform: translateY(-120%);
  }

  .k-link:hover::after {
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .k-link,
  .k-link::after,
  .k-link span {
    transition: none;
  }
}



@media (max-width: 991px) {
     /* MENU FERMÉ – état par défaut */
  html:not(.has-mobile-menu-open) .k-logo,
  html:not(.has-mobile-menu-open) .k-burger span {
    color: #000;
  }
  .contact-menu-header .k-burger span{
        color: #000!important;

  }

  body.home .k-logo,body.home .k-burger span{
    color: #fff;
  }
 .has-mobile-menu-open body.home .k-burger span{
    color: #000;
  }
  /* SVG hérite de la couleur */
  .k-logo svg {
    color: inherit;
  }

  body.menu-reverse html:not(.has-mobile-menu-open),
  body.menu-reverse html:not(.has-mobile-menu-open) .k-logo,
  body.menu-reverse html:not(.has-mobile-menu-open) .k-burger {
    color: #000;
  }

html:not(.has-mobile-menu-open) .k-logo,
  html:not(.has-mobile-menu-open) .k-burger {
    color: #000;
  }

  .has-mobile-menu-open .k-burger span, .has-mobile-menu-open body.home .k-logo{
    color: #000;
  }

  body.home .k-logo,body.home .k-burger{
    color: #fff;
  }

  .k-logo{
        z-index: 100000;

  }


  .k-logo svg {
    display: block;
  }

  .k-burger span {
    background-color: currentColor;
  }




  /* Header redevient neutre */
  .k-header {
    position: relative;
    min-height: 70px;
  }

  /* NAV = simple conteneur */
  .k-nav {
    position: relative;
    background: none;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    padding: 0;
    max-width: none;
    width: 100%;
    justify-content: space-between;
  }

  /* Burger visible */
  .k-burger {
    display: block;
    z-index: 1200;
  }

  /* Menu fermé */
  .main-menu {
    display: none;
  }

  /* Menu ouvert plein écran */
  html.has-mobile-menu-open .main-menu {
    position: fixed;
    inset: 0;
    background: #f3efe8;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    z-index: 1100;
    animation: menuFade 0.4s ease;
  }

  .k-link,.k-link-cta {
    font-size: 1.6rem;
  }
}


@keyframes menuFade {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

html.has-mobile-menu-open .k-burger span:nth-child(1) {
  transform: translateX(-50%) translateY(7px) rotate(45deg);
}

html.has-mobile-menu-open .k-burger span:nth-child(2) {
  opacity: 0;
}

html.has-mobile-menu-open .k-burger span:nth-child(3) {
  transform: translateX(-50%) translateY(-7px) rotate(-45deg);
}

/* Animation hover *//*
html.has-mobile-menu-open .k-burger:hover span:nth-child(1) {
  transform: translateX(-50%) translateY(7px) rotate(55deg);
}

html.has-mobile-menu-open .k-burger:hover span:nth-child(3) {
  transform: translateX(-50%) translateY(-7px) rotate(-55deg);
}*/


 .effect-cta-header-2{
 display: none;
  }

@media (min-width:992px){
  .k-link-mob{
    display: none!important;
  }

  .effect-cta-header-2{
     padding: 0 24px;
  background-color: #87794C;
  border-radius: 999px;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #ffffff;
  background-color: #87794C;
       /* position: absolute;*/
    right: 0;
   /* transform: translateX(calc(100% + 30px));
    bottom: -1px;*/
   display: flex;
    align-items: center;
    
   /* position: absolute;
    right: 0;
    top: 0;
    bottom: 0; 
    transform: translateX(calc(100% + 30px));*/
}

.effect-cta-header-2 span{

flex-shrink: 1;
}

.nav-content{
  gap: 2rem;
}

}

@media (max-width:991.99px) {
  .nav-content{
    width: 100%;
  }

   .effect-cta-header{
  margin-top: 5rem;
 }
}