/* Shared navigation for the WebmPros approach section. */
.nav-about { position:relative; flex-shrink:0; }
.nav-about > summary { list-style:none; display:flex; align-items:center; gap:5px; cursor:pointer; }
.nav-about > summary::-webkit-details-marker { display:none; }
.nav-about > summary::marker { content:''; }
.nav-about > summary > .icon { width:12px; height:12px; stroke-width:2; }
.nav-about[open] > summary > .icon { transform:rotate(180deg); }
.nav-about > summary:focus-visible { outline:3px solid #549cfa; outline-offset:6px; border-radius:2px; }
.about-menu { position:absolute; top:calc(100% + 21px); right:-30px; width:294px; padding:9px; border-radius:10px; background:#0c1e2b; border:1px solid #314554; box-shadow:0 18px 45px #0004; z-index:55; }
.about-menu::before { content:''; position:absolute; height:24px; inset: -24px 0 auto; }
.about-menu a { display:block; padding:12px 13px; border-radius:6px; text-align:left; color:#f3f6f9; }
.about-menu a + a { border-top:1px solid #223443; }
.about-menu strong { font-size:13px; line-height:1.5; font-weight:650; display:block; }
.about-menu a > span { display:block; margin-top:3px; font-size:11px; line-height:1.5; color:#adbfcc; font-weight:400; }
.about-menu a:hover,.about-menu a[aria-current="page"] { background:#183141; }
.about-menu a[aria-current="page"] strong { color:#ff7e84; }
.footer-method { display:flex; flex-wrap:wrap; align-items:center; gap:13px 27px; padding:24px 0; border-top:1px solid #1c2c37; margin-top:30px; }
.footer-method > span { font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:#92a9b9; }
.footer-method a { color:#c3d1db; font-size:12px; line-height:1.6; }
.footer-method a:hover { text-decoration:underline; text-underline-offset:4px; color:#fff; }
.footer-method + .footer-resources { margin-top:0; }
.approach-promo { border-top:1px solid #e2e9ed; background:#f4f7f9; padding:33px 0; }
.approach-promo > .container { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.approach-promo p { color:#b4222c; font-size:11px; letter-spacing:.04em; text-transform:uppercase; font-weight:700; margin-bottom:10px; }
.approach-promo h2 { color:#1d3445; font-size:20px; line-height:1.5; font-weight:650; letter-spacing:-.025em; max-width:740px; }
.approach-promo .text-link { color:#143449; font-size:13px; flex-shrink:0; white-space:nowrap; }
@media(max-width:1100px){
 .about-menu { right:-15px; }
 .approach-promo > .container { gap:22px; }
 .approach-promo h2 { font-size:18px; }
 .approach-promo .text-link { white-space:normal; flex-shrink:1; min-width:180px; }
}
@media(max-width:900px){
 .nav-about { width:100%; }
 .nav-about > summary { justify-content:space-between; min-height:44px; }
 .nav-about > summary > .icon { width:17px; height:17px; }
 .about-menu { position:static; width:100%; box-shadow:none; padding:5px 7px; margin:6px 0 10px; background:#102736; border-color:#2a4253; }
 .about-menu::before { display:none; }
 .about-menu a { padding:12px; }
 .about-menu strong { font-size:13px; }
 .about-menu a > span { font-size:11px; }
 .footer-method { gap:14px 23px; }
 .approach-promo > .container { align-items:flex-start; flex-direction:column; gap:18px; }
}
@media(max-width:650px){
 .footer-method { gap:13px 19px; padding:24px 0; margin-top:26px; }
 .footer-method > span { width:100%; font-size:10px; }
 .footer-method a { font-size:11px; }
 .approach-promo { padding:28px 0; }
 .approach-promo h2 { font-size:18px; line-height:1.5; }
}
@media(prefers-reduced-motion:reduce){
 .nav-about > summary > .icon { transition:none; }
}
@media print{
 .footer-method,.approach-promo { display:none !important; }
}

/* Four sitemap groups stay balanced on desktop and stack on phones. */
.sitemap-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:650px){ .sitemap-grid { grid-template-columns:1fr; } }
