/* Vendored from https://xfclubs.com/assets/xf-header.css?v=51dbc943 on 10 Nov 2026, unchanged. Re-copy when the site changes. */
/* xf-header.css: the ONE site header (.xfh), every page. R4 "one header", 24 Oct 2026.
   Markup comes from partials/header.html through tools/components.py (<!--XF:HEADER-->). These are the only header rules on the estate:
   no page and no other sheet carries header styling for .xfh.
   Brand Guide 2.2, ratified web tokens v1.0 (Nova 24 Oct 2026): black band, 1px hairline, sticky, 64px high (56px under 820px),
   wordmark 30px and always a link home named "XF Clubs, home", Join online 40px high at every width (3 Nov 2026: 12px of band above and below
   from 820px, 8px under; its tap area stays 44px through ::before), padding 0 24px (0 20px under 820px),
   Inter 600 14px uppercase +0.08em (14px from 3 Nov 2026, the same as every other XF button), black on Stadium Green #00B62E, radius 4px, focus ring 2px grey-200 offset 2px (never green).
   html scroll-padding-top (80px, 72px under 820px = band + 16px) keeps in-page jumps (#offer, #rides, #tour) and focus from landing under the sticky band (Nova change A).
   Self-contained on purpose: values are literal or --xfh-* custom properties set on .xfh, so the header looks the same on a page whose
   :root, body or reset is different (home, /ride/, /students/, /key-workers/, the club pages). Specificity is header.xfh so the old
   element rule  header{padding:28px 0 0}  that / and /ride/ still carry inline cannot reach it. */
header.xfh{
  --xfh-h:64px;--xfh-gutter:40px;--xfh-container:1200px;--xfh-btn-h:40px;
  position:sticky;top:0;z-index:100;
  display:block;box-sizing:border-box;width:auto;height:auto;min-width:0;min-height:0;flex:none;margin:0;padding:0;
  background:#0A0A0A;color:#FFFFFF;
  border:0;border-bottom:1px solid rgba(255,255,255,.12);
  font-family:'InterV','Inter','Helvetica Neue',-apple-system,sans-serif;font-size:17px;font-weight:400;line-height:1.7;
  letter-spacing:normal;text-transform:none;text-align:left;font-style:normal;font-variant-numeric:normal;
  -webkit-font-smoothing:antialiased;
}
html{scroll-padding-top:80px}
@media (max-width:819.98px){header.xfh{--xfh-h:56px;--xfh-gutter:20px;--xfh-btn-h:40px;--xfh-btn-pad:20px;font-size:16px}html{scroll-padding-top:72px}}
header.xfh *,header.xfh *::before,header.xfh *::after{box-sizing:border-box}
header.xfh .xfh-in{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  width:auto;max-width:var(--xfh-container);height:var(--xfh-h);margin:0 auto;padding:0 var(--xfh-gutter);
}
header.xfh .xfh-home{
  display:inline-flex;align-items:center;min-height:44px;min-width:44px;margin:0;padding:0;
  color:#FFFFFF;text-decoration:none;
}
header.xfh .xfh-home .wm{display:block;height:30px;width:auto;max-width:none;margin:0}
header.xfh .xfh-join{
  display:inline-flex;align-items:center;justify-content:center;
  position:relative;min-height:var(--xfh-btn-h);margin:0;padding:0 var(--xfh-btn-pad,24px);border:0;border-radius:4px;
  background:#00B62E;color:#0A0A0A;
  font-family:inherit;font-size:14px;font-weight:600;line-height:1;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
}
header.xfh .xfh-join::before{content:"";position:absolute;left:0;right:0;top:-2px;bottom:-2px}
header.xfh .xfh-join:hover{background:#009E28}
header.xfh .xfh-join:active{background:#009526}
header.xfh a:focus-visible{outline:2px solid #C7C7C5;outline-offset:2px}
@media (prefers-reduced-motion:no-preference){header.xfh .xfh-join{transition:background 200ms cubic-bezier(.4,0,.2,1),box-shadow 200ms cubic-bezier(.4,0,.2,1)}}
@media (forced-colors:active){header.xfh .xfh-join{border:1px solid ButtonText}}