.header{position:relative;z-index:5;max-width:none;margin:0;padding:22px max(5%,calc((100% - 1296px)/2)) 18px;gap:36px;background:var(--color-cobalt);color:var(--color-ivory)}
.header .brand-linear{display:block;width:210px;height:auto;filter:brightness(0) invert(1)}
.header .brand,.site-footer .brand{min-height:44px}
.header nav{align-items:center;gap:clamp(16px,2.5vw,38px)}
.header nav a{color:var(--color-ivory)}
.header .nav-watch{background:var(--color-gold);color:var(--color-ink-on-gold);padding:9px 22px;font-size:var(--cta-font-size);font-weight:var(--cta-font-weight);line-height:var(--cta-line-height)}
.header .nav-watch:hover{background:var(--color-ivory);color:var(--color-ink);text-decoration:none}
.header nav a[aria-current="page"]{text-decoration-thickness:2px;text-underline-offset:7px}
.header a:focus-visible{outline-color:var(--color-gold);box-shadow:none}
@media(max-width:1000px){.header{gap:15px}.header .brand-linear{width:180px}}
@media(max-width:760px){
  .header{padding:20px 6% 12px;flex-wrap:wrap;gap:12px}
  .header .brand-linear{width:165px;height:auto}
  .header nav{width:100%;margin:0;justify-content:space-between;gap:8px;flex-wrap:nowrap}
  .header nav a{font-size:var(--type-meta)}
  .header .nav-watch{position:absolute;top:20px;right:6%;padding:7px 15px}
}
@media(max-width:420px){.header .brand-linear{width:150px}.header nav a{font-size:var(--type-label)}.header .nav-watch{padding:7px 12px}}
@media(max-width:360px){
  .header nav{flex-wrap:nowrap;justify-content:space-between;gap:4px}
  .header nav a{font-size:var(--type-tiny);white-space:nowrap}
  .header .nav-watch{margin-left:0;padding:6px 9px;font-size:var(--type-body);gap:6px}
}
.site-footer{
  max-width:none;
  margin:0;
  display:block;
  padding:0;
  border-top:1px solid var(--color-border);
  background:var(--color-paper);
  color:var(--color-ink);
}
.site-footer a{touch-action:manipulation}
.footer-inner{
  max-width:1440px;
  margin:0 auto;
  padding:clamp(48px,5vw,72px) max(5%,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(5%,env(safe-area-inset-left));
}
.footer-main{
  display:grid;
  grid-template-columns:minmax(260px,1.25fr) minmax(180px,.65fr) minmax(250px,.9fr);
  gap:clamp(36px,6vw,90px);
  align-items:start;
}
.site-footer .brand-linear{display:block;width:190px;height:auto}
.site-footer p{width:auto;margin:17px 0 0;font-size:var(--type-body);color:var(--color-text-muted)}
.footer-brand p{max-width:30ch}
.footer-heading{
  margin:0 0 13px;
  font-family:var(--font-display);
  font-size:var(--type-lead);
  font-weight:var(--weight-medium);
  line-height:1.25;
  letter-spacing:0;
}
.footer-links{display:grid;gap:2px}
.footer-links a,.footer-meta a{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:44px;
  text-underline-offset:5px;
}
.footer-links a[aria-current="page"]{font-weight:var(--weight-bold);text-decoration-thickness:2px}
.site-footer .footer-watch{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:11px 20px;
  border-radius:100px;
  background:var(--color-gold);
  color:var(--color-ink-on-gold);
  font-size:var(--cta-font-size-utility);
  font-weight:var(--cta-font-weight);
  line-height:var(--cta-line-height);
  text-decoration:none;
  white-space:normal;
  transition:transform .2s ease;
}
.footer-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:clamp(40px,5vw,64px);
  padding-top:20px;
  border-top:1px solid var(--color-border);
}
.site-footer .footer-meta small{font-size:var(--type-label);color:var(--color-text-muted)}
@media(hover:hover){
  .site-footer .footer-watch:hover{background:var(--color-orange-action);color:var(--color-on-orange-action);transform:translateY(-2px)}
  .footer-links a:hover,.footer-meta a:hover{text-decoration-thickness:2px}
}
@media(max-width:900px){
  .footer-main{grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr)}
  .footer-connect{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:28px;border-top:1px solid var(--color-border)}
  .footer-connect .footer-heading{margin:0}
}
@media(max-width:620px){
  .footer-inner{padding-top:42px;padding-right:max(6%,env(safe-area-inset-right));padding-left:max(6%,env(safe-area-inset-left))}
  .footer-main{grid-template-columns:1fr;gap:34px}
  .site-footer .brand-linear{width:175px}
  .site-footer p{margin-top:14px}
  .footer-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .footer-connect{grid-column:auto;display:block;padding-top:30px}
  .footer-connect .footer-heading{margin-bottom:16px}
  .site-footer .footer-watch{width:100%}
  .footer-meta{margin-top:42px}
}
/* What shows when a page is pulled past its top or bottom is the root background, not the page. Blue
   meets the header at the top; site.js switches it to the footer's paper once you are past halfway. */
html{background:var(--color-cobalt)}
html.near-end{background:var(--color-paper)}
@media print{html{background:none}}