@media (max-width: 1401px) {
     .hero-content {
         margin-top: 8rem;
     }

     .card1 {
         top: 260px;
         left: -20px;
     }
 }

 @media (max-width: 1379px) {}

 @media (max-width: 1320px) {
     .header-grid {
         justify-content: space-around !important;
     }

     .nav-desktop {
         gap: 20px;
     }

     .nav-desktop ul {
         gap: 20px;
     }

     .nav-desktop .nav-lks {
         font-size: 1rem;
     }

     .actions {
         gap: 10px;
     }

     .services-dropdown-menu {
         width: 400px;
     }

     /* .button {
         padding: 15px 20px;
     } */

     .hero-title,
     .banner-text .banner-title,
     .section-title {
         font-size: 2.5rem;
     }

     .hero-right {
         max-width: 360px;
     }

     .card-inner .number {
         font-size: 25px;
     }

     .card-inner .denomination {
         font-size: 12px;
     }

     .card-banner i {
         font-size: 15px;
         border-radius: 6px;
     }

     .card-banner {
         padding: 10px;
         border-radius: 10px;
         gap: 5px;
     }

     .card1 {
         top: 200px;
         left: -30px;
     }

     .card2 {
         top: 230px;
         right: -15px;
     }

     .card3 {
         bottom: 80px;
         left: 80px;
     }

     .search-bar {
         border-radius: 10px;
     }

     .search-field {
         padding: 5px;
     }

     .search-btn {
         border-radius: 10px;
     }

     .search-btn {
         font-size: 0.8rem;
     }

     .card h3 {
         font-size: 20px;
     }

     .banner-text .banner-description {
         font-size: 1.3rem;
         margin-bottom: 1.5rem;
     }
 }

 @media (max-width: 1201px) {
     .expertise-section {
         padding: 80px 0%;
         margin: 0 0 2rem 0;
     }

     .card-innerr {
         row-gap: 15px;
     }

     .card {
         padding: 15px;
     }

     .search-bar {
         margin-top: 1rem;
     }

     section {
         padding: 40px 1%;
     }

     /* .swiper-testimonial-slide {
         width: 40% !important;
     } */
 }

 @media (max-width: 999px) {
     :root {
         --container-max: 72rem;
     }

     .nav-desktop {
         display: none;
     }

     .hamburger {
         display: flex;
     }

     .mobile-dropdown {
         width: 100%;
     }

     .button {
         width: 100%;
         min-height: 5rem;
         font-size: 1.5rem;
     }

     .dropdown-menu {
         width: 100%;
         align-items: center;
     }

     .mobile-btn-box .button {
         font-size: 1.5rem;
         min-height: 5rem;
     }

     .hero-content {
         flex-direction: column;
     }

     .hero-left {
         margin: 5rem 0;
     }

     .container,
     .container-fluid,
     .container-lg,
     .container-md,
     .container-sm,
     .container-xl,
     .container-xxl {
         max-width: 95%;
     }

     .hero-right {
         max-width: 500px;
     }

     .hero-title br {
         display: none;
     }

     .cards-container {
         overflow-x: auto;
         justify-content: flex-start;
         padding-bottom: 20px;
         padding-left: 20px;
         padding-right: 20px;
     }

     .btn-exp {
         width: 50%;
     }

     .cards-container::-webkit-scrollbar {
         height: 6px;
         margin: 1rem 0 0 0;
     }

     .cards-container::-webkit-scrollbar-thumb {
         background-color: #154420;
         border-radius: 10px;
     }

     .card {
         min-width: 220px;
         flex-shrink: 0;
     }

     .banner {
         background-position: -50% 50%;
         background-size: cover;
     }

     .banner-overlay {
         background: linear-gradient(89deg,
                 rgba(0, 7, 5, 1), rgba(21, 68, 32, 1)53%, rgba(0, 0, 0, 0)80%, transparent 100%);
     }

     .banner-text {
         max-width: 80%;
     }

     .banner-text .banner-title {
         font-size: 2rem;
         width: 80%;
     }

     .banner-text .banner-title br {
         display: none;
     }

     .banner-content {
         max-width: 100%;
         margin: 0;
         padding: 0;
     }

     .banner-text .banner-description br {
         display: none;
     }

     .profile-card {
         max-width: 90%;
     }

     .pro-swiper-slide {
         height: 440px;
     }

     .score {
         padding: 7px;
         font-size: 1rem;
         border-radius: 4px;
     }

     .custom-input {
         padding: 40px 25px;
         font-size: 18px;
     }

     .cta-box {
         border-radius: 20px;
     }

     .cta-box .button {
         width: auto;
     }

     .newsletter-form input {
         padding: 32px 15px;
         border-radius: 12px 12px 0 0;
     }

     .footer-btn {
         border-radius: 0 0 12px 12px;
         min-height: 4rem;
         font-size: 1.2rem;
     }

     .team-cards-wrapper {
         display: flex;
         overflow-x: auto;
         gap: 10px;
         scroll-snap-type: x mandatory;
         padding-bottom: 10px;
         scroll-behavior: smooth;
     }

     .team-card {
         flex: 0 0 400px;
         /* largeur fixe des cards */
         scroll-snap-align: start;
     }

     /* Optionnel : cacher scrollbar */
     .team-cards-wrapper::-webkit-scrollbar {
         display: none;
     }

     .team-card {
         padding: 0;
     }

     .pn-team {
         font-size: 22px;
     }
 }

 @media (min-width: 768px) {
     .footer__container {
         grid-template-columns: 1fr 1.2fr 1.5fr;
     }
 }

 @media (max-width: 769px) {
     .card-inner .number {
         font-size: 1.5rem;
     }

     .expertise-section {
         padding: 50px 0%;
     }

     .banner-overlay {
         background: linear-gradient(89deg,
                 rgba(0, 7, 5, 1), rgba(21, 68, 32, 1)60%, rgba(0, 0, 0, 0)100%, transparent 100%);
     }

     .banner-text {
         max-width: 100%;
     }

     .banner {
         background-position: 50% 50%;
     }

     .banner-text .banner-description {
         font-size: 1.1rem;
         width: 70%;
     }

     .section-subtitle {
         max-width: 60%;
     }

     .card .card-btn {
         padding: 10px 15px;
         font-size: 0.5rem;
         border-radius: 0.5rem;
         min-height: 2rem;
     }

     .btn-exp {
         width: 30%;
     }

     .profil-body-content {
         justify-content: space-around;
     }

     .left-profil {
         width: 70%;
     }

     .newsletter-form input {
         padding: 20px 25px;
     }

     .cta-box {
         text-align: center;
         padding: 3rem !important;
     }

     .cta-text {
         line-height: 1.2;
         margin: 0.3rem 0 1rem 0;
     }

     .contact-title,
     .contact-text,
     .contact-info {
         text-align: center;
     }

     .contact-section {
         margin-top: -60px;
         padding-top: 100px;
     }

     .button {
         min-height: 4rem;
         font-size: 1.3rem;
     }

     .footer__links {
         align-items: start !important;
     }

     .footer__socials a {
         width: 30px;
         height: 30px;
     }

     .footer__socials i {
         font-size: 20px;
     }

     .form-sumbit-btn {
         min-height: 6rem;
     }

     .logo-client {
         max-height: 100%;
     }

     /* .fonction-name {
         justify-content: end !important;
     } */

     .fn-content {
         margin-left: 0;
         /* width: 50%; */
         /* align-items: end !important; */
     }

     /* .testimonial-card {
         width: 95%;
     } */
     .testimonial-user h6 {
         font-size: 18px;
     }

     .testimonial-user span {
         font-size: 12px;
     }
 }

 @media (max-width: 500px) {
     .mobile-menu {
         right: -90%;
         width: 90%;
         padding: 100px 20px 20px 20px;
     }

     .mobile-content {
         gap: 50px;
         padding: 0 20px 0 20px;
     }

     .hamburger span {
         height: 5px;
         width: 35px;
     }

     .logo-content {
         width: 70px;
     }

     .mobile-nav .nav-lks {
         font-size: 1.5rem;
     }

     .mobile-submenu .nav-lks {
         font-size: 1rem;
     }

     .mobile-nav {
         gap: 20px;
     }

     .mobile-contact {
         font-size: 1.2rem;
     }

     .mobile-contact p i {
         margin-right: 5px;
         margin-bottom: 8px;
         background: rgba(255, 255, 255, 0.183);
         padding: 5px;
         width: 50px;
         height: 50px;
         border-radius: 8px;
         display: flex;
         align-items: center;
         justify-content: center;
     }

     .mobile-nav {
         gap: 35px;
     }

     .hero-title {
         font-size: 2rem;
     }

     .hero-title br {
         display: none;
     }

     .mobile-contact p {
         font-size: 1.5rem;
         display: flex;
         flex-direction: column;
     }

     .search-bar {
         flex-direction: column;
         gap: 15px;
     }

     .search-field {
         width: 100%;
         border-right: 0;
         border-bottom: 1px solid #ddd;
     }

     .search-btn {
         font-size: 1.1rem;
         width: 100%;
     }

     .text-slider {
         min-height: 100%;
         margin-bottom: 2rem;
     }

     .hero-left {
         height: 100%;
         width: 100%;
         position: relative;
     }

     .card1 {
         top: 235px;
         left: 0px;
     }

     .card2 {
         top: 260px;
         right: 0px;
     }

     .card3 {
         bottom: 60px;
         left: 93px;
     }

     .banner-text .banner-title {
         font-size: 1.5rem;
         width: 100%;
     }

     .banner-text .banner-description {
         font-size: 1rem;
     }

     .section-title {
         font-size: 1.8rem;
     }

     .hero-text {
         font-size: 1rem;
     }

     .banner {
         height: 350px;
     }

     .mySwiper {
         width: 100%;
         padding: 40px 0 20px 0;
     }

     .pro-swiper-slide {
         height: 350px;
     }

     .location {
         font-size: 0.8rem;
     }

     .left-profil {
         width: 90%;
     }

     .profile-name {
         width: 100%;
         font-size: 18px;
     }

     .right-profil {
         gap: 25px;
     }

     .profile-card {
         border-radius: 15px;
     }

     .job {
         padding: 5px 8px;
         border-radius: 4px;
         font-size: 10px;
     }

     .section-header {
         margin-bottom: 20px;
     }

     .section-subtitle {
         max-width: 100%;
     }

     .cta-box {
         padding: 2rem !important;
         background: linear-gradient(181deg, #EDC500 60%, #000000 96% 100%);
     }

     .contact-title {
         font-size: clamp(1.5rem, 7vw, 3.2rem);
     }

     .button {
         border-radius: 8px;
     }

     .contact-title,
     .contact-text,
     .contact-info {
         text-align: left;
     }

     section {
         padding: 30px 1%;
     }

     .clients {
         margin-bottom: 0rem;
     }
 }

 @media (max-width: 426px) {
     .profile-card {
         max-width: 99%;
     }
 }

 @media (max-width: 376px) {
     .card1 {
         top: 140px;
         left: 0px;
     }

     .card2 {
         top: 200px;
         right: 0px;
     }

     .card3 {
         bottom: 40px;
         left: 70px;
     }

     .card-inner .number {
         font-size: 1.2rem;
     }

     .card-inner .denomination {
         font-size: 10px;
     }

     .card-banner i {
         font-size: 10px;
         border-radius: 5px;
         padding: 5px;
     }

     .mobile-contact p {
         font-size: 1.3rem;
     }
 }

 @media (max-width: 340px) {

     .mobile-menu {
         padding: 15px;
     }

     .mobile-contact {
         font-size: 12px;
     }

     .location {
         font-size: 0.6rem;
     }
 }