/* * Candura Accessibility Remediation — CSS layer * WCAG 2.1 AA runtime fixes. Selectors are taken directly from the site audit, * so each rule only touches an element the audit flagged (no site-wide reach * except where explicitly noted). Brand colours are preserved and only nudged * enough to meet the 4.5:1 (or 3:1 for large text / non-text) thresholds. * * Toggle classes on let the settings page disable individual groups: * .candura-no-contrast .candura-no-links .candura-no-inputs */ /* ========================================================================= * 1. Skip link (SC 2.4.1) — visible on keyboard focus, off-screen otherwise * ========================================================================= */ .candura-skip-link { position: absolute; left: -9999px; top: 0; z-index: 100000; padding: 12px 20px; background: #ffffff; color: #0b3d91; font: 600 16px/1.2 sans-serif; text-decoration: underline; border: 2px solid #0b3d91; border-radius: 0 0 4px 0; } .candura-skip-link:focus { left: 0; outline: 3px solid #0b3d91; outline-offset: 2px; } /* Skip-link target: offset the jump so the sticky header does not cover the * top of the main content, and never let the -1 tabindex show an outline box. */ #candura-main-content, .candura-main-anchor { scroll-margin-top: 140px; } .candura-main-anchor { display: block; width: 100%; height: 0; margin: 0; padding: 0; outline: none !important; } /* Visually-hidden utility for injected labels / long descriptions */ .candura-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; } /* ========================================================================= * 2. Visible focus indicator (SC 2.4.7 / keyboard operability) * ========================================================================= */ .candura-focus a:focus-visible, .candura-focus button:focus-visible, .candura-focus input:focus-visible, .candura-focus select:focus-visible, .candura-focus textarea:focus-visible, .candura-focus [tabindex]:focus-visible, .candura-focus [role="button"]:focus-visible, .candura-focus [role="tab"]:focus-visible { outline: 3px solid #0b3d91 !important; outline-offset: 2px !important; box-shadow: 0 0 0 3px #ffffff !important; } /* ========================================================================= * 3. Colour contrast — CONFIRMED failures (SC 1.4.3) * ------------------------------------------------------------------------- */ /* 3a. Grey (#C0C0C0) table headers: #5e5e5e -> near-black (approx 11:1) */ .candura-contrast td[bgcolor="#C0C0C0"] > strong, .candura-contrast td[bgcolor="#c0c0c0"] > strong, .candura-contrast td[bgcolor="#C0C0C0"], .candura-contrast td[bgcolor="#c0c0c0"], .candura-contrast td[rowspan="5"], .candura-contrast td[rowspan="5"] > strong { color: #2d2d2d !important; } /* 3b. Near-white text on near-white background -> near-black */ .candura-contrast .eluidf5a9aec4 > .tbk__title, .candura-contrast .eluidf5a9aec4 > h4 { color: #2d2d2d !important; } /* 3c. Brand orange headings on white (#f28100 ≈ 3:1) -> darkened orange * (#b4520a on white ≈ 4.8:1; keeps the brand hue) */ .candura-contrast .eluid0903542b > h4, .candura-contrast .eluid0b9f82e0 > h4, .candura-contrast .eluid1ca8c0f4 > h3, .candura-contrast .eluid812a3666 > h3, .candura-contrast .eluida4dfcfae > h3, .candura-contrast .eluidff289de1 > h3 { color: #b4520a !important; } /* ========================================================================= * 4. Colour contrast — content headings on light section backgrounds * (audit could not measure the background image, but these Zion title / * icon-box elements render on light backgrounds; darken to near-black). * Scoped to the exact audited elements only. * ========================================================================= */ .candura-contrast #eluid04148a09 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid05bbc95a > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid0a3e6e13 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid57327a63 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid57327a63 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__desc-wrapper > .kl-iconbox__desc, .candura-contrast #eluid5f0897d1 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid62a1f389 > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid938b6a2b > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluide88f81da > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluidf00c84cc > .kl-iconbox__inner > .kl-iconbox__content-wrapper > .kl-iconbox__title-wrapper > .kl-iconbox__title, .candura-contrast #eluid09521cf00 > span, .candura-contrast #eluid2b99c7010 > span, .candura-contrast #eluid9de0f4930 > span, .candura-contrast #eluid9de0f4931 > span, .candura-contrast #eluidc12e7a480 > span, .candura-contrast #eluidfb0ee4a30 > span, .candura-contrast #eluid247e886c0 > span:nth-child(2), .candura-contrast #eluid755e265c0 > span:nth-child(2), .candura-contrast #eluidb87b55270 > span:nth-child(2), .candura-contrast .eluid08cd392d > .tbk__text > p:nth-child(1), .candura-contrast .eluid08cd392d > .tbk__title, .candura-contrast .eluid16523a9e > .tbk__title, .candura-contrast .eluid16523a9e > h3, .candura-contrast .eluid16523a9e > h4, .candura-contrast .eluid19e2daca > h4, .candura-contrast .eluid52e7fdd6 > h4, .candura-contrast .eluid52e7fdd6 > h4 > strong, .candura-contrast .eluid5d7a67ee > .tbk__title, .candura-contrast .eluid5d7a67ee > h4, .candura-contrast .eluid7db88311 > h4, .candura-contrast .eluid812a3666 > h4, .candura-contrast .eluid9305dd4d > .tbk__title, .candura-contrast .eluid9305dd4d > h4, .candura-contrast .eluida13253d4 > .tbk__title, .candura-contrast .eluida19dd47a > .tbk__title, .candura-contrast .eluida19dd47a > h4, .candura-contrast .eluidc9de8111 > .tbk__title, .candura-contrast .eluidd89b5621 > .tbk__title, .candura-contrast .eluide0c508c2 > h4, .candura-contrast .eluidf124f931 > h4, .candura-contrast .eluidfeb9c189 > h4, .candura-contrast .eluidfeb9c189 > h4 > strong { color: #2d2d2d !important; } /* Textarea value text flagged for contrast */ .candura-contrast .wpcf7-textarea { color: #2d2d2d !important; } /* ========================================================================= * 5. Text over background images / gradients (footer contact, nav, CTA): * audit could not measure contrast. We DO NOT recolour (that could hide * light text on a dark image); instead we add a subtle shadow that * boosts legibility of light text against busy imagery. Scoped to the * audited elements only. * ========================================================================= */ .candura-contrast #eluid9cba44fc a > span, .candura-contrast #menu-item-4615 > .main-menu-link > span, .candura-contrast .ctabutton > span:nth-child(2), .candura-contrast a[aria-current="page"] > span, .candura-contrast .eluid2f4eab00 > h4 span, .candura-contrast .eluid2f4eab00 > h4 a, .candura-contrast .eluid9b765cdb > h4 span, .candura-contrast .eluid9b765cdb > h4 a, .candura-contrast .eluidd6c506a4 > h4 span, .candura-contrast .eluidd6c506a4 > h4 a { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65), 0 0 1px rgba(0, 0, 0, 0.55); } /* Magnific-popup close button — ensure it is visible on either backdrop */ .candura-contrast .mfp-close { color: #ffffff !important; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important; opacity: 1 !important; } /* ========================================================================= * 6. Distinguishable links (SC 1.4.1) — underline in-content + footer links * ========================================================================= */ .candura-links a[href^="tel:"], .candura-links a[href^="mailto:"] { text-decoration: underline !important; text-underline-offset: 2px; } /* Footer contact links keep their (light) colour but gain an underline */ .candura-links .eluid2f4eab00 a, .candura-links .eluid9b765cdb a, .candura-links .eluidd6c506a4 a { text-decoration: underline !important; } /* ========================================================================= * 7. Non-text control contrast (SC 1.4.11) — form fields get a 3:1 border * ========================================================================= */ .candura-inputs .wpcf7-form-control.wpcf7-text, .candura-inputs .wpcf7-form-control.wpcf7-textarea, .candura-inputs .wpcf7-form-control.wpcf7-number, .candura-inputs .wpcf7-form-control.wpcf7-select, .candura-inputs .wpcf7-form input[type="text"], .candura-inputs .wpcf7-form input[type="email"], .candura-inputs .wpcf7-form input[type="tel"], .candura-inputs .wpcf7-form input[type="url"], .candura-inputs .wpcf7-form textarea, .candura-inputs .wpcf7-form select { border: 1px solid #595959 !important; } .candura-inputs .wpcf7-form input:focus, .candura-inputs .wpcf7-form textarea:focus, .candura-inputs .wpcf7-form select:focus { border-color: #0b3d91 !important; outline: 2px solid #0b3d91 !important; outline-offset: 1px; } /* ========================================================================= * 8. Injected visible labels for the search & contact form * ========================================================================= */ .candura-a11y-label { display: block; margin-bottom: 4px; font-weight: 600; line-height: 1.3; } /* Carousel pause / play control injected by the JS layer */ .candura-carousel-toggle { position: absolute; top: 8px; right: 8px; z-index: 50; padding: 6px 12px; background: #ffffff; color: #111111; border: 2px solid #111111; border-radius: 4px; font: 600 14px/1 sans-serif; cursor: pointer; } .candura-carousel-toggle:focus-visible { outline: 3px solid #0b3d91; outline-offset: 2px; }