/* Images décoratives flottantes pour la page index */

/* Hero Section - Images de fond */
.hero-section {
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 15%;
    right: 8%;
    width: 300px;
    height: 300px;
    background: url('https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=600&q=80');
    background-size: cover;
    border-radius: 40% 60% 60% 40% / 50% 40% 60% 50%;
    opacity: 0.25;
    z-index: 0;
    pointer-events: none;
}

.hero-section::after {
    content: '';
    position: absolute;
    bottom: 15%;
    left: 5%;
    width: 250px;
    height: 250px;
    background: url('https://images.unsplash.com/photo-1555066931-4365d14bab8c?w=600&q=80');
    background-size: cover;
    border-radius: 60% 40% 40% 60% / 60% 50% 50% 40%;
    opacity: 0.2;
    z-index: 0;
    pointer-events: none;
}

/* Image décorative supplémentaire à côté de la photo de profil */
.hero-section .hero-image::before {
    content: '';
    position: absolute;
    top: 50%;
    right: -80px;
    transform: translateY(-50%);
    width: 350px;
    height: 350px;
    background: url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?w=600&q=80');
    background-size: cover;
    border-radius: 35% 65% 60% 40% / 45% 55% 45% 55%;
    opacity: 0.3;
    z-index: -1;
    pointer-events: none;
}

.hero-section .hero-image {
    position: relative;
}

/* About Section - Images décoratives */
.about-section {
    position: relative;
    overflow: hidden;
}

.about-section::before {
    content: '';
    position: absolute;
    top: 10%;
    left: 3%;
    width: 280px;
    height: 280px;
    background: url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?w=600&q=80');
    background-size: cover;
    border-radius: 50% 50% 40% 60% / 40% 60% 40% 60%;
    opacity: 0.15;
    z-index: 0;
    pointer-events: none;
}

.about-section::after {
    content: '';
    position: absolute;
    bottom: 5%;
    right: 5%;
    width: 320px;
    height: 320px;
    background: url('https://images.unsplash.com/photo-1461749280684-dccba630e2f6?w=600&q=80');
    background-size: cover;
    border-radius: 40% 60% 50% 50% / 60% 40% 60% 40%;
    opacity: 0.18;
    z-index: 0;
    pointer-events: none;
}

/* Skills Section - Images décoratives */
.skills-section {
    position: relative;
    overflow: hidden;
}

.skills-section::before {
    content: '';
    position: absolute;
    top: 20%;
    right: 10%;
    width: 260px;
    height: 260px;
    background: url('https://images.unsplash.com/photo-1550751827-4bd374c3f58b?w=600&q=80');
    background-size: cover;
    border-radius: 70% 30% 30% 70% / 30% 70% 70% 30%;
    opacity: 0.2;
    z-index: 0;
    pointer-events: none;
}

.skills-section::after {
    content: '';
    position: absolute;
    bottom: 10%;
    left: 8%;
    width: 290px;
    height: 290px;
    background: url('https://images.unsplash.com/photo-1484417894907-623942c8ee29?w=600&q=80');
    background-size: cover;
    border-radius: 30% 70% 70% 30% / 70% 30% 30% 70%;
    opacity: 0.22;
    z-index: 0;
    pointer-events: none;
}

/* Experience Section - Images décoratives */
.experience-section {
    position: relative;
    overflow: hidden;
}

.experience-section::before {
    content: '';
    position: absolute;
    top: 5%;
    left: 5%;
    width: 310px;
    height: 310px;
    background: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?w=600&q=80');
    background-size: cover;
    border-radius: 60% 40% 60% 40% / 50% 50% 50% 50%;
    opacity: 0.16;
    z-index: 0;
    pointer-events: none;
}

.experience-section::after {
    content: '';
    position: absolute;
    bottom: 15%;
    right: 7%;
    width: 270px;
    height: 270px;
    background: url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=600&q=80');
    background-size: cover;
    border-radius: 50% 50% 60% 40% / 60% 40% 50% 50%;
    opacity: 0.19;
    z-index: 0;
    pointer-events: none;
}

/* Portfolio Section - Images décoratives */
.portfolio-section {
    position: relative;
    overflow: hidden;
}

.portfolio-section::before {
    content: '';
    position: absolute;
    top: 12%;
    right: 6%;
    width: 330px;
    height: 330px;
    background: url('https://images.unsplash.com/photo-1487058792275-0ad4aaf24ca7?w=600&q=80');
    background-size: cover;
    border-radius: 45% 55% 55% 45% / 55% 45% 55% 45%;
    opacity: 0.17;
    z-index: 0;
    pointer-events: none;
}

.portfolio-section::after {
    content: '';
    position: absolute;
    bottom: 8%;
    left: 4%;
    width: 300px;
    height: 300px;
    background: url('https://images.unsplash.com/photo-1460925895917-afdab827c52f?w=600&q=80');
    background-size: cover;
    border-radius: 55% 45% 45% 55% / 45% 55% 45% 55%;
    opacity: 0.21;
    z-index: 0;
    pointer-events: none;
}

/* Contact Section - Images décoratives */
.contact-section {
    position: relative;
    overflow: hidden;
}

.contact-section::before {
    content: '';
    position: absolute;
    top: 10%;
    left: 10%;
    width: 280px;
    height: 280px;
    background: url('https://images.unsplash.com/photo-1516321318423-f06f85e504b3?w=600&q=80');
    background-size: cover;
    border-radius: 35% 65% 65% 35% / 65% 35% 65% 35%;
    opacity: 0.15;
    z-index: 0;
    pointer-events: none;
}

.contact-section::after {
    content: '';
    position: absolute;
    bottom: 12%;
    right: 8%;
    width: 290px;
    height: 290px;
    background: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=600&q=80');
    background-size: cover;
    border-radius: 65% 35% 35% 65% / 35% 65% 35% 65%;
    opacity: 0.18;
    z-index: 0;
    pointer-events: none;
}

/* Animation de flottement */
@keyframes float {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }
    33% {
        transform: translateY(-20px) rotate(3deg);
    }
    66% {
        transform: translateY(-10px) rotate(-2deg);
    }
}

/* S'assurer que les contenus sont au-dessus des images */
.hero-section .container,
.about-section .container,
.skills-section .container,
.experience-section .container,
.portfolio-section .container,
.contact-section .container {
    position: relative;
    z-index: 5;
}

/* Masquer TOUTES les images décoratives sur mobile */
@media (max-width: 991px) {
    .hero-section::before,
    .hero-section::after,
    .hero-section .hero-image::before,
    .about-section::before,
    .about-section::after,
    .skills-section::before,
    .skills-section::after,
    .experience-section::before,
    .experience-section::after,
    .portfolio-section::before,
    .portfolio-section::after,
    .contact-section::before,
    .contact-section::after {
        display: none !important;
    }
}
