body {
    font-family: 'Inter', sans-serif;
}

.font-mono {
    font-family: 'JetBrains Mono', monospace;
}

.font-handwritten {
    font-family: 'Kalam', cursive;
}

.bg-dark-primary {
    background-color: #09090b;
}

.bg-dark-secondary {
    background-color: #18181b;
}

.bg-dark-card {
    background-color: #18181b;
}

.text-accent-coral {
    color: #FF7F50;
}

.border-accent-coral {
    border-color: #FF7F50;
}

.bg-accent-coral {
    background-color: #FF7F50;
}

.hover\:bg-accent-coral-dark:hover {
    background-color: #E66A40;
}

.card-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(255, 127, 80, 0.15);
    border-color: rgba(255, 127, 80, 0.3);
}

.glow-on-hover-coral:hover {
    box-shadow: 0 0 30px rgba(255, 127, 80, 0.3);
}


.mobile-menu {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.3s ease-out,
                transform 0.3s ease-out;
}

.mobile-menu.active {
    max-height: 500px;
    opacity: 1;
    transform: translateY(0);
}

/* Animation pour les liens du menu mobile */
.mobile-menu .flex-col a {
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

.mobile-menu.active .flex-col a {
    opacity: 1;
    transform: translateX(0);
}

/* Délais en cascade pour chaque lien */
.mobile-menu.active .flex-col a:nth-child(1) {
    transition-delay: 0.1s;
}

.mobile-menu.active .flex-col a:nth-child(2) {
    transition-delay: 0.15s;
}

.mobile-menu.active .flex-col a:nth-child(3) {
    transition-delay: 0.2s;
}

.mobile-menu.active .flex-col a:nth-child(4) {
    transition-delay: 0.25s;
}

/* Animation de l'icône hamburger -> X */
#mobile-menu-btn {
    position: relative;
    transition: transform 0.3s ease;
}

#mobile-menu-btn:active {
    transform: scale(0.95);
}

.certification-logo {
    opacity: 0.7;
    transition: all 0.3s ease;
}

.group:hover .certification-logo {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

.tooltip-text {
    position: absolute;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #18181b;
    color: #d4d4d8;
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #3f3f46;
    font-size: 14px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 10;
}

.group:hover .tooltip-text {
    opacity: 1;
    visibility: visible;
}

/* === NOUVELLES ANIMATIONS AU SCROLL === */

/* Animation de fade-in depuis le bas */
.scroll-animate {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-animate.active {
    opacity: 1;
    transform: translateY(0);
}

/* Animation depuis la gauche */
.scroll-slide-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-slide-left.active {
    opacity: 1;
    transform: translateX(0);
}

/* Animation depuis la droite */
.scroll-slide-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-slide-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* Animation de scale (zoom) */
.scroll-scale {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-scale.active {
    opacity: 1;
    transform: scale(1);
}

/* Animation en cascade pour les éléments enfants */
.scroll-stagger>* {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-stagger.active>*:nth-child(1) {
    transition-delay: 0.1s;
}

.scroll-stagger.active>*:nth-child(2) {
    transition-delay: 0.2s;
}

.scroll-stagger.active>*:nth-child(3) {
    transition-delay: 0.3s;
}

.scroll-stagger.active>*:nth-child(4) {
    transition-delay: 0.4s;
}

.scroll-stagger.active>*:nth-child(5) {
    transition-delay: 0.5s;
}

.scroll-stagger.active>*:nth-child(6) {
    transition-delay: 0.6s;
}

.scroll-stagger.active>* {
    opacity: 1;
    transform: translateY(0);
}

/* Effet de rotation subtile */
.scroll-rotate {
    opacity: 0;
    transform: rotate(-5deg) scale(0.95);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-rotate.active {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

/* Effet parallaxe léger sur le hero */
.parallax-slow {
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Dans styles.css */
#services {
    position: relative;
    overflow: hidden;
}

#services::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('https://images.unsplash.com/photo-1682439735724-97b0f8f2a518?ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80&w=2525?q=80&w=1920&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
   /* opacity: 0.03;*/
    z-index: 0;
}

#services > .container {
    position: relative;
    z-index: 1;
}

/* Dans styles.css */
#expertise {
    position: relative;
    overflow: hidden;
}

#expertise::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('https://images.unsplash.com/photo-1682439735724-97b0f8f2a518?ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80&w=2525?q=80&w=1920&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
    /*opacity: 0.04;*/
    z-index: 0;
}

#expertise > .container {
    position: relative;
    z-index: 1;
}