/* Shared header, footer and theme button, every page. Literal brand colors so it works with any page stylesheet. */
.skip{position:absolute;left:-9999px;top:8px;background:#141414;color:#fff;padding:8px 12px;border-radius:6px;z-index:60;text-decoration:none} .skip:focus{left:12px;color:#fff}
.hdr{position:sticky;top:0;z-index:20;height:72px;border-bottom:1px solid transparent;transition:background .2s,border-color .2s;font-family:"Public Sans",system-ui,sans-serif}
.hdr.solid{background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom-color:#E3E3E3}
html.dark .hdr.solid{background:rgba(20,20,20,.9);border-bottom-color:#2E2E2E}
body.home .hdr{position:fixed;left:0;right:0}
.hdr-in{max-width:1200px;margin:0 auto;padding:0 32px;height:100%;display:flex;align-items:center}
.hdr .dock{display:block;width:130px;height:30px;flex:none}
.hdr .dlogo{display:block;line-height:0;color:#141414} html.dark .hdr .dlogo{color:#fff}
.hdr .dlogo svg{display:block;width:100%;height:auto}
body.home .hdr .dlogo{visibility:hidden} html.logo-docked body.home .hdr .dlogo{visibility:visible} html.fly-on body.home .hdr .dlogo{visibility:hidden}
.hdr .nav{display:flex;gap:30px;margin-left:auto}
.hdr .nav a{font-size:15px;font-weight:500;color:#383838;text-decoration:none} .hdr .nav a:hover{color:#141414;text-decoration:underline;text-underline-offset:6px}
.hdr .nav a[aria-current="page"]{color:#B45200;text-decoration:underline;text-underline-offset:6px}
html.dark .hdr .nav a{color:#D6D6D6} html.dark .hdr .nav a:hover{color:#fff} html.dark .hdr .nav a[aria-current="page"]{color:#FD9033}
.hdr .acts{display:flex;align-items:center;gap:14px;margin-left:36px;padding-left:20px;border-left:1px solid #D6D6D6;height:28px} html.dark .hdr .acts{border-left-color:#383838}
.hdr .login{font-size:15px;font-weight:600;color:#383838;text-decoration:none} .hdr .login:hover{color:#141414;text-decoration:underline}
html.dark .hdr .login{color:#D6D6D6} html.dark .hdr .login:hover{color:#fff}
.hdr .btn-su{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:10px;background:#FD7400;color:#141414;font:600 15px/1 "Public Sans",system-ui,sans-serif;text-decoration:none;white-space:nowrap} .hdr .btn-su:hover{background:#E66A00;color:#141414}
.theme{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 8px;border:1px solid transparent;border-radius:8px;background:none;color:#4D4D4D;font:500 13px/1 "Public Sans",system-ui,sans-serif;cursor:pointer}
.theme:hover{border-color:#D6D6D6;color:#141414} html.dark .theme{color:#B3B3B3} html.dark .theme:hover{border-color:#383838;color:#fff}
.theme svg{width:18px;height:18px;display:none;flex:none}
html[data-theme-pref="light"] .theme .g-light,html[data-theme-pref="dark"] .theme .g-dark,html[data-theme-pref="system"] .theme .g-system,html:not([data-theme-pref]) .theme .g-system{display:block}
html[data-theme-pref="light"] .theme .tl:after{content:"Light"} html[data-theme-pref="dark"] .theme .tl:after{content:"Dark"} html[data-theme-pref="system"] .theme .tl:after,html:not([data-theme-pref]) .theme .tl:after{content:"System"}
.hdr :focus-visible,.sfoot :focus-visible{outline:2px solid #E66A00;outline-offset:2px} html.dark .hdr :focus-visible,.sfoot :focus-visible{outline-color:#FD9033}
.sfoot{background:#141414;color:#fff;padding:52px 0 44px;font-family:"Public Sans",system-ui,sans-serif} html.dark .sfoot{background:#1C1C1C;border-top:1px solid #2E2E2E}
.sfoot-in{max-width:1200px;margin:0 auto;padding:0 32px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}
.sfoot .flogo{display:block;width:118px;line-height:0;color:#fff} .sfoot .flogo svg{width:100%;height:auto;display:block}
.sfoot .tagline{margin:0;color:#ECECEC;font-weight:600;font-size:16px}
.sfoot .flinks{display:flex;gap:24px;margin-left:auto} .sfoot .flinks a{color:#ECECEC;text-decoration:none;font-size:15px} .sfoot .flinks a:hover{color:#fff;text-decoration:underline}
.sfoot .copy{margin:0;color:#B3B3B3;font-size:15px}
@media (max-width:1020px){.hdr .nav{display:none} .hdr .acts{margin-left:auto;border-left:0;padding-left:0}}
@media (max-width:700px){.hdr{height:60px} .hdr-in{padding:0 20px} .hdr .dock{width:112px;height:26px} .hdr .acts{gap:10px} .hdr .btn-su{height:38px;padding:0 12px;font-size:14px} .theme .tl{display:none} .theme{padding:0 6px}
 .sfoot-in{padding:0 20px} .sfoot .flinks{margin-left:0;width:100%}}
/* Touch / small screens (iPhone Safari): the solid header fades in with an opacity-only layer (compositor),
   not a background-color/backdrop-filter transition that repaints every frame. Same look. */
@media (max-width:1020px),(hover:none){
 .hdr,.hdr.solid,html.dark .hdr.solid{transition:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent}
 .hdr:before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;border-bottom:1px solid #E3E3E3;opacity:0;transition:opacity .2s;pointer-events:none;will-change:opacity}
 html.dark .hdr:before{background:#141414;border-bottom-color:#2E2E2E}
 .hdr.solid:before{opacity:1}
}
@media (prefers-reduced-motion:reduce){.hdr,.hdr:before{transition:none}}