/* valleyvillageclearbraces.com — accessibility fixes (2026-10-09, SOP-A11Y-WIDGET-ROLLOUT Step 5/5a).
   Loaded LAST (end of <body>) so it wins over the per-page Divi inline styles at equal specificity.
   Every colour is the closest darker shade of the site's own colour that reaches WCAG AA. */

/* utilities */
.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}
.a11y-skip{position:absolute;left:8px;top:-60px;z-index:100000;background:#fff;color:#0e5f86;padding:10px 16px;border:2px solid #0e5f86;border-radius:4px;font:600 16px/1.2 "Open Sans",Arial,sans-serif;text-decoration:underline}
.a11y-skip:focus{top:8px;outline:3px solid #0e5f86;outline-offset:2px}

/* brand blue #1696d3 under white text (3.31:1) -> #127caf (4.64:1): nav bar, mobile bar, footer, blue button */
html body #main-header #et-top-navigation,html body #top-header{background-color:#127caf!important}
html body .et_pb_section_0_tb_footer.et_pb_section,html body.et-db #et-boc .et-l .et_pb_section_0_tb_footer.et_pb_section{background-color:#127caf!important}
html body #page-container .et_pb_section .et_pb_button_4{background-color:#127caf!important}

/* "Case N" pills: #1696d3 on #e8f4fb (2.96:1) -> #1174a3 (4.63:1) */
html body .bx-case-title .bx-num{color:#1174a3!important}

/* homepage counters: yellow #edf000 on cyan #0ec4f7 (1.66:1) -> the section heading navy #000487 */
html body #page-container .et_pb_number_counter .percent p{color:#000487!important}

/* orange buttons: white on #f49246 (2.32:1) -> #bc580b (4.63:1) */
html body #page-container .et_pb_section .et_pb_button_0,html body #page-container .et_pb_section .et_pb_button_3{background-color:#bc580b!important}

/* body links: Divi default #2ea3f2 on white (2.74:1) -> #0c79c3 (4.63:1) */
a{color:#0c79c3}

/* links inside running text must not rely on colour alone (link-in-text-block) */
#main-content .et_pb_text_inner p a:not(.et_pb_button),#main-content .et_pb_text_inner li a:not(.et_pb_button),
#main-content .entry-content p a:not(.et_pb_button),#main-content .et_pb_text_inner :is(h1,h2,h3,h4,h5,h6) a,#main-content .lg-prose a{text-decoration:underline;text-underline-offset:2px}

/* visible keyboard focus (site navy) */
#page-container a:focus-visible,#page-container button:focus-visible,#page-container [role="button"]:focus-visible,#page-container summary:focus-visible,#page-container input:focus-visible{outline:3px solid #0e5f86!important;outline-offset:2px!important}
#main-header #et-top-navigation a:focus-visible,.et_pb_section_0_tb_footer a:focus-visible,.et_pb_section_1_tb_footer a:focus-visible,.mobile_cmenu a:focus-visible,.mobile_nav:focus-visible{outline:3px solid #fff!important;outline-offset:2px!important;box-shadow:0 0 0 6px #0e5f86!important}
/* desktop dropdowns open for keyboard users too */
#top-menu li.menu-item-has-children:focus-within>.sub-menu{opacity:1!important;visibility:visible!important;display:block}

/* legal / statement contents rail: 24px minimum target height (WCAG 2.5.8) */
.lg-page .lg-toc li a{display:inline-block;min-height:24px;padding:2px 0}

/* surgical-cases + braces-valleyvillage: the case jump tables are wider than a phone
   (35px side-scroll at 375px; 51px with the widget's text-spacing switch on) */
@media (max-width:600px){
  body.page-id-30033491 #main-content .et_pb_text_inner table,body.page-id-30033273 #main-content .et_pb_text_inner table{width:100%;table-layout:fixed}
  body.page-id-30033491 #main-content .et_pb_text_inner table td,body.page-id-30033273 #main-content .et_pb_text_inner table td{overflow:hidden;width:auto!important;overflow-wrap:anywhere}
}

/* homepage hero tagline sits on light cabinets/chairs in the photo (light patches ~1.9:1) -> stronger dark text backing (photo unchanged) */
html:not(.a11y-contrast) body #page-container h1.a11y-pin-home-hero{text-shadow:0 2px 4px rgba(0,0,0,.85),0 0 14px rgba(0,0,0,.65),0 0 2px rgba(0,0,0,.9)!important}

/* black footer bottom bar: keep the original lighter link blue there (#2ea3f2 on #000 = 7.6:1; the body-link shade would only be 4.5:1) */
html body .et_pb_section_1_tb_footer a{color:#2ea3f2}

/* homepage "View Entire Gallery": was an image of text (2.68:1) -> real link styled like the other orange buttons */
html body #page-container .a11y-gallery-btn{display:inline-block;background-color:#bc580b;color:#fff!important;font-family:"Open Sans",Arial,sans-serif;font-size:20px;font-weight:500;line-height:34px;padding:6px 20px;border:1px solid #4c4c4c;border-radius:24px;text-decoration:none;box-shadow:0 6px 12px rgba(0,0,0,.25);transition:background-color .3s ease}
html body #page-container .a11y-gallery-btn:hover{background-color:#a34c09}

/* legal / statement pages: "Legal" eyebrow #127caf on the pale gradient band (4.04:1 at the band's tint) -> the page's own darker accent #0e5f86 (6.4:1+) */
.lg-page .lg-eyebrow{color:var(--lg-accent-dk,#0e5f86)}

/* homepage "iTero Digital Scanner": the brand-cyan "i" #00ccff on the near-white band (1.7-1.9:1) -> closest darker cyan #0096bc (3.1:1, large bold text) */
html:not(.a11y-contrast) body.home #main-content strong > span[style*="00ccff"]{color:#0096bc!important}

/* header menu hover states: Divi fades hovered/open menu links to 70% opacity
   (white on #127caf -> #b8d8e7 = 3.09:1; #333 on #e1e1e1 dropdown -> ~3:1). Keep full colour, underline instead. */
#top-menu-nav>ul>li>a:hover,#top-menu-nav>ul>li.et-show-dropdown>a,#top-menu-nav .nav li ul a:hover,.et-social-icons a:hover{opacity:1!important}
#top-menu-nav>ul>li>a:hover,#top-menu-nav .nav li ul a:hover{text-decoration:underline;text-underline-offset:3px}

/* Divi icon-font glyphs are CSS content letters ("3" menu arrow, "5" button arrow) that screen readers read
   ("About The Office 3", "Learn more about Invisalign 5"). Same glyph, empty alternative text. */
#top-menu .menu-item-has-children>a:first-child::after{content:"3" / ""}
#page-container .et_pb_button:not(.et_pb_custom_button_icon)::after,#page-container .et_pb_button:not(.et_pb_custom_button_icon)::before{content:"\35" / ""}

/* a11y-pin: headings re-tagged for one-h1 / heading order — look pinned to the pre-change computed styles (generated by _a11y/gen-pin-css.py) */
html body #page-container .a11y-pin-home-hero{font-weight:500!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{color:rgb(255, 255, 255)!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-hero{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h0{font-weight:500!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:uppercase!important;text-align:left!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h0{color:rgb(51, 51, 51)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h0{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h1{font-weight:500!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h1{color:rgb(19, 119, 196)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h1{font-family:"Josefin Sans", Helvetica, Arial, Lucida, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h2{font-weight:700!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:left!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h2{color:rgb(11, 81, 186)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h2{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h3{font-weight:600!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h3{color:rgb(0, 4, 135)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h3{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h4{font-weight:600!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h4{color:rgb(8, 49, 137)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h4{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h5{font-weight:500!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h5{color:rgb(53, 53, 53)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h5{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-home-h6{font-size:45px!important;font-weight:500!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-h6{color:rgb(255, 255, 255)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-home-h6{font-family:Arial, Helvetica, Arial, Lucida, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h6{line-height:45px!important;letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-inv-h1{font-weight:700!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:left!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-inv-h1{color:rgb(11, 81, 186)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-inv-h1{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{letter-spacing:normal!important;word-spacing:0px!important}
html body #page-container .a11y-pin-inv-h2{font-weight:600!important;font-style:normal!important;font-variant-caps:normal!important;text-transform:none!important;text-align:center!important;margin-top:0px!important;margin-bottom:0px!important;margin-left:0px!important;margin-right:0px!important;padding-top:0px!important;padding-bottom:10px!important;padding-left:0px!important;padding-right:0px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-inv-h2{color:rgb(0, 4, 135)!important;text-shadow:none!important}
html:not(.a11y-font) body #page-container .a11y-pin-inv-h2{font-family:"Open Sans", Arial, sans-serif!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{letter-spacing:normal!important;word-spacing:0px!important}
@media (min-width:1299px){
html body #page-container .a11y-pin-home-hero{font-size:55px!important;padding-bottom:27.5px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{text-shadow:rgba(0, 0, 0, 0.4) 0px 5.5px 5.5px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{line-height:71.5px!important}
html body #page-container .a11y-pin-home-h0{font-size:35px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{line-height:49px!important}
html body #page-container .a11y-pin-home-h1{font-size:45px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{line-height:45px!important}
html body #page-container .a11y-pin-home-h2{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{line-height:42px!important}
html body #page-container .a11y-pin-home-h3{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{line-height:44px!important}
html body #page-container .a11y-pin-home-h4{font-size:37px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{line-height:37px!important}
html body #page-container .a11y-pin-home-h5{font-size:60px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{line-height:60px!important}
html body #page-container .a11y-pin-inv-h1{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{line-height:42px!important}
html body #page-container .a11y-pin-inv-h2{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{line-height:44px!important}
}
@media (min-width:981px) and (max-width:1298px){
html body #page-container .a11y-pin-home-hero{font-size:55px!important;padding-bottom:27.5px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{text-shadow:rgba(0, 0, 0, 0.4) 0px 5.5px 5.5px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{line-height:71.5px!important}
html body #page-container .a11y-pin-home-h0{font-size:35px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{line-height:49px!important}
html body #page-container .a11y-pin-home-h1{font-size:45px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{line-height:45px!important}
html body #page-container .a11y-pin-home-h2{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{line-height:42px!important}
html body #page-container .a11y-pin-home-h3{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{line-height:44px!important}
html body #page-container .a11y-pin-home-h4{font-size:37px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{line-height:37px!important}
html body #page-container .a11y-pin-home-h5{font-size:60px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{line-height:60px!important}
html body #page-container .a11y-pin-inv-h1{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{line-height:42px!important}
html body #page-container .a11y-pin-inv-h2{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{line-height:44px!important}
}
@media (min-width:768px) and (max-width:980px){
html body #page-container .a11y-pin-home-hero{font-size:55px!important;padding-bottom:27.5px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{text-shadow:rgba(0, 0, 0, 0.4) 0px 5.5px 5.5px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{line-height:71.5px!important}
html body #page-container .a11y-pin-home-h0{font-size:35px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{line-height:49px!important}
html body #page-container .a11y-pin-home-h1{font-size:45px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{line-height:45px!important}
html body #page-container .a11y-pin-home-h2{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{line-height:42px!important}
html body #page-container .a11y-pin-home-h3{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{line-height:44px!important}
html body #page-container .a11y-pin-home-h4{font-size:37px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{line-height:37px!important}
html body #page-container .a11y-pin-home-h5{font-size:38px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{line-height:38px!important}
html body #page-container .a11y-pin-inv-h1{font-size:42px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{line-height:42px!important}
html body #page-container .a11y-pin-inv-h2{font-size:44px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{line-height:44px!important}
}
@media (min-width:601px) and (max-width:767px){
html body #page-container .a11y-pin-home-hero{font-size:24px!important;padding-bottom:12px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{text-shadow:rgba(0, 0, 0, 0.4) 0px 2.4px 2.4px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{line-height:31.2px!important}
html body #page-container .a11y-pin-home-h0{font-size:24px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{line-height:33.6px!important}
html body #page-container .a11y-pin-home-h1{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{line-height:25px!important}
html body #page-container .a11y-pin-home-h2{font-size:27px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{line-height:27px!important}
html body #page-container .a11y-pin-home-h3{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{line-height:25px!important}
html body #page-container .a11y-pin-home-h4{font-size:26px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{line-height:26px!important}
html body #page-container .a11y-pin-home-h5{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{line-height:25px!important}
html body #page-container .a11y-pin-inv-h1{font-size:27px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{line-height:27px!important}
html body #page-container .a11y-pin-inv-h2{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{line-height:25px!important}
}
@media (max-width:600px){
html body #page-container .a11y-pin-home-hero{font-size:24px!important;padding-bottom:12px!important}
html:not(.a11y-contrast) body #page-container .a11y-pin-home-hero{text-shadow:rgba(0, 0, 0, 0.4) 0px 2.4px 2.4px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-hero{line-height:31.2px!important}
html body #page-container .a11y-pin-home-h0{font-size:24px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h0{line-height:33.6px!important}
html body #page-container .a11y-pin-home-h1{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h1{line-height:25px!important}
html body #page-container .a11y-pin-home-h2{font-size:27px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h2{line-height:27px!important}
html body #page-container .a11y-pin-home-h3{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h3{line-height:25px!important}
html body #page-container .a11y-pin-home-h4{font-size:26px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h4{line-height:26px!important}
html body #page-container .a11y-pin-home-h5{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-home-h5{line-height:25px!important}
html body #page-container .a11y-pin-inv-h1{font-size:27px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h1{line-height:27px!important}
html body #page-container .a11y-pin-inv-h2{font-size:25px!important}
html:not(.a11y-spacing) body #page-container .a11y-pin-inv-h2{line-height:25px!important}
}
