/* 2026-10-13: shared header/footer chrome for the 9 pages still running on
   assets/site.css. Deliberately self-contained (no shared :root, no var()
   dependency on precision-home.css) so it can be loaded alongside site.css
   without colliding with its own :root tokens, body font or base rules.
   Values are ported from assets/precision-home.css so header and footer
   look identical to the precision homepage; .container is intentionally
   NOT redefined here so the new header/footer line up with each page's
   existing (site.css) content width. */

.skip{position:absolute;z-index:50;left:12px;top:-100px;color:#fff;background:#222;padding:10px 14px;font-family:'Inter','Segoe UI',Arial,sans-serif}
.skip:focus{top:10px}

.utility{height:35px;background:#19232e;color:#b0bcc7;display:flex;align-items:center;font:500 10px 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.05em}
.utility__inside{display:flex;justify-content:space-between;gap:20px}
.utility a{color:#f3f5f5}
.utility__contacts{display:flex;gap:25px}
.utility__contacts a{white-space:nowrap}

.header{position:sticky;top:0;z-index:30;background:#111921;color:#e6ecf0;border-bottom:1px solid #3d4b58;transition:background-color .25s,box-shadow .25s}
.header.is-scrolled{background:rgba(17,25,33,.96);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.25)}
.header__inside{display:flex;height:86px;align-items:center;gap:clamp(14px,1.55vw,29px)}
.brand{display:flex;align-items:center;width:185px;flex:none}
.brand img{width:172px;height:70px;object-fit:contain;background:#fff;padding:8px 15px}
.desktop-nav{display:flex;align-items:center;gap:clamp(14px,1.6vw,26px);margin-inline:auto}
.desktop-nav a{color:#cbd3d9;font-family:'Inter','Segoe UI',Arial,sans-serif;font-size:clamp(14.5px,1.15vw,16px);font-weight:600;letter-spacing:.005em;white-space:nowrap;transition:color .2s}
.desktop-nav a:hover{color:#fff}
.nav-contact{display:flex;gap:24px;align-items:center;justify-content:center;white-space:nowrap;background:#bd1d70;color:#fff;padding:14px 19px;min-height:46px;font-family:'Inter','Segoe UI',Arial,sans-serif;font-size:12px;font-weight:700;transition:background .2s}
.nav-contact:hover{background:#9f0953}
.menu-button{display:none;width:46px;height:46px;background:transparent;color:#fff;border:1px solid #697782}
.menu-button span{display:block;width:20px;height:2px;background:#fff;margin:5px auto}
.mobile-nav[hidden]{display:none}
.mobile-nav:not([hidden]){animation:chromeNavIn .22s ease both}
@keyframes chromeNavIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}

html{scroll-padding-top:88px}

@media(max-width:1380px){.desktop-nav{gap:14px}.header__inside{gap:15px}}
@media(max-width:1280px){
  .desktop-nav,.nav-contact{display:none}
  .menu-button{display:block;margin-left:auto}
  .mobile-nav:not([hidden]){display:grid;grid-template-columns:1fr 1fr;gap:0;padding:8px 24px 22px;background:#131f2a;border-top:1px solid #41505a}
  .mobile-nav a{padding:13px 7px;border-bottom:1px solid #42515c;font-family:'Inter','Segoe UI',Arial,sans-serif;font-size:15px;color:#cbd3d9}
  .header__inside{height:74px}
}
@media(max-width:600px){
  .utility__contacts{gap:4px;flex-direction:column}
  .utility{height:auto;padding:9px 0}
  .utility__inside{flex-direction:column;gap:4px;font-size:9px}
  .header__inside{height:69px}
  .brand img{width:147px;height:59px}
  .mobile-nav:not([hidden]){grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .header{transition:none!important}
  .mobile-nav:not([hidden]){animation:none!important}
}

.footer{background:#f1f2f0;color:#33414a;font-family:'Inter','Segoe UI',Arial,sans-serif}
.footer .container{width:min(calc(100% - 40px),1240px);margin-inline:auto}
.footer__main{padding:63px 0;display:flex;align-items:start;justify-content:space-between;gap:32px;border-bottom:1px solid #cbd2d5}
.footer__about{max-width:275px}
.footer__brand img{width:158px}
.footer__about p{font-size:12px;line-height:1.7;color:#596875;margin:19px 0 0}
.footer__nav{display:grid;grid-template-columns:repeat(3,max-content);gap:clamp(24px,3vw,54px)}
.footer__nav>div{display:flex;flex-direction:column;align-items:start;gap:12px}
.footer__nav b{font:600 10px 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.09em;color:#bb1369;margin-bottom:5px}
.footer__nav a{font-size:12px;line-height:1.45;color:#33414a}
.footer__nav a:hover{color:#bb1369}
.footer__bottom{padding:22px 0 34px;display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:space-between;color:#6e7980;font:500 10px 'IBM Plex Mono',ui-monospace,monospace}
.footer__bottom a{margin-right:10px;color:#6e7980}
.footer__bottom a:hover{color:#33414a}

@media(max-width:1080px){.footer__nav{grid-template-columns:repeat(3,max-content)}}
@media(max-width:920px){.footer__main{flex-direction:column;align-items:start}}
@media(max-width:600px){
  .footer .container{width:calc(100% - 36px)}
  .footer__nav{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:31px 14px}
  .footer__nav a{overflow-wrap:anywhere}
  .footer__brand img{width:155px}
  .footer__bottom{gap:18px;justify-content:flex-start}
}
