/* Footer video background */
.footer-video-bg {
    position: relative;
    overflow: hidden;
}

.footer-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}


.footer-video-bg .container,
.footer-video-bg .copyright-area-8 {
    position: relative;
    z-index: 2;
}

/* Hero: center title vertically in remaining space */
.hero-8-content .content-first {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Fill text left-to-right on hover */
.side-info-4 .offcanvas-4 .contact-item .nav-list li a.fill,
.nav-list a.fill,
.socail-media a.fill {
    display: inline-block;
    /* background-clip:text rogne les jambages (p,g,…) qui dépassent sous la
       line-box ; un line-height généreux les fait tenir dans la zone peinte */
    line-height: 1.2;
    /* letter-spacing du thème = -4.5px (très serré) ; on détend pour aérer les mots horizontalement */
    letter-spacing: 0;
    background: linear-gradient(to right, #8B5E3C 50%, #ffffff 50%);
    background-size: 200% 100%;
    background-position: right;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: background-position 0.4s ease;
}

.side-info-4 .offcanvas-4 .contact-item .nav-list li a.fill:hover,
.nav-list a.fill:hover,
.socail-media a.fill:hover {
    background-position: left;
}
.list{
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.list a{
    width: fit-content;
}
.fs-64px{
    font-size: 4rem;
}

.hero-8-content .subtitle-wrapper{
    margin-top: 30px;
}

.text-initial{
    text-transform: initial;
}

.fs-70px{
    font-size: 4.5rem;
}
.fs-90px{
    font-size: 6rem;
}
.fs-20px{
    font-size: 1.25rem;
}

/* Réduction des grands textes display sur tablette et mobile.
   Ces classes utilitaires écrasent le responsive du thème ; on les
   rend donc responsive ici, là où elles sont définies. */
@media only screen and (max-width: 991px) {
    .fs-64px { font-size: 2.75rem; }
    .fs-70px { font-size: 3rem; }
    .fs-90px { font-size: 3.5rem; }
}

@media only screen and (max-width: 767px) {
    .fs-64px { font-size: 2.125rem; }
    .fs-70px { font-size: 2.375rem; }
    .fs-90px { font-size: 2.75rem; }
}

@media only screen and (max-width: 480px) {
    .fs-64px { font-size: 1.875rem; }
    .fs-70px { font-size: 2rem; }
    .fs-90px { font-size: 2.375rem; }
}

/* Fullscreen menu lives outside the header to avoid Safari clipping fixed children. */
.side-info-4 {
    inset: 0;
    z-index: 99999999;
    min-height: 100vh;
    height: 100dvh;
    opacity: 1;
    visibility: hidden;
    pointer-events: none;
    transform: translateZ(0);
    transition:
        -webkit-clip-path 0.9s ease-in-out,
        clip-path 0.9s ease-in-out,
        visibility 0s linear 0.9s;
    clip-path: inset(0 0 100% 0);
    -webkit-clip-path: inset(0 0 100% 0);
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.side-info-4.info-open {
    visibility: visible;
    pointer-events: auto;
    transition:
        -webkit-clip-path 0.9s ease-in-out,
        clip-path 0.9s ease-in-out,
        visibility 0s linear 0s;
    clip-path: inset(0 0 0 0);
    -webkit-clip-path: inset(0 0 0 0);
}

.menu-toggle {
    position: relative;
    z-index: 3;
    border: 0;
    background: transparent;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

body.mobile-menu-open {
    overflow: hidden;
    touch-action: none;
}

.site-mobile-menu {
    position: relative;
    z-index: 4;
    width: 100%;
    margin-top: 32px;
    opacity: 1;
    visibility: visible;
    transform: none !important;
}

.site-mobile-menu .nav-list--mobile {
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex !important;
    flex-direction: column;
    gap: 0;
    opacity: 1;
    visibility: visible;
    transform: none !important;
}

.site-mobile-menu .nav-list--mobile li {
    display: block !important;
    width: 100%;
    margin: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.24);
    opacity: 1;
    visibility: visible;
    transform: none !important;
}

.site-mobile-menu .nav-list--mobile li:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

.site-mobile-menu .nav-list--mobile a,
.site-mobile-menu .nav-list--mobile a.text-white {
    position: relative;
    z-index: 4;
    left: 0;
    display: block !important;
    width: 100%;
    padding: 16px 0;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    color: #ffffff !important;
    opacity: 1;
    visibility: visible;
    transform: none !important;
    -webkit-text-fill-color: #ffffff;
}

.side-info-4 .site-mobile-menu ~ .side-info-close {
    margin-top: 40px;
}

@media (min-width: 1200px) {
    .site-mobile-menu {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .site-mobile-menu .nav-list--mobile a {
        font-size: 24px;
    }
}

@media (max-width: 1199px) {
    .site-mobile-menu {
        display: block !important;
        position: relative !important;
        z-index: 999999999 !important;
        width: 100% !important;
        margin: 32px 0 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    .site-mobile-menu .nav-list--mobile {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    .site-mobile-menu .nav-list--mobile li {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    .site-mobile-menu .nav-list--mobile a {
        display: block !important;
        position: relative !important;
        left: 0 !important;
        z-index: 999999999 !important;
        width: 100% !important;
        padding: 16px 0 !important;
        font-size: 20px !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        -webkit-text-fill-color: #ffffff !important;
    }
}