body{font-weight: 400;font-family: var(--web-font); color: #212529; padding-top: 96px; background-color: #fff; line-height: 1.6; font-size: 1rem; scroll-behavior: smooth;}

section.hero-section {
    background-color: var(--web-light);
    padding: 5rem 0;
    background-image: url(../img/hero-image.jpg);  
    background-size: cover;
    background-position: left;
}

section.hero-section .hero-title { font-size: 2.5rem; font-weight: 700; margin-bottom: 1rem; }

.content-title {text-align: center; font-size: 2.5rem;}

.form-control, .form-select { border-radius: 0 !important; }
.navbar-brand > img  {height: 64px;}

.btn, a, .form-control, .form-select {border-radius: 0 !important;}

a {text-decoration: none;}
a:hover{text-decoration: underline;}

.navbar-toggler {
    display: flex;
    align-items: center;
    gap: .5rem;
}

header > nav {background-color: #fff; height: 96px; padding: 0 !important; border-bottom: 1px solid var(--web-color) !important}
header > nav .nav-link {font-size: 1.1rem; padding: 1rem 1rem; text-transform: capitalize;}
header .navbar-nav, header .nav-item {height: 100%; }

header .nav-item a {height: 100%; transition: .1s ease-out; position: relative; background-color: transparent; white-space: nowrap; text-decoration: none; padding-left: 1rem !important; padding-right: 1rem !important; display:flex; align-items: center; border-bottom: 4px solid transparent}
header .nav-item a.active {border-bottom-color: var(--web-color) !important; background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.05))}
header .nav-item a:hover {border-bottom-color: rgba(0, 0, 0, 0.2); border-bottom-width: 8px;}

.section-header {padding: 4rem 0;}
.page-title {font-size: 2.4rem; line-height: 1.2; margin-bottom: 1rem;}

.has-breadcrumbs .page-title {margin-top: 1rem;}

@media only screen and (max-width: 768px) {
    body {}
}

.bg-blurred { backdrop-filter: blur(4px); background-color: rgba(255, 255, 255, 0.75); }
.btn {text-decoration: none !important;}

section.footer-cta {border-top: 1px solid rgba(0, 0, 0, 0.1)}

.fade-in { opacity: 1 !important; transform: translateY(0) !important; transition: opacity 0.4s ease, transform 0.4s ease !important; }

.btn-lg {
    text-decoration: none;
    position: relative;
    clip-path: polygon(
        0% 0%,     /* coin haut gauche biseauté */
        100% 0%,     /* coin haut droit */
        100% calc(100% - 10px), /* coin bas droit biseauté */
        calc(100% - 10px) 100%, /* coin bas droit */
        0% 100%,     /* coin bas gauche */
        0% 10px      /* coin haut gauche biseauté */
    );
    transition: background-color 0.3s ease; 
    /* background-color: var(--web-color); */
    /* padding-left: 12px !important; padding-right: 12px !important; */
}



#side-menu.offcanvas { background-color: #fff;}
#side-menu.offcanvas .offcanvas-body {display: flex;align-items: center;justify-content: center;flex-direction: column; padding: 2rem;}

ul.menu-list {list-style: none;display: flex;align-items: center; flex-direction: column; margin: 0;padding: 0;gap: .8rem;position: relative;}
ul.menu-list a {
    transition: .25s ease-out; opacity: 0; transform: translateY(10px); text-align: left; font-weight: 400; font-size: 1.4rem; padding: .25rem 0; text-decoration: none; display: block; position: relative; text-transform: uppercase; font-family: var(--web-font);
}