/* Shared brand details and persistent navigation. */
:root{--orange-brand:#f1542a;--orange-paper:#e84b25;--orange-small:#9b341d;--blue-muted:#7b98a8}
.paper,.about-paper,.hww-hero,.hww-final{--orange:var(--orange-paper)}
.dark,.about-dark,.faq-intro,.cs-shift,.cs-travel-feature{--orange:var(--orange-brand)}
.paper .kicker,.about-paper .kicker,.hww-hero .kicker,.hww-final .kicker{color:var(--orange-small)}
.dark .kicker,.about-dark .kicker,.about-title-callout .kicker{color:var(--orange-brand)}
.about-paper .about-punchline{color:var(--orange-small)}
body.has-pinned-nav{padding-top:72px}
.has-pinned-nav .site-header{position:fixed;inset:0 0 auto;width:100%;height:72px;z-index:1000;box-shadow:0 3px 12px #0002}
.has-pinned-nav main section[id],.has-pinned-nav main article[id],.has-pinned-nav main aside[id],.has-pinned-nav main>div[id]{scroll-margin-top:96px}
.hww-final-copy h2{color:var(--ink)}


@media(max-width:820px){body.has-pinned-nav{padding-top:68px}.has-pinned-nav .site-header{height:68px}}

/* Clip sideways art without creating a second vertical scroll container. */
@supports(overflow:clip){html,body.has-pinned-nav{overflow-x:clip}}
.has-pinned-nav .site-nav a:focus-visible,.has-pinned-nav .menu-toggle:focus-visible{outline:2px solid #f1542a;outline-offset:5px}
.has-pinned-nav .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:1100px){.has-pinned-nav .site-footer{flex-wrap:wrap}}
@media(max-width:820px){
 .has-pinned-nav .menu-toggle{min-height:44px;min-width:64px}
 .has-pinned-nav .site-nav{max-height:calc(100dvh - 68px);overflow-y:auto;gap:6px;padding:16px 24px 24px;box-shadow:0 16px 24px #0003}
 .has-pinned-nav .site-nav>a{min-height:44px;display:flex;align-items:center}
 .has-pinned-nav .site-nav>.btn{margin-top:8px}
 .has-pinned-nav .site-footer{display:grid;grid-template-columns:116px minmax(0,1fr);padding-inline:24px;gap:16px 20px}
 .has-pinned-nav .site-footer>span{line-height:1.6}
 .has-pinned-nav .footer-links{grid-column:1/-1;gap:4px 20px;width:100%}
 .has-pinned-nav .back-top{grid-column:1/-1;justify-self:start}
 .has-pinned-nav .footer-links a,.has-pinned-nav .back-top{min-height:44px;display:inline-flex;align-items:center;font-size:12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}

/* Orange buttons use navy text; the FAQ's paper button also keeps its label visible. */
.dark .btn,#services .btn,.about-dark .btn{color:var(--cta-blue)!important;background:var(--orange-brand)}
.dark .btn:hover,#services .btn:hover,.about-dark .btn:hover{color:var(--cta-blue)!important;background:var(--paper)}
.faq-capability .btn{color:var(--cta-blue)!important;background:var(--paper)}
.faq-capability .btn:hover{background:var(--orange-brand)}

/* The extra capability link needs a dropdown before the desktop row gets tight. */
@media(min-width:821px) and (max-width:1000px){
 .has-pinned-nav .menu-toggle{display:block;min-width:64px;min-height:44px;cursor:pointer}
 .has-pinned-nav .site-nav{position:absolute;inset:72px 0 auto;display:none;flex-direction:column;align-items:flex-start;gap:6px;margin-left:0;padding:16px 32px 24px;max-height:calc(100dvh - 72px);overflow-y:auto;background:var(--black);border-bottom:1px solid #f3ecdb30;box-shadow:0 16px 24px #0003}
 .has-pinned-nav .site-nav.open{display:flex}
 .has-pinned-nav .site-nav>a{min-height:44px;display:flex;align-items:center}
 .has-pinned-nav .site-nav>.btn{margin-top:8px}
}