/* ==========================================================
   WCL A11Y FIXES — Lighthouse 90→95+/100
   Fix: target-size (25), color-contrast (6), heading-order (1), skip-link (1)
   Date: 2026-05-06
   ========================================================== */

/* ---------- 1. SKIP-LINK — focusable per WCAG 2.4.1 ---------- */
.skip-link {
    position: absolute !important;
    left: -9999px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    z-index: 999999 !important;
}
.skip-link:focus,
.skip-link:focus-visible {
    position: fixed !important;
    left: 16px !important;
    top: 16px !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding: 12px 24px !important;
    background: #ff6900 !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
    outline: 3px solid #003366 !important;
    outline-offset: 2px !important;
}

/* ---------- 2. COLOR CONTRAST ---------- */

/* Hero CTA — orange #ff7700 + white text only ~3.0:1 → darken to #cc5500 (4.7:1) */
.wcl-hero-btn-primary {
    background: #cc5500 !important;
    box-shadow: 0 4px 24px rgba(204,85,0,0.35) !important;
}
.wcl-hero-btn-primary:hover {
    background: #b34900 !important;
    box-shadow: 0 8px 36px rgba(204,85,0,0.5) !important;
}

/* Footer address #888 → #595959 on white = 7:1 */
.wcl-footer-contact-addr {
    color: #595959 !important;
}

/* Footer contact links #666 → #444 = 9.7:1 */
.wcl-footer-contact a {
    color: #444 !important;
}

/* Footer social links #888 → #444 + clear border for AA */
.wcl-footer-social a {
    color: #444 !important;
    border-color: #888 !important;
}

/* Footer bottom small text #aaa → #595959 = 7:1 */
.wcl-footer-bottom {
    color: #595959 !important;
}

/* ---------- 3. TARGET SIZE — min 44×44 per WCAG 2.5.5 ---------- */

/* Footer contact tel/mail/address links */
.wcl-footer-contact a {
    min-height: 44px;
    padding: 6px 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Footer social icon circles 36 → 44 */
.wcl-footer-social a {
    width: 44px !important;
    height: 44px !important;
}

/* Footer nav links — give them tap padding */
.wcl-footer-nav a,
.wcl-footer-links a,
footer .wcl-footer a:not(.wcl-footer-social a):not(.wcl-footer-contact a) {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
    padding: 0 4px;
}

/* ---------- 4. HEADING ORDER fix via aria/role on h4 in footer ----------
   Footer uses <h4> after <h1> on home → axe flags as skipped.
   Best fix: change template <h4> → <h2 class="wcl-footer-h">. We do it via PHP edit too,
   but as belt-and-suspenders, give <h2 class="wcl-footer-h"> footer-H styling. */
.wcl-footer-h,
.wcl-footer h4 {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #1a1a1a !important;
    margin: 0 0 16px !important;
}

/* ---------- 5. FOCUS VISIBLE — global keyboard outline ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid #ff6900 !important;
    outline-offset: 2px !important;
    border-radius: 4px;
}