/* perryvillefamilydentistry.com — accessibility fixes (2026-10-09 rollout).
   Loaded after the page's own Divi CSS from BaseLayout. Generated by hand; see ../_a11y/ for the scripts. */

/* header tagline: was a second <h1> on every inner page; now a <p> with the exact h1 look */
.et_pb_text_2_tb_header .a11y-tagline{font-family:'Open Sans',Arial,sans-serif;font-size:45px;font-weight:600;line-height:22px;color:#056666;margin:0;padding:0 0 10px}
@media only screen and (max-width:767px){.et_pb_text_2_tb_header .a11y-tagline{font-size:19px}}

/* Divi clickable modules now carry a real link: keep the module's own text look */
a.a11y-cl{color:inherit;text-decoration:none;font:inherit}
a.a11y-cl:hover{text-decoration:underline}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* legal links: the theme hides the footer section holding them below 768px -> mobile-only copy in the bottom bar */
.a11y-mlegal{display:none}
@media only screen and (max-width:767px){.a11y-mlegal{display:block;padding:4px 0 0!important;font-size:14px;line-height:1.6}.a11y-mlegal a{color:#fff!important;text-decoration:underline}}

/* content links: Divi default #2ea3f2 on white = 2.74:1 -> same hue darkened to 5.18:1 (4.8:1 on the #f6f6f6
   sidebar); zero-specificity so every module that sets its own link colour keeps it. Underlined inside running
   text, because the darker blue is close to the body text colour. */
:where(#main-content) a{color:#0b71b6}
:where(#main-content) :is(p,li) > a:not(.et_pb_button):not(.a11y-cl){text-decoration:underline;text-underline-offset:2px}

/* keyboard focus: Divi sets :focus{outline:0}. Navy ring + white halo; white ring on the dark bars */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #203484!important;outline-offset:2px!important;box-shadow:0 0 0 2px #fff!important}
.et_pb_section_0_tb_header a:focus-visible,.et_pb_section_1_tb_header a:focus-visible,.et_pb_section_2_tb_header a:focus-visible,.et_pb_section_3_tb_header a:focus-visible,.et_pb_section_3_tb_header [tabindex]:focus-visible,.et_pb_row_3_tb_header a:focus-visible,.et_pb_row_3_tb_header [tabindex]:focus-visible,.et_mobile_menu a:focus-visible,.et-l--footer a:focus-visible,.menuButton:focus-visible{outline-color:#fff!important;box-shadow:0 0 0 2px #203484!important}
#main-content[tabindex="-1"]:focus{outline:0!important;box-shadow:none!important}
/* the theme's skip link: visible when focused */
.screen-reader-shortcut:focus{position:fixed!important;left:8px;top:8px;z-index:2147483000;width:auto!important;height:auto!important;clip:auto!important;padding:8px 14px;background:#fff;color:#203484!important;font-size:16px;text-decoration:underline}

/* header "Book Now" dropdown: opens for keyboard focus too; Escape closes it (a11y-fixes.js) */
.et-menu li.menu-item-has-children:focus-within>.sub-menu{visibility:visible!important;opacity:1!important}
.et-menu li.a11y-esc>.sub-menu{visibility:hidden!important;opacity:0!important}
/* Divi icon glyphs (dropdown caret, menu button) must not be read as text */
.et-menu .menu-item-has-children>a:first-child:after{content:"3" / ""}

/* gallery slider: arrows were shown on mouse hover only; dots were 7px targets -> 24px hit area, same 7px dot */
.et_pb_slider .et-pb-arrow-prev:focus-visible,.et_pb_slider .et-pb-arrow-next:focus-visible{opacity:1!important}
.et-pb-controllers a{width:24px!important;height:24px!important;border:8.5px solid transparent!important;background-clip:padding-box!important;box-sizing:border-box!important;margin-right:2px!important}

/* skip link (the theme's own one sits in a header row the theme hides on desktop) */
.a11y-skip{position:absolute;left:8px;top:-200px;z-index:2147483000;padding:8px 14px;background:#fff;color:#203484!important;font-size:16px;line-height:1.4;text-decoration:underline;border-radius:3px}
.a11y-skip:focus{top:8px}

/* header address is nowrap: between 981px and ~1300px it runs past the screen edge (sideways scroll, all pages).
   Let it wrap there. The "Book Now" dropdown (last menu item) opens leftwards so its hidden list cannot push
   the page wider. */
@media only screen and (min-width:981px) and (max-width:1366px){.et_pb_text_1_tb_header p,.et_pb_text_1_tb_header a{white-space:normal!important}}
.et_pb_menu_1_tb_header .et-menu>li:last-child>.sub-menu{left:auto!important;right:0!important}

/* header tagline over the photo: theme teal #078383 = 3.8:1 on the pale part of the photo -> same hue #056666
   (5.6:1), set above. Its box spans the full row, so keep it to the text's own width. */
.et_pb_text_2_tb_header .a11y-tagline{width:fit-content;max-width:100%}
/* service-category banners (advanced care / preventative / restorative): on phones the dark heading text runs over
   the darker part of the photo -> light backing behind the text block */
@media only screen and (max-width:767px){.sec_banner .et_pb_text .et_pb_text_inner{display:inline-block;background:rgba(255,255,255,.85);padding:4px 8px;border-radius:3px}}
@media only screen and (max-width:767px){.et_pb_text_2_tb_header .a11y-tagline{background:rgba(255,255,255,.85);padding:4px 8px!important;border-radius:3px;line-height:1.3}}
/* one skip link only: ours (BaseLayout) is the first Tab stop at every width; the theme's mobile-only copy is hidden */
.et_pb_text_0_tb_header .screen-reader-shortcut{display:none!important}
/* menu button glyph ("a" in the icon font) is not read; the button is named "Menu" (a11y-fixes.js) */
.mobile_menu_bar:before{content:"a" / ""}
