/* brand-slogan.css — Gov508 brand logo (Eric approved 2026-11-04 19:00; Graphics).
   Plain picture on navy (images/gov508-logo-dark-navy-bg.png, 828 x 161): no sprite cropping, so these rules
   switch off the old cropping rules for the header and footer logo. */
.gov508-header .brand-artwork.brand-slogan,.footer-logo-frame.brand-slogan{aspect-ratio:828/161;overflow:visible}
.gov508-header .brand-artwork.brand-slogan .brand-logo,.footer-logo-frame.brand-slogan img{position:static;display:block;left:auto;top:auto;width:100%;max-width:100%;height:auto}
/* Menu: "Clarity" stays highlighted on the four edition pages (aria-current="true", 2026-11-02). */
.gov508-header .site-nav a[aria-current=true]{background:#183558;color:#fff;border-radius:.4rem;padding-inline:.55rem;text-decoration:underline;text-decoration-color:#5fd438;text-decoration-thickness:3px;text-underline-offset:.4em}

/* header-size-20261102: larger approved header logo, preserving artwork and nav space. */
.gov508-header .brand{flex-basis:32rem;max-width:32rem}
@media(max-width:74rem){.gov508-header .brand{flex:0 1 32rem;width:min(32rem,calc(100% - 5rem));max-width:calc(100% - 5rem)}}
@media(max-width:30rem){.gov508-header .brand{flex-basis:calc(100% - 5rem);width:calc(100% - 5rem);max-width:calc(100% - 5rem)}}

/* Black header (Eric 2026-11-04 19:50). White text on black; the menu highlight is dark gray so white text keeps high contrast. */
.site-header.gov508-header{background:#000;border-bottom-color:#3a3a3a}
.gov508-header .site-nav a[aria-current=page],.gov508-header .site-nav a[aria-current=true],.gov508-header .site-nav a:hover,.gov508-header .nav-toggle{background:#262626}
@media(forced-colors:active){.site-header.gov508-header{background:Canvas}}

/* 2026-11-04 19:55 (Eric): footer matches the black header; navy boxes become black; the logo-green line replaces the orange accent lines. */
html body .site-footer.gov508-footer{background:#000;border-top:3px solid #3cf814}
html body .footer-logo-frame.brand-slogan{aspect-ratio:1000/168}
html body .site-header.gov508-header{border-bottom:3px solid #3cf814}
html body aside.scope-panel{background:#0d0d0d;border-left:5px solid #3cf814}
html body .mission-scripture{background:#0d0d0d;border-left-color:#3cf814}
html body .mission-invitation{border-left-color:#38c018}
@media(forced-colors:active){html body .site-footer.gov508-footer,html body .site-header.gov508-header{border-color:CanvasText}}

/* Footer layout (Eric 2026-11-04 20:44): the legal line breaks in the middle; menu links never word-wrap.
   Wide screens: logo and legal text left, menus right, each menu on one line.
   Medium screens: menus move below the legal text, still one line each.
   Phones (under 48rem): menus may wrap so nothing scrolls sideways (WCAG 1.4.10 Reflow). */
html body .footer-primary-links a,html body .footer-utility-links a{white-space:nowrap}
@media(min-width:48rem){html body .footer-primary-links,html body .footer-utility-links{flex-wrap:nowrap}}
@media(min-width:48rem) and (max-width:83.99rem){html body .footer-main{flex-direction:column;align-items:flex-start}html body .footer-primary-links,html body .footer-utility-links{justify-content:flex-start}}
@media(min-width:84rem){html body .footer-links-block{flex:0 0 auto}html body .footer-brand-block{flex:1 1 auto;min-width:0}}
/* Legal text: left of center, exactly two lines (Eric 2026-11-04 20:45 and 20:53). Width in em so it holds at any zoom. */
html body .footer-legal{max-width:none}
html body .footer-legal p{max-width:42em}