.header-title, h1 {
    color: #0E355B;
    position: relative;
    display: inline-block;
    padding-bottom: 8px; 
}

h1 a, h1 a:visited {
    color: #0E355B;
}

@media (max-width: 768px) {
    h1, .header-title {
        text-align: center;
    }
}

h1::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;

    width: 15%;
    height: 3px;
  
    background-image: linear-gradient(to right, #0E355B, #226C8B);
    border-radius: 2px; 
}

@media (max-width: 768px) {
    h1::after {
        left: 50%; /* On le pousse à 50% vers la droite */
        transform: translateX(-50%);
    }
}

.nav-acceuil-pc {
    background-color: #EEEFF4;
    box-shadow: 0 5px 10px -1px rgba(0, 0, 0, 0.12), 0 3px 6px -1px rgba(0, 0, 0, 0.08);
    padding: 0.8em;
    border-radius: 0.6em;
    display: flex;
    gap: 1em;
}

@media (max-width:768px) {
    .nav-acceuil-pc {
        display: none;
    }
}

.nav-acceuil-pc a {
    color: black;
    font-weight:bold;
    transition: color ease 0.3s;
    padding-bottom: 0.9em;
}

.nav-acceuil-pc a:hover {
    color:#226C8B;
    border-bottom: 3px solid #226C8B;
}

.dropdown {
    position: relative;
}

.dropdown-link {
    display: flex;
    gap: 0.5em;
    cursor: pointer;
    font-weight: bold;
    transition: all ease 0.3s;
}

.dropdown-link:hover {
    color:#226C8B;
}

.dropdown:hover .dropdown-content {
    /* display: block; */
    visibility: visible;
    opacity: 1;
}

.dropdown-content {
    /* display: none; */
    visibility: hidden;
    opacity: 0;
    margin-top: 0.8em;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    transition: all ease 0.3s;
    z-index: 999;
}

.dropdown-content::before {
    content: "";
    position: absolute;
    top: -0.8em;
    left: 0;
    right: 0;
    height: 0.8em;
    background-color: transparent;
}

.dropdown-content a {
    display: block;
    padding: 1em 1em;
    font-weight: normal;
    transition: all ease 0.3s;
}

.dropdown-content a:hover {
  background-color: #f1f1f1;
  border-bottom: none;
}

body.no-scroll {
    overflow: hidden;
    height: 100vh;
}

#nav-button-mobile {
    display: none;
    background: none;
    border: 2px solid white;
    border-radius: 6px;
    color: white;
    font-size: 1.3rem;
    cursor: pointer;
    padding: 0.2em;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    #nav-button-mobile {
        display: block;
    }
}

#nav-acceuil-mobile {
    display: none;
}

#nav-acceuil-mobile ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1em;
    gap: 1em;
    height: 100vh;
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    z-index: 9999;
    background-color: #226C8B;
}

#nav-acceuil-close-mobile {
    position: absolute;
    top: 20px;
    right: 20px;
}

#nav-acceuil-close-mobile button {
    background: none;
    border: none;
    color: #0E355B;
    cursor: pointer;
    font-weight: bold;
    padding: 10px;
}

#mobile-menu-dropdown-button {
    background-color: transparent;
    border: none;
}

#nav-acceuil-mobile a, #nav-acceuil-mobile button {
    color: white;
}

.dropdown {
    position: relative;
}

.dropdown-mobile-link {
    display: flex;
    gap: 0.5em;
    cursor: pointer;
    font-weight: bold;
}

#dropdown-mobile-content {
    visibility: hidden;
    opacity: 0;
    margin-top: 0.8em;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    transition: all ease 0.3s;
}

#dropdown-mobile-content.show {
    visibility: visible;
    opacity: 1;
}

#nav-acceuil-mobile #dropdown-mobile-content a {
    display: block;
    padding: 1em 1em;
    font-weight: normal;
    color: #0E355B;
}


header {
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    margin-bottom: 2em;
    display: flex;
    align-items: center;
    justify-content: space-around;
    /* background-color: red; */
    /* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask2622%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='url(%26quot%3b%23SvgjsLinearGradient2623%26quot%3b)'%3e%3c/rect%3e%3cpath d='M1440 0L984.9100000000001 0L1440 256.87z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M984.9100000000001 0L1440 256.87L1440 356.38L848.83 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M848.83 0L1440 356.38L1440 482.32L635.71 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M635.71 0L1440 482.32L1440 535.8L569.95 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 560L629.46 560L0 357.47z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 357.47L629.46 560L1038.54 560L0 327.26000000000005z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 327.26L1038.54 560L1077.06 560L0 223.6z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 223.60000000000002L1077.06 560L1102.36 560L0 69.28000000000003z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask2622'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3clinearGradient x1='100%25' y1='50%25' x2='0%25' y2='50%25' gradientUnits='userSpaceOnUse' id='SvgjsLinearGradient2623'%3e%3cstop stop-color='%230e2a47' offset='0'%3e%3c/stop%3e%3cstop stop-color='rgba(150%2c 177%2c 213%2c 1)' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e"); */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask2940%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='url(%26quot%3b%23SvgjsLinearGradient2941%26quot%3b)'%3e%3c/rect%3e%3cpath d='M1440 0L892.03 0L1440 32.44z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M892.03 0L1440 32.44L1440 214.92L875.8 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M875.8 0L1440 214.92L1440 420.71L643.05 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M643.05 0L1440 420.71L1440 442.72999999999996L355.11999999999995 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 560L240.08 560L0 554.18z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 554.18L240.08 560L899.0300000000001 560L0 472.37999999999994z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 472.38L899.0300000000001 560L968.33 560L0 304.81z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 304.81L968.33 560L1279.45 560L0 172.45z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask2940'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3clinearGradient x1='100%25' y1='50%25' x2='0%25' y2='50%25' gradientUnits='userSpaceOnUse' id='SvgjsLinearGradient2941'%3e%3cstop stop-color='%230e2a47' offset='0'%3e%3c/stop%3e%3cstop stop-color='rgba(163%2c 187%2c 218%2c 1)' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
    background-size: cover;
}

@media (max-width: 768px) {
    header {
        padding: 1.5em 10px;
    }
}