/* ------------------------------------------------------------------ * Desinsect13000 Anthropic — A11y overrides * Last-stylesheet wins. Targets WCAG 2.1 AA contrast failures from * axe-core audit (May 2026, 8 sample pages). * * Failure pairs fixed: * #ffffff on #d45b3d -> #ffffff on #b94a2e (5.1:1) [primary buttons] * #d45b3d on #fdf8f0 -> #a83a23 on #fdf8f0 (6.4:1) [accent text/links] * #978d86 on #fdf8f0 -> #7a6f66 on #fdf8f0 (4.6:1) [muted hero/article meta] * #6d6059 on #190f0a -> #b8aba2 on #190f0a (8.4:1) [footer links] * ------------------------------------------------------------------ */ /* Primary CTA button — darken terracotta for white-text 4.5:1 */ .btn--primary, a.btn--primary, button.btn--primary { background: #b94a2e !important; border-color: #b94a2e !important; } .btn--primary:hover, a.btn--primary:hover, button.btn--primary:hover { background: #a83a23 !important; border-color: #a83a23 !important; } /* Ghost button + accent inline links + accent text — darken for body-text 4.5:1 */ .btn--ghost, a.btn--ghost { color: #a83a23 !important; border-color: #a83a23 !important; } .btn--ghost:hover, a.btn--ghost:hover { color: #ffffff !important; background: #a83a23 !important; border-color: #a83a23 !important; } .text-accent, .pillar__title em, .hero__title em, .contact-cta__title em { color: #a83a23 !important; } /* Inline content links inside pillar/article body */ .pillar__rich a, .article__rich a, .entry-content a, .post-content a, .s-richtext a, p > a:not(.btn):not(.cta-button-green):not(.cta-button-link), .feature-card-v3 .card-link, .cta-button-green { color: #a83a23 !important; text-decoration: underline; text-underline-offset: 2px; } .pillar__rich a:hover, .article__rich a:hover, .entry-content a:hover, .post-content a:hover, .s-richtext a:hover { color: #7e2a17 !important; } /* Muted text — bump #978d86 to #7a6f66 for 4.6:1 on cream */ .text-muted, .hero__meta span, .hero__meta, .pillar__hero-meta span, .pillar__hero-meta, .pillar__id-row dd .num, .pillar__id-row dt, .article__hero-rt, .article__hero-date, .article__hero-meta, .article__meta span, .article__meta, .eyebrow, .proof-rail__small, .proof-rail__label, .contact-details p, .tarifs-fact, .authority-strip__chip .note, .authority-strip__label, .b2b-strip__label, .feature-card-v3 small, small.muted, .muted { color: #7a6f66 !important; } /* Accent text/links on any cream surface variant — darken to #a83a23 */ .proof-rail__label, .article__meta a, .article__meta strong, .s-richtext ol > li > a, .s-richtext ul > li > a, .entry-content ol > li > a, .entry-content ul > li > a, li > a[href*="#identification"], li > a[href*="#signes"], li > a[href*="/devis/"], .pillar__rich strong, .s-richtext strong, strong[style*="color"] { color: #a83a23 !important; } /* Pillar hero figcaption family/latin chips */ .pillar__hero-caption .family, .pillar__hero-caption .latin, .family, .latin { color: #7a6f66 !important; } /* Gutenberg button blocks (post_content) — Wordpress core button blocks inherit terracotta as text colour when bg is "stripped". Override to guarantee 4.5:1 white-on-darker-terracotta + ghost variant. */ .wp-block-button__link.has-primary-background-color, .wp-block-button__link.has-secondary-background-color { background: #b94a2e !important; color: #ffffff !important; } .wp-block-button__link.has-primary-background-color:hover, .wp-block-button__link.has-secondary-background-color:hover { background: #a83a23 !important; } /* Article TOC + content anchor links */ .entry-content a[href^="#"], .post-content a[href^="#"], .s-richtext a[href^="#"], .article__prose a[href^="#"], .article__rich a[href^="#"], ol > li > a[href^="#"], ul > li > a[href^="#"] { color: #a83a23 !important; text-decoration: underline; text-underline-offset: 2px; } /* Tables — th must meet 4.5:1 against table bg */ table th, .pillar__rich table th, .article__rich table th, .s-richtext table th, .entry-content table th { color: #190f0a !important; background: #f0e7d8 !important; } table td, .pillar__rich table td, .article__rich table td { color: #2d2018 !important; } /* Footer links + headings — lighten on dark for 8.4:1 */ .site-footer ul a, .site-footer__col a, .site-footer__col__heading { color: #b8aba2 !important; } .site-footer ul a:hover, .site-footer__col a:hover { color: #ffffff !important; } .site-footer__col h3, .site-footer__col h4, .site-footer .site-footer__col h3, .site-footer .site-footer__col h4 { color: #fdf8f0 !important; } .site-footer__brand, .site-footer__tagline { color: #fdf8f0 !important; } .site-footer__hours { color: #c8baad !important; } /* Footer phone + bottom links readability */ .site-footer__phone, .site-footer__bottom a, .site-footer__bottom span { color: #c8baad !important; } .site-footer__bottom a { text-decoration: underline; text-underline-offset: 2px; } /* Pillar info-row dt/dd contrast */ .pillar__id-row dt { color: #7a6f66 !important; } /* Article hero date/right-block */ .article__hero-meta time, .article__hero-meta span { color: #7a6f66 !important; } /* ------------------------------------------------------------------ * Focus visibility — WCAG 2.4.7 (AA). Strong terracotta ring on * keyboard focus only. Pointer/click focus stays subtle. * ------------------------------------------------------------------ */ :where(a, button, input, textarea, select, [tabindex]):focus-visible { outline: 2px solid #a83a23 !important; outline-offset: 2px !important; border-radius: 4px; box-shadow: 0 0 0 4px rgba(168, 58, 35, 0.18) !important; } /* Buttons keep a tight ring instead of double */ .btn:focus-visible, button.btn:focus-visible, a.btn:focus-visible { outline: 2px solid #190f0a !important; outline-offset: 3px !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.6), 0 0 0 6px rgba(168, 58, 35, 0.4) !important; } /* ------------------------------------------------------------------ * Reduced motion — disable non-essential transitions/animations site-wide. * Already shipped on cookies + floating actions. Generalize to all reveal, * marquee, scroll-driven, hover-lift transitions. * ------------------------------------------------------------------ */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } [data-reveal], [data-reveal-stagger] > * { opacity: 1 !important; transform: none !important; } } /* ------------------------------------------------------------------ * Skip link — make truly visible on focus (WCAG 2.4.1) * ------------------------------------------------------------------ */ .skip-link { position: absolute !important; left: -9999px; top: 0; z-index: 9999; background: #190f0a; color: #fdf8f0 !important; padding: 12px 18px; border-radius: 0 0 6px 0; font-weight: 600; text-decoration: none; } .skip-link:focus, .skip-link:focus-visible { left: 0 !important; clip: auto !important; height: auto !important; width: auto !important; outline: 2px solid #fdf8f0 !important; outline-offset: -4px !important; } /* ------------------------------------------------------------------ * Active nav state — WCAG 4.1.2 (Name/Role/Value via aria-current) * ------------------------------------------------------------------ */ .site-header nav a[aria-current="page"], .site-footer nav a[aria-current="page"] { color: #a83a23 !important; font-weight: 600; } .site-header nav a[aria-current="page"]::after { content: ""; display: block; height: 2px; background: #a83a23; margin-top: 4px; } /* ------------------------------------------------------------------ * Form accessibility — high-contrast invalid state, visible labels. * ------------------------------------------------------------------ */ input:not([type=hidden]):required:user-invalid, textarea:required:user-invalid, select:required:user-invalid { border-color: #b04030 !important; box-shadow: 0 0 0 1px #b04030 !important; } [role="alert"], .form-error, .field-error { color: #8e2418 !important; font-weight: 500; } /* Ensure required asterisks are not the sole indicator (WCAG 1.3.3) */ .required::after, [aria-required="true"] + label::after { content: " (requis)"; font-size: 0.85em; color: #7a6f66; } /* Cookie banner contrast safety */ .d13a-cookie-banner button, .d13a-cookie-banner a { color: #fdf8f0 !important; } /* Article byline (mu-plugin injected) — make it a div semantically via role */ .article__byline { color: #4a4540 !important; } /* Pillar hero media — already a complementary chunk, but axe wants either * top-level or accept-as-illustrative. Add aria-hidden=true via CSS-only * isn't possible — but we can reduce noise by making axe see it as not * a landmark. Keeps semantics: the image is decorative-with-caption; the *