/* =========================================================================
   Accessibility + Core Web Vitals enhancements — added 2026-06-10
   Loaded last so these rules win over the legacy theme stylesheet.
   ========================================================================= */

/* ----- Skip link (WCAG 2.4.1) ----- */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 2000;
    padding: 10px 16px;
    background: #702f63;
    color: #fff;
    text-decoration: none;
}
.skip-link:focus { left: 0; }

/* ----- Visible focus indicator (WCAG 2.4.7) ----- */
:where(a, button, [tabindex]):focus-visible {
    outline: 3px solid #702f63;
    outline-offset: 2px;
}

/* ----- Contrast fixes (WCAG 1.4.3): #888 fails 4.5:1 on the cream/near-white
   backgrounds. Darken default, hover, and secondary text. ----- */
body { color: #5d5d5d; }
a:hover { color: #5d5d5d; }
.what-we-do .graduation .special,
.contact-half-width-text .special { color: #4f4f4f; }
.header ul.nav li a i { color: #7a7a7a; }

/* ----- Readability: avoid justified text (WCAG 1.4.8 advisory) ----- */
.accueil-full-width-text p,
.contact-half-width-text .special { text-align: left; }

/* ----- Responsive hero image (replaces the single-slide flexslider) ----- */
.hero { display: block; margin: 0 auto; text-align: center; }
.hero img {
    display: block;
    width: 100%;
    max-width: 600px;
    height: auto;
    margin: 0 auto;
    border: 5px solid #f8f8f8;
}

/* ----- Map iframe fills its framed box (was sized by the old gmap plugin) ----- */
.map iframe { display: block; width: 100%; height: 100%; border: 0; }

/* ----- Accessible mobile navigation (replaces the Bootstrap collapse plugin).
   Below 980px the toggle button controls visibility via the .is-open class;
   at >=980px the menu is always shown (matches the original breakpoint). ----- */
@media (max-width: 979px) {
    /* Bootstrap's generic .collapse sets height:0;overflow:hidden and the old
       plugin toggled it. We own the toggle now via the .is-open class. */
    .header .nav-collapse.collapse { display: none; }
    .header .nav-collapse.collapse.is-open {
        display: block;
        height: auto;
        overflow: visible;
    }
    /* The menu <ul> carries Bootstrap's .pull-right (float:right !important),
       which would collapse its parent's height. Drop the float on mobile so
       the open menu flows normally and pushes the page content down. */
    .header .nav-collapse .nav.pull-right { float: none !important; }
}

/* ----- Reduced motion (WCAG 2.3.3 / animation hygiene) ----- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}