/*********** RESPONSIVE ***********/

@media (max-width: 992px) {

    .body{
        overflow-x: hidden;
        width: 100%;
    }
    .hero{
        width: 100%;
    }
    .section lb {
        width: 100%;
    }
    .section {
        width: 100%;
    }
    .card-interest-all {
        width: 100%;
    }
    .skillcard-all {
        flex-direction: column; /* Passe de ligne à colonne */
        align-items: center; /* Centre les éléments horizontalement */
        justify-content: space-between; /* Aligne les cartes verticalement */
    }
    .skillcard {
        margin-top: 30px;
    }
    .onmartop {
        margin-top: 30px;
    }
    .mobmar40 {
        margin:30px 0;
    }
    .padleft30 {
        padding-left: 0;
    }
    .section {
        padding:4rem 0;
    }
    .transparent-header {
        background-color: #1c0f2a !important;
        padding: 10px 10px !important;
    }
    .header .dropdown-menu {
        min-width: auto;
    }
    .navbar-toggler-right {
        top:17px;
        cursor: pointer;
    }
    .hero h2 {
        font-size: 44px;
    }
    .tagline-v2 h3 {
        font-size: 22px;
        line-height: 28px;
    }
    .tagline-v2 p {
        font-size: 14px;
        line-height: 24px;
    }
    .foot-link ul li {
        font-size: 13px;
        margin-right: 6px;
    }
    .foot-link ul li::after {
        font-size: 11px;
    }
    body, p {
        font-size: 14px;
        line-height: 1.6;
    }

    .insta-box {
        width: 15%;
        margin-bottom: 10px;
        padding:4px;
    }

    .modal {
        width:80%;
    }

    .ModalPdf {
        width:80%;
    }

    .card-header-project {
        display: block !important;
    }

    .illustration-img {
        max-width: 90% !important;
        box-shadow: none !important;
    }
}

@media screen and (max-width: 768px) {

    .body{
        overflow-x: hidden;
        width: 100%;
    }
    .media-body {
        width: 100%;
    }
    .profil-container {
        margin-left: 10px;
        margin-right: 10px;
    }
    .hero{
        width: 100%;
    }
    .section lb {
        width: 100%;
    }
    .section {
        width: 100%;
    }
    .timeline{
        /*display:none;*/
    }
    .timeline ul li div {
        position: initial;
        width: 320px;
    }
    .card-interest-all {
        width: 100%;
    }
    .skillcard-all {
        flex-direction: column; /* Passe de ligne à colonne */
        align-items: center; /* Centre les éléments horizontalement */
        justify-content: space-between; /* Aligne les cartes verticalement */
    }
    .skillcard {
        margin-top: 30px;
    }
    .grd7 {
        background-color: #f32e59 !important;
        background-image: none !important; 
    }
    .testimonial_desc:after {
        display: none;
    }
    .testi-style-01 img {
        float: none !important;
        margin-bottom: 20px;
    }
    .mobmar30 {
        margin:30px 0;
    }

    .mobmartop30 {
        margin-top: 30px;
    }
    .mega-menu-items {
        padding:1rem 2rem !important; 
    }
    .hero h2 {
        font-size: 34px;
    }
    .atom {
        scale: 1.5;
    }
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl {
        padding: 0px;
    }
    .btn btn-primary btn-sm withradius secbtn withicon {

    }
    .timeline ul li.in-view::after {
        display: none;
    }
    .timeline ul li div::before {
        display: none;
    }
    .card-interest {
        margin-top: 50px !important;
    }
    .interest-body {
        flex-direction: column;
    }
    .img-interest {
        width: 100% !important;
        order: -1;
    }
    .interest-content-l {
        width: 100% !important;
        margin-left: 0 !important;
        order: 0;
    }
    .interest-content-r {
        width: 100% !important;
        margin-right: 0 !important;
        order: 0;
    }
    .project {
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding-right: 15px;
        padding-left: 15px;
        flex-direction: column;
    }

    .card {
        width: 100% !important;
        height: auto !important;
        margin-bottom: 35px !important;
        margin-right: 0 !important;
    }

    .card-button {
        width: 60% !important;
        font-size: 0.8rem !important;
    }

    .img-project.card-header {
        display: none !important;
    }

    .card-header-project-text {
        margin-right: 0 !important;
    }

    .card-text-project-table {
        overflow-x: auto;
        max-width: 100%;
    }

    .card-intro {
        width: 100%;
        min-width: 600px; /* largeur minimale pour forcer le scroll sur petit écran */
        border-collapse: collapse;
    }

    .card-intro th,
    .card-intro td {
        border: 1px solid #ddd;
        padding: 12px;
        vertical-align: top;
        text-align: left;
    }

    .card-intro ul {
        margin: 0;
        padding-left: 18px;
    }

    .card-intro li {
        margin-bottom: 6px;
        line-height: 1.4em;
    }

    .doc-filters {
        flex-direction: column !important;
        height: auto !important;
    }

    .doc-filter-btn {
        width: 45% !important;
    }

    .doc-card-line {
        flex-direction: column !important;
    }

    .doc-card {
        width: 95% !important;
    }

    .doc-btn a span {
        font-size: 8px !important;
    }

    /* Optionnel : juste afficher l’icône centrée */
    .doc-btn a i {
        margin: 0;
    }


}

@media (min-width: 992px) {
    .header .dropdown-menu {
        margin-top: 13px;
    }
    .header .navbar-nav .has-submenu {
        position: static;
    }
    .header .navbar-nav .has-submenu:hover > ul {
        visibility: visible;
        opacity: 1;
        top: 100%;
    }
    .header .navbar-nav .has-submenu:hover > ul li ul {
        margin-top: -1px;
    }

    .header .navbar-nav .has-submenu ul {
        -webkit-transition: visibility 0.35s ease-in-out, opacity 0.35s ease-in-out, top 0.35s ease-in-out, bottom 0.35s ease-in-out, left 0.35s ease-in-out, right 0.35s ease-in-out;
        -moz-transition: visibility 0.35s ease-in-out, opacity 0.35s ease-in-out, top 0.35s ease-in-out, bottom 0.35s ease-in-out, left 0.35s ease-in-out, right 0.35s ease-in-out;
        -o-transition: visibility 0.35s ease-in-out, opacity 0.35s ease-in-out, top 0.35s ease-in-out, bottom 0.35s ease-in-out, left 0.35s ease-in-out, right 0.35s ease-in-out;
        transition: visibility 0.35s ease-in-out, opacity 0.35s ease-in-out, top 0.35s ease-in-out, bottom 0.35s ease-in-out, left 0.35s ease-in-out, right 0.35s ease-in-out;
    }
    .header .navbar-nav .has-submenu .dropdown-menu {
        padding: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
    }
    .header .navbar-nav .has-submenu > ul {
        position: absolute;
        top: 130%;
        visibility: hidden;
        display: block;
        opacity: 0;
        left: auto;
    }
    .header .navbar-nav .has-submenu > ul li {
        position: relative;
    }
    .header .navbar-nav .has-submenu > ul li:hover > ul {
        visibility: visible;
        opacity: 1;
        left: 100%;
    }

    .header .navbar-nav .has-submenu > ul li ul {
        position: absolute;
        top: 0;
        visibility: hidden;
        display: block;
        opacity: 0;
        left: 130%;
    }
    .header .navbar-nav .has-submenu > ul li ul.show-right {
        right: 130%;
        left: auto;
    }

}