/*====================================
        TABLETTE (≤ 991px)
====================================*/

@media (max-width:991px){

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

    .top-bar{

        display:none;

    }

    .logo img{

        height:60px;

    }

    .main-navbar{

        padding:15px 0;

    }

    .navbar-nav{

        padding-top:20px;

        gap:0;

    }

    .nav-item{

        margin-bottom:15px;

    }

    .btn-admission{

        display:block;

        text-align:center;

    }

    /*================ HERO ================*/

    .hero{

        height:auto;

        padding:150px 0;

    }

    .hero h1{

        font-size:42px;

    }

    .hero p{

        font-size:18px;

    }

    .hero-buttons{

        flex-direction:column;

    }

    /*================ ABOUT ================*/

    .about-content{

        padding-left:0;

        margin-top:60px;

    }

    .about-list{

        grid-template-columns:1fr;

    }

    .experience-box{

        right:20px;

        bottom:20px;

        padding:18px;

    }

    .about-content h2{

        font-size:32px;

    }

    /*================ FORMATIONS ================*/

    .page-hero{

        height:auto;

        padding:130px 0 70px;

    }

    .page-hero h1{

        font-size:42px;

    }

}
/*====================================
        MOBILE (≤768px)
====================================*/

@media (max-width:768px){

    body{

        padding-top:90px;

    }

    /* HERO */

    .hero{

        padding:120px 0 80px;

        text-align:center;

    }

    .hero h1{

        font-size:34px;

    }

    .hero p{

        font-size:16px;

    }

    /* PAGE FORMATIONS */

    .page-hero{

        text-align:center;

        padding:120px 0 60px;

    }

    .page-hero h1{

        font-size:32px;

    }

    .hero-description{

        font-size:16px;

    }

    .training-domains{

        padding:40px 0 20px;

    }

    .bts-section{

        padding:20px 0 50px;

    }

    .domain-card{

        padding:30px;

    }

    .custom-accordion .accordion-button{

        font-size:17px;

        padding:18px;

    }

}
/*====================================
        PETITS MOBILES (≤576px)
====================================*/

@media (max-width:576px){

    .hero h1{

        font-size:28px;

    }

    .page-hero h1{

        font-size:26px;

    }

    .section-title h2{

        font-size:24px;

    }

}

/*====================================
        AJUSTEMENTS GLOBAUX
====================================*/

html,
body{
    overflow-x:hidden;
}

@media (max-width:991px){

    .main-navbar .navbar-collapse{
        margin-top:14px;
        padding:18px 20px;
        background:#fff;
        border-radius:12px;
        box-shadow:0 12px 28px rgba(8,31,77,.12);
    }

    .main-navbar .navbar-nav{
        align-items:stretch;
    }

    .main-navbar .nav-item{
        margin-bottom:0;
    }

    .main-navbar .nav-link{
        padding:11px 0;
    }

    .main-navbar .btn-admission{
        margin-top:10px;
    }

    .hero{
        background-attachment:scroll;
    }

    .history,
    .mission-section,
    .organisation,
    .formations,
    .admission,
    .why-us,
    .contact-section,
    .admission-section{
        padding:60px 0;
    }

    .history-content{
        padding-left:0;
        margin-top:40px;
    }

    .history-image img{
        height:420px;
    }

    .contact-form-wrapper,
    .admission-form-wrapper{
        padding:35px;
    }

    .footer{
        padding-top:55px;
    }

    .footer .row > div{
        margin-bottom:35px;
    }

    .footer-bottom{
        margin-top:15px;
    }
}

@media (max-width:768px){

    body{
        padding-top:0;
    }

    .main-navbar{
        padding:10px 0;
    }

    .logo img{
        height:52px;
    }

    .navbar-toggler{
        padding:7px 10px;
    }

    .hero,
    .page-hero{
        min-height:0;
    }

    .hero{
        padding:100px 0 75px;
    }

    .hero h1,
    .page-content h1{
        font-size:36px;
    }

    .hero p,
    .page-content p,
    .admission p{
        font-size:16px;
        line-height:1.7;
    }

    .hero-buttons,
    .admission-buttons{
        gap:12px;
    }

    .hero-buttons a,
    .btn-primary-custom,
    .btn-secondary-custom,
    .btn-light-custom,
    .btn-outline-light-custom{
        width:100%;
        max-width:none;
    }

    .about-section,
    .formations,
    .admission,
    .why-us,
    .history,
    .mission-section,
    .organisation,
    .contact-section,
    .admission-section{
        padding:50px 0;
    }

    .about-image img,
    .history-image img{
        height:320px;
    }

    .about-content{
        margin-top:35px;
    }

    .about-content h2,
    .history-content h2,
    .section-title h2,
    .admission h2,
    .contact-form-wrapper h2,
    .admission-form-wrapper h2{
        font-size:30px;
    }

    .formations-grid{
        margin-top:35px;
    }

    .formation-row{
        gap:18px;
        margin-bottom:18px;
    }

    .formation-card{
        width:min(100%, 360px);
    }

    .history-box{
        gap:15px;
        margin:25px 0;
    }

    .mission-card,
    .org-card{
        padding:32px 25px;
    }

    .contact-form-wrapper,
    .admission-form-wrapper{
        margin-top:40px;
        padding:28px 22px;
        border-radius:16px;
    }

    .contact-form,
    .admission-form{
        margin-top:25px;
        padding:25px 20px;
    }

    .custom-accordion .accordion-body{
        padding:25px 20px;
    }

    .footer-logo{
        width:200px;
    }

    .footer-bottom{
        gap:15px;
        padding:20px 0;
    }
}

@media (max-width:576px){

    .container{
        padding-left:18px;
        padding-right:18px;
    }

    .hero{
        padding:80px 0 60px;
    }

    .hero h1,
    .page-content h1{
        font-size:29px;
    }

    .subtitle,
    .section-subtitle,
    .page-content span,
    .admission-subtitle{
        font-size:12px;
        padding:7px 13px;
    }

    .page-hero{
        padding:80px 0 50px;
    }

    .page-hero h1{
        font-size:29px;
    }

    .page-hero p{
        font-size:15px;
    }

    .about-image img,
    .history-image img{
        height:250px;
    }

    .about-content h2,
    .history-content h2,
    .section-title h2,
    .admission h2,
    .contact-form-wrapper h2,
    .admission-form-wrapper h2{
        font-size:26px;
    }

    .history-box{
        flex-direction:column;
    }

    .history-box h3{
        font-size:28px;
    }

    .domain-card,
    .admission-card,
    .contact-card{
        padding:26px 20px;
    }

    .custom-accordion .accordion-button{
        align-items:flex-start;
        font-size:15px;
        line-height:1.4;
        padding:16px;
    }

    .custom-accordion .accordion-button i{
        margin-top:3px;
    }

    .footer{
        padding-top:45px;
    }

    .footer-logo{
        width:180px;
    }

    .footer h4{
        font-size:20px;
    }

    .footer-bottom{
        align-items:flex-start;
        flex-direction:column;
    }

    .footer-bottom span{
        margin:0 6px;
    }
}