/* =====================================
   LANDING PAGE
===================================== */

html {
    scroll-behavior: smooth;
}

.section-subtitle {
    color: #6b7280;
}

.section-title{
    font-size:2.25rem;
    font-weight:700;
    text-align:center;
    margin-bottom:3rem;
}

.feature-card{
    background:#fff;
    border-radius:1rem;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.3s ease;
}

.feature-card:hover{
    transform:translateY(-8px);
}

.product-card{
    background:#fff;
    border-radius:1rem;
    overflow:hidden;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.3s ease;
}

.product-card img{
    width:100%;
    height:240px;
    object-fit:cover;
}

.product-card:hover{
    transform:translateY(-8px);
}

#temoignageCarousel .carousel-inner{
    min-height: 320px;
}

#temoignageCarousel .carousel-item{
    padding: 5px;
}

#temoignageCarousel .carousel-item.active,
#temoignageCarousel .carousel-item-next,
#temoignageCarousel .carousel-item-prev {
    display: flex;
    align-items: stretch;
    width: 100%;
}

/* La carte témoignage s'étire pour remplir la hauteur du slide */
.testimonial-card {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 15px 30px rgba(0,0,0,.08);
    display: flex;
    flex-direction: column;
    justify-content: center;  /* centre verticalement le contenu court */
    width: 100%;
    min-height: 260px;        /* hauteur minimale identique pour toutes les cartes */
}

.stat-card{
    background:#fff;
    border-radius:1.5rem;
    padding:2.5rem;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.3s ease;
}

.stat-card:hover{
    transform:translateY(-8px);
}

@keyframes float {
    0% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0); }
}

@keyframes glow {
    0% {
        filter: drop-shadow(0 0 5px rgba(34,197,94,.3));
    }
    50% {
        filter: drop-shadow(0 0 25px rgba(34,197,94,.7));
    }
    100% {
        filter: drop-shadow(0 0 5px rgba(34,197,94,.3));
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-float {
    animation: float 5s ease-in-out infinite;
}

.animate-logo-glow {
    animation: glow 3s infinite ease-in-out;
}

.animate-fade-in-up {
    animation: fadeInUp 1s ease forwards;
}

/* ================================================
   NAVBAR LANDING
================================================ */

/* ================================================
   NAVBAR LANDING
================================================ */

header{
    background:#fff;
    border-bottom:1px solid #eef2f7;
    box-shadow:0 2px 10px rgba(0,0,0,.04);
}

header .container{
    position:relative;
    padding-top:0;
    padding-bottom:0;
}

.nav-wrapper{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:78px;
    width:100%;
    position: relative;
}

.nav-logo{
    display:flex;
    align-items:center;
    flex-shrink:0;
}

.nav-logo img{
    height:70px;
    width:auto;
}

.nav-desktop{
    display:flex;
    align-items:center;
    margin-left:auto;
    gap:40px;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:30px;
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:14px;
}

/* Bouton hamburger */

.nav-hamburger{
    display:none;
    margin-left:auto;

    width:44px;
    height:44px;

    border:none;
    border-radius:12px;

    background:#f0fdf4;
    color:#16a34a;

    font-size:22px;

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

    cursor:pointer;

    transition:.25s;
}

.nav-hamburger:hover{
    background:#dcfce7;
}

.nav-hamburger.is-open{
    background:#dcfce7;
}

/* Liens */

.nav-link{
    position:relative;
    text-decoration:none;
    color:#374151;
    font-weight:500;
    transition:.25s;
}

.nav-link::after{
    content:'';
    position:absolute;
    left:0;
    bottom:-6px;
    width:0;
    height:2px;
    background:#16a34a;
    transition:.25s;
}

.nav-link:hover{
    color:#16a34a;
}

.nav-link:hover::after,
.nav-link.active::after{
    width:100%;
}

.nav-link.active{
    color:#16a34a;
}

/* Dropdown utilisateur */

#user-dropdown{
    animation:dropIn .2s ease;
}

@keyframes dropIn{

    from{
        opacity:0;
        transform:translateY(-8px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

/* Menu mobile */

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

#mobile-menu{
    padding:10px;
    display: none;
    background: #fff;
    border-top: 1px solid #f0fdf4;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 999;
}
#mobile-menu.is-open {
    display: block;       /* visible quand ouvert */
}

.mobile-user{
    padding:14px 18px;
    background:#f9fafb;
    border-radius:14px;
    margin:6px 8px 10px;
}

.mobile-user-name{
    font-size:16px;
    font-weight:700;
    color:#111827;
}

.mobile-user-role{
    display:inline-block;
    margin-top:6px;
    padding:3px 10px;
    border-radius:30px;
    background:#dcfce7;
    color:#15803d;
    font-size:12px;
    font-weight:600;
}

.mobile-user-email{
    display:block;
    margin-top:8px;
    color:#6b7280;
    font-size:13px;
}

.mobile-link{
    display:flex;
    align-items:center;
    gap:16px;
    padding:14px 18px;
    margin:2px 0;
    border-radius:12px;
    font-size:15px;
    font-weight:500;
    color:#374151;
    text-decoration:none;
    transition:.2s;
}

.mobile-link i{
    width:22px;
    text-align:center;
    color:#16a34a;
    font-size:18px;
}

.mobile-link:hover{
    background:#f0fdf4;
    color:#16a34a;
}

.mobile-divider{
    height:1px;
    background:#e5e7eb;
    margin:10px 8px;
}

/* Responsive */

@media(max-width:1024px){

    .nav-desktop{
        display:none;
    }

    .nav-hamburger{
        display:flex;
    }

}

@media(min-width:1025px){

    .nav-hamburger{
        display:none !important;
    }

    .nav-desktop{
        display:flex !important;
    }

    #mobile-menu{
        display:none !important;
    }

}