/* Text enlargement: scoped to the ten brand-service pages that include this file. */
@media(max-width:800px){
  .service-page.visual-system .service-header.site-header{flex-wrap:wrap}
  .service-page.visual-system .service-mobile-nav{max-width:100%}
  .service-page.visual-system .service-hero{grid-template-columns:minmax(0,1fr)}
  .service-page.visual-system .service-hero>*{min-width:0}
  .service-page.visual-system .service-hero h1{overflow-wrap:anywhere;hyphens:auto}
}
/* A dark ring on light surfaces and a white ring on dark surfaces. */
.service-page.visual-system :focus-visible{outline:3px solid #111!important;outline-offset:3px;box-shadow:0 0 0 6px #fff}

@media(max-width:800px){.service-page.visual-system .service-mobile-nav>nav{max-height:calc(100dvh - 100% - 16px)}}

.service-page.visual-system .local-skip-link:not(:focus){transform:translateY(-200%)}

@media(max-width:800px){
.service-page.visual-system .service-related-list{grid-template-columns:minmax(0,1fr)}
.service-page.visual-system .service-related-list a{min-width:0;overflow-wrap:anywhere}
.service-page.visual-system .site-footer .footer-brand-tooltip{min-width:0;max-width:85px;overflow-wrap:anywhere}
}

@media(max-width:800px){
.service-page.visual-system [id],.service-page.visual-system main :is(a,button,input,select,summary,[tabindex]){scroll-margin-top:190px}
}

/* Keep the open navigation inside the viewport when text is enlarged. */
@media(max-width:800px){
 .service-page.visual-system .service-mobile-nav>nav{grid-template-columns:minmax(0,1fr)}
 .service-page.visual-system .service-mobile-nav>nav>*{min-width:0}
 .service-page.visual-system .mobile-nav-primary{grid-template-columns:repeat(2,minmax(0,1fr))}
 .service-page.visual-system .service-mobile-nav :is(a,.nav-brand-card,.nav-brand-title,.mobile-nav-contact){min-width:0;overflow-wrap:anywhere;white-space:normal}
}
@media(max-width:380px){
 .service-page.visual-system .mobile-nav-primary{grid-template-columns:minmax(0,1fr)}
}

/* Long labels remain readable in the narrow footer and related section. */
@media(max-width:800px){
 .service-page.visual-system .service-related h2{overflow-wrap:anywhere}
}
@media(max-width:600px){
 .service-page.visual-system .site-footer,
 .service-page.visual-system .site-footer .site-footer-contact,
 .service-page.visual-system .site-footer .site-footer-bottom nav{grid-template-columns:minmax(0,1fr)}
 .service-page.visual-system .site-footer :is(p,a,button,summary){min-width:0;overflow-wrap:anywhere}
}

/* Enlarged desktop navigation can use a second line. */
@media(min-width:801px){
 .service-page.visual-system .service-header.site-header{flex-wrap:wrap}
 .service-page.visual-system [id],.service-page.visual-system main :is(a,button,input,select,summary,[tabindex]){scroll-margin-top:230px}
}
