/* ============================================================================ FHA HIGH-CONTRAST MODE — OPT-IN ONLY (his call, 8/21). The site's default look is UNTOUCHED. These rules activate only when carries .hc, which js/ada.js applies in exactly two cases: 1. the visitor's OS accessibility setting asks for more contrast (prefers-contrast: more), or 2. the visitor turns on the HIGH CONTRAST item in the site menu (persisted in localStorage). Content: the Package-A treatment — near-white functional ink over smoked-glass fields. Decorative brand scripts stay as designed. ========================================================================= */ /* ---- desktop ------------------------------------------------------------ */ @media (min-width: 992px) { html.hc .theme-teal .banner .banner-image-container .banner-menu { background-image: linear-gradient(rgba(2,34,50,.66), rgba(2,34,50,.66)), url(../images/thumb/menubg-opaque.png) !important; } html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd .dd-menu:hover, html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd .dd-menu.active, html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd.active .dd-title, html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd.show .dd-title, html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd .dd-title:hover { color: #D6F6F6 !important; text-decoration: underline; text-underline-offset: 4px; } html.hc .theme-teal .banner .banner-image-container .banner-menu .main-dd ul { background: rgba(2,34,50,.85); -webkit-backdrop-filter: blur(10px) saturate(1.1); backdrop-filter: blur(10px) saturate(1.1); border: 1px solid rgba(162,231,232,.28); border-radius: 2px; padding: 8px 14px; box-shadow: 0 8px 24px rgba(2,20,34,.45); } html.hc .theme-teal .banner .banner-detail-container { isolation: isolate; } html.hc .theme-teal .banner .banner-detail-container::before { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: -4% -6%; background: radial-gradient(115% 96% at 50% 46%, rgba(2,32,48,.50) 50%, rgba(2,32,48,.44) 78%, rgba(2,32,48,.18) 92%, rgba(2,32,48,0) 100%); } } /* ---- shared ------------------------------------------------------------- */ html.hc .s5 .s5face { background: rgba(3,40,56,.48); border-color: rgba(162,231,232,.30); } html.hc .s5 .s5peek .g { background: rgba(3,40,56,.40); } html.hc .s5 .s5txt p { color: #F6FCFC; } html.hc .s5 .s5txt .sig { color: #F6FCFC; } html.hc .s5 .s5bcap, html.hc .s5 .s5bcap * { color: #FFFFFF; } html.hc .s5 .s5story { color: #F6FCFC; } html.hc .theme-teal .banner .banner-detail-container .details p, html.hc .theme-teal .banner .banner-detail-container .details li, html.hc .theme-teal .banner .banner-detail-container .details h4, html.hc .theme-teal .banner .banner-detail-container .details .ex, html.hc .theme-teal .banner .banner-detail-container .details .seg, html.hc .theme-teal .banner .banner-detail-container .details .lead, html.hc .theme-teal .banner .banner-detail-container .details .outro, html.hc .s4 .s4copy p, html.hc .s2 .details-disc, html.hc .s2 .details-disc p { color: #F2FBFB; } html.hc .s2slot .artBtn > img:first-child { filter: contrast(1.16) brightness(1.03); } html.hc .s2 .s2slot .panel, html.hc #fhaMobile .s2slot .panel { background: rgba(3,40,56,.55); } html.hc .s2slot.invert .panel { background: #034153; } html.hc .dd .ddIn, html.hc .dd .ddIn p, html.hc .dd .ddIn .ex, html.hc .dd .ddIn span { color: #F2FBFB !important; } html.hc .s2 .svcName, html.hc #fhaMobile .svcName, html.hc .s2 .svcRow .svcName { color: #FFFFFF; } html.hc .s2 .svcPrice, html.hc #fhaMobile .svcPrice, html.hc .s2 .svcRow .svcPrice { color: #FFFFFF; } html.hc .theme-teal .legend, html.hc .theme-teal .legend *, html.hc .s2rows .legend, html.hc .s2rows .legend * { color: #F2FBFB !important; } html.hc .s2 .s2artist, html.hc #fhaMobile .s2artist { background: rgba(3,40,56,.55); } html.hc .s2artist .rl, html.hc #fhaMobile .s2artist .rl { color: #DFF1F1 !important; } html.hc .s2artist .nm, html.hc #fhaMobile .s2artist .nm { color: #F2FBFB !important; } html.hc .s2artist .svcSub, html.hc #fhaMobile .s2artist .svcSub { color: #E9F5F5 !important; } html.hc .s3 .s3bio { background: rgba(3,40,56,.42); border-radius: 2px; } /* legacy inline-gradient bars render as muted dark bands — bright ink */ html.hc [style*="#BEE6E6"], html.hc [style*="#BEE6E6"] p, html.hc [style*="#BEE6E6"] span, html.hc [style*="#BEE6E6"] b, html.hc [style*="#BEE6E6"] strong, html.hc [style*="#BEE6E6"] em, html.hc [style*="#BEE6E6"] h4, html.hc [style*="#BEE6E6"] a { color: #F6FCFC !important; } /* ---- mobile ------------------------------------------------------------- */ @media (max-width: 991px) { html.hc #fhaMobile .colInner .cc { position: relative; isolation: isolate; } html.hc #fhaMobile .colInner .cc::before { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: -10px -14px; background: radial-gradient(112% 100% at 50% 46%, rgba(2,32,48,.50) 52%, rgba(2,32,48,.44) 80%, rgba(2,32,48,.20) 93%, rgba(2,32,48,0) 100%); border-radius: 6px; } html.hc #fhaMobile .colInner p.mis { color: #F2FBFB; } html.hc #fhaMobile.s3m .colInner p, html.hc #fhaMobile.ngm .colInner p { color: #F6FCFC; } html.hc #fhaMobile .ngClose { color: #FFFFFF; } html.hc #fhaMobile .s4copy em, html.hc #fhaMobile .s4copy strong { color: #FFFFFF; } html.hc #fhaMobile .s2slot.s2acc .panel p, html.hc #fhaMobile .s2slot.s2acc .panel h4, html.hc #fhaMobile .s2slot.s2acc .panel b, html.hc #fhaMobile .s2slot.s2acc .panel span { color: #F6FCFC; } html.hc #fhaMobile .mbody, html.hc #fhaMobile .mbody p, html.hc #fhaMobile .mbody a, html.hc #fhaMobile .mbody span, html.hc #fhaMobile .mbody > span { color: #F2FBFB; } html.hc #fhaMobile .mtitle { color: #F6FCFC; } html.hc #fhaMobile .s2slot.s2acc .hdT { color: #F6FCFC; } html.hc #fhaMobile.s3m .colInner .s3name .t { color: #F2FBFB; } html.hc #fhaMobile .s3bio { color: #F2FBFB; background: rgba(3,40,56,.52); } html.hc #fhaMobile .mitem { background: linear-gradient(92deg, rgba(3,40,56,.54), rgba(2,50,64,.62)); border-color: rgba(162,231,232,.26); } html.hc #fhaMobile .s2slot.s2acc .panel { background: rgba(3,40,56,.60); border-radius: 2px; } html.hc #fhaMobile .idFly { background: rgba(2,34,50,.78); } html.hc #fhaMobile .idFly button { color: #F6FCFC; } html.hc #fhaMobile .menuSheet { background: rgba(2,34,50,.72); border-bottom-color: rgba(162,231,232,.35); } } /* ---- the menu toggle (both modes' styling lives here) -------------------- */ #fhaMobile .menuSheet .a11yT { display: block; width: 100%; background: none; border: 0; cursor: pointer; text-align: right; padding: 2px 0 0; margin-top: 4px; color: #CFF2F2; font-family: 'Playfair Display', serif; font-variant: small-caps; letter-spacing: .12em; font-size: 15px; line-height: 1.9; text-shadow: 0 1.5px 0.5px rgba(2,30,46,0.55); opacity: .85; } #fhaMobile .menuSheet .a11yT .st { font-size: 12px; letter-spacing: .08em; } html.hc #fhaMobile .menuSheet .a11yT { color: #A2E7E8; opacity: 1; } .banner-menu .a11yT { display: block; background: none; border: 0; cursor: pointer; width: 100%; text-align: right; padding: 10px 20px 0 0; margin-top: 6px; color: #EAF6F6; font-family: 'Playfair Display', serif; font-variant: small-caps; letter-spacing: .1em; font-size: 12px; opacity: .8; text-shadow: 0 1.5px 0.5px rgba(2,30,46,0.55); } html.hc .banner-menu .a11yT { color: #A2E7E8; opacity: 1; text-decoration: underline; text-underline-offset: 3px; }