@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;700&display=swap");
:root {
  --gb3-dark: #0a0a0b;
  --gb3-dark-band: #101012;
  --gb3-dark-hover: #131316;
  --gb3-dark-tile: #17171a;
  --gb3-light: #ffffff;
  --gb3-light-band: #f4f3f1;
  --gb3-light-hover: #ebe9e5;
  --gb3-ink-dark: #f5f5f4;
  --gb3-ink-dark-secondary: #b6b7ba;
  --gb3-ink-dark-tertiary: #9a9b9f;
  --gb3-ink-dark-meta: #8b8c90;
  --gb3-ink-light: #111113;
  --gb3-ink-light-body: #4a4b50;
  --gb3-ink-light-meta: #6b6c70;
  --gb3-red: #ed1b23;
  --gb3-red-light: #c2141b;
  /* Third place in a result grid. Two values for the same reason the red has two: the `-light` one
     is the value used ON the light surfaces, and it runs darker so it holds against white the way
     --gb3-red-light does. Both carry white text at 5:1 or better. A brighter, medal-like bronze
     (#cd7f32) drops white to 3.1:1 and reads loud next to a palette this muted. */
  --gb3-bronze: #96602c;
  --gb3-bronze-light: #7d4f22;
  /* The red nav bar's own furniture. Separate tokens because these are only ever read against the
     red - a line or an ink picked for the dark bands is muddy or invisible on it. */
  --gb3-on-red: rgba(255, 255, 255, 0.82);
  --gb3-line-red: rgba(10, 10, 11, 0.22);
  --gb3-line-dark: rgba(245, 244, 244, 0.12);
  --gb3-line-dark-soft: rgba(245, 244, 244, 0.09);
  --gb3-line-light: rgba(17, 17, 19, 0.14);
  --gb3-line-light-soft: rgba(17, 17, 19, 0.1);
  --gb3-portrait: radial-gradient(circle at 50% 38%, #6b0d14, #2a0508 72%);
  --gb3-font: "Archivo", sans-serif;
  --gb3-mono: "JetBrains Mono", monospace;
  --gb3-shell: 1280px;
  /* The column INSIDE the shell. --gb3-shell is the outer width, gutters included: .grid-container
     is 1280 wide with 36px of padding, so its text starts at (viewport - 1280) / 2 + 36.
     A wrapper that carries no gutter of its own - because the full-bleed section around it does -
     must cap to this instead, or it lands 36px left of everything else. Any symmetrically padded
     parent gives the same answer, so this is always the right cap for an unpadded wrapper. */
  --gb3-column: calc(var(--gb3-shell) - (var(--gb3-gutter) * 2));
  /* How far the outer margins of a full-bleed dark band lift away from its own colour. A tint
     rather than a fixed colour so every band keeps its base and gains the same relative lift. */
  --gb3-edge-lift: rgba(245, 244, 244, 0.12);
  /* How far in from each edge the lift reaches. Independent of --gb3-shell on purpose: tying it
     to the content column meant the effect vanished entirely on any window narrower than 1280,
     and was only ~70px wide at 1440. */
  --gb3-edge-fade: clamp(90px, 15%, 300px);
  /* Partner logo box. One value so the container and the image cap cannot drift apart. */
  --gb3-partner-mark: 62px;
  --gb3-gutter: 36px;
  /* The header's two bands, as numbers the rest of the sheet can offset against. On desktop the red
     bar sticks and the utility strip above it scrolls away, so anything else that sticks to the
     viewport, and every in-page anchor, has to clear --gb3-sticky-header or it lands underneath the
     bar. One value for the bar rather than a measurement in each consumer, so they cannot drift. */
  --gb3-utility-bar: 42px;
  --gb3-sticky-header: 81px;
  /* The red bar once the page has scrolled - see "Compacting once scrolled". 68px on a phone. */
  --gb3-bar-compact: 60px;
  /* Where an anchor jump lands: clear of whatever part of the header is stuck, plus a little air. */
  --gb3-anchor-offset: calc(var(--gb3-sticky-header) + 16px);
}

/* On a phone the section links wrap onto a second row under the logo, so the full header is 141px. */
@media print, screen and (max-width: 39.9375em) {
  :root {
    --gb3-bar-compact: 68px;
    --gb3-anchor-offset: 157px;
  }
}
/* With the script running, the bar compacts as soon as the page scrolls - and every consumer of these
   values only matters on a scrolled page: a table header or side panel only sticks once it has been
   scrolled to, and an anchor jump always lands somewhere down the page. So they offset against the
   COMPACT bar, and it is always the right answer at the moment they apply. gb3-2026.js sets the class
   when it starts; without it the header never compacts and the full-height values above stand. */
html.gb3-header-compacts {
  --gb3-sticky-header: var(--gb3-bar-compact);
  --gb3-anchor-offset: calc(var(--gb3-bar-compact) + 16px);
}

/* A driver's flag. One rule for all four places that show nationality - the standings table, the
   directory card, the profile hero and its entry details - because they should not drift apart.
   The artwork is the estate's own blob, which is photographic JPG rather than SVG: it is sized in
   3:2 with object-fit so a source that is not quite that ratio is cropped rather than squashed, and
   carries a hairline because a white-heavy flag on a light panel otherwise has no edge. */
.gb3-flag {
  display: inline-block;
  width: 21px;
  height: 14px;
  flex: 0 0 auto;
  -o-object-fit: cover;
     object-fit: cover;
  vertical-align: -2px;
  /* An outline pulled inwards, not an inset box-shadow: on a replaced element the inset shadow is
     painted UNDER the image content, so it never appears. */
  outline: 1px solid rgba(10, 10, 11, 0.25);
  outline-offset: -1px;
}

/* GB3 interior content pages */
.gb3-interior-hero {
  position: relative;
  min-height: 292px;
  overflow: hidden;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-interior-hero__media,
.gb3-interior-hero picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.gb3-interior-hero__media {
  -o-object-fit: cover;
     object-fit: cover;
}

/* The plain header a page gets from its CMS title when it has no Basic Page Info - no image, so none of
   the 292px the photograph needs. Just the heading, on the same band, with room to breathe. */
.gb3-interior-hero--title,
.gb3-interior-hero--title .gb3-interior-hero__content {
  min-height: 0;
}

.gb3-interior-hero--title .gb3-interior-hero__content {
  padding-top: 56px;
  padding-bottom: 40px;
}

.gb3-interior-hero__shade {
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 11, 0.66);
}

.gb3-interior-hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100%, var(--gb3-shell));
  min-height: 292px;
  flex-direction: column;
  justify-content: flex-end;
  gap: 12px;
  margin: 0 auto;
  padding: 42px var(--gb3-gutter);
}

.gb3-interior-hero h1 {
  max-width: 760px;
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 56px;
  font-weight: 800;
  line-height: 0.96;
}

.gb3-interior-body {
  padding: 56px var(--gb3-gutter) 68px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-interior-body > div {
  width: min(100%, 920px);
  margin: 0 auto;
}

.gb3-interior-body p,
.gb3-interior-body li {
  font-size: 17px;
  line-height: 1.65;
}

.gb3-interior-body p {
  margin: 0 0 20px;
}

.gb3-interior-body h2,
.gb3-interior-body h3 {
  max-width: 760px;
  margin: 42px 0 16px;
  color: var(--gb3-ink-light);
  font-weight: 800;
  line-height: 1;
}

.gb3-interior-body h2 {
  font-size: 38px;
}

.gb3-interior-body h3 {
  font-size: 25px;
}

.gb3-interior-body ul,
.gb3-interior-body ol {
  margin: 0 0 24px;
  padding-left: 24px;
}

.gb3-interior-body a {
  color: var(--gb3-red-light);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.gb3-interior-body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 30px 0;
}

.gb3-interior-body table {
  width: 100%;
  margin: 28px 0;
  border-collapse: collapse;
}

.gb3-interior-body th,
.gb3-interior-body td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--gb3-line-light);
  text-align: left;
}

.gb3-interior-body th {
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  text-transform: uppercase;
}

@media screen and (max-width: 63.998em) {
  .gb3-interior-hero {
    min-height: 240px;
  }
  .gb3-interior-hero__content {
    min-height: 240px;
    padding: 32px 16px;
  }
  .gb3-interior-hero h1 {
    font-size: 40px;
  }
  .gb3-interior-body {
    padding: 38px 16px 52px;
  }
  .gb3-interior-body p,
  .gb3-interior-body li {
    font-size: 16px;
  }
  .gb3-interior-body h2 {
    margin-top: 32px;
    font-size: 30px;
  }
  .gb3-interior-body h3 {
    font-size: 22px;
  }
}
/* GB3 CMS Front widget system */
.cms-content-page {
  background: var(--gb3-dark);
}

/* Migrated individual news articles */
.gb3-article {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

/* Type only. The photograph used to sit behind this at 58% under a left-heavy scrim, which needed
   540px of height to work and buried the image; it is now its own block below, so the hero is sized
   by the headline it holds. */
.gb3-article__hero {
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-article__hero-content {
  display: flex;
  width: min(100%, 960px);
  flex-direction: column;
  gap: 20px;
  margin: 0 auto;
  padding: 72px var(--gb3-gutter) 56px;
}

/* The story's main image, between the headline and the copy. Wider than the 820px body column and
   the 960px headline block so it reads as the lead picture rather than an illustration inside the
   article, and edge to edge on a phone. 16/9 with object-fit because the feed carries everything
   from portraits to panoramas and they cannot all set the height of this block. */
.gb3-article__media {
  width: min(100%, var(--gb3-shell));
  margin: 0 auto;
  background: var(--gb3-dark-tile);
}

.gb3-article__media img {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-article__eyebrow,
.gb3-article__byline {
  display: flex;
  gap: 14px;
  margin: 0;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.gb3-article__eyebrow time {
  color: var(--gb3-ink-dark-secondary);
}

.gb3-article h1 {
  max-width: 900px;
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 72px;
  line-height: 0.98;
}

.gb3-article__standfirst {
  max-width: 720px;
  margin: 0;
  color: var(--gb3-ink-dark-secondary);
  font-size: 19px;
  line-height: 1.5;
}

.gb3-article__content {
  width: min(100%, 820px);
  margin: 0 auto;
  padding: 56px var(--gb3-gutter) 72px;
}

.gb3-article__byline {
  margin-bottom: 28px;
  color: var(--gb3-ink-light-meta);
}

.gb3-article__body {
  color: var(--gb3-ink-light-body);
  font-size: 18px;
  line-height: 1.72;
}

.gb3-article__body > :first-child {
  margin-top: 0;
}

.gb3-article__body h2,
.gb3-article__body h3,
.gb3-article__body h4 {
  margin-top: 2em;
  color: var(--gb3-ink-light);
}

.gb3-article__body a {
  color: var(--gb3-red);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.gb3-article__body img {
  display: block;
  width: 100%;
  height: auto;
  margin: 36px 0;
}

.gb3-article__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--gb3-line-light);
}

.gb3-article__footer a {
  padding: 11px 15px;
  border: 1px solid var(--gb3-line-light);
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.gb3-article__footer a:last-child {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

@media screen and (max-width: 63.998em) {
  .gb3-article__hero-content {
    padding-top: 44px;
    padding-bottom: 34px;
  }
  .gb3-article h1 {
    font-size: 42px;
  }
  .gb3-article__content {
    padding-top: 38px;
    padding-bottom: 52px;
  }
  .gb3-article__body {
    font-size: 17px;
  }
}
.gb3-news-list {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-news-list__header {
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-news-list__header > div {
  display: grid;
  width: min(100%, var(--gb3-shell));
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  margin: 0 auto;
  padding: 58px var(--gb3-gutter) 34px;
}

.gb3-news-list__header p {
  grid-column: 1;
  margin: 0 0 10px;
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-news-list__header h1 {
  grid-column: 1;
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 52px;
  font-weight: 800;
  line-height: 0.96;
  letter-spacing: -0.04em;
}

.gb3-news-list__header > div > span,
.gb3-news-list__archive > header span,
.gb3-news-list__briefing > header span {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-news-list__header > div > span {
  grid-column: 2;
  grid-row: 1/span 2;
  padding-bottom: 3px;
}

.gb3-news-list__content {
  width: min(100%, var(--gb3-shell));
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 80px;
}

.gb3-news-list__feature {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 56px;
  padding: 48px 0 56px;
}

.gb3-news-list__lead,
.gb3-news-list__briefing,
.gb3-news-list__article {
  min-width: 0;
}

.gb3-news-list__lead > a {
  display: flex;
  height: 100%;
  flex-direction: column;
  color: inherit;
}

.gb3-news-list__lead-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
}

.gb3-news-list__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-news-list__meta span {
  color: var(--gb3-red-light);
}

.gb3-news-list__meta time::before {
  margin-right: 8px;
  content: "·";
}

.gb3-news-list__lead h2 {
  max-width: 720px;
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 40px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.gb3-news-list__summary {
  display: -webkit-box;
  max-width: 620px;
  overflow: hidden;
  margin: 14px 0 0;
  color: var(--gb3-ink-light-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.gb3-news-list__read {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  margin-top: 16px;
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-news-list__read > span,
.gb3-news-list__briefing-arrow {
  color: var(--gb3-red-light);
  font-size: 16px;
}

.gb3-news-list__lead-media {
  display: block;
  width: 100%;
  margin-top: 18px;
  aspect-ratio: 9/5;
  overflow: hidden;
  background: var(--gb3-dark-tile);
}

.gb3-news-list__lead-media img,
.gb3-news-list__article-media img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-news-list__briefing > header {
  display: flex;
  min-height: 44px;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 12px;
  border-bottom: 2px solid var(--gb3-ink-light);
}

.gb3-news-list__briefing > header h2,
.gb3-news-list__archive > header h2 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
}

.gb3-news-list__briefing article {
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-news-list__briefing article > a {
  position: relative;
  display: grid;
  min-height: 118px;
  grid-template-columns: 92px minmax(0, 1fr);
  align-content: center;
  -moz-column-gap: 15px;
       column-gap: 15px;
  padding: 17px 38px 17px 0;
  color: inherit;
}

/* Spans both copy rows so the thumbnail is the full height of the row rather than sitting against
   the meta line. */
.gb3-news-list__briefing-thumb {
  display: grid;
  overflow: hidden;
  grid-row: 1/span 2;
  place-items: center;
  aspect-ratio: 4/3;
  background: var(--gb3-dark-tile);
}

.gb3-news-list__briefing-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* The mark a story without artwork gets. Deliberately not a grey box: a plate that reads as the
   championship keeps the column on one rhythm instead of drawing the eye to what is missing. */
.gb3-news-list__briefing-thumb > span {
  color: rgba(245, 244, 244, 0.5);
  font-family: var(--gb3-font);
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.gb3-news-list__briefing-thumb > span b {
  color: var(--gb3-red);
  font-weight: 800;
}

.gb3-news-list__briefing article > a:hover h3,
.gb3-news-list__article > a:hover h3,
.gb3-news-list__lead > a:hover h2 {
  color: var(--gb3-red-light);
}

.gb3-news-list__briefing h3,
.gb3-news-list__article h3 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
}

.gb3-news-list__briefing-arrow {
  position: absolute;
  right: 0;
  top: 50%;
  translate: 0 -50%;
}

.gb3-news-list__archive {
  border-top: 1px solid var(--gb3-line-light);
}

.gb3-news-list__archive > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 32px 0 24px;
}

.gb3-news-list__archive > header span {
  margin-left: auto;
}

.gb3-news-list__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--gb3-line-light);
}

.gb3-news-list__article {
  background: var(--gb3-light);
}

.gb3-news-list__article > a {
  display: flex;
  height: 100%;
  flex-direction: column;
  background: var(--gb3-light);
  color: inherit;
}

.gb3-news-list__article > a:hover {
  background: var(--gb3-light-hover);
}

.gb3-news-list__article-media {
  display: block;
  width: 100%;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: var(--gb3-dark-tile);
}

.gb3-news-list__article-copy {
  display: flex;
  min-height: 172px;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 18px 18px 22px;
}

.gb3-news-list__card-summary {
  display: -webkit-box;
  overflow: hidden;
  margin: 10px 0 0;
  color: var(--gb3-ink-light-body);
  font-size: 13px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.gb3-news-list__article--text-only .gb3-news-list__article-copy {
  min-height: 250px;
  justify-content: flex-end;
  background: var(--gb3-light-band);
}

.gb3-news-list__empty {
  width: min(100%, var(--gb3-column));
  margin: 0 auto;
  color: var(--gb3-ink-light-meta);
}

.gb3-gallery-list {
  display: grid;
  width: min(100%, var(--gb3-column));
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0 auto;
  background: var(--gb3-line-light);
}

.gb3-gallery-list__item {
  min-width: 0;
  background: var(--gb3-light);
}

.gb3-gallery-list__item a {
  display: block;
  height: 100%;
  color: inherit;
}

.gb3-gallery-list__item img {
  display: block;
  width: 100%;
  aspect-ratio: 16/10;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-gallery-list__item div {
  padding: 18px;
}

.gb3-gallery-list__item span,
.gb3-gallery-list__item p {
  margin: 0;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.gb3-gallery-list__item h3 {
  margin: 9px 0 16px;
  color: var(--gb3-ink-light);
  font-size: 23px;
  line-height: 1.08;
}

.gb3-gallery-list__item p {
  color: var(--gb3-red);
}

.gb3-teams-area {
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-teams-area__hero {
  width: min(100%, var(--gb3-shell));
  margin: 0 auto;
}

/* No gutter of their own - .gb3-teams-area__login supplies it - so these take the inner column. */
.gb3-teams-area__status,
.gb3-teams-area__login > header {
  width: min(100%, var(--gb3-column));
  margin: 0 auto;
}

.gb3-teams-area__hero {
  padding: 72px var(--gb3-gutter) 48px;
}

.gb3-teams-area__hero span,
.gb3-teams-area__login > header span,
.gb3-teams-area__status > span {
  display: block;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.gb3-teams-area__hero h1 {
  max-width: 650px;
  margin: 10px 0 16px;
  color: var(--gb3-ink-dark);
  font-size: 54px;
  line-height: 0.96;
}

.gb3-teams-area__hero p {
  max-width: 520px;
  margin: 0;
  color: var(--gb3-ink-dark-secondary);
  font-size: 17px;
  line-height: 1.55;
}

.gb3-teams-area__login {
  padding: 36px var(--gb3-gutter) 80px;
  background: var(--gb3-dark-band);
}

.gb3-teams-area__login > header {
  padding: 0 0 24px;
}

.gb3-teams-area__login h2,
.gb3-teams-area__status h2 {
  margin: 7px 0 0;
  color: var(--gb3-ink-dark);
  font-size: 32px;
}

.gb3-teams-area__login > .grid-container {
  width: min(100%, var(--gb3-column));
  padding: 0;
}

.gb3-teams-area__login .grid-x {
  margin: 0;
}

.gb3-teams-area__login .cell {
  width: 100%;
}

.gb3-teams-area__login section {
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  padding: 24px;
}

.gb3-teams-area__login .widget-header {
  display: none;
}

.gb3-teams-area__login .content {
  padding: 0;
}

.gb3-teams-area__login label {
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.gb3-teams-area__login input {
  width: 100%;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

.gb3-teams-area__login .button {
  border-radius: 0;
  box-shadow: none;
}

.gb3-teams-area__login .medium-6 + .medium-6 {
  display: none;
}

.gb3-teams-area__status {
  padding: 0 var(--gb3-gutter) 80px;
}

.gb3-teams-area__status p {
  max-width: 560px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 16px;
  line-height: 1.55;
}

@media screen and (max-width: 63.998em) {
  .gb3-news-list__header > div {
    padding: 44px 16px 30px;
  }
  .gb3-news-list__header h1 {
    font-size: 44px;
  }
  .gb3-news-list__content {
    padding: 0 16px 64px;
  }
  .gb3-news-list__feature {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
  }
  .gb3-news-list__lead h2 {
    font-size: 34px;
  }
  .gb3-news-list__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-gallery-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-teams-area__hero {
    padding: 48px 16px 36px;
  }
  .gb3-teams-area__hero h1 {
    font-size: 40px;
  }
  .gb3-teams-area__login {
    padding: 28px 16px 56px;
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-news-list__header > div {
    display: block;
    padding: 34px 16px 24px;
  }
  .gb3-news-list__header h1 {
    font-size: 40px;
  }
  .gb3-news-list__header > div > span {
    display: block;
    margin-top: 13px;
    padding: 0;
  }
  .gb3-news-list__content {
    padding: 0 16px 52px;
  }
  .gb3-news-list__feature {
    display: block;
    padding: 24px 0 40px;
  }
  .gb3-news-list__lead-media {
    order: -1;
    margin: 0 0 14px;
    aspect-ratio: 3/2;
  }
  .gb3-news-list__lead h2 {
    font-size: 27px;
    line-height: 1.08;
  }
  .gb3-news-list__summary {
    display: none;
  }
  .gb3-news-list__read {
    margin-top: 8px;
  }
  .gb3-news-list__briefing {
    margin-top: 24px;
  }
  .gb3-news-list__briefing article > a {
    min-height: 104px;
    grid-template-columns: 76px minmax(0, 1fr);
    -moz-column-gap: 12px;
         column-gap: 12px;
    padding: 15px 34px 15px 0;
  }
  .gb3-news-list__briefing h3 {
    font-size: 17px;
  }
  .gb3-news-list__archive > header {
    padding: 26px 0 19px;
  }
  .gb3-news-list__grid {
    display: block;
    background: transparent;
  }
  .gb3-news-list__article {
    border-top: 1px solid var(--gb3-line-light);
  }
  .gb3-news-list__article > a {
    display: grid;
    min-height: 116px;
    grid-template-columns: 118px minmax(0, 1fr);
  }
  .gb3-news-list__article-media {
    height: 100%;
    min-height: 116px;
    aspect-ratio: auto;
  }
  .gb3-news-list__article-copy {
    min-height: 116px;
    padding: 14px 0 14px 14px;
  }
  .gb3-news-list__article .gb3-news-list__meta {
    margin-bottom: 7px;
    font-size: 9px;
  }
  .gb3-news-list__article h3 {
    font-size: 16px;
    line-height: 1.25;
  }
  .gb3-news-list__card-summary {
    display: none;
  }
  .gb3-news-list__article--text-only > a {
    grid-template-columns: minmax(0, 1fr);
  }
  .gb3-news-list__article--text-only .gb3-news-list__article-copy {
    min-height: 130px;
    padding: 18px;
  }
}
.gb3-home-hero {
  position: relative;
  display: flex;
  min-height: 620px;
  overflow: hidden;
  align-items: stretch;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-tile);
}

.gb3-home-hero__media,
.gb3-home-hero picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.gb3-home-hero__media {
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-home-hero__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.95) 0%, rgba(10, 10, 11, 0.82) 42%, rgba(10, 10, 11, 0.24) 76%), linear-gradient(0deg, rgba(10, 10, 11, 0.78), transparent 48%);
}

.gb3-home-hero__content {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100%, 760px);
  min-height: 620px;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  padding: 56px var(--gb3-gutter);
}

.gb3-home-hero__kicker,
.cms-gb3-snapshot__heading::before {
  margin: 0;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gb3-home-hero h1 {
  max-width: 720px;
  margin: 0;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
  font-size: 76px;
  font-weight: 800;
  line-height: 0.92;
  letter-spacing: 0;
}

.gb3-home-hero__summary {
  max-width: 560px;
  margin: 0;
  color: #d3d4d7;
  font-size: 17px;
  line-height: 1.6;
}

.gb3-home-hero__summary p {
  margin: 0;
}

/* The homepage hero's Basic Page Info Main Text - kicker, summary and buttons authored as HTML with the
   classes above. display: contents lifts each authored element into the hero's own flex column, so the
   column's gap spaces them exactly as the fixed markup was; the margin reset stops a rich-text editor's
   default paragraph margins adding to that gap. */
.gb3-home-hero__copy {
  display: contents;
}

.gb3-home-hero__copy > * {
  margin-top: 0;
  margin-bottom: 0;
}

.gb3-home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 4px;
}

.gb3-home-hero__actions a,
.cms-gb3-snapshot__link {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border: 1px solid var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-home-hero__actions .gb3-home-hero__action-secondary {
  border-color: rgba(245, 244, 244, 0.42);
  background: transparent;
  color: var(--gb3-ink-dark);
}

.gb3-home-hero__actions a:hover,
.cms-gb3-snapshot__link:hover {
  background: var(--gb3-red-light);
  color: #fff;
}

.cms-gb3-snapshot,
.cms-tagged-news,
.cms-gb3-item-list {
  margin: 0;
}

.cms-gb3-snapshot__heading,
.cms-tagged-news__heading,
.cms-gb3-item-list > h2 {
  display: flex;
  width: 100%;
  max-width: var(--gb3-shell);
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 auto;
  padding: 48px var(--gb3-gutter) 26px;
}

.cms-gb3-snapshot__heading::before {
  content: "GB3 Championship";
  flex: 0 0 auto;
  padding-bottom: 4px;
}

.cms-gb3-snapshot__heading h2,
.cms-tagged-news__heading h2,
.cms-gb3-item-list > h2 {
  margin: 0 auto 0 0;
  color: inherit;
  font-family: var(--gb3-font);
  font-size: 38px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.cms-gb3-snapshot--news,
.cms-tagged-news {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__heading::before {
  content: "From the paddock";
  color: var(--gb3-red);
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__cards,
.cms-tagged-news__items {
  display: grid;
  max-width: var(--gb3-shell);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 52px;
  background: var(--gb3-line-light);
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card,
.cms-tagged-news__item {
  min-width: 0;
  background: var(--gb3-light);
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child,
.cms-tagged-news__item:first-child {
  grid-column: span 2;
  grid-row: span 2;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card img,
.cms-tagged-news__item > a {
  display: block;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card img,
.cms-tagged-news__item img {
  width: 100%;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child img,
.cms-tagged-news__item:first-child img {
  aspect-ratio: 16/10;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card h3,
.cms-tagged-news__content {
  margin: 0;
  padding: 16px;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card h3 {
  color: var(--gb3-ink-light);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: 0;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child h3 {
  font-size: 27px;
}

.cms-gb3-snapshot--news .cms-gb3-snapshot__card .cms-gb3-snapshot__link {
  margin: 0 16px 16px;
}

.cms-tagged-news__content {
  display: flex;
  min-height: 126px;
  flex-direction: column;
  gap: 10px;
}

.cms-tagged-news__content time {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cms-tagged-news__link {
  color: var(--gb3-ink-light);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.14;
  letter-spacing: 0;
}

.cms-tagged-news__item:first-child .cms-tagged-news__link {
  font-size: 26px;
}

.cms-gb3-snapshot--car {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.cms-gb3-snapshot--car > .cms-gb3-snapshot__heading {
  display: none;
}

/* Full-bleed cinematic banner. Deliberately NOT capped to --gb3-shell: the photograph is the full
   width of the page and only the copy is held to the column, which is how the hero works. */
.cms-gb3-car-feature {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 470px;
  align-items: center;
  overflow: hidden;
  background: var(--gb3-dark-band);
}

.cms-gb3-car-feature__media {
  position: absolute;
  inset: 0;
}

.cms-gb3-car-feature__media img {
  width: 100%;
  height: 100%;
  /* cover against a band WIDER than the source now, so it is the top and bottom that are trimmed -
     sky and tarmac - rather than the nose and tail of the car. */
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 46%;
     object-position: 50% 46%;
}

/* Weighted to the left, where the copy is, and thinning out across the car. Without it the headline
   would be sitting on whatever happens to be in that part of the photograph. */
.cms-gb3-car-feature__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.95) 0%, rgba(10, 10, 11, 0.82) 38%, rgba(10, 10, 11, 0.22) 68%, rgba(10, 10, 11, 0.1) 100%);
}

.cms-gb3-car-feature__copy {
  position: relative;
  display: flex;
  width: 100%;
  max-width: var(--gb3-shell);
  flex-direction: column;
  align-items: flex-start;
  margin: 0 auto;
  padding: 54px var(--gb3-gutter);
}

.cms-gb3-car-feature__copy > span {
  margin-bottom: 12px;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cms-gb3-car-feature h2 {
  margin: 0 0 16px;
  color: var(--gb3-ink-dark);
  font-size: 42px;
  font-weight: 800;
  line-height: 0.96;
  letter-spacing: 0;
  /* Deliberately not uppercased: the heading is a model name, and capitalising it loses the shape
     that makes it readable as one. The mono kicker above it carries the uppercase. */
  text-transform: none;
}

.cms-gb3-car-feature p {
  /* Narrower than before: over a photograph a long measure is much harder to read. */
  max-width: 46ch;
  margin: 0 0 12px;
  color: var(--gb3-ink-dark);
  font-size: 15px;
  line-height: 1.6;
  text-shadow: 0 1px 12px rgba(10, 10, 11, 0.65);
}

.cms-gb3-car-feature .cms-gb3-snapshot__link {
  margin-top: 18px;
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy > .spilt-background,
.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy > .split-background {
  background: var(--gb3-dark-band);
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy .bkgrd {
  background: var(--gb3-dark-band);
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy .grid-container {
  max-width: var(--gb3-shell);
  padding-right: var(--gb3-gutter);
  padding-left: var(--gb3-gutter);
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy .widget-header {
  padding-top: 52px;
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy .widget-header h3,
.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy h3 {
  color: var(--gb3-ink-dark);
  font-size: 40px;
}

.cms-gb3-snapshot--car .cms-gb3-snapshot__legacy p {
  color: var(--gb3-ink-dark-secondary);
}

.cms-gb3-snapshot--drivers {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__heading::before {
  content: "2026 grid";
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__cards {
  display: grid;
  max-width: var(--gb3-shell);
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 54px;
  background: var(--gb3-line-dark);
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__card {
  display: flex;
  min-width: 0;
  min-height: 352px;
  flex-direction: column;
  background: var(--gb3-dark-band);
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__card img {
  width: 100%;
  aspect-ratio: 1/1.12;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom center;
     object-position: bottom center;
  background: var(--gb3-portrait);
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__card h3 {
  margin: auto 14px 5px;
  color: var(--gb3-ink-dark);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: 0;
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__card p {
  min-height: 22px;
  margin: 0 14px 14px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 12px;
  line-height: 1.35;
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__link {
  min-height: 38px;
  margin: 0;
  border: 0;
  border-top: 1px solid var(--gb3-line-dark);
  background: transparent;
  color: var(--gb3-ink-dark);
  font-size: 10px;
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__link::after,
.cms-tagged-news__link::after {
  content: " ->";
  color: var(--gb3-red);
}

.cms-gb3-snapshot--drivers .cms-gb3-snapshot__link:hover {
  background: var(--gb3-dark-hover);
}

.cms-gb3-snapshot--calendar {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.cms-gb3-snapshot--calendar .cms-gb3-snapshot__heading::before {
  content: "Race schedule";
}

.cms-gb3-snapshot__rounds {
  width: 100%;
  max-width: var(--gb3-shell);
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 52px;
  list-style: none;
}

.cms-gb3-snapshot__rounds li {
  display: grid;
  min-height: 82px;
  grid-template-columns: 82px minmax(0, 1fr) minmax(180px, 0.52fr);
  align-items: center;
  gap: 14px;
  border-top: 1px solid var(--gb3-line-light);
}

.cms-gb3-snapshot__rounds li:last-child {
  border-bottom: 1px solid var(--gb3-line-light);
}

.cms-gb3-snapshot__round-number {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 16px;
  font-weight: 700;
}

.cms-gb3-snapshot__rounds strong {
  color: var(--gb3-ink-light);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0;
}

.cms-gb3-snapshot__rounds li > span:last-child {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.cms-gb3-snapshot--standings {
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

.cms-gb3-snapshot--standings .cms-gb3-snapshot__heading::before {
  content: "2026 season";
}

.cms-gb3-snapshot__standings {
  width: calc(100% - var(--gb3-gutter) * 2);
  max-width: calc(var(--gb3-shell) - var(--gb3-gutter) * 2);
  margin: 0 auto;
  border-collapse: collapse;
}

.cms-gb3-snapshot__standings th,
.cms-gb3-snapshot__standings td {
  padding: 16px 14px;
  border-bottom: 1px solid var(--gb3-line-dark-soft);
  text-align: left;
}

.cms-gb3-snapshot__standings th {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.cms-gb3-snapshot__standings td {
  color: var(--gb3-ink-dark);
  font-size: 16px;
  font-weight: 700;
}

.cms-gb3-snapshot__standings td:first-child {
  width: 80px;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
}

.cms-gb3-snapshot__standings td:last-child,
.cms-gb3-snapshot__standings th:last-child {
  width: 120px;
  text-align: right;
  font-family: var(--gb3-mono);
  font-size: 20px;
  font-weight: 700;
}

.cms-gb3-snapshot--standings::after {
  content: "";
  display: block;
  height: 52px;
}

.cms-gb3-snapshot--teams {
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__heading::before {
  content: "2026 entrants";
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__cards {
  display: grid;
  max-width: var(--gb3-shell);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 52px;
  background: var(--gb3-line-light);
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__card {
  display: flex;
  min-height: 138px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 20px;
  background: var(--gb3-light);
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__card img {
  width: 100%;
  max-height: 68px;
  margin-bottom: auto;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left center;
     object-position: left center;
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__card h3 {
  margin: 16px 0 12px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__link {
  width: -moz-max-content;
  width: max-content;
  min-height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--gb3-ink-light);
  font-size: 10px;
}

.cms-gb3-snapshot--teams .cms-gb3-snapshot__link::after {
  content: " ->";
  color: var(--gb3-red);
}

.cms-gb3-snapshot--partners {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__heading::before {
  content: "GB3";
}

.cms-gb3-snapshot__gallery {
  display: grid;
  max-width: var(--gb3-shell);
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 30px 40px;
  align-items: center;
  justify-items: center;
  margin: 0 auto;
  padding: 0 var(--gb3-gutter) 52px;
}

.cms-gb3-snapshot__gallery a {
  display: flex;
  width: 100%;
  min-height: 56px;
  align-items: center;
  justify-content: center;
}

.cms-gb3-snapshot__gallery img {
  max-width: 100%;
  max-height: 48px;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0) invert(1);
}

@media screen and (max-width: 63.998em) {
  .gb3-home-hero,
  .gb3-home-hero__content {
    min-height: 540px;
  }
  .gb3-home-hero__content {
    justify-content: flex-end;
    padding: 36px 16px;
  }
  .gb3-home-hero h1 {
    font-size: 48px;
  }
  .cms-gb3-snapshot__heading,
  .cms-tagged-news__heading,
  .cms-gb3-item-list > h2 {
    padding: 34px 16px 20px;
  }
  .cms-gb3-snapshot__heading h2,
  .cms-tagged-news__heading h2,
  .cms-gb3-item-list > h2 {
    font-size: 30px;
  }
  .cms-gb3-snapshot--news .cms-gb3-snapshot__cards,
  .cms-tagged-news__items,
  .cms-gb3-snapshot--drivers .cms-gb3-snapshot__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-right: 16px;
    padding-left: 16px;
  }
  .cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child,
  .cms-tagged-news__item:first-child {
    grid-column: span 2;
    grid-row: auto;
  }
  .cms-gb3-snapshot--drivers .cms-gb3-snapshot__card {
    min-height: 310px;
  }
  .cms-gb3-snapshot__rounds {
    padding-right: 16px;
    padding-left: 16px;
  }
  .cms-gb3-snapshot__rounds li {
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 13px 0;
  }
  .cms-gb3-snapshot__rounds li > span:last-child {
    grid-column: 2;
  }
  .cms-gb3-snapshot__standings {
    width: calc(100% - 32px);
  }
  .cms-gb3-snapshot__standings th,
  .cms-gb3-snapshot__standings td {
    padding: 13px 8px;
  }
  .cms-gb3-snapshot__standings td:first-child {
    width: 42px;
  }
  .cms-gb3-snapshot__standings td:last-child,
  .cms-gb3-snapshot__standings th:last-child {
    width: 72px;
    font-size: 16px;
  }
  .cms-gb3-snapshot--teams .cms-gb3-snapshot__cards,
  .cms-gb3-snapshot__gallery {
    padding-right: 16px;
    padding-left: 16px;
  }
  .cms-gb3-snapshot__gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }
}
/* GB3 Front 30 home composition. This intentionally sits after the legacy bridge rules above. */
.gb3-site-shell {
  width: 100%;
  /* Deliberately uncapped: a section's background has to reach the viewport edge. The 1280px lives on
     the inner wrappers instead (max-width: var(--gb3-shell)), so content stays put and only the
     backgrounds bleed. Capping here boxed the whole page and let the body colour show either side. */
  max-width: none;
  margin: 0 auto;
  /* clip, not hidden. Both stop the full-bleed sections spilling sideways, but `hidden` makes this
     element the scroll container for every sticky descendant - and since the shell scrolls with the
     page rather than within itself, that silently turns `position: sticky` anywhere inside the site
     into `static`. `clip` establishes no scroll container, so the driver profile aside can stick. */
  overflow-x: clip;
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
}

/* The header and footer bars span the viewport - their backgrounds are the bars - but their CONTENTS
   line up with everything else. This used to say max-width: none, which was harmless only because the
   shell itself was capped at 1280px and the bar could never exceed it. With the shell full-bleed that
   opt-out let the nav and footer run to the screen edges while every section below stayed aligned.
   margin: 0 auto comes from the base .grid-container rule and still applies. */
.gb3-header .grid-container,
.gb3-footer .grid-container {
  width: 100%;
  max-width: var(--gb3-shell);
  padding-right: var(--gb3-gutter);
  padding-left: var(--gb3-gutter);
}

.gb3-home-hero__content {
  width: 100%;
  min-height: 620px;
  justify-content: flex-start;
  padding-top: 52px;
  padding-bottom: 36px;
}

.gb3-home-hero__summary {
  max-width: 520px;
}

.gb3-home-hero__stats {
  display: grid;
  width: min(100%, 520px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: auto;
  padding-top: 20px;
  border-top: 1px solid rgba(245, 244, 244, 0.22);
}

.gb3-home-hero__stats strong,
.gb3-home-hero__stats span {
  display: block;
}

.gb3-home-hero__stats strong {
  font-family: var(--gb3-mono);
  font-size: 30px;
  line-height: 1;
}

.gb3-home-hero__stats span {
  margin-top: 5px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 12px;
  line-height: 1.3;
}

.gb3-home-widgets {
  display: flex;
  flex-direction: column;
}

/* No `order` here on purpose: the home page renders its widgets in the order the CMS holds them, so
   reordering in Central is the only thing that moves them. These rules used to pin calendar/standings/
   news/car/teams/partners to a fixed sequence, which silently overrode the CMS - and did it a second
   time, since the page template carried the same hard-coded ranking. Both are gone. The display rules
   below are NOT ordering: the drivers surface is deliberately hidden on the home page, while car and
   partners are forced visible. */
.gb3-home-widgets > .cms-gb3-snapshot--car {
  display: block;
}

.gb3-home-widgets > .gb3-championship--drivers {
  display: none;
}

.gb3-home-widgets > .cms-gb3-snapshot--partners {
  display: block;
}

.cms-gb3-snapshot--car {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.cms-gb3-car-feature h2 {
  max-width: 15ch;
  font-size: 40px;
  line-height: 0.98;
}

.gb3-championship {
  padding: 0 var(--gb3-gutter) 44px;
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.gb3-championship--calendar,
.gb3-championship--drivers,
.gb3-championship--teams {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-championship__header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin: 0;
  padding: 44px 0 26px;
  border: 0;
}

.gb3-championship__header .gb3-kicker {
  order: 2;
  margin-left: 0;
  color: var(--gb3-ink-dark-meta);
  font-size: 12px;
}

.gb3-championship--calendar .gb3-kicker,
.gb3-championship--drivers .gb3-kicker,
.gb3-championship--teams .gb3-kicker {
  color: var(--gb3-ink-light-meta);
}

.gb3-championship__header h2 {
  flex: 0 1 auto;
  margin: 0;
  color: inherit;
  font-size: 34px;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
}

.gb3-championship__header p {
  margin-left: auto;
  color: inherit;
  font-size: 11px;
  text-align: right;
}

.gb3-calendar-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  min-height: 380px;
}

.gb3-calendar-feature__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  padding: 36px;
  background: var(--gb3-red);
  color: #fff;
}

.gb3-calendar-feature__copy > span,
.gb3-calendar-feature__copy > strong {
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-calendar-feature__copy h3 {
  max-width: 440px;
  margin: auto 0 16px;
  font-size: 44px;
  font-weight: 800;
  line-height: 0.98;
}

.gb3-calendar-feature__copy p {
  max-width: 330px;
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.5;
}

.gb3-calendar-feature__copy a {
  margin-top: auto;
  padding: 13px 20px;
  background: var(--gb3-dark);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-calendar-feature__media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: #e8e6e2;
}

.gb3-calendar-feature__media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-calendar-feature__media .gb3-calendar-feature__circuit {
  display: block;
  width: 58%;
  height: 58%;
  margin: 21% auto;
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 0.4;
  filter: brightness(0);
}

/* Calendar rail arrows. Overlaid at each end rather than placed below, so they read as "there is more
   this way" instead of as a separate control. gb3-2026.js sets [hidden] when the rail does not
   overflow and [disabled] at each limit, so neither state needs a JS-applied class. */
.gb3-calendar-rail-wrap {
  position: relative;
}

.gb3-calendar-rail-wrap > .gb3-calendar-rail {
  scroll-behavior: smooth;
}

.gb3-calendar-rail__nav {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: #fff;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}

.gb3-calendar-rail__nav:hover:not(:disabled) {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
}

.gb3-calendar-rail__nav:disabled {
  cursor: default;
  opacity: 0.3;
}

.gb3-calendar-rail__nav::before {
  width: 10px;
  height: 10px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  content: "";
}

.gb3-calendar-rail__nav--prev {
  left: 4px;
}

.gb3-calendar-rail__nav--prev::before {
  margin-left: 3px;
  transform: rotate(-135deg);
}

.gb3-calendar-rail__nav--next {
  right: 4px;
}

.gb3-calendar-rail__nav--next::before {
  margin-right: 3px;
  transform: rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {
  .gb3-calendar-rail-wrap > .gb3-calendar-rail {
    scroll-behavior: auto;
  }
}
.gb3-calendar-rail {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 26px 0 10px;
  overflow-x: auto;
  list-style: none;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: var(--gb3-ink-light-meta) transparent;
  -webkit-overflow-scrolling: touch;
}

.gb3-calendar-rail::-webkit-scrollbar {
  height: 8px;
}

.gb3-calendar-rail::-webkit-scrollbar-track {
  background: transparent;
}

.gb3-calendar-rail::-webkit-scrollbar-thumb {
  background-color: var(--gb3-ink-light-meta);
  border: 2px solid transparent;
  background-clip: padding-box;
}

.gb3-calendar-rail::-webkit-scrollbar-thumb:hover {
  background-color: var(--gb3-red);
}

.gb3-calendar-rail:focus-visible {
  outline: 2px solid var(--gb3-red);
  outline-offset: 4px;
}

.gb3-calendar-rail li {
  display: flex;
  min-width: 0;
  flex: 0 0 200px;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  background: var(--gb3-light-band);
  scroll-snap-align: start;
}

.gb3-calendar-rail li > span,
.gb3-calendar-rail time {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.gb3-calendar-rail img {
  width: 100%;
  height: 100px;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0);
}

.gb3-calendar-rail strong {
  font-size: 15px;
  line-height: 1.2;
}

.gb3-calendar-rail .is-complete {
  opacity: 0.58;
}

.gb3-calendar-rail .is-current {
  background: var(--gb3-red);
  color: #fff;
  opacity: 1;
}

.gb3-calendar-rail .is-current > span,
.gb3-calendar-rail .is-current time {
  color: rgba(255, 255, 255, 0.88);
}

.gb3-calendar-rail .is-current img {
  filter: brightness(0) invert(1);
}

.gb3-calendar-rail__image {
  display: block;
  width: 100%;
  height: 100px;
  overflow: hidden;
}

.gb3-calendar-rail__image img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: none;
}

.gb3-calendar-rail .is-current .gb3-calendar-rail__image img {
  filter: none;
}

.gb3-championship--calendar {
  padding-bottom: 0;
}

.gb3-calendar-page {
  max-width: var(--gb3-column);
  margin: 0 auto;
  padding: 64px 0 72px;
}

.gb3-calendar-page__header {
  display: flex;
  align-items: baseline;
  gap: 18px;
  padding-bottom: 30px;
  border-bottom: 2px solid var(--gb3-ink-light);
}

.gb3-calendar-page__header .gb3-kicker {
  margin: 0;
  color: var(--gb3-red);
}

.gb3-calendar-page__header h1 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 64px;
  line-height: 0.94;
}

.gb3-calendar-page__header p {
  margin: 0 0 2px auto;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-calendar-page__rounds {
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-calendar-page__rounds li {
  display: grid;
  grid-template-columns: 82px minmax(140px, 0.6fr) minmax(0, 1fr) 170px;
  min-height: 142px;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-calendar-page__rounds li.is-complete {
  opacity: 0.56;
}

.gb3-calendar-page__rounds li.is-current {
  border-left: 4px solid var(--gb3-red);
  padding-left: 16px;
  opacity: 1;
}

.gb3-calendar-page__round {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 17px;
  font-weight: 700;
}

.gb3-calendar-page__rounds time,
.gb3-calendar-page__tests time {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.gb3-calendar-page__venue h2 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 28px;
  line-height: 1;
}

.gb3-calendar-page__venue p {
  margin: 8px 0 0;
  color: var(--gb3-ink-light-meta);
  font-size: 14px;
}

.gb3-calendar-page__rounds img {
  width: 100%;
  height: 94px;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-calendar-page__tests {
  margin-top: 64px;
  padding-top: 26px;
  border-top: 2px solid var(--gb3-ink-light);
}

.gb3-calendar-page__tests header {
  margin-bottom: 8px;
}

.gb3-calendar-page__tests h2 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-size: 24px;
}

.gb3-calendar-page__tests ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--gb3-line-light);
  list-style: none;
}

.gb3-calendar-page__tests li {
  display: flex;
  min-height: 84px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 14px 18px;
  border-right: 1px solid var(--gb3-line-light);
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-calendar-page__tests li:nth-child(3n) {
  border-right: 0;
}

.gb3-calendar-page__tests li.is-complete {
  opacity: 0.56;
}

.gb3-calendar-page__tests span {
  color: var(--gb3-ink-light);
  font-size: 14px;
  font-weight: 700;
}

.gb3-championship--standings {
  padding-bottom: 40px;
  background: var(--gb3-dark-band);
}

.gb3-standings-layout {
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  /* Column only. The layout collapses to a single column below 64em, and a row gap there would
     open a band of background between the portrait and the table it belongs to. */
  -moz-column-gap: 30px;
       column-gap: 30px;
  border-top: 1px solid var(--gb3-line-dark);
  border-bottom: 1px solid var(--gb3-line-dark);
}

.gb3-standing-profile {
  position: relative;
  display: flex;
  min-height: 620px;
  flex-direction: column;
  overflow: hidden;
  background: var(--gb3-portrait);
}

.gb3-standing-profile__fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 50% 38%, #6b0d14 0%, #2a0508 72%);
}

.gb3-standing-profile__fallback span {
  color: rgba(255, 255, 255, 0.14);
  font-family: var(--gb3-mono);
  font-size: 96px;
  font-weight: 700;
}

.gb3-standing-profile__meta,
.gb3-standing-profile__content {
  position: relative;
  z-index: 1;
}

.gb3-standing-profile__meta {
  display: flex;
  gap: 10px;
  padding: 20px 22px;
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.gb3-standing-profile__meta span:first-child {
  padding: 5px 9px;
  background: var(--gb3-red);
}

.gb3-standing-profile__content {
  margin-top: auto;
  padding: 24px;
  background: linear-gradient(0deg, rgba(10, 10, 11, 0.96), rgba(10, 10, 11, 0.05));
}

.gb3-standing-profile__content p,
.gb3-standing-profile__content h3,
.gb3-standing-profile__content > span {
  margin: 0;
}

.gb3-standing-profile__content p {
  font-size: 16px;
}

.gb3-standing-profile__content h3 {
  font-size: 44px;
  line-height: 1.02;
}

.gb3-standing-profile__content > span {
  display: block;
  margin-top: 5px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 13px;
}

.gb3-standing-profile__content > div {
  display: flex;
  flex-direction: column;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.35);
}

.gb3-standing-profile__content strong {
  font-family: var(--gb3-mono);
  font-size: 42px;
  line-height: 1;
}

.gb3-standing-profile__content small,
.gb3-standings-table small {
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
}

.gb3-standings-table {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border: 0;
}

.gb3-standings-table__row {
  display: grid;
  width: 100%;
  min-height: 64px;
  grid-template-columns: 44px minmax(150px, 1fr) minmax(80px, 190px) 96px;
  gap: 18px;
  align-items: center;
  padding: 10px 24px 10px 20px;
  border: 0;
  border-bottom: 1px solid var(--gb3-line-dark-soft);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
  cursor: pointer;
  text-align: left;
}

.gb3-standings-table__row:hover,
.gb3-standings-table__row.is-selected {
  background: var(--gb3-dark-hover);
}

.gb3-standings-table__row:focus-visible {
  position: relative;
  z-index: 1;
  outline: 2px solid var(--gb3-red);
  outline-offset: -2px;
}

.gb3-standings-table__row.is-selected strong {
  color: var(--gb3-red);
}

.gb3-standings-table__row > strong,
.gb3-standings-table__row > em {
  font-family: var(--gb3-mono);
  font-size: 17px;
  font-style: normal;
  font-weight: 700;
}

.gb3-standings-table__row > em {
  font-size: 22px;
  text-align: right;
}

.gb3-standings-table__row > span:nth-child(2) {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

.gb3-standings-table__row b {
  overflow: hidden;
  color: inherit;
  font-family: var(--gb3-font);
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gb3-standings-table__gap {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
}

.gb3-standings-table__gap > i {
  display: block;
  height: 4px;
  background: #353538;
}

.gb3-standings-table__gap > i > i {
  display: block;
  height: 100%;
  background: var(--gb3-red);
}

.cms-gb3-snapshot--news {
  padding: 56px var(--gb3-gutter);
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.cms-gb3-news {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 56px;
  align-items: start;
}

.cms-gb3-news__lead a {
  color: inherit;
}

.cms-gb3-news__lead p,
.cms-gb3-news__list span {
  margin: 0 0 10px;
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.cms-gb3-news__lead h2 {
  max-width: 620px;
  margin: 0 0 18px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.06;
}

.cms-gb3-news__lead img {
  display: block;
  width: 100%;
  aspect-ratio: 9/5;
  -o-object-fit: cover;
     object-fit: cover;
}

.cms-gb3-news__list {
  display: flex;
  flex-direction: column;
}

/* Thumbnail beside the copy. The mark spans both text rows so it is the height of the row rather
   than sitting against the date line. */
.cms-gb3-news__list > a:not(.cms-gb3-news__all) {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  align-content: center;
  gap: 6px 14px;
  padding: 16px 0;
  border-top: 1px solid var(--gb3-line-light);
  color: var(--gb3-ink-light);
}

.cms-gb3-news__list span {
  margin: 0;
  color: var(--gb3-ink-light-meta);
}

.cms-gb3-news__list strong {
  font-size: 19px;
  font-weight: 600;
  line-height: 1.25;
}

/* Needs the list in the selector to outrank .cms-gb3-news__list span above, which is the date's
   mono micro-type and would otherwise land on the mark inside this. */
.cms-gb3-news__list .cms-gb3-news__thumb {
  display: grid;
  overflow: hidden;
  grid-row: 1/span 2;
  place-items: center;
  align-self: center;
  aspect-ratio: 4/3;
  background: var(--gb3-dark-tile);
}

.cms-gb3-news__list .cms-gb3-news__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.cms-gb3-news__list .cms-gb3-news__thumb > span {
  color: rgba(245, 244, 244, 0.5);
  font-family: var(--gb3-font);
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: none;
}

.cms-gb3-news__list .cms-gb3-news__thumb > span b {
  color: var(--gb3-red);
  font-weight: 800;
}

.cms-gb3-news__all {
  align-self: flex-start;
  margin-top: 18px;
  padding: 13px 20px;
  border: 1px solid var(--gb3-line-light);
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-championship--drivers,
.gb3-championship--teams {
  border-top-color: var(--gb3-line-light);
}

.gb3-championship--drivers {
  padding-bottom: 0;
}

.gb3-driver-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 0;
  background: var(--gb3-line-light);
  gap: 1px;
}

.gb3-driver-card {
  position: relative;
  min-height: 268px;
  padding: 16px;
  overflow: hidden;
  border: 0;
  background: var(--gb3-dark-tile);
}

.gb3-driver-card__portrait {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--gb3-portrait);
}

.gb3-driver-card__portrait span {
  color: rgba(255, 255, 255, 0.16);
  font-family: var(--gb3-mono);
  font-size: 42px;
  font-weight: 700;
}

.gb3-driver-card__top,
.gb3-driver-card h3,
.gb3-driver-card p,
.gb3-driver-card strong {
  position: relative;
  z-index: 1;
}

.gb3-driver-card__top {
  color: var(--gb3-ink-dark);
  font-size: 10px;
  letter-spacing: 0.08em;
}

.gb3-driver-card h3 {
  margin-top: auto;
  color: #fff;
  font-size: 20px;
  line-height: 1.05;
}

.gb3-driver-card h3 span {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 500;
}

.gb3-driver-card p {
  min-height: 0;
  margin-bottom: 12px;
  color: rgba(255, 255, 255, 0.76);
}

.gb3-driver-card strong {
  color: #fff;
}

.gb3-championship--teams {
  padding-bottom: 40px;
}

.gb3-championship--teams .gb3-championship__header {
  gap: 16px;
  padding-top: 36px;
  border-top: 1px solid var(--gb3-line-light);
}

.gb3-championship--teams .gb3-kicker {
  display: none;
}

.gb3-championship--teams .gb3-championship__header h2 {
  font-size: 26px;
}

.gb3-championship--teams .gb3-championship__header p {
  width: auto;
  margin: 0;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.gb3-championship__all-link {
  margin-left: auto;
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-championship__all-link::after {
  content: " ->";
  color: var(--gb3-red);
}

.gb3-championship__all-link:hover {
  color: var(--gb3-red-light);
}

.gb3-team-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  border: 0;
  background: transparent;
}

.gb3-team-card {
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

.gb3-team-card:hover {
  background: var(--gb3-light-hover);
  color: var(--gb3-ink-light);
}

.gb3-team-card:focus-visible {
  outline: 2px solid var(--gb3-red-light);
  outline-offset: 3px;
}

/* Team marks run in their own colours, which decides the tile. Most of the grid is black artwork
   on transparent - Hillspeed, Hitech and Rodin are ~100% black pixels - so a dark tile would have
   shown nothing at all once the knock-out filter came off.
   The card's own --gb3-light-band rather than white: the section behind the cards IS white, so a
   white plate floats free of the card it belongs to instead of reading as the top of it. Sharing
   the card colour also keeps Arden's and VRD's white fills off a pure-white ground.
   .preserve-colours is now the behaviour rather than the exception, so the card no longer reads it;
   the class is still emitted and still meaningful to anything that wants to know. */
.gb3-team-card__mark {
  display: flex;
  height: 84px;
  flex: 0 0 84px;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  background: var(--gb3-light-band);
}

/* Sized to the tile rather than capped at 36px, so the mark fills the box it is given: the padding
   on the container is the only breathing room, and `contain` decides which dimension runs out
   first. Expect this to read unevenly until the artwork is normalised - a wide wordmark is limited
   by the tile's width and a square mark by its height, so the square ones grow the most. */
.gb3-team-card__mark img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-team-card__fallback {
  color: var(--gb3-ink-light-meta);
}

.gb3-team-card__fallback {
  color: rgba(255, 255, 255, 0.38);
  font-family: var(--gb3-mono);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.gb3-team-card__content {
  display: flex;
  min-height: 82px;
  flex-direction: column;
  gap: 3px;
  padding: 14px 16px 16px;
}

.gb3-team-card__content strong {
  color: var(--gb3-ink-light);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.gb3-team-card__content span {
  margin-top: auto;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.cms-gb3-snapshot--partners {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__heading {
  padding-top: 30px;
  padding-bottom: 22px;
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__heading::before {
  content: "Official partners & suppliers";
  padding: 0;
  color: var(--gb3-ink-dark-meta);
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__heading h2 {
  display: none;
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__gallery {
  gap: 30px 40px;
  padding-bottom: 34px;
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__gallery a {
  min-height: 52px;
}

.cms-gb3-snapshot--partners .cms-gb3-snapshot__gallery img {
  max-height: 44px;
}

.gb3-footer {
  background: var(--gb3-dark);
}

.gb3-footer .gb3-partners {
  padding: 30px var(--gb3-gutter) 34px;
}

.gb3-footer .grid-container {
  padding-right: 0;
  padding-left: 0;
}

@media screen and (max-width: 63.998em) {
  .gb3-site-shell {
    max-width: none;
  }
  .gb3-home-hero__content {
    min-height: 540px;
    padding-top: 34px;
  }
  .gb3-home-hero h1 {
    font-size: 44px;
  }
  .gb3-home-hero__stats {
    gap: 10px;
  }
  .gb3-home-hero__stats strong {
    font-size: 23px;
  }
  .gb3-championship__header {
    flex-wrap: wrap;
    padding: 32px 0 20px;
  }
  .gb3-championship__header h2 {
    font-size: 28px;
  }
  .gb3-championship__header p {
    width: 100%;
    margin-left: 0;
    text-align: left;
  }
  .gb3-calendar-feature,
  .gb3-standings-layout,
  .cms-gb3-news {
    grid-template-columns: minmax(0, 1fr);
  }
  .cms-gb3-car-feature {
    min-height: 400px;
  }
  /* Narrow screens put the copy over the middle of the car, so the scrim turns vertical. */
  .cms-gb3-car-feature__scrim {
    background: linear-gradient(180deg, rgba(10, 10, 11, 0.62) 0%, rgba(10, 10, 11, 0.93) 62%);
  }
  .cms-gb3-car-feature__media img {
    -o-object-position: 50% 42%;
       object-position: 50% 42%;
  }
  .gb3-calendar-feature__copy {
    min-height: 300px;
    padding: 28px 20px;
  }
  .gb3-calendar-feature__copy h3 {
    font-size: 34px;
  }
  .gb3-calendar-feature__media {
    min-height: 230px;
  }
  .gb3-calendar-rail li {
    flex-basis: 176px;
  }
  .gb3-calendar-page {
    padding-top: 44px;
  }
  .gb3-calendar-page__header {
    flex-wrap: wrap;
  }
  .gb3-calendar-page__header p {
    width: 100%;
    margin-left: 0;
  }
  .gb3-calendar-page__rounds li {
    grid-template-columns: 64px minmax(120px, 0.65fr) minmax(0, 1fr) 130px;
    gap: 14px;
  }
  .gb3-calendar-page__rounds img {
    height: 78px;
  }
  .gb3-calendar-page__tests ol {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-calendar-page__tests li:nth-child(3n) {
    border-right: 1px solid var(--gb3-line-light);
  }
  .gb3-calendar-page__tests li:nth-child(2n) {
    border-right: 0;
  }
  .gb3-standing-profile {
    min-height: 450px;
  }
  .gb3-standings-table__row {
    grid-template-columns: 36px minmax(0, 1fr) 58px;
    gap: 10px;
    padding-right: 14px;
    padding-left: 14px;
  }
  .gb3-standings-table__gap {
    display: none;
  }
  .gb3-standings-table__row b {
    font-size: 16px;
  }
  .cms-gb3-snapshot--news {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .cms-gb3-news {
    gap: 24px;
  }
  .cms-gb3-news__list > a:not(.cms-gb3-news__all) {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 5px 12px;
  }
  .cms-gb3-news__lead h2 {
    font-size: 30px;
  }
  .gb3-driver-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-driver-card {
    min-height: 220px;
  }
  .gb3-team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .gb3-championship--teams .gb3-championship__header {
    align-items: flex-start;
  }
  .gb3-championship--teams .gb3-championship__header p {
    flex: 1 1 100%;
    order: 3;
  }
  .gb3-championship__all-link {
    margin-left: auto;
  }
  .gb3-partner-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-team-card__mark {
    height: 70px;
    flex-basis: 70px;
    padding: 8px 12px;
  }
  .gb3-team-card__content {
    min-height: 70px;
    padding: 11px 12px 13px;
  }
  .gb3-team-card__content strong {
    font-size: 13px;
  }
  .gb3-team-card__content span {
    font-size: 10px;
  }
  .gb3-calendar-page {
    padding-top: 34px;
    padding-bottom: 44px;
  }
  .gb3-calendar-page__header {
    display: block;
    padding-bottom: 22px;
  }
  .gb3-calendar-page__header .gb3-kicker {
    display: block;
    margin-bottom: 10px;
  }
  .gb3-calendar-page__header h1 {
    font-size: 42px;
  }
  .gb3-calendar-page__header p {
    margin-top: 14px;
  }
  .gb3-calendar-page__rounds li {
    grid-template-columns: 52px minmax(0, 1fr);
    min-height: 0;
    gap: 8px 14px;
    padding: 18px 0;
  }
  .gb3-calendar-page__rounds li.is-current {
    padding-left: 12px;
  }
  .gb3-calendar-page__rounds time {
    grid-column: 2;
    grid-row: 1;
  }
  .gb3-calendar-page__venue {
    grid-column: 2;
  }
  .gb3-calendar-page__venue h2 {
    font-size: 24px;
  }
  .gb3-calendar-page__rounds img {
    display: none;
  }
  .gb3-calendar-page__tests {
    margin-top: 44px;
  }
  .gb3-calendar-page__tests ol {
    grid-template-columns: 1fr;
  }
  .gb3-calendar-page__tests li,
  .gb3-calendar-page__tests li:nth-child(3n) {
    border-right: 0;
  }
  .gb3-home-hero,
  .gb3-home-hero__content {
    min-height: 510px;
  }
  .gb3-home-hero__shade {
    background: linear-gradient(90deg, rgba(10, 10, 11, 0.9), rgba(10, 10, 11, 0.24)), linear-gradient(0deg, rgba(10, 10, 11, 0.9), transparent 56%);
  }
  .gb3-home-hero h1 {
    font-size: 42px;
  }
  .gb3-home-hero__summary {
    font-size: 15px;
  }
  .cms-gb3-snapshot__heading {
    display: block;
  }
  .cms-gb3-snapshot__heading::before {
    display: block;
    margin-bottom: 10px;
  }
  .cms-gb3-snapshot--news .cms-gb3-snapshot__cards,
  .cms-tagged-news__items {
    grid-template-columns: 1fr;
  }
  .cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child,
  .cms-tagged-news__item:first-child {
    grid-column: auto;
  }
  .cms-gb3-snapshot--news .cms-gb3-snapshot__card:first-child h3,
  .cms-tagged-news__item:first-child .cms-tagged-news__link {
    font-size: 22px;
  }
  .cms-gb3-snapshot--drivers .cms-gb3-snapshot__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cms-gb3-snapshot--drivers .cms-gb3-snapshot__card {
    min-height: 250px;
  }
  .cms-gb3-snapshot--drivers .cms-gb3-snapshot__card h3 {
    font-size: 16px;
  }
  .cms-gb3-snapshot--teams .cms-gb3-snapshot__cards {
    grid-template-columns: 1fr;
  }
  .cms-gb3-snapshot__gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* GB3 interior pages */
.gb3-season-page {
  margin: 0 calc(var(--gb3-gutter) * -1) -44px;
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-season-page__hero {
  position: relative;
  min-height: 300px;
  padding: 40px var(--gb3-gutter) 32px;
  overflow: hidden;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: linear-gradient(90deg, var(--gb3-dark) 0%, var(--gb3-dark-band) 58%, #29292c 100%);
}

.gb3-season-page__hero > div {
  position: relative;
  z-index: 1;
  max-width: 680px;
}

.gb3-season-page__hero h1 {
  max-width: 680px;
  margin: 16px 0;
  font-size: 56px;
  font-weight: 800;
  line-height: 0.94;
}

.gb3-season-page__hero p {
  max-width: 550px;
  margin: 0;
  color: #d3d4d7;
  font-size: 17px;
  line-height: 1.6;
}

.gb3-directory-tools, .gb3-profile-tools {
  display: flex;
  min-height: 62px;
  align-items: center;
  gap: 6px;
  padding: 0 var(--gb3-gutter);
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-directory-tools > span:first-child {
  margin-right: 10px;
}

.gb3-directory-tools button {
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid rgba(245, 244, 244, 0.22);
  background: transparent;
  color: var(--gb3-ink-dark-secondary);
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-directory-tools button.is-active {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

.gb3-directory-tools__count {
  margin-left: auto;
}

.gb3-directory-tools a, .gb3-profile-tools a {
  color: var(--gb3-ink-dark);
  font-weight: 700;
}

.gb3-driver-directory-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  padding: 26px var(--gb3-gutter) 44px;
}

.gb3-driver-directory-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border: 1px solid var(--gb3-line-dark-soft);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

.gb3-driver-directory-card:hover {
  border-color: rgba(245, 244, 244, 0.4);
}

.gb3-driver-directory-card__portrait {
  position: relative;
  display: grid;
  aspect-ratio: 500/381;
  place-items: center;
  overflow: hidden;
  background: var(--gb3-portrait);
}

.gb3-driver-directory-card__portrait b {
  color: rgba(255, 255, 255, 0.14);
  font-family: var(--gb3-mono);
  font-size: 72px;
  line-height: 1;
}

.gb3-driver-directory-card__portrait i {
  position: absolute;
  top: 0;
  right: 0;
  padding: 6px 9px;
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.gb3-driver-directory-card__name {
  display: flex;
  min-height: 80px;
  flex-direction: column;
  gap: 3px;
  padding: 14px 14px 0;
}

.gb3-driver-directory-card__name small {
  color: var(--gb3-ink-dark-secondary);
  font-size: 13px;
}

.gb3-driver-directory-card__name strong {
  font-size: 19px;
  line-height: 1.15;
}

.gb3-driver-directory-card__name em {
  color: var(--gb3-ink-dark-meta);
  font-size: 12px;
  font-style: normal;
}

.gb3-driver-directory-card__points {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--gb3-line-dark-soft);
}

.gb3-driver-directory-card__points b {
  font-family: var(--gb3-mono);
  font-size: 16px;
}

.gb3-driver-directory-card__points small, .gb3-driver-directory-card__points i {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-driver-directory-card__points i {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: 11px;
}

.gb3-directory-team-grid {
  padding: 0 var(--gb3-gutter) 46px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-directory-team-grid > header, .gb3-team-profiles > header, .gb3-team-championship > header, .gb3-race-with-us section > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 42px 0 24px;
}

.gb3-directory-team-grid h2, .gb3-team-profiles h2, .gb3-team-championship h2, .gb3-race-with-us h2 {
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
}

.gb3-directory-team-grid > header span, .gb3-team-profiles > header span, .gb3-team-championship > header span, .gb3-race-with-us section > header span {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-directory-team-grid > header a, .gb3-team-profiles > header a {
  margin-left: auto;
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-directory-team-grid > div {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  border-top: 1px solid var(--gb3-line-light);
  border-bottom: 1px solid var(--gb3-line-light);
  background: var(--gb3-line-light);
}

.gb3-directory-team-grid article {
  min-width: 0;
  padding: 18px 16px 20px;
  background: var(--gb3-light);
}

.gb3-directory-team-grid h3 {
  margin: 0 0 3px;
  font-size: 15px;
}

.gb3-directory-team-grid article > span {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-directory-team-grid article a {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
  padding: 9px 0;
  border-top: 1px solid var(--gb3-line-light-soft);
  color: var(--gb3-ink-light);
  font-size: 13px;
  font-weight: 600;
}

.gb3-directory-team-grid article a:first-of-type {
  margin-top: 12px;
}

.gb3-directory-team-grid article a b {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
}

.gb3-profile-tools > span:last-child {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.gb3-profile-tools > span:last-child a {
  padding: 9px 12px;
  border: 1px solid rgba(245, 244, 244, 0.22);
}

.gb3-profile-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 500px);
  border-bottom: 1px solid var(--gb3-line-dark);
}

.gb3-profile-hero__copy {
  display: flex;
  min-height: 480px;
  flex-direction: column;
  gap: 22px;
  padding: 44px var(--gb3-gutter) 32px;
}

.gb3-profile-hero__copy small {
  color: var(--gb3-ink-dark-secondary);
  font-size: 26px;
}

.gb3-profile-hero__copy h1 {
  margin: 0;
  font-size: 76px;
  font-weight: 800;
  line-height: 0.92;
}

.gb3-profile-hero__copy p {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: 0;
}

.gb3-profile-hero__copy p b {
  padding: 8px 11px;
  border: 1px solid rgba(245, 244, 244, 0.16);
  font-family: var(--gb3-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-profile-hero__copy p strong {
  font-size: 17px;
}

.gb3-profile-hero__copy p em {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-style: normal;
}

.gb3-profile-hero__copy dl {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  margin: auto 0 0;
  padding-top: 22px;
  border-top: 1px solid rgba(245, 244, 244, 0.22);
}

.gb3-profile-hero__copy dt {
  font-family: var(--gb3-mono);
  font-size: 32px;
  font-weight: 700;
}

.gb3-profile-hero__copy dd {
  margin: 6px 0 0;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.gb3-profile-hero__portrait {
  position: relative;
  display: grid;
  min-height: 480px;
  place-items: center;
  overflow: hidden;
  border-left: 1px solid var(--gb3-line-dark);
  background: var(--gb3-portrait);
}

.gb3-profile-hero__portrait span {
  color: rgba(255, 255, 255, 0.1);
  font-family: var(--gb3-mono);
  font-size: 210px;
  font-weight: 700;
}

.gb3-profile-summary {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 44px;
  padding: 42px var(--gb3-gutter);
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-profile-summary h2 {
  margin: 0 0 10px;
  font-size: 34px;
}

.gb3-profile-summary p {
  margin: 0;
  color: var(--gb3-ink-light-body);
  line-height: 1.6;
}

.gb3-profile-summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  background: var(--gb3-line-light);
}

.gb3-profile-summary dl div {
  padding: 18px;
  background: var(--gb3-light-band);
}

.gb3-profile-summary dt {
  font-size: 16px;
  font-weight: 700;
}

.gb3-profile-summary dd {
  margin: 5px 0 0;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Driver biography. Sits BELOW the season log, continuing its light band so the numbers and the prose
   read as one block. The copy is editor-authored HTML from RaceAdmin, so the child rules below style
   whatever it contains rather than assuming a structure. */
/* Driver social links. Labels, not icons - this site loads no icon font, and mono micro-type is the
   theme's own idiom for this kind of secondary navigation. Sits in the profile aside under the entry
   details, so it is styled to match .gb3-profile-facts rather than to stand out. */
.gb3-profile-socials {
  margin-top: 22px;
}

.gb3-profile-socials h3 {
  margin: 0 0 10px;
  font: 700 12px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-socials > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gb3-profile-socials a {
  padding: 7px 11px;
  border: 1px solid var(--gb3-line-dark-soft);
  color: inherit;
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.gb3-profile-socials a:hover,
.gb3-profile-socials a:focus-visible {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

.gb3-profile-bio {
  /* No band of its own: it sits INSIDE .gb3-profile-season now, which already supplies the light
     background, the gutter and the padding that closes the section before the page returns to dark for
     "elsewhere on the grid". Its spacing from the log above is the grid's row gap.
     min-width so a long unbroken word in editor-authored prose cannot widen the column. */
  min-width: 0;
}

.gb3-profile-bio > header {
  margin: 0 0 18px;
}

.gb3-profile-bio > header h2 {
  margin: 0;
  font-size: 28px;
}

.gb3-profile-bio__copy {
  /* Narrower than the shell on purpose: long prose at 1280px is unreadable. */
  max-width: 760px;
  font-size: 17px;
  line-height: 1.6;
}

.gb3-profile-bio__copy > *:first-child {
  margin-top: 0;
}

.gb3-profile-bio__copy > *:last-child {
  margin-bottom: 0;
}

.gb3-profile-bio__copy p {
  margin: 0 0 14px;
}

.gb3-profile-bio__copy a {
  color: var(--gb3-red);
  text-decoration: underline;
}

.gb3-profile-bio__copy img {
  height: auto;
  max-width: 100%;
}

.gb3-profile-others {
  padding: 34px var(--gb3-gutter) 40px;
}

.gb3-profile-others header {
  display: flex;
  align-items: baseline;
}

.gb3-profile-others h2 {
  margin: 0;
  font-size: 26px;
}

.gb3-profile-others header a {
  margin-left: auto;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-profile-others > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 20px;
}

.gb3-profile-others > div a {
  display: flex;
  min-height: 128px;
  flex-direction: column;
  justify-content: end;
  padding: 14px;
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

.gb3-profile-others > div a span {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-weight: 700;
}

.gb3-profile-others > div a b {
  margin-top: 18px;
  font-size: 17px;
}

.gb3-profile-others > div a small {
  margin-top: 4px;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-championship {
  padding: 0 var(--gb3-gutter) 10px;
  background: var(--gb3-dark-band);
}

.gb3-team-championship > header span {
  color: var(--gb3-ink-dark-meta);
}

.gb3-team-championship > div {
  border-top: 1px solid var(--gb3-line-dark);
}

.gb3-team-championship article {
  display: grid;
  min-height: 74px;
  grid-template-columns: 44px 100px minmax(0, 1fr) minmax(80px, 220px) 96px;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid var(--gb3-line-dark-soft);
}

.gb3-team-championship article > b, .gb3-team-championship article > em {
  font-family: var(--gb3-mono);
  font-style: normal;
  font-weight: 700;
}

.gb3-team-championship article > em {
  text-align: right;
  font-size: 22px;
}

.gb3-team-championship__mark, .gb3-team-profiles__mark {
  display: grid;
  height: 46px;
  place-items: center;
  background: var(--gb3-dark);
  color: rgba(255, 255, 255, 0.4);
  font-family: var(--gb3-mono);
  font-weight: 700;
}

.gb3-team-championship article > span strong {
  display: block;
  font-size: 19px;
}

.gb3-team-championship article > span small {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-championship article > i {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-style: normal;
}

.gb3-team-championship article > i > i {
  display: block;
  height: 4px;
  background: #353538;
}

.gb3-team-championship article > i > i > i {
  display: block;
  height: 100%;
  background: var(--gb3-red);
}

.gb3-team-championship article > i small {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-profiles {
  padding: 0 var(--gb3-gutter) 46px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-team-profiles > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.gb3-team-profiles article {
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr);
  background: var(--gb3-light-band);
}

.gb3-team-profiles__mark {
  height: auto;
  min-height: 160px;
  font-size: 24px;
}

.gb3-team-profiles article > div:last-child {
  padding: 18px 20px 20px;
}

.gb3-team-profiles article header {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.gb3-team-profiles h3 {
  margin: 0;
  font-size: 19px;
}

.gb3-team-profiles article header span {
  margin-left: auto;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
}

.gb3-team-profiles dl {
  display: flex;
  gap: 22px;
  margin: 14px 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-team-profiles dt {
  font-family: var(--gb3-mono);
  font-size: 20px;
  font-weight: 700;
}

.gb3-team-profiles dd {
  margin: 1px 0 0;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-team-profiles__drivers a {
  display: grid;
  grid-template-columns: 28px 30px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid var(--gb3-line-light-soft);
  color: var(--gb3-ink-light);
  font-size: 14px;
  font-weight: 600;
}

.gb3-team-profiles__drivers a b, .gb3-team-profiles__drivers a small {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
}

.gb3-team-profiles__drivers a small {
  text-align: right;
}

.gb3-race-with-us {
  margin: 0 calc(var(--gb3-gutter) * -1);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-race-with-us__hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr);
  min-height: 560px;
  border-bottom: 1px solid var(--gb3-line-dark);
}

.gb3-race-with-us__hero-copy {
  display: flex;
  flex-direction: column;
  gap: 26px;
  padding: 54px var(--gb3-gutter) 40px;
}

.gb3-race-with-us__hero h1 {
  max-width: 720px;
  margin: 0;
  font-size: 76px;
  font-weight: 800;
  line-height: 0.92;
}

.gb3-race-with-us__hero p {
  max-width: 540px;
  margin: 0;
  color: #d3d4d7;
  font-size: 17px;
  line-height: 1.6;
}

.gb3-race-with-us__hero-copy > div, .gb3-race-with-us__steps footer {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.gb3-race-with-us__hero a, .gb3-race-with-us__steps footer a {
  padding: 15px 22px;
  background: var(--gb3-red);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us a.gb3-race-with-us__secondary {
  border: 1px solid rgba(245, 244, 244, 0.45);
  background: transparent;
  color: var(--gb3-ink-dark);
}

.gb3-race-with-us__hero small {
  max-width: 520px;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-race-with-us__hero > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-race-with-us__figures {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.gb3-race-with-us__figures div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  padding: 22px var(--gb3-gutter) 24px;
  border-right: 1px solid var(--gb3-line-dark-soft);
}

.gb3-race-with-us__figures strong {
  font-family: var(--gb3-mono);
  font-size: 34px;
}

.gb3-race-with-us__figures span {
  color: var(--gb3-ink-dark-secondary);
  font-size: 13px;
}

.gb3-race-with-us__car, .gb3-race-with-us__steps {
  padding: 0 var(--gb3-gutter) 46px;
}

.gb3-race-with-us__car > header span, .gb3-race-with-us__steps > header span {
  color: var(--gb3-ink-dark-meta);
}

.gb3-race-with-us__car-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  gap: 1px;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-line-dark);
}

.gb3-race-with-us__car-content > div:first-child {
  background: var(--gb3-dark);
}

.gb3-race-with-us details {
  border-bottom: 1px solid var(--gb3-line-dark-soft);
  padding: 18px 22px 20px;
}

.gb3-race-with-us summary {
  cursor: pointer;
  font-size: 19px;
  font-weight: 700;
}

.gb3-race-with-us summary b {
  margin-right: 16px;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
}

.gb3-race-with-us details p {
  margin: 12px 0 0 28px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
  line-height: 1.6;
}

.gb3-race-with-us details > span {
  display: flex;
  gap: 10px;
  margin: 12px 0 0 28px;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
}

.gb3-race-with-us details > span strong {
  color: var(--gb3-ink-dark);
  font-size: 16px;
}

.gb3-race-with-us__car-image {
  display: grid;
  min-height: 540px;
  place-items: center;
  overflow: hidden;
  background: var(--gb3-dark-tile);
}

.gb3-race-with-us__car-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-race-with-us__car-image span {
  color: rgba(255, 255, 255, 0.14);
  font-family: var(--gb3-mono);
  font-size: 56px;
  font-weight: 700;
}

.gb3-race-with-us__value {
  padding: 0 var(--gb3-gutter) 48px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-race-with-us__licence-points {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.gb3-race-with-us__licence-points div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
  padding: 20px;
  background: var(--gb3-light-band);
}

.gb3-race-with-us__licence-points span, .gb3-race-with-us__licence-points small {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-race-with-us__licence-points strong {
  font-family: var(--gb3-mono);
  font-size: 42px;
}

.gb3-race-with-us__value-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 56px;
  padding-top: 44px;
}

.gb3-race-with-us__value h3 {
  margin: 0 0 10px;
  font-size: 26px;
}

.gb3-race-with-us__value p, .gb3-race-with-us__value li {
  color: var(--gb3-ink-light-body);
  line-height: 1.6;
}

.gb3-race-with-us__value a {
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us__value ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-race-with-us__value li {
  padding: 10px 0;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-race-with-us__steps > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--gb3-line-dark);
  border-bottom: 1px solid var(--gb3-line-dark);
}

.gb3-race-with-us__steps article {
  display: flex;
  min-height: 210px;
  flex-direction: column;
  gap: 10px;
  padding: 24px 28px 28px;
  border-right: 1px solid var(--gb3-line-dark-soft);
}

.gb3-race-with-us__steps article b {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 26px;
}

.gb3-race-with-us__steps article h3 {
  margin: 0;
  font-size: 19px;
}

.gb3-race-with-us__steps article p {
  margin: 0;
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.gb3-race-with-us__steps footer {
  align-items: center;
  margin-top: 44px;
  padding: 30px 32px;
  background: var(--gb3-dark-band);
}

.gb3-race-with-us__steps footer div {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 5px;
}

.gb3-race-with-us__steps footer span, .gb3-race-with-us__steps footer small {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us__steps footer strong {
  font-size: 20px;
}

@media screen and (max-width: 63.998em) {
  .gb3-driver-directory-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .gb3-directory-team-grid > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-profile-hero, .gb3-profile-summary, .gb3-race-with-us__hero, .gb3-race-with-us__car-content, .gb3-race-with-us__value-columns {
    grid-template-columns: 1fr;
  }
  .gb3-profile-hero__portrait {
    min-height: 300px;
    border-top: 1px solid var(--gb3-line-dark);
    border-left: 0;
  }
  .gb3-team-profiles > div {
    grid-template-columns: 1fr;
  }
  .gb3-race-with-us__hero > img {
    min-height: 320px;
  }
  .gb3-race-with-us__licence-points {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .gb3-race-with-us__steps > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-season-page, .gb3-race-with-us {
    margin-right: -16px;
    margin-left: -16px;
  }
  .gb3-season-page__hero {
    padding: 34px 16px;
  }
  .gb3-season-page__hero h1, .gb3-race-with-us__hero h1, .gb3-profile-hero__copy h1 {
    font-size: 42px;
  }
  .gb3-directory-tools, .gb3-profile-tools {
    min-height: 0;
    flex-wrap: wrap;
    padding: 16px;
  }
  .gb3-directory-tools__count {
    width: 100%;
    margin-left: 0;
  }
  .gb3-directory-tools a {
    margin-left: auto;
  }
  .gb3-driver-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 16px 16px 36px;
    gap: 8px;
  }
  .gb3-directory-team-grid, .gb3-team-championship, .gb3-team-profiles, .gb3-race-with-us__car, .gb3-race-with-us__value, .gb3-race-with-us__steps {
    padding-right: 16px;
    padding-left: 16px;
  }
  .gb3-directory-team-grid > header, .gb3-team-profiles > header, .gb3-team-championship > header, .gb3-race-with-us section > header {
    flex-wrap: wrap;
    padding-top: 32px;
  }
  .gb3-directory-team-grid h2, .gb3-team-profiles h2, .gb3-team-championship h2, .gb3-race-with-us h2 {
    font-size: 28px;
  }
  .gb3-directory-team-grid > header span, .gb3-team-profiles > header span, .gb3-team-championship > header span, .gb3-race-with-us section > header span {
    width: 100%;
  }
  .gb3-directory-team-grid > div {
    grid-template-columns: 1fr;
  }
  .gb3-profile-tools > span:last-child {
    width: 100%;
    margin-left: 0;
  }
  .gb3-profile-hero__copy {
    min-height: 0;
    padding: 34px 16px;
  }
  .gb3-profile-hero__copy dl {
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .gb3-profile-hero__copy dt {
    font-size: 24px;
  }
  .gb3-profile-summary {
    gap: 28px;
    padding: 32px 16px;
  }
  .gb3-profile-others {
    padding-right: 16px;
    padding-left: 16px;
  }
  .gb3-profile-others > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-team-championship article {
    grid-template-columns: 34px 46px minmax(0, 1fr) 58px;
    gap: 10px;
    padding: 10px 0;
  }
  .gb3-team-championship article > i {
    display: none;
  }
  .gb3-team-championship article > em {
    font-size: 18px;
  }
  .gb3-team-profiles article {
    grid-template-columns: 92px minmax(0, 1fr);
  }
  .gb3-team-profiles__mark {
    min-height: 140px;
  }
  .gb3-race-with-us__hero-copy {
    padding: 42px 16px;
  }
  .gb3-race-with-us__figures {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-race-with-us__figures div {
    padding: 20px 16px;
  }
  .gb3-race-with-us__car-image {
    min-height: 300px;
  }
  .gb3-race-with-us__licence-points {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-race-with-us__value-columns {
    gap: 26px;
  }
  .gb3-race-with-us__steps > div {
    grid-template-columns: 1fr;
  }
  .gb3-race-with-us__steps article {
    min-height: 0;
    border-bottom: 1px solid var(--gb3-line-dark-soft);
  }
  .gb3-race-with-us__steps footer {
    align-items: flex-start;
    padding: 24px;
  }
}
html {
  box-sizing: border-box;
  background: #1c1c1f;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  background: #1c1c1f;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body,
.off-canvas-content {
  min-height: 100vh;
}

.off-canvas-content {
  width: 100%;
  /* Uncapped for the same reason as .gb3-site-shell, and it has to be done in BOTH places: the shell
     element carries both classes, and this rule comes later in the file, so capping here silently beat
     the other one and nothing appeared to change. */
  max-width: none;
  margin: 0 auto;
  /* clip, not hidden. Both stop the full-bleed sections spilling sideways, but `hidden` makes this
     element the scroll container for every sticky descendant - and since the shell scrolls with the
     page rather than within itself, that silently turns `position: sticky` anywhere inside the site
     into `static`. `clip` establishes no scroll container, so the driver profile aside can stick. */
  overflow-x: clip;
  background: var(--gb3-dark);
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
ul {
  margin-top: 0;
}

.grid-container {
  width: 100%;
  max-width: var(--gb3-shell);
  margin: 0 auto;
  padding-right: var(--gb3-gutter);
  padding-left: var(--gb3-gutter);
}

.grid-container.full,
.grid-container.fluid {
  max-width: 100%;
}

.grid-container.full {
  padding-right: 0;
  padding-left: 0;
}

.grid-x {
  display: flex;
  flex-flow: row wrap;
  min-width: 0;
}

.grid-y {
  display: flex;
  flex-direction: column;
}

.cell {
  flex: 0 0 auto;
  min-width: 0;
  width: 100%;
}

.cell.auto,
.cell.grow {
  flex: 1 1 0;
  width: auto;
}

.cell.shrink {
  flex: 0 0 auto;
  width: auto;
}

.small-2 {
  width: 16.6667%;
}

.small-3 {
  width: 25%;
}

.small-4 {
  width: 33.3333%;
}

.small-6 {
  width: 50%;
}

.small-8 {
  width: 66.6667%;
}

.small-9 {
  width: 75%;
}

.small-12 {
  width: 100%;
}

.grid-margin-x,
.grid-padding-x {
  margin-right: -6px;
  margin-left: -6px;
}

.grid-margin-x > .cell,
.grid-padding-x > .cell {
  padding-right: 6px;
  padding-left: 6px;
}

.grid-margin-y,
.grid-padding-y {
  margin-top: -6px;
  margin-bottom: -6px;
}

.grid-margin-y > .cell,
.grid-padding-y > .cell {
  padding-top: 6px;
  padding-bottom: 6px;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-left {
  text-align: left;
}

.align-center {
  justify-content: center;
}

.align-middle,
.v-align-text {
  align-items: center;
}

.align-bottom {
  align-items: flex-end;
}

.align-self-bottom {
  align-self: flex-end;
}

.show-for-medium,
.show-for-large {
  display: none !important;
}

.button,
button,
input,
textarea,
select {
  font: inherit;
}

.button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 16px;
  border: 1px solid var(--gb3-line-dark);
  border-radius: 0;
  background: transparent;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.button.primary,
.button.brand-col,
#live-timing {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

.button.secondary,
.button.outline {
  border-color: rgba(245, 244, 244, 0.28);
  background: transparent;
  color: var(--gb3-ink-dark);
}

.button:hover,
a:hover {
  color: var(--gb3-ink-dark);
}

.top-bar1 {
  height: var(--gb3-utility-bar);
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark-secondary);
}

.top-bar1 .grid-container,
.top-bar1 .grid-x {
  height: 100%;
}

.top-bar1 a,
.top-bar1 .socials a {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.top-bar1 a:hover,
.top-bar1 .socials a:hover {
  color: var(--gb3-ink-dark);
}

.top-bar1 .championships img {
  max-height: 24px;
  width: auto;
}

.top-bar1 .championships .grid-x,
.top-bar1 .socials {
  display: flex;
  align-items: center;
  gap: 18px;
}

.gb3-site-shell {
  min-height: 100vh;
}

/* Sticky at every width. Below 64em it always was (see the #header rule in that query); desktop now
   matches, so the navigation and Live timing stay one click away however far down a long page -
   standings, a driver profile - the visitor has read.

   It is the whole <header> that sticks, not the red bar inside it: sticky only travels within its
   parent, and the bar's parent is the header itself, which is barely taller than the bar. To let the
   utility strip scroll away while the bar stays, the header sticks at a NEGATIVE top equal to the
   strip's height - it scrolls up by exactly that much and then holds. That offset is conditional on
   the strip being there at all: GB3Header omits it when the front has no utility, partner or social
   links, and a -42px top with no strip would tuck 42px of the red bar off the top of the screen. */
.gb3-header {
  position: sticky;
  top: 0;
  z-index: 20;
}

@media print, screen and (min-width: 64em) {
  .gb3-header.has-utility {
    top: calc(-1 * var(--gb3-utility-bar));
  }
}
/* --- Compacting once scrolled -------------------------------------------------------------------
   gb3-2026.js sets .is-compact once the page has scrolled past the utility strip, and the bar drops
   to --gb3-bar-compact: 60px from tablet up, 68px on a phone, where the section-link strip under the
   logo folds away instead.

   The header's LAYOUT never changes size - only what is painted. That is the whole design. A header
   that really got shorter would pull everything below it up by the difference the instant the class
   landed, and although Chrome and Firefox hide that with scroll anchoring, Safari does not: on an
   iPhone the page would lurch 73px every time the threshold was crossed. So:

   - the red is a background layer (.gb3-primary-nav::before) that animates to the compact height,
     while the bar box itself stays full size and transparent;
   - the contents tighten up inside that layer - on desktop and tablet by resizing them within a bar
     whose min-height holds its layout, on a phone by hiding the second row, which keeps its space;
   - the strip of header left uncovered underneath is transparent and passes clicks through to the
     page, but the visible red takes them, so a tap on the bar never lands on whatever it is covering.

   Never while the phone menu is open: that menu hangs off the bottom of the full-height bar, and
   collapsing the bar above it would leave the menu floating beneath a gap. The script checks. */
.gb3-primary-nav::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  /* +1px to cover the bar's own bottom border, which carries its layout height but is left transparent
     so the line can move with the layer - see .gb3-primary-nav. */
  height: calc(100% + 1px);
  box-sizing: border-box;
  border-bottom: 1px solid var(--gb3-line-red);
  background: var(--gb3-red);
  content: "";
  transition: height 200ms cubic-bezier(0.2, 0, 0, 1), box-shadow 200ms linear;
}

/* Positioned, so it paints above the ::before layer rather than under it. */
.gb3-primary-nav > .grid-container {
  position: relative;
}

#header .logo-img,
#header .logo-img img,
.gb3-primary-nav .gb3-live-timing,
.gb3-menu-toggle {
  transition: height 200ms cubic-bezier(0.2, 0, 0, 1), margin 200ms cubic-bezier(0.2, 0, 0, 1), background-color 130ms linear, border-color 130ms linear, color 130ms linear;
}

/* ID-qualified because #header's own background and border are, and would otherwise win. */
#header.is-compact {
  border-bottom-color: transparent;
  background: transparent;
  pointer-events: none;
}

#header.is-compact .gb3-primary-nav::before {
  height: var(--gb3-bar-compact);
  box-shadow: 0 6px 18px rgba(10, 10, 11, 0.35);
  pointer-events: auto;
}

#header.is-compact .gb3-primary-nav .grid-x > *,
#header.is-compact .gb3-utility-nav,
#header.is-compact .gb3-mobile-nav {
  pointer-events: auto;
}

/* Tablet and up: one row, resized to fit. The bar keeps its 80px min-height underneath, so the page
   below does not move. Live timing and the menu button keep their 44px - only the air around them
   goes - and the logo image comes down to the 44px it already is on a tablet. */
@media print, screen and (min-width: 40em) {
  #header.is-compact .gb3-primary-nav .grid-x {
    min-height: var(--gb3-bar-compact);
  }
  #header.is-compact .logo-img {
    height: var(--gb3-bar-compact);
  }
  #header.is-compact .logo-img img {
    height: 44px;
  }
  #header.is-compact .gb3-primary-item > a,
  #header.is-compact .gb3-submenu-toggle {
    min-height: 0;
  }
  #header.is-compact .gb3-primary-nav .gb3-live-timing,
  #header.is-compact .gb3-menu-toggle {
    margin-top: 8px;
    margin-bottom: 8px;
  }
}
/* Phone: the section links fold away and the logo row stays exactly as it is. That row's height is
   what the page is laid out against here, so resizing it would move the content; the link strip is
   hidden with visibility, which keeps its space and also takes it out of tab order and hit testing.
   The hamburger in the row above still reaches every section. */
@media print, screen and (max-width: 39.9375em) {
  .gb3-primary-links {
    transition: opacity 160ms linear, visibility 0s linear 0s;
  }
  #header.is-compact .gb3-primary-links {
    visibility: hidden;
    opacity: 0;
    transition: opacity 160ms linear, visibility 0s linear 160ms;
  }
}
@media (prefers-reduced-motion: reduce) {
  .gb3-primary-nav::before,
  #header .logo-img,
  #header .logo-img img,
  .gb3-primary-nav .gb3-live-timing,
  .gb3-menu-toggle,
  .gb3-primary-links {
    transition: none;
  }
}
.gb3-utility-nav .grid-x,
.gb3-primary-nav .grid-x {
  flex-wrap: nowrap;
}

.gb3-utility-links {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 22px;
  overflow: hidden;
  white-space: nowrap;
}

.gb3-utility-links-right {
  margin-left: auto;
}

.gb3-social-link {
  min-width: 20px;
  justify-content: center;
}

/* The red and its bottom line are painted by ::before (see "Compacting once scrolled"), so the bar can
   shrink on screen without shrinking in the layout. The border stays for the 1px of height it has
   always contributed, transparent so the line is drawn once, by the layer. */
.gb3-primary-nav {
  position: relative;
  min-height: 80px;
  border-bottom: 1px solid transparent;
  background: transparent;
}

/* On a desktop the 80px logo is what gives the bar its height, and with the 1px border that is 81 -
   one more than the min-height above, which is border-box. So when the compact logo shrinks to 60 the
   bar fell back to 80 and the whole page moved up a pixel. Holding the min-height at the full 81 keeps
   the layout still while the contents shrink, which is the one thing the compacting must not break. */
@media print, screen and (min-width: 64em) {
  .gb3-primary-nav {
    min-height: 81px;
  }
}
.gb3-primary-nav .grid-x {
  min-height: 68px;
  align-items: stretch;
}

.gb3-primary-links {
  display: flex;
  min-width: 0;
  align-items: stretch;
  margin-left: 18px;
}

.gb3-primary-item {
  position: relative;
  display: flex;
  align-items: stretch;
}

.gb3-primary-item > a,
.gb3-submenu-toggle,
.gb3-live-timing {
  display: inline-flex;
  min-height: 68px;
  align-items: center;
  box-sizing: border-box;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--gb3-on-red);
  font-family: var(--gb3-mono);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-primary-item > a,
.gb3-submenu-toggle {
  padding: 0 13px;
}

.gb3-submenu-toggle {
  gap: 7px;
  cursor: pointer;
}

.gb3-submenu-icon {
  padding-right: 13px;
  padding-left: 0;
}

.gb3-primary-item.active > a,
.gb3-primary-item > a:hover,
.gb3-submenu-toggle:hover {
  border-bottom-color: #fff;
  color: #fff;
}

/* The two rules above are outranked and do not reach the bar on their own. `#header nav a` further
   down this file is an ID selector from the pre-2026 header, and every primary link is an <a> inside
   a <nav> inside #header, so it wins on specificity and paints them the grey it picked for a black
   bar - and underlines hover in a red that a red bar swallows whole.
   That rule still serves the utility bar, so it stays; these re-state the answer for the red bar
   only, with the .gb3-primary-nav class added to clear it. Scoped so the utility links above keep
   their own secondary grey on the dark strip. */
#header .gb3-primary-nav nav a {
  color: var(--gb3-on-red);
}

#header .gb3-primary-nav nav a:hover,
#header .gb3-primary-nav .gb3-primary-item.active > a {
  border-bottom-color: #fff;
  color: #fff;
}

.gb3-live-timing {
  min-height: 44px;
  margin: 12px 0 12px auto;
  padding: 0 16px;
  border: 1px solid #fff;
  background: #fff;
  color: var(--gb3-red);
}

.gb3-live-timing:hover {
  border-color: var(--gb3-dark);
  background: var(--gb3-dark);
  color: #fff;
}

.gb3-submenu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 2;
  display: block !important;
  width: -moz-max-content;
  width: max-content;
  min-width: 220px;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  border: 1px solid var(--gb3-line-dark);
  border-top-color: var(--gb3-line-red);
  background: var(--gb3-dark-band);
  list-style: none;
}

.gb3-submenu[hidden],
.gb3-mobile-nav[hidden] {
  display: none !important;
}

.gb3-submenu li {
  display: block !important;
}

.gb3-submenu a {
  display: block !important;
  min-height: 44px !important;
  padding: 13px 16px !important;
  border: 0 !important;
  color: var(--gb3-ink-dark-secondary) !important;
  font-family: var(--gb3-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.gb3-submenu a:hover {
  background: var(--gb3-dark-hover);
  color: var(--gb3-ink-dark) !important;
}

.gb3-menu-toggle,
.gb3-mobile-nav {
  display: none;
}

.gb3-submenu-toggle:focus-visible,
.gb3-menu-toggle:focus-visible,
.gb3-directory-tools button:focus-visible {
  outline: 2px solid var(--gb3-red);
  outline-offset: -2px;
}

.gb3-wordmark {
  display: inline-flex;
  align-items: baseline;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
}

.gb3-wordmark span {
  margin-left: 1px;
  color: var(--gb3-red);
}

.gb3-page-content {
  min-height: 320px;
}

.gb3-footer .gb3-partners {
  padding: 30px 0 34px;
  border-top: 1px solid var(--gb3-line-dark);
}

.gb3-footer-label {
  margin: 0 0 22px;
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gb3-partner-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 30px 40px;
  align-items: center;
  justify-items: center;
}

/* span: a partner with no link is shown as a logo alone, sized and centred the same as the linked ones. */
.gb3-partner-grid a,
.gb3-partner-grid > span {
  display: flex;
  width: 100%;
  min-height: 54px;
  align-items: center;
  justify-content: center;
}

.gb3-partner-grid img {
  max-width: 100%;
  max-height: 46px;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0) invert(1);
}

/* The footer body: brand and socials, the menu's own columns, and the enquiry panel. */
.gb3-footer__main {
  padding: 44px var(--gb3-gutter) 40px;
  border-top: 1px solid var(--gb3-line-dark);
}

.gb3-footer__inner {
  display: grid;
  width: 100%;
  max-width: var(--gb3-column);
  grid-template-columns: minmax(200px, 0.9fr) minmax(0, 2fr) minmax(190px, 0.9fr);
  gap: 40px;
  margin: 0 auto;
}

.gb3-footer__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
}

.gb3-footer__mark img {
  max-width: 168px;
  max-height: 58px;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-footer__mark .gb3-wordmark {
  font-size: 34px;
}

.gb3-footer__socials {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* A little bigger than the header's, which sits in a 30px-tall utility strip. Boxed rather than bare
   because down here they are the only marks on a large empty panel. */
.gb3-footer__social-link {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--gb3-line-dark);
  color: var(--gb3-ink-dark-secondary);
}

.gb3-footer__social-link:hover {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

.gb3-footer__columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 28px 30px;
}

.gb3-footer__column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}

.gb3-footer__column h2,
.gb3-footer__contact h2 {
  margin: 0 0 4px;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* Bigger than the 11px mono the generic `footer a` rule sets: these are navigation, not small print,
   and this is the only route to most of the site from the bottom of a long page. */
.gb3-footer__column a,
.gb3-footer__contact p {
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-font);
  font-size: 14px;
  line-height: 1.35;
}

.gb3-footer__column a:hover {
  color: var(--gb3-ink-dark);
}

.gb3-footer__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.gb3-footer__contact p {
  margin: 0;
  max-width: 24ch;
}

.gb3-footer__contact-link {
  margin-top: 4px;
  padding: 11px 18px;
  background: var(--gb3-red);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-footer__contact-link:hover {
  background: #fff;
  color: var(--gb3-dark);
}

.gb3-footer__legal {
  padding: 18px var(--gb3-gutter);
  border-top: 1px solid var(--gb3-line-dark-soft);
}

.gb3-footer__legal .gb3-footer__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 18px;
}

.gb3-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

.gb3-copyright {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.07em;
}

#header {
  min-height: 68px;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
}

#header > .grid-container > .grid-x {
  min-height: 68px;
  align-items: stretch;
}

#header .logo-img {
  display: flex;
  height: 80px;
  align-items: center;
  margin: 0;
  /* No padding of its own. .gb3-header .grid-container already applies the gutter, and applying it
     again here indented the logo to twice the depth of every section below it. */
  padding: 0;
}

#header .logo-img img {
  width: auto;
  /* 64px in the 80px bar - 8px clearance top and bottom. The bar height is set in TWO places that
     must move together: .gb3-primary-nav's min-height and #header .logo-img's own height. max-width
     has to keep pace with the height or it binds first and squashes the aspect ratio: the 1499x418
     logo at 64px tall is ~229px wide, so 280px leaves headroom. */
  height: 64px;
  max-width: 280px;
  flex: 0 0 auto;
  -o-object-fit: contain;
     object-fit: contain;
}

#header .menu-container {
  display: flex;
  min-width: 0;
  justify-content: flex-end;
}

#header ul,
#header .menu {
  display: flex;
  height: 100%;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

#header li {
  display: flex;
}

#header .menu a,
#header nav a {
  display: flex;
  height: 100%;
  min-height: 68px;
  align-items: center;
  padding: 0 13px;
  border-bottom: 2px solid transparent;
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

#header .menu a:hover,
#header nav a:hover,
#header .menu .active > a {
  border-bottom-color: var(--gb3-red);
  color: var(--gb3-ink-dark);
}

.menu-btn {
  display: flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(245, 244, 244, 0.25);
  color: var(--gb3-ink-dark);
}

.page-body {
  background: var(--gb3-dark);
}

.hero-image {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
}

.hero-image.home-page {
  min-height: 620px;
}

.hero-image picture,
.hero-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-image img {
  -o-object-fit: cover;
     object-fit: cover;
}

.hero-image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.94), rgba(10, 10, 11, 0.4)), linear-gradient(180deg, rgba(10, 10, 11, 0) 52%, rgba(10, 10, 11, 0.88));
}

.hero-image .overlay {
  display: none;
}

.hero-image h1,
.page-body > h1 {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0;
  padding: 52px var(--gb3-gutter) 36px;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-font);
  font-size: 76px;
  font-weight: 800;
  line-height: 0.92;
  letter-spacing: 0;
}

.hero-image h1 em,
.page-body > h1 em {
  color: var(--gb3-red);
  font-style: normal;
}

.intro-text {
  padding: 36px 0 44px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 17px;
  line-height: 1.6;
}

.intro-text h2,
.intro-text h3,
.widget-header h2,
.widget-header h3 {
  color: inherit;
  font-family: var(--gb3-font);
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.widget-header {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  padding: 44px 0 26px;
}

.widget-header .text {
  min-width: 0;
}

.widget-header .line,
.widget-header .spacer {
  flex: 1 1 0;
  height: 1px;
  background: currentColor;
  opacity: 0.14;
}

.widget-header.dark {
  color: var(--gb3-ink-dark);
}

.calendar-container {
  position: relative;
  border-top: 1px solid var(--gb3-line-light);
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.calendar-container > .calendar-info {
  display: none;
}

.calendar-container > .calendar-info.show {
  display: block;
}

.calendar-info > .grid-x {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1fr);
  align-items: stretch;
}

.calendar-info .circuit-layout {
  position: absolute;
  right: var(--gb3-gutter);
  bottom: 24px;
  z-index: 2;
  width: 180px;
  opacity: 0.35;
  filter: brightness(0);
}

.calendar-info .cell.large-6:first-of-type {
  grid-column: 2;
  min-height: 520px;
}

.calendar-info .cell.large-6:first-of-type picture,
.calendar-info .cell.large-6:first-of-type img {
  width: 100%;
  height: 100%;
}

.calendar-info .cell.large-6:first-of-type img {
  -o-object-fit: cover;
     object-fit: cover;
}

.calendar-info .cell.large-6:last-of-type {
  grid-column: 1;
  grid-row: 1;
  background: var(--gb3-red-light);
  color: #fff;
}

.calendar-info-round-info {
  display: flex;
  min-height: 520px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 44px var(--gb3-gutter);
}

.calendar-info-round-info h6,
.calendar-info-round-info .date-expanded {
  margin: 0 0 12px;
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.calendar-info-round-info .venue {
  margin: 0 0 18px;
  font-size: 46px;
  font-weight: 800;
  line-height: 0.98;
  letter-spacing: 0;
}

.calendar-container .swiper {
  padding: 1px var(--gb3-gutter) 36px;
  overflow: hidden;
}

.calendar-quick-view {
  display: flex;
  gap: 1px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.calendar-quick-view::-webkit-scrollbar {
  display: none;
}

.calendar-quick-view .round {
  flex: 0 0 200px;
  scroll-snap-align: start;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

.calendar-quick-view .round.selected,
.calendar-quick-view .round.round-selected {
  background: var(--gb3-red-light);
  color: #fff;
}

.calendar-quick-view .round .info {
  min-height: 178px;
  padding: 18px 14px;
}

.calendar-quick-view .round img {
  width: 120px;
  max-height: 82px;
  margin: 0 auto 14px;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0);
}

.calendar-quick-view .round.selected img,
.calendar-quick-view .round.round-selected img {
  filter: brightness(0) invert(1);
}

.calendar-quick-view h5,
.calendar-quick-view h6 {
  margin: 0;
}

.calendar-quick-view .date,
.calendar-quick-view .date-expanded,
.calendar-quick-view .number {
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.calendar-quick-view .venue {
  margin-top: 10px;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0;
}

.swiper-button-prev,
.swiper-button-next {
  display: none;
}

.large-countdown {
  border-top: 1px solid var(--gb3-line-dark);
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band) !important;
  color: var(--gb3-ink-dark);
  padding: 0;
}

.large-countdown .grid-container {
  padding-top: 24px;
  padding-bottom: 24px;
}

.large-countdown h2,
.large-countdown h3,
.large-countdown h4,
.large-countdown h5,
.large-countdown li {
  font-family: var(--gb3-mono);
  text-transform: uppercase;
}

#standings,
.standings,
.standings-page {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

#standings .podium {
  display: none;
}

#standings > .grid-container,
.standings-page > .grid-container {
  background: transparent !important;
  padding-top: 36px;
  padding-bottom: 20px;
}

.standings-row {
  border-bottom: 1px solid var(--gb3-line-dark-soft);
  background: var(--gb3-dark);
}

.standings-row:hover {
  background: var(--gb3-dark-hover);
}

.standings-row > .grid-x {
  min-height: 56px;
  align-items: center;
  padding: 0 14px;
}

.standings-row h5 {
  margin: 0;
}

.standings-row .pos,
.standings-row .points {
  font-family: var(--gb3-mono);
  font-weight: 700;
}

.standings-row .pos {
  color: var(--gb3-red);
  font-size: 15px;
}

.standings-row .driver {
  color: var(--gb3-ink-dark);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
}

.standings-row .driver strong {
  font-weight: 800;
}

.standings-row .team {
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
  font-weight: 500;
}

.standings-row .points {
  color: var(--gb3-ink-dark);
  font-size: 23px;
}

.news-article-container,
.news-list-page,
.news .grid-container,
.teams-container {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.news-article-container {
  padding-top: 0;
  padding-bottom: 46px;
}

.news-article-container .widget-header {
  display: none;
}

.article-container {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 1px;
  background: var(--gb3-line-light);
  text-align: left;
}

.article-container > * {
  min-width: 0;
  background: var(--gb3-light);
}

.article-container > *:first-child {
  grid-row: span 4;
}

.article-container a,
.news-article a {
  color: var(--gb3-ink-light);
}

.article-container h3,
.article-container h4,
.article-container h5,
.news-article h1,
.news-article h2,
.news-article h3 {
  color: var(--gb3-ink-light);
  font-family: var(--gb3-font);
  font-weight: 800;
  letter-spacing: 0;
}

.article-container p,
.news-article,
.news-article p {
  color: var(--gb3-ink-light-body);
}

.news .button,
.news-article-container .button,
.teams-container .button {
  border-color: var(--gb3-line-light);
  color: var(--gb3-ink-light);
}

.driver-list,
.driver-page,
.team-page,
.standings-container,
.results-container,
.results-page {
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.driver-list .grid-container {
  margin: 0 !important;
  padding-top: 36px;
  padding-bottom: 46px;
}

.driver-list .grid-x.small-up-1,
.driver-list .grid-x.medium-up-2,
.driver-list .grid-x.large-up-3,
.driver-list .grid-x.xlarge-up-4,
.driver-list .grid-x.xxlarge-up-5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  background: var(--gb3-line-dark);
}

.driver-list .grid-x > .cell {
  width: auto;
  padding: 0;
}

.card,
.driver-info,
.team-info,
.team-info-v1 {
  border: 0;
  border-radius: 0;
  background: var(--gb3-dark-band);
  box-shadow: none;
  color: var(--gb3-ink-dark);
}

.driver-info {
  height: 100%;
}

.driver-info .bkgrd,
.driver-page .card .bkgrd {
  position: relative;
  min-height: 260px;
  overflow: hidden;
  background: var(--gb3-portrait);
}

.driver-info .header {
  position: absolute;
  top: 12px;
  right: 12px;
  left: 12px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.driver-info .number,
.driver-page .number p,
.team-page .number p {
  margin: 0;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
}

.driver-info .header img {
  width: 42px;
  height: 28px;
  -o-object-fit: cover;
     object-fit: cover;
}

.driver-info picture,
.driver-info picture img {
  width: 100%;
}

.driver-info picture img {
  aspect-ratio: 500/381;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom center;
     object-position: bottom center;
}

.driver-info .card-section {
  min-height: 98px;
  padding: 16px;
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.driver-info h4 {
  margin: 0 0 6px;
  color: var(--gb3-ink-dark);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0;
}

.driver-info h4 strong {
  display: block;
  font-weight: 800;
}

.driver-info p {
  margin: 0;
  color: var(--gb3-ink-dark-secondary);
  font-size: 13px;
}

.driver-page .grid-container,
.team-page .grid-container {
  padding-top: 36px;
  padding-bottom: 36px;
}

.driver-page .card,
.team-page .team-info .content {
  overflow: hidden;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.driver-page .card-section,
.team-page .drivers .grid-x,
.team-info-v1 .drivers .grid-x {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
}

.driver-page .name h4,
.team-page h4 {
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.driver-page .name p,
.team-page p,
.team-page .summary {
  color: var(--gb3-ink-dark-secondary);
}

.social-bar {
  border-right: 1px solid var(--gb3-line-dark);
  border-left: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
}

.social-bar a {
  display: flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-bottom: 1px solid var(--gb3-line-dark-soft);
  color: var(--gb3-ink-dark-secondary);
  font-family: var(--gb3-mono);
  font-size: 12px;
}

.social-bar a:hover {
  color: var(--gb3-ink-dark);
}

.biography,
.team-info-text {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark-secondary);
}

.biography h4,
.team-info-text h4 {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.team-info-v1 {
  width: 100%;
  border: 1px solid var(--gb3-line-dark);
}

.team-info-v1 .content > .grid-x {
  align-items: stretch;
}

.team-info-v1 .team-logo {
  display: flex;
  min-height: 150px;
  align-items: center;
  justify-content: center;
  padding: 22px 18px;
  background: var(--gb3-ink-light);
}

.team-info-v1 .team-logo img,
.teams-container img {
  max-height: 85px;
  -o-object-fit: contain;
     object-fit: contain;
  filter: brightness(0) invert(1);
}

.team-info-v1 .widget-header {
  padding: 18px 0 12px;
}

.team-info-v1 h3 {
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 26px;
}

.team-info-v1 .team-text {
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
}

.team-info-v1 .more-info {
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.team-info-v1 .car-img img,
.team-page .car-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.team-info-v1 .drivers,
.team-page .drivers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--gb3-line-dark);
}

.team-info-v1 .driver,
.team-page .driver {
  min-width: 0;
  background: var(--gb3-dark-tile);
}

.team-info-v1 .driver a,
.team-page .driver a {
  display: block;
  color: var(--gb3-ink-dark);
}

.team-info-v1 .driver img,
.team-page .driver img {
  width: 100%;
  aspect-ratio: 500/381;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom center;
     object-position: bottom center;
  background: var(--gb3-portrait);
}

.team-info-v1 .driver .number,
.team-page .driver .number {
  display: flex;
  align-items: center;
  justify-content: center;
}

.team-info-v1 .driver .number p,
.team-page .driver .number p {
  color: var(--gb3-red);
  font-size: 20px;
}

.team-info-v1 .driver .name,
.team-page .driver .name {
  min-width: 0;
  padding: 10px 12px;
}

.team-info-v1 .driver .name p,
.team-page .driver .name p {
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.05;
}

.team-info-v1 .driver .name em,
.team-page .driver .name em {
  display: block;
  font-style: normal;
  font-weight: 800;
}

.teams-container {
  border-top: 1px solid var(--gb3-line-light);
  padding-bottom: 46px;
}

.teams-container .widget-header.dark {
  color: var(--gb3-ink-light);
}

.teams-container .grid-x.align-center {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  background: var(--gb3-line-light);
}

.teams-container .cell.shrink {
  width: auto;
  background: var(--gb3-ink-light);
}

.teams-container a {
  display: flex;
  min-height: 84px;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.results-container,
.standings-container {
  overflow-x: auto;
}

.results {
  width: 100%;
  border-collapse: collapse;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.results th,
.results td {
  border-bottom: 1px solid var(--gb3-line-light-soft);
  padding: 12px 10px;
  text-align: center;
}

.results th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--gb3-ink-light);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.results td {
  color: var(--gb3-ink-light-body);
  font-family: var(--gb3-mono);
  font-size: 14px;
}

.results .name {
  text-align: left;
}

.results .name h4 {
  margin: 0;
  color: var(--gb3-ink-light);
  font-family: var(--gb3-font);
  font-size: 16px;
  font-weight: 700;
}

footer {
  border-top: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark-meta);
}

footer h5 {
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

footer li,
footer p,
footer a {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  line-height: 1.5;
}

footer a:hover {
  color: var(--gb3-ink-dark);
}

footer .socials {
  gap: 12px;
  justify-content: center;
  margin-bottom: 16px;
}

footer .socials a {
  color: var(--gb3-ink-dark-secondary);
  font-size: 20px;
}

footer .partners {
  border-top: 1px solid var(--gb3-line-dark-soft);
}

@media print, screen and (min-width: 40em) {
  .medium-3 {
    width: 25%;
  }
  .medium-4 {
    width: 33.3333%;
  }
  .medium-5 {
    width: 41.6667%;
  }
  .medium-6 {
    width: 50%;
  }
  .medium-7 {
    width: 58.3333%;
  }
  .medium-8 {
    width: 66.6667%;
  }
  .medium-9 {
    width: 75%;
  }
  .medium-12 {
    width: 100%;
  }
  .medium-auto {
    flex: 1 1 0;
    width: auto;
  }
  .medium-shrink {
    flex: 0 0 auto;
    width: auto;
  }
  .medium-offset-2 {
    margin-left: 16.6667%;
  }
  .medium-text-center {
    text-align: center;
  }
  .show-for-medium {
    display: block !important;
  }
}
@media print, screen and (min-width: 64em) {
  .large-2 {
    width: 16.6667%;
  }
  .large-3 {
    width: 25%;
  }
  .large-4 {
    width: 33.3333%;
  }
  .large-5 {
    width: 41.6667%;
  }
  .large-6 {
    width: 50%;
  }
  .large-7 {
    width: 58.3333%;
  }
  .large-8 {
    width: 66.6667%;
  }
  .large-10 {
    width: 83.3333%;
  }
  .large-12 {
    width: 100%;
  }
  .large-offset-0 {
    margin-left: 0;
  }
  .large-offset-2 {
    margin-left: 16.6667%;
  }
  .large-text-left {
    text-align: left;
  }
  .large-shrink {
    flex: 0 0 auto;
    width: auto;
  }
  .show-for-large {
    display: block !important;
  }
  .hide-for-large {
    display: none !important;
  }
}
@media print, screen and (max-width: 63.9375em) {
  .gb3-utility-nav {
    display: none;
  }
  /* One column, in reading order: the mark and socials, then the links, then the enquiry. Three
     columns of this width start colliding well before the phone breakpoint. */
  .gb3-footer__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }
  .gb3-primary-nav .grid-container {
    padding-right: 16px;
    padding-left: 16px;
  }
  .gb3-primary-links {
    display: none;
  }
  .gb3-primary-nav .grid-x > .gb3-live-timing {
    display: inline-flex;
    margin-left: auto;
    font-size: 11px;
  }
  #header .logo-img {
    height: 68px;
    padding: 0;
  }
  #header .logo-img img {
    max-width: 180px;
  }
  .gb3-menu-toggle {
    display: inline-flex;
    width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    margin: 12px 0 12px 8px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: transparent;
    color: #fff;
    cursor: pointer;
  }
  .gb3-menu-toggle > span {
    display: block;
    width: 18px;
    height: 2px;
    background: currentColor;
  }
  .gb3-mobile-nav {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--gb3-line-dark);
    background: var(--gb3-dark-band);
  }
  .gb3-mobile-nav a {
    display: flex;
    min-height: 48px;
    align-items: center;
    padding: 0 16px;
    border-bottom: 1px solid var(--gb3-line-dark-soft);
    color: var(--gb3-ink-dark);
    font-family: var(--gb3-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .gb3-mobile-nav .gb3-mobile-subitem {
    padding-left: 32px;
    color: var(--gb3-ink-dark-secondary);
    font-family: var(--gb3-font);
    font-size: 14px;
    letter-spacing: 0;
    text-transform: none;
  }
  .gb3-mobile-nav .gb3-live-timing {
    display: flex;
    min-height: 48px;
    margin: 0;
    border: 0;
    background: var(--gb3-red);
    color: #fff;
  }
  .gb3-partner-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }
}
@media print, screen and (max-width: 39.9375em) {
  .gb3-header {
    position: sticky;
    top: 0;
  }
  .gb3-primary-nav .grid-container {
    padding-right: 0;
    padding-left: 0;
  }
  .gb3-primary-nav .grid-x {
    min-height: 0;
    flex-wrap: wrap;
  }
  #header .logo-img {
    margin-left: 16px;
  }
  .gb3-primary-nav .grid-x > .gb3-live-timing {
    margin-left: auto;
  }
  .gb3-menu-toggle {
    margin-right: 16px;
  }
  .gb3-primary-links {
    order: 10;
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    align-items: stretch;
    justify-content: space-between;
    gap: 14px;
    margin-left: 0;
    padding: 0 12px 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .gb3-primary-links::-webkit-scrollbar {
    display: none;
  }
  .gb3-primary-item {
    flex: 0 0 auto;
  }
  .gb3-primary-item > a {
    min-height: 44px;
    padding: 0 0 10px;
    font-family: var(--gb3-font);
    font-size: 12px;
    letter-spacing: 0;
  }
  .gb3-footer .gb3-partners {
    padding: 26px 0;
  }
  .gb3-partner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
  .gb3-footer__main {
    padding-top: 34px;
    padding-bottom: 32px;
  }
  /* Two, not auto-fit: the 150px minimum would drop the menu to a single column on a phone and make
     the footer as long as the page above it. */
  .gb3-footer__columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-footer__legal .gb3-footer__inner {
    gap: 12px;
  }
}
@media screen and (max-width: 80em) {
  .driver-list .grid-x.small-up-1,
  .driver-list .grid-x.medium-up-2,
  .driver-list .grid-x.large-up-3,
  .driver-list .grid-x.xlarge-up-4,
  .driver-list .grid-x.xxlarge-up-5,
  .teams-container .grid-x.align-center {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media screen and (max-width: 63.998em) {
  :root {
    --gb3-gutter: 16px;
  }
  /* Was max-width: 390px, which squeezed the WHOLE site into a 390px column on anything under
     ~1024px - .off-canvas-content is the content wrapper, not the slide-out menu, so that looks like a
     menu width applied to the wrong selector. With the shell now full-bleed it has to go either way,
     or every background stops dead at 390px on a tablet. */
  .off-canvas-content {
    max-width: none;
  }
  .top-bar1 {
    display: none;
  }
  #header {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 58px;
  }
  #header > .grid-container > .grid-x {
    min-height: 58px;
    align-items: center;
  }
  #header .logo-img {
    height: 58px;
    /* As the desktop rule: the container carries the gutter, the logo does not. */
    padding: 0;
  }
  #header .logo-img img {
    max-width: 210px;
    height: 44px;
  }
  #header .menu-container {
    display: none;
  }
  .hero-image,
  .hero-image.home-page {
    min-height: 500px;
  }
  .hero-image::before {
    background: linear-gradient(180deg, rgba(10, 10, 11, 0.25), rgba(10, 10, 11, 0.05) 40%, rgba(10, 10, 11, 0.85));
  }
  .hero-image h1,
  .page-body > h1 {
    max-width: 100%;
    padding: 320px 16px 28px;
    font-size: 40px;
    line-height: 0.96;
    letter-spacing: 0;
  }
  .widget-header {
    padding: 30px 0 18px;
  }
  .widget-header h2,
  .widget-header h3,
  .intro-text h2,
  .intro-text h3 {
    font-size: 26px;
  }
  .intro-text {
    padding: 28px 0;
    font-size: 14px;
  }
  .calendar-info > .grid-x {
    display: flex;
  }
  .calendar-info .cell.large-6:first-of-type,
  .calendar-info .cell.large-6:last-of-type {
    width: 100%;
    min-height: auto;
  }
  .calendar-info .cell.large-6:first-of-type picture,
  .calendar-info .cell.large-6:first-of-type img {
    position: static;
    height: auto;
  }
  .calendar-info-round-info {
    min-height: 280px;
    padding: 30px 16px;
  }
  .calendar-info-round-info .venue {
    font-size: 34px;
  }
  .calendar-info .circuit-layout {
    right: 16px;
    bottom: 16px;
    width: 128px;
  }
  .calendar-container .swiper {
    padding: 1px 16px 28px;
  }
  .calendar-quick-view .round {
    flex-basis: 176px;
  }
  .article-container {
    display: block;
    background: transparent;
  }
  .article-container > * {
    border-bottom: 1px solid var(--gb3-line-light-soft);
  }
  /* The banner is full-bleed and its media is absolutely positioned, so it takes no padding of its
     own - the copy carries it. The grid columns and the padding here are left over from the
     two-column layout this replaced, and the padding was adding 37px of dead height. */
  .cms-gb3-car-feature__copy {
    padding: 28px 20px;
  }
  .cms-gb3-car-feature h2 {
    font-size: 31px;
  }
  .driver-list .grid-x.small-up-1,
  .driver-list .grid-x.medium-up-2,
  .driver-list .grid-x.large-up-3,
  .driver-list .grid-x.xlarge-up-4,
  .driver-list .grid-x.xxlarge-up-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .driver-info .bkgrd,
  .driver-page .card .bkgrd {
    min-height: 190px;
  }
  .driver-info h4 {
    font-size: 16px;
  }
  .driver-page .name h4,
  .team-page h4 {
    font-size: 26px;
  }
  .team-info-v1 .team-logo {
    min-height: 84px;
  }
  .team-info-v1 .drivers,
  .team-page .drivers,
  .teams-container .grid-x.align-center {
    grid-template-columns: 1fr;
  }
  .standings-row > .grid-x {
    min-height: 52px;
    padding: 0 10px;
  }
  .standings-row .team {
    display: none;
  }
  .standings-row .driver {
    font-size: 15px;
  }
  .standings-row .points {
    font-size: 20px;
  }
  footer .grid-padding-x,
  footer .grid-margin-x {
    margin-right: 0;
    margin-left: 0;
  }
}
/* New GB3 page surfaces — mirrored verbatim in Styles/gb3-2026.scss. */
.gb3-season-page__hero > img, .gb3-season-page__hero-scrim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.gb3-season-page__hero > img {
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-season-page__hero-scrim {
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.97), rgba(10, 10, 11, 0.83) 42%, rgba(10, 10, 11, 0.12));
}

.gb3-driver-directory-card__portrait img, .gb3-profile-others__portrait img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-driver-directory-card__portrait .gb3-driver-directory-card__number {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  padding: 7px 10px;
  background: var(--gb3-red);
  color: #fff;
  font-size: 15px;
}

/* Top level, despite sitting under a minified @media block that has already closed - which is exactly
   why an earlier, tidier rule placed above these never took effect. The portrait FILLS the panel so
   every driver occupies the same space whether their image is the tall Relaxed crop (600x1000) or the
   square profile shot (500x381) that half of them still fall back to; object-fit does the equalising
   and object-position sits above centre so cropping a landscape shot does not cut the head off. */
.gb3-standing-profile__portrait {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--gb3-portrait);
}

.gb3-standing-profile__portrait > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 15%;
     object-position: 50% 15%;
}

.gb3-standing-profile__portrait [hidden] {
  display: none;
}

.gb3-standing-profile__content dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 18px 0 0;
  background: var(--gb3-line-dark-soft);
}

.gb3-standing-profile__content dl div {
  padding: 12px 8px;
  background: var(--gb3-dark);
}

.gb3-standing-profile__content dt {
  font: 700 18px var(--gb3-mono);
}

.gb3-standing-profile__content dd {
  margin: 3px 0 0;
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-profile-hero__portrait > img, .gb3-profile-hero__portrait-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.gb3-profile-hero__portrait > img {
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-profile-hero__portrait-shade {
  background: linear-gradient(180deg, transparent 52%, rgba(10, 10, 11, 0.88));
}

.gb3-profile-hero__standing {
  position: absolute;
  right: 24px;
  bottom: 24px;
  left: 24px;
  z-index: 2;
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.gb3-profile-hero__standing b {
  color: #fff;
  font: 700 34px var(--gb3-mono);
}

.gb3-profile-hero__standing span {
  color: var(--gb3-ink-dark-secondary);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-season {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.55fr);
  gap: 32px;
  padding: 46px var(--gb3-gutter) 52px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-profile-season__log > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 20px;
}

.gb3-profile-season__log h2 {
  margin: 0;
  font-size: 34px;
}

.gb3-profile-season__log > header span, .gb3-profile-season__aside > section > span {
  color: var(--gb3-ink-light-meta);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-profile-season__head, .gb3-profile-season__round {
  display: grid;
  grid-template-columns: 42px minmax(160px, 1fr) 72px repeat(3, 38px) 44px;
  align-items: center;
  gap: 10px;
}

.gb3-profile-season__head {
  min-height: 34px;
  border-bottom: 1px solid var(--gb3-line-light);
  color: var(--gb3-ink-light-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-season__round {
  min-height: 66px;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-profile-season__round > b, .gb3-profile-season__round time, .gb3-profile-season__round > em {
  font: 12px var(--gb3-mono);
  font-style: normal;
}

.gb3-profile-season__round > span {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.gb3-profile-season__round > span strong {
  font-size: 15px;
}

.gb3-profile-season__round > span small {
  color: var(--gb3-ink-light-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-season__round > i, .gb3-profile-season__aside section:first-child i {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  background: var(--gb3-light-band);
  font: 700 11px var(--gb3-mono);
  font-style: normal;
}

.gb3-profile-season__round > i.is-win, .gb3-profile-season__aside section:first-child i.is-win {
  background: var(--gb3-red-light);
  color: #fff;
}

.gb3-profile-season__round > i.is-second, .gb3-profile-season__aside section:first-child i.is-second {
  background: #242427;
  color: #fff;
}

.gb3-profile-season__round > i.is-third, .gb3-profile-season__aside section:first-child i.is-third {
  background: var(--gb3-bronze-light);
  color: #fff;
}

/* A non-finishing status - DNF, DNS, DSQ and the rest. Muted rather than coloured: it is not a result
   to celebrate or to read as a placing, and the cell holds letters where its neighbours hold a number,
   so it needs to look different from both a podium and a plain finish. */
.gb3-profile-season__round > i.is-status,
.gb3-profile-season__aside section:first-child i.is-status {
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--gb3-line-light-soft);
  color: var(--gb3-ink-light-meta);
  font-size: 9px;
  letter-spacing: 0.04em;
}

.gb3-profile-season__log > footer {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto auto auto;
  align-items: baseline;
  gap: 10px;
  padding: 18px 0;
}

.gb3-profile-season__log > footer b {
  font: 700 22px var(--gb3-mono);
}

.gb3-profile-season__log > footer span, .gb3-profile-season__log > footer a {
  color: var(--gb3-ink-light-meta);
  font: 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-season__log > footer a {
  color: var(--gb3-red-light);
  font-weight: 700;
}

.gb3-profile-season__aside {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.gb3-profile-season__aside > section {
  padding: 20px;
  background: var(--gb3-light-band);
}

.gb3-profile-season__aside section:first-child > div {
  display: flex;
  gap: 6px;
  margin-top: 14px;
}

/* The aside rides down beside the season log. Only in the two-column regime - below 64em the grid
   collapses to one column and the aside stacks under the log, where sticking it would pin a panel
   over the content it is meant to sit beside.

   Capped to the viewport because the four panels come to roughly 900px, which is taller than a
   laptop screen: a sticky block taller than the viewport pins its top and parks its bottom below
   the fold permanently, so the round promo would become unreachable. The cap only bites when the
   content genuinely does not fit, so on a tall monitor there is no scrollbar at all. */
@media print, screen and (min-width: 64em) {
  .gb3-profile-season__aside {
    position: sticky;
    /* Below the site header, which sticks on desktop as well now - at a plain 24px the top of this
       panel ran underneath the red bar. The height cap takes the bar off too, or the bottom of the
       panel would sit off the foot of the screen by the same amount. */
    top: calc(var(--gb3-sticky-header) + 24px);
    /* A grid child stretches to the row height by default, and a full-height box has nothing to
       stick within. */
    align-self: start;
    max-height: calc(100vh - var(--gb3-sticky-header) - 48px);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--gb3-ink-light-meta) transparent;
  }
  /* The bio shares the log's column and the aside spans both rows, so the panels stay alongside while
     the prose scrolls past. Without this the aside's grid area ends with the log - and since the aside
     is almost exactly as tall as the log, sticky would have nothing to travel through and would look
     like it was not working at all.
     Only when a bio exists: spanning two rows in a one-row grid adds an empty row and its gap. */
  .gb3-profile-season:has(.gb3-profile-bio) {
    grid-template-rows: auto auto;
  }
  .gb3-profile-season:has(.gb3-profile-bio) > .gb3-profile-season__log {
    grid-column: 1;
    grid-row: 1;
  }
  .gb3-profile-season:has(.gb3-profile-bio) > .gb3-profile-season__aside {
    grid-column: 2;
    grid-row: 1/3;
  }
  .gb3-profile-season:has(.gb3-profile-bio) > .gb3-profile-bio {
    grid-column: 1;
    grid-row: 2;
  }
}
.gb3-profile-facts dl {
  margin: 14px 0 0;
}

.gb3-profile-facts dl div {
  display: flex;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--gb3-line-light-soft);
}

.gb3-profile-facts dt {
  color: var(--gb3-ink-light-meta);
  font-size: 12px;
}

.gb3-profile-facts dd {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 0 0 0 auto;
  text-align: right;
  font-size: 12px;
  font-weight: 700;
}

.gb3-profile-round-promo {
  background: var(--gb3-red-light) !important;
  color: #fff;
}

.gb3-profile-round-promo > span {
  color: rgba(255, 255, 255, 0.8) !important;
}

.gb3-profile-round-promo h3 {
  margin: 12px 0 4px;
  font-size: 24px;
}

.gb3-profile-round-promo > b {
  font: 11px var(--gb3-mono);
}

.gb3-profile-round-promo > div {
  display: flex;
  gap: 8px;
  margin-top: 18px;
}

.gb3-profile-round-promo a {
  padding: 9px 11px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  color: #fff;
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-profile-others > div a {
  min-height: 0;
  padding: 0;
}

.gb3-profile-others__portrait {
  position: relative;
  display: grid;
  aspect-ratio: 1.45;
  place-items: center;
  overflow: hidden;
  background: var(--gb3-portrait);
}

.gb3-profile-others__portrait b {
  position: absolute;
  right: 10px;
  bottom: 8px;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font: 700 24px var(--gb3-mono) !important;
}

.gb3-profile-others__name {
  display: flex;
  min-height: 96px;
  flex-direction: column;
  padding: 13px 14px 16px;
}

.gb3-profile-others__name small {
  margin: 0 !important;
  color: var(--gb3-ink-dark-secondary) !important;
  font: 12px var(--gb3-font) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.gb3-profile-others__name strong {
  font-size: 18px;
}

.gb3-profile-others__name em {
  margin-top: auto;
  color: var(--gb3-ink-dark-meta);
  font: 10px var(--gb3-mono);
  font-style: normal;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Same reasoning as the home-page grid: colour artwork needs a light tile under it, in the same
   light band the cards use. */
.gb3-team-championship__mark, .gb3-team-profiles__mark {
  padding: 10px 14px;
  background: var(--gb3-light-band);
}

.gb3-team-championship__mark img, .gb3-team-profiles__mark img {
  max-width: 100%;
  max-height: 72px;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-team-profiles__mark img {
  max-width: 118px;
}

.gb3-team-championship__mark span, .gb3-team-profiles__mark span {
  color: var(--gb3-ink-light-meta);
}

.gb3-race-with-us__hero-media {
  position: relative;
  min-width: 0;
  min-height: 560px;
  overflow: hidden;
  background: var(--gb3-dark-tile);
}

.gb3-race-with-us__hero-media img, .gb3-race-with-us__hero-media span {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.gb3-race-with-us__hero-media img {
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-race-with-us__hero-media span {
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.9), rgba(10, 10, 11, 0.15) 38%, transparent);
}

.gb3-race-with-us__status {
  color: var(--gb3-ink-dark-meta);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.14em;
}

.gb3-race-with-us__status.is-open {
  color: var(--gb3-red);
}

.gb3-race-with-us__status.is-open:before {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 10px;
  background: currentColor;
  border-radius: 50%;
  content: "";
}

.gb3-race-with-us__car > header a {
  margin-left: auto;
  color: var(--gb3-ink-dark);
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us summary {
  display: flex;
  gap: 16px;
  list-style: none;
}

.gb3-race-with-us summary::-webkit-details-marker {
  display: none;
}

.gb3-race-with-us details[open] {
  background: #131316;
}

.gb3-race-with-us details > div {
  display: flex;
  gap: 22px;
  margin: 14px 0 0 28px;
}

.gb3-race-with-us details > div > span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.gb3-race-with-us details > div strong {
  font: 700 20px var(--gb3-mono);
}

.gb3-race-with-us details > div small {
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.08em;
}

.gb3-race-with-us__comparison {
  padding: 22px !important;
}

.gb3-race-with-us__comparison h3 {
  margin: 0 0 16px;
  color: var(--gb3-ink-dark-meta);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.gb3-race-with-us__comparison > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 86px;
  align-items: center;
  gap: 16px;
  margin-top: 15px;
}

.gb3-race-with-us__comparison > div > span {
  display: grid;
  gap: 6px;
}

.gb3-race-with-us__comparison > div > span > b {
  font-size: 13px;
}

.gb3-race-with-us__comparison > div > span > i {
  display: block;
  height: 4px;
  background: var(--gb3-line-dark);
}

.gb3-race-with-us__comparison > div > span > i:nth-of-type(2) {
  height: 6px;
}

.gb3-race-with-us__comparison > div > span > i > i {
  display: block;
  height: 100%;
  background: rgba(245, 244, 244, 0.35);
}

.gb3-race-with-us__comparison > div > span > i:nth-of-type(2) > i {
  background: var(--gb3-red);
}

.gb3-race-with-us__comparison em {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: right;
  font-style: normal;
}

.gb3-race-with-us__comparison em b, .gb3-race-with-us__comparison em small {
  font-family: var(--gb3-mono);
}

.gb3-race-with-us__comparison em small {
  color: var(--gb3-ink-dark-meta);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-race-with-us__licence-points {
  padding-bottom: 36px;
}

.gb3-race-with-us__licence-points .is-champion {
  background: var(--gb3-red-light);
  color: #fff;
}

.gb3-race-with-us__licence-points .is-champion span, .gb3-race-with-us__licence-points .is-champion small {
  color: rgba(255, 255, 255, 0.9);
}

.gb3-race-with-us__ladder {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--gb3-line-light);
  background: var(--gb3-line-light);
}

.gb3-race-with-us__ladder > div {
  display: flex;
  min-width: 0;
  min-height: 142px;
  flex-direction: column;
  gap: 8px;
  padding: 22px 20px 24px;
  background: #fff;
}

.gb3-race-with-us__ladder > div.is-current {
  background: var(--gb3-red-light);
  color: #fff;
}

.gb3-race-with-us__ladder span {
  color: var(--gb3-ink-light-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.gb3-race-with-us__ladder strong {
  font-size: 22px;
}

.gb3-race-with-us__ladder p {
  margin: 0;
  color: var(--gb3-ink-light-body);
  font-size: 13px;
  line-height: 1.5;
}

.gb3-race-with-us__ladder .is-current span, .gb3-race-with-us__ladder .is-current p {
  color: rgba(255, 255, 255, 0.9);
}

.gb3-race-with-us__alumni > div, .gb3-race-with-us__includes > div {
  display: grid;
  min-height: 54px;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-race-with-us__alumni > div {
  grid-template-columns: 62px minmax(0, 1fr) 100px;
}

.gb3-race-with-us__alumni > div b, .gb3-race-with-us__alumni > div span, .gb3-race-with-us__includes > div span {
  color: var(--gb3-ink-light-meta);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.06em;
}

.gb3-race-with-us__alumni > div strong {
  font-size: 18px;
}

.gb3-race-with-us__alumni > div span, .gb3-race-with-us__includes > div span {
  text-align: right;
}

.gb3-race-with-us__alumni blockquote {
  margin: 26px 0 0;
  padding: 4px 0 4px 20px;
  border-left: 4px solid var(--gb3-red-light);
}

.gb3-race-with-us__alumni blockquote small {
  color: var(--gb3-ink-light-meta);
  font: 10px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-race-with-us__alumni blockquote p {
  margin: 8px 0 0;
  color: var(--gb3-ink-light);
  font-size: 23px;
  font-weight: 700;
  line-height: 1.25;
}

.gb3-race-with-us__includes > div {
  grid-template-columns: minmax(0, 1fr) 120px;
}

.gb3-race-with-us__includes > div strong {
  font-size: 14px;
}

.gb3-race-with-us__includes > p {
  margin-top: 20px;
  font-size: 14px;
}

.gb3-race-with-us__step-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.gb3-race-with-us__step-grid article small {
  margin-top: auto;
  padding-top: 12px;
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-race-with-us__enquiry {
  display: grid !important;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) !important;
  gap: 1px;
  margin-top: 44px;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-line-dark);
}

.gb3-race-with-us__enquiry > form {
  padding: 30px 32px 34px;
  background: var(--gb3-dark-band);
}

.gb3-race-with-us__enquiry > aside {
  display: flex;
  flex-direction: column;
  gap: 26px;
  padding: 30px 28px 34px;
  background: var(--gb3-dark);
}

.gb3-race-with-us__modes {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
}

.gb3-race-with-us__modes button {
  min-height: 44px;
  padding: 12px 16px;
  border: 1px solid rgba(245, 244, 244, 0.25);
  background: transparent;
  color: var(--gb3-ink-dark-secondary);
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.gb3-race-with-us__modes button.is-active {
  border-color: var(--gb3-red);
  background: var(--gb3-red);
  color: #fff;
}

.gb3-race-with-us__enquiry form section, .gb3-race-with-us__enquiry aside section {
  padding: 0;
}

.gb3-race-with-us__enquiry form section[hidden] {
  display: none;
}

.gb3-race-with-us__enquiry h3 {
  margin: 0 0 8px;
  font-size: 26px;
}

.gb3-race-with-us__enquiry form section > p, .gb3-race-with-us__enquiry aside p {
  max-width: 460px;
  margin: 0 0 26px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
  line-height: 1.6;
}

.gb3-race-with-us__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 26px;
}

.gb3-race-with-us__fields label {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 8px;
}

.gb3-race-with-us__fields label.is-wide {
  grid-column: 1/-1;
}

.gb3-race-with-us__fields label span, .gb3-race-with-us__enquiry aside h3, .gb3-race-with-us__enquiry aside footer span {
  color: var(--gb3-ink-dark-meta);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.gb3-race-with-us__fields input {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: 8px 0 10px;
  border: 0;
  border-bottom: 1px solid rgba(245, 244, 244, 0.25);
  outline: 0;
  background: transparent;
  color: var(--gb3-ink-dark);
  font: 16px var(--gb3-font);
}

.gb3-race-with-us__submit {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 30px;
}

.gb3-race-with-us__submit button {
  min-height: 44px;
  padding: 15px 22px;
  border: 0;
  background: var(--gb3-red);
  color: #fff;
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us__submit > span {
  max-width: 300px;
  color: var(--gb3-ink-dark-meta);
  font: 9px/1.6 var(--gb3-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-race-with-us__fields textarea {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  padding: 8px 0 10px;
  border: 0;
  border-bottom: 1px solid rgba(245, 244, 244, 0.25);
  outline: 0;
  background: transparent;
  color: var(--gb3-ink-dark);
  font: 16px var(--gb3-font);
  resize: vertical;
}

.gb3-race-with-us__turnstile {
  margin-top: 26px;
}

.gb3-race-with-us__submit button[disabled] {
  opacity: 0.55;
}

.gb3-race-with-us__submit a {
  display: inline-flex;
  padding: 12px 16px;
  border: 1px solid rgba(245, 244, 244, 0.35);
  color: var(--gb3-ink-dark);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* The submit row, the mode switch and the turnstile box are all flex, and an author display beats the UA sheet's [hidden] - so hiding them on success needs saying explicitly, the same way the panels already do. */
.gb3-race-with-us__modes[hidden], .gb3-race-with-us__turnstile[hidden], .gb3-race-with-us__submit[hidden], .gb3-race-with-us__result[hidden] {
  display: none;
}

.gb3-race-with-us__result {
  max-width: 460px;
  margin: 24px 0 0;
  padding: 14px 16px;
  border-left: 2px solid var(--gb3-red);
  background: rgba(245, 244, 244, 0.04);
  color: var(--gb3-ink-dark);
  font: 14px/1.6 var(--gb3-font);
}

.gb3-race-with-us__result.is-success {
  border-left-color: #3f9a56;
}

.gb3-race-with-us__result a {
  color: var(--gb3-ink-dark);
  text-decoration: underline;
}

/* Shown in place of the form when the widget has no source id or site key. Matches the form's own padding and ground, since it sits in the same grid cell. */
.gb3-race-with-us__unavailable {
  padding: 30px 32px 34px;
  background: var(--gb3-dark-band);
}

.gb3-race-with-us__unavailable > p {
  max-width: 460px;
  margin: 0 0 26px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 14px;
  line-height: 1.6;
}

.gb3-race-with-us__enquiry aside h3 {
  margin-bottom: 14px;
}

.gb3-race-with-us__test {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 0 0 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--gb3-line-dark-soft);
}

.gb3-race-with-us__test > b {
  flex: 0 0 96px;
  color: var(--gb3-red);
  font: 12px var(--gb3-mono);
}

.gb3-race-with-us__test > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.gb3-race-with-us__test strong {
  font-size: 14px;
}

.gb3-race-with-us__test small {
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-race-with-us__enquiry aside a {
  display: inline-flex;
  padding: 12px 16px;
  border: 1px solid rgba(245, 244, 244, 0.35);
  color: var(--gb3-ink-dark);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-race-with-us__enquiry aside footer {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: auto;
  padding-top: 20px;
  border-top: 1px solid var(--gb3-line-dark-soft);
}

@media screen and (max-width: 63.998em) {
  .gb3-profile-season, .gb3-race-with-us__enquiry {
    grid-template-columns: 1fr !important;
  }
  .gb3-race-with-us__ladder {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-season-page__hero-scrim {
    background: linear-gradient(90deg, rgba(10, 10, 11, 0.95), rgba(10, 10, 11, 0.42));
  }
  .gb3-profile-season {
    gap: 24px;
    padding: 32px 16px 38px;
  }
  .gb3-profile-season__log {
    overflow-x: auto;
  }
  .gb3-profile-season__head, .gb3-profile-season__round, .gb3-profile-season__log > footer {
    min-width: 620px;
  }
  .gb3-race-with-us__hero-media {
    min-height: 320px;
  }
  .gb3-race-with-us__car > header a {
    margin-left: 0;
  }
  .gb3-race-with-us details > div {
    gap: 12px;
  }
  .gb3-race-with-us__ladder {
    grid-template-columns: 1fr;
  }
  .gb3-race-with-us__ladder > div {
    min-height: 0;
  }
  .gb3-race-with-us__step-grid {
    grid-template-columns: 1fr !important;
  }
  .gb3-race-with-us__enquiry {
    margin-top: 32px;
  }
  .gb3-race-with-us__enquiry > form, .gb3-race-with-us__enquiry > aside {
    padding: 24px 20px 28px;
  }
  .gb3-race-with-us__fields {
    grid-template-columns: 1fr;
  }
  .gb3-race-with-us__fields label.is-wide {
    grid-column: auto;
  }
  .gb3-race-with-us__submit {
    align-items: flex-start;
    flex-direction: column;
  }
  .gb3-race-with-us__alumni > div {
    grid-template-columns: 56px minmax(0, 1fr) 72px;
    gap: 8px;
  }
  .gb3-race-with-us__includes > div {
    grid-template-columns: minmax(0, 1fr) 76px;
    gap: 8px;
  }
}
.gb3-home-hero__content {
  width: 100%;
  max-width: none;
}

.gb3-home-hero__footer {
  display: flex;
  align-items: flex-end;
  gap: 30px;
  margin-top: auto;
}

.gb3-home-hero__stats {
  flex: 1 1 auto;
}

.gb3-home-hero__event {
  flex: 0 0 380px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(237, 27, 35, 0.72);
  backdrop-filter: blur(3px);
}

.gb3-home-hero__event > span {
  display: block;
  margin-bottom: 10px;
  color: rgba(255, 255, 255, 0.88);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-home-hero__event > span.is-live {
  color: #fff;
}

.gb3-home-hero__event > div {
  display: flex;
  align-items: flex-end;
  gap: 18px;
}

.gb3-home-hero__event > div > div {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
}

.gb3-home-hero__event strong {
  font-size: 22px;
}

.gb3-home-hero__event small {
  color: rgba(255, 255, 255, 0.86);
  font: 11px var(--gb3-mono);
  text-transform: uppercase;
}

.gb3-home-hero__event a {
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  color: #fff;
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-home-hero__event a:hover {
  background: #fff;
  color: var(--gb3-red);
}

.gb3-weekend-timetable {
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
}

.gb3-weekend-timetable > header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px var(--gb3-gutter) 18px;
}

.gb3-weekend-timetable > header > span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gb3-red);
}

.gb3-weekend-timetable h2 {
  margin: 0;
  font-size: 22px;
}

.gb3-weekend-timetable > header p {
  margin: 0;
  color: var(--gb3-ink-dark-meta);
  font: 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-weekend-timetable > header a {
  margin-left: auto;
  padding: 9px 12px;
  border: 1px solid rgba(245, 244, 244, 0.35);
  color: var(--gb3-ink-dark);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-weekend-timetable > div {
  display: flex;
  padding: 0 var(--gb3-gutter);
  border-top: 1px solid var(--gb3-line-dark);
}

.gb3-weekend-timetable > div > section {
  flex: 1 1 0;
  border-right: 1px solid var(--gb3-line-dark);
}

.gb3-weekend-timetable > div > section > header {
  display: flex;
  gap: 8px;
  padding: 10px 16px;
  background: var(--gb3-dark);
}

.gb3-weekend-timetable > div > section > header strong {
  font-size: 13px;
}

.gb3-weekend-timetable > div > section > header span {
  color: var(--gb3-ink-dark-meta);
  font: 10px var(--gb3-mono);
}

.gb3-weekend-timetable > div > section > div {
  display: flex;
}

.gb3-weekend-timetable article {
  display: flex;
  min-width: 0;
  flex: 1 1 0;
  flex-direction: column;
  gap: 3px;
  padding: 11px 10px 13px;
  border-right: 1px solid var(--gb3-line-dark-soft);
}

.gb3-weekend-timetable article.is-race {
  background: #17171a;
}

.gb3-weekend-timetable time {
  font: 700 14px var(--gb3-mono);
}

.gb3-weekend-timetable article span {
  color: var(--gb3-ink-dark-secondary);
  font-size: 11px;
}

@media screen and (max-width: 63.998em) {
  .gb3-home-hero__footer {
    align-items: stretch;
    flex-direction: column;
  }
  .gb3-home-hero__event {
    flex-basis: auto;
    width: min(100%, 380px);
  }
  .gb3-weekend-timetable > div {
    overflow-x: auto;
  }
  .gb3-weekend-timetable > div > section {
    min-width: 300px;
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-home-hero__event {
    width: 100%;
    box-sizing: border-box;
  }
  .gb3-weekend-timetable > header {
    align-items: flex-start;
    flex-wrap: wrap;
    padding-right: 16px;
    padding-left: 16px;
  }
  .gb3-weekend-timetable > header p {
    width: calc(100% - 22px);
  }
  .gb3-weekend-timetable > header a {
    margin-left: 22px;
  }
  .gb3-weekend-timetable > div {
    padding: 0 16px;
  }
}
.gb3-profile-mobile-stat, .gb3-profile-hero__mobile-entry {
  display: none;
}

.gb3-profile-form h3, .gb3-profile-facts h3 {
  margin: 0 0 12px;
  font-size: 22px;
}

.gb3-profile-form h3 {
  display: none;
}

.gb3-profile-form > span {
  display: block;
  margin-top: 12px;
}

@media screen and (max-width: 39.9375em) {
  .gb3-profile-tools > span:nth-child(2) {
    display: none;
  }
  .gb3-profile-tools > span:last-child {
    width: auto;
    margin-left: auto;
  }
  .gb3-profile-tools > span:last-child a {
    display: grid;
    min-width: 44px;
    height: 44px;
    place-items: center;
    padding: 0;
    font-size: 0;
  }
  .gb3-profile-tools > span:last-child a:first-child:before {
    font-size: 14px;
    content: "←";
  }
  .gb3-profile-tools > span:last-child a:last-child:before {
    font-size: 14px;
    content: "→";
  }
  .gb3-profile-hero__portrait {
    order: -1;
    height: 300px;
    min-height: 300px;
  }
  .gb3-profile-hero__portrait > img {
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: 50% 100%;
       object-position: 50% 100%;
  }
  .gb3-profile-hero__copy {
    gap: 14px;
    padding: 18px 16px 20px;
  }
  .gb3-profile-hero__copy h1 {
    font-size: 44px;
  }
  .gb3-profile-hero__copy small {
    font-size: 17px;
  }
  .gb3-profile-hero__copy p b {
    display: none;
  }
  .gb3-profile-hero__copy p {
    gap: 10px;
  }
  .gb3-profile-hero__copy p strong {
    font-size: 15px;
  }
  .gb3-profile-hero__copy dl {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin: 0 -16px -20px;
    padding-top: 1px;
    background: var(--gb3-line-dark);
  }
  .gb3-profile-hero__copy dl div {
    padding: 14px 16px;
    background: var(--gb3-dark);
  }
  .gb3-profile-hero__copy dt {
    font-size: 26px;
  }
  .gb3-profile-mobile-stat {
    display: block;
  }
  .gb3-profile-hero__gap {
    display: none;
  }
  .gb3-profile-hero__mobile-entry {
    display: inline;
  }
  .gb3-profile-hero__standing {
    right: 16px;
    bottom: 14px;
    left: 16px;
  }
  .gb3-profile-hero__standing b {
    padding: 6px 9px;
    background: var(--gb3-red);
    font-size: 12px;
  }
  .gb3-profile-hero__standing span {
    font-size: 10px;
    color: #fff;
  }
  .gb3-profile-season {
    display: grid;
  }
  .gb3-profile-season__aside {
    display: contents;
  }
  .gb3-profile-form {
    order: 1;
  }
  .gb3-profile-season__log {
    order: 2;
  }
  .gb3-profile-bio {
    order: 3;
  }
  .gb3-profile-facts {
    order: 4;
  }
  .gb3-profile-socials {
    order: 5;
  }
  .gb3-profile-round-promo {
    order: 6;
  }
  .gb3-profile-form h3 {
    display: block;
    font-size: 26px;
  }
  .gb3-profile-form > div {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
  }
  .gb3-profile-form > div i {
    width: auto !important;
    height: 48px !important;
    font-size: 17px !important;
  }
  .gb3-profile-facts h3 {
    font-size: 26px;
  }
  .gb3-profile-season__head {
    display: none;
  }
  .gb3-profile-season__round {
    position: relative;
    min-width: 0;
    min-height: 52px;
    grid-template-columns: minmax(0, 1fr) repeat(3, 34px);
    grid-template-rows: 1fr 1fr;
    gap: 3px 4px;
    padding: 9px 0;
  }
  .gb3-profile-season__round > b {
    position: absolute;
    top: 13px;
    left: 0;
  }
  .gb3-profile-season__round > span {
    grid-column: 1;
    grid-row: 1;
    padding-left: 24px;
  }
  .gb3-profile-season__round > span small {
    display: none;
  }
  .gb3-profile-season__round time {
    grid-column: 1;
    grid-row: 2;
    padding-left: 24px;
    color: var(--gb3-ink-light-meta);
    font-size: 10px;
  }
  .gb3-profile-season__round > i {
    align-self: center;
    width: 34px;
    height: 34px;
    grid-row: 1/3;
  }
  .gb3-profile-season__round > em {
    display: none;
  }
  .gb3-profile-season__log > footer {
    min-width: 0;
    grid-template-columns: 1fr auto auto;
    padding-top: 14px;
  }
  .gb3-profile-season__log > footer a {
    display: none;
  }
  .gb3-profile-others {
    overflow: hidden;
  }
  .gb3-profile-others > div {
    display: flex;
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }
  .gb3-profile-others > div a {
    flex: 0 0 176px;
    scroll-snap-align: start;
  }
}
.gb3-weekend-timetable__mobile-title, .gb3-weekend-timetable__tabs {
  display: none;
}

.gb3-weekend-timetable article small {
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-weekend-timetable article.is-live {
  background: var(--gb3-red);
}

.gb3-weekend-timetable article.is-live span, .gb3-weekend-timetable article.is-live small {
  color: #fff;
}

@media screen and (max-width: 39.9375em) {
  .gb3-weekend-timetable__desktop-title {
    display: none;
  }
  .gb3-weekend-timetable__mobile-title {
    display: inline;
  }
  .gb3-weekend-timetable__tabs {
    display: flex;
    gap: 6px;
    padding: 0 16px 12px;
  }
  .gb3-weekend-timetable__tabs button {
    display: flex;
    min-width: 0;
    min-height: 44px;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2px;
    padding: 7px 4px;
    border: 1px solid var(--gb3-line-dark);
    background: transparent;
    color: var(--gb3-ink-dark-secondary);
  }
  .gb3-weekend-timetable__tabs button.is-active {
    border-color: var(--gb3-red);
    background: var(--gb3-red);
    color: #fff;
  }
  .gb3-weekend-timetable__tabs strong {
    font: 700 12px var(--gb3-mono);
    text-transform: uppercase;
  }
  .gb3-weekend-timetable__tabs span {
    font: 10px var(--gb3-mono);
  }
  .gb3-weekend-timetable > .gb3-weekend-timetable__days {
    display: block;
    overflow: visible;
    padding: 0;
    background: var(--gb3-dark);
  }
  .gb3-weekend-timetable > .gb3-weekend-timetable__days > section {
    display: none;
    min-width: 0;
    border: 0;
  }
  .gb3-weekend-timetable > .gb3-weekend-timetable__days > section.is-active {
    display: block;
  }
  .gb3-weekend-timetable__days > section > header {
    padding: 12px 16px 6px;
    border-top: 1px solid var(--gb3-line-dark);
    background: var(--gb3-dark);
  }
  .gb3-weekend-timetable__days > section > header strong {
    display: none;
  }
  .gb3-weekend-timetable__days > section > div {
    display: block !important;
  }
  .gb3-weekend-timetable__days article {
    display: grid;
    min-height: 44px;
    grid-template-columns: 50px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--gb3-line-dark-soft);
    border-right: 0;
  }
  .gb3-weekend-timetable__days article span {
    font-size: 14px;
    font-weight: 600;
  }
  .gb3-weekend-timetable__days article small {
    text-align: right;
  }
}
/* Each time carries its clock - "09:30 BST", "15:05 CEST" - and a round abroad adds the UK time beneath it,
   so nobody has to know what CEST is to them. The zone is quieter than the time it qualifies; the UK line
   quieter again. On a phone the time column widens to hold the two lines. */
.gb3-weekend-timetable__when {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.gb3-weekend-timetable__when abbr {
  margin-left: 5px;
  color: var(--gb3-ink-dark-meta);
  font: 700 9px var(--gb3-mono);
  letter-spacing: 0.06em;
  text-decoration: none;
  cursor: help;
}

.gb3-weekend-timetable__when em {
  color: var(--gb3-ink-dark-meta);
  font: 10px var(--gb3-mono);
  font-style: normal;
  letter-spacing: 0.04em;
}

.gb3-weekend-timetable article.is-live .gb3-weekend-timetable__when abbr,
.gb3-weekend-timetable article.is-live .gb3-weekend-timetable__when em {
  color: rgba(255, 255, 255, 0.82);
}

@media screen and (max-width: 39.9375em) {
  .gb3-weekend-timetable__days article {
    grid-template-columns: 74px minmax(0, 1fr) auto;
  }
}
/* GB3 design-handoff parity: directory and recruitment mobile composition. */
.gb3-team-championship__mobile-progress {
  display: none;
}

.gb3-team-championship > header a {
  margin-left: auto;
  color: var(--gb3-ink-dark);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* --- Team profiles ------------------------------------------------------------------------------
   The identity colour each team carries. --gb3-team-colour defaults to the house red, so every rule
   below can use it unconditionally and a team with no colour of its own simply looks like the site. */
.gb3-team-profiles article {
  --gb3-team-colour: var(--gb3-red-light);
  border-left: 4px solid var(--gb3-team-colour);
}

.gb3-team-profiles__car {
  overflow: hidden;
  margin: 0 0 14px;
}

.gb3-team-profiles__car img {
  display: block;
  width: 100%;
  height: auto;
}

.gb3-team-profiles__bio {
  margin: 0 0 14px;
  color: var(--gb3-ink-light-body);
  font-size: 14px;
  line-height: 1.5;
}

.gb3-team-profiles__bio > :first-child {
  margin-top: 0;
}

.gb3-team-profiles__bio > :last-child {
  margin-bottom: 0;
}

/* One team to a row, which gives each card the width to set the team - car, copy, calls to action -
   beside its drivers as full portraits, where two to a row could only manage a list of thumbnails. */
.gb3-team-profiles > div {
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
}

@media screen and (max-width: 39.9375em) {
  .gb3-team-profiles > div {
    gap: 20px;
  }
}
.gb3-team-profiles__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 28px;
  align-items: start;
}

.gb3-team-profiles__team > :last-child {
  margin-bottom: 0;
}

/* The card's footer, under both columns. */
.gb3-team-profiles__content + .gb3-team-profiles__actions {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--gb3-line-light);
}

/* Up to four across; a team with fewer keeps the same tile size rather than stretching them. */
.gb3-team-profiles__drivers {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.gb3-team-profiles__drivers a {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  padding: 0;
  border-bottom: 0;
  color: var(--gb3-ink-light);
}

.gb3-team-profiles__driver-portrait {
  margin-bottom: 6px;
}

.gb3-team-profiles__drivers a b {
  color: var(--gb3-team-colour);
  font-size: 13px;
}

.gb3-team-profiles__drivers a > span:last-child {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.gb3-team-profiles__drivers a:hover > span:last-child {
  color: var(--gb3-red-light);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Too narrow for the two side by side: the drivers go under the team. */
@media screen and (max-width: 63.998em) {
  .gb3-team-profiles__content {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-team-profiles__drivers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* The rule under the team's name. The points/wins row that sat here drew it, and went with the rest of
   the performance figures to the team standings page; without the line the name ran straight into
   the car photograph. */
.gb3-team-profiles__body > header {
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gb3-line-light);
}

/* --- Team standings page, on white ---------------------------------------------------------------
   The teams' championship was designed as a dark band under the teams directory's hero, and every
   colour in it was picked for that: pale ink, a #353538 progress track, dark rules between rows. On
   its own page it sits on white instead, so each of those is re-stated here against the light tokens
   the team profiles already use - --gb3-red-light rather than --gb3-red for the bars, for the same
   contrast reason the rest of the light surfaces use it. Scoped to the page's own class, so the table
   keeps its dark treatment anywhere else it is ever placed. */
/* The teams directory shares it: the same season-page wrapper, which is near-black at full width while the
   white profiles inside it are capped at the content width - so a wide screen showed black strips down both
   sides of the whole page, under a dark count bar. */
.gb3-team-standings,
.gb3-teams-directory {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-team-standings .gb3-directory-tools,
.gb3-teams-directory .gb3-directory-tools {
  border-bottom-color: var(--gb3-line-light);
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light-meta);
}

.gb3-teams-directory .gb3-directory-tools a,
.gb3-team-standings .gb3-directory-tools a,
.gb3-team-standings .gb3-team-championship > header a {
  color: var(--gb3-ink-light);
}

.gb3-teams-directory .gb3-directory-tools a:hover,
.gb3-team-standings .gb3-directory-tools a:hover,
.gb3-team-standings .gb3-team-championship > header a:hover {
  color: var(--gb3-red-light);
}

/* background-image too: the dark bands carry a faint edge lift that means nothing on white.
   The bottom padding is this page's own: the table was built to hand straight on to the team
   profiles below it with 10px, and on a page where it is the last thing before the footer that left
   the final row sitting on the footer's edge - the season wrapper also pulls 44px into it. */
.gb3-team-standings .gb3-team-championship {
  padding-bottom: 88px;
  background: var(--gb3-light);
  background-image: none;
}

@media screen and (max-width: 39.9375em) {
  .gb3-team-standings .gb3-team-championship {
    padding-bottom: 56px;
  }
}
.gb3-team-standings .gb3-team-championship > header span,
.gb3-team-standings .gb3-team-championship article > span small,
.gb3-team-standings .gb3-team-championship article > i small {
  color: var(--gb3-ink-light-meta);
}

.gb3-team-standings .gb3-team-championship > div {
  border-top-color: var(--gb3-line-light);
}

.gb3-team-standings .gb3-team-championship article {
  border-bottom-color: var(--gb3-line-light-soft);
}

.gb3-team-standings .gb3-team-championship article > i > i,
.gb3-team-standings .gb3-team-championship__mobile-progress {
  background: var(--gb3-light-hover);
}

.gb3-team-standings .gb3-team-championship article > i > i > i,
.gb3-team-standings .gb3-team-championship__mobile-progress > i {
  background: var(--gb3-red-light);
}

/* A team's name in the standings links to its profile card on the teams page. Same type as before - it
   is the row's heading, not a call to action - and it only shows itself as a link on hover or focus. */
.gb3-team-championship__summary strong a {
  color: inherit;
  text-decoration: none;
  text-underline-offset: 3px;
}

.gb3-team-championship__summary strong a:hover,
.gb3-team-championship__summary strong a:focus-visible {
  color: var(--gb3-red-light);
  text-decoration: underline;
}

/* The card a standings link lands on: clear of the sticky header, and outlined in the team's own colour
   so it is obvious which of ten near-identical cards was the one asked for. */
.gb3-team-profiles article {
  scroll-margin-top: var(--gb3-anchor-offset);
}

.gb3-team-profiles article:target {
  outline: 2px solid var(--gb3-team-colour);
  outline-offset: 2px;
}

/* --- Team profile page ------------------------------------------------------------------------------
   The generated /teams/{year}/{slug} page. The page itself stays the season pages' dark, because the
   tools bar at the top is width-capped and the page shows beside it; each band sets its own colour.
   A dark hero edged in the team's own colour, the car at full
   width, then the team's words and its line-up on white, and the rest of the grid to move on to.

   Each band bleeds to the edge of the page and holds its content to the site column with padding,
   rather than joining the "gutter inside the wrapper" list, which caps the ELEMENT at the shell width -
   fine on a single-colour page, but here a white band capped at 1280px would sit in dark margins on a
   wide screen. The padding puts the content on exactly the column the tools bar above uses. */
.gb3-team-page {
  --gb3-team-colour: var(--gb3-red-light);
  --gb3-team-page-inline: max(var(--gb3-gutter), calc((100% - var(--gb3-shell)) / 2 + var(--gb3-gutter)));
}

.gb3-team-page__hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 380px);
  align-items: center;
  gap: 40px;
  padding: 48px var(--gb3-team-page-inline) 44px;
  border-bottom: 4px solid var(--gb3-team-colour);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-team-page__identity h1 {
  margin: 14px 0 10px;
  font-size: 64px;
  font-weight: 800;
  line-height: 0.95;
}

.gb3-team-page__identity p {
  margin: 0;
  color: var(--gb3-ink-dark-meta);
  font: 700 12px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-team-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

/* On the dark hero the enquiry button's usual near-black hover would disappear into the band. */
.gb3-team-page__actions .gb3-team-profiles__enquire:hover {
  background: #fff;
  color: var(--gb3-red-light);
}

.gb3-team-page__website {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  border: 1px solid var(--gb3-line-dark);
  color: var(--gb3-ink-dark);
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-page__website:hover {
  border-color: #fff;
  color: #fff;
}

/* The logo on its own light plate, as on the teams page: most of the grid's artwork is black on
   transparent and would vanish on the dark hero. */
.gb3-team-page__mark {
  display: grid;
  min-height: 190px;
  place-items: center;
  padding: 24px;
  background: var(--gb3-light-band);
}

.gb3-team-page__mark img {
  max-width: 100%;
  max-height: 130px;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-team-page__mark > span,
.gb3-team-page__other-mark > span {
  color: var(--gb3-ink-light-meta);
  font: 700 36px var(--gb3-mono);
}

.gb3-team-page__car {
  margin: 0;
  padding: clamp(16px, 3vw, 40px) 20px;
  background: var(--gb3-dark-tile);
}

.gb3-team-page__car img {
  display: block;
  width: 100%;
  max-width: 1100px;
  height: auto;
  margin: 0 auto;
}

.gb3-team-page__body {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(260px, 0.55fr);
  align-items: start;
  gap: 40px;
  padding: 52px var(--gb3-team-page-inline) 60px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-team-page__main {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 44px;
}

.gb3-team-page__main h2,
.gb3-team-page__others h2 {
  margin: 0 0 18px;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
}

.gb3-team-page__bio-copy {
  color: var(--gb3-ink-light-body);
  font-size: 16px;
  line-height: 1.65;
}

.gb3-team-page__bio-copy > :first-child {
  margin-top: 0;
}

.gb3-team-page__bio-copy > :last-child {
  margin-bottom: 0;
}

.gb3-team-page__empty {
  margin: 0;
  color: var(--gb3-ink-light-meta);
}

.gb3-team-page__drivers {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
}

.gb3-team-page__driver {
  display: flex;
  flex-direction: column;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

.gb3-team-page__driver:hover {
  background: var(--gb3-light-hover);
  color: var(--gb3-ink-light);
}

.gb3-team-page__driver:hover strong {
  color: var(--gb3-red-light);
}

.gb3-team-page__driver-portrait {
  position: relative;
  display: grid;
  overflow: hidden;
  aspect-ratio: 4/5;
  place-items: center;
  background: var(--gb3-light-hover);
  color: rgba(17, 17, 19, 0.22);
}

.gb3-team-page__driver-portrait img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 12%;
     object-position: 50% 12%;
}

.gb3-team-page__driver-portrait svg {
  width: 46%;
  height: auto;
}

.gb3-team-page__driver-portrait b {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 3px 7px;
  background: var(--gb3-team-colour);
  color: #fff;
  font: 700 12px var(--gb3-mono);
}

.gb3-team-page__driver-name {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px 6px;
}

.gb3-team-page__driver-name small {
  color: var(--gb3-ink-light-meta);
  font-size: 13px;
}

.gb3-team-page__driver-name strong {
  font-size: 20px;
  font-weight: 800;
  line-height: 1.1;
  transition: color 130ms linear;
}

.gb3-team-page__driver-nation {
  display: flex;
  min-height: 18px;
  align-items: center;
  gap: 8px;
  padding: 0 14px 14px;
  color: var(--gb3-ink-light-meta);
  font: 11px var(--gb3-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gb3-team-page__aside {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.gb3-team-page__aside > section {
  padding: 20px;
  background: var(--gb3-light-band);
}

.gb3-team-page__aside .gb3-profile-facts dd a {
  color: var(--gb3-red-light);
}

.gb3-team-page__others {
  padding: 44px var(--gb3-team-page-inline) 88px;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

.gb3-team-page__others > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
}

.gb3-team-page__others > header a {
  margin-left: auto;
  color: var(--gb3-ink-light);
  font: 700 12px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-team-page__others > div {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 10px;
}

.gb3-team-page__others > div > a {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-team-page__others > div > a:hover strong {
  color: var(--gb3-red-light);
}

.gb3-team-page__other-mark {
  display: grid;
  height: 56px;
  place-items: center;
}

.gb3-team-page__other-mark img {
  max-width: 100%;
  max-height: 44px;
  -o-object-fit: contain;
     object-fit: contain;
}

.gb3-team-page__other-mark > span {
  font-size: 18px;
}

.gb3-team-page__others strong {
  font-size: 14px;
  line-height: 1.25;
  transition: color 130ms linear;
}

/* The team name on the teams directory's cards links to the team's page. */
.gb3-team-profiles article h3 a {
  color: inherit;
}

.gb3-team-profiles article h3 a:hover {
  color: var(--gb3-red-light);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media screen and (max-width: 63.998em) {
  .gb3-team-page__hero,
  .gb3-team-page__body {
    grid-template-columns: minmax(0, 1fr);
  }
  .gb3-team-page__mark {
    min-height: 140px;
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-team-page {
    --gb3-team-page-inline: 16px;
  }
  .gb3-team-page__hero {
    gap: 24px;
    padding-top: 32px;
    padding-bottom: 30px;
  }
  .gb3-team-page__identity h1 {
    font-size: 40px;
  }
  .gb3-team-page__actions > a {
    flex: 1 1 auto;
    justify-content: center;
  }
  .gb3-team-page__body {
    gap: 36px;
    padding-top: 36px;
    padding-bottom: 40px;
  }
  .gb3-team-page__main h2,
  .gb3-team-page__others h2 {
    font-size: 26px;
  }
  .gb3-team-page__drivers,
  .gb3-team-page__others > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .gb3-team-page__others {
    padding-bottom: 56px;
  }
  .gb3-team-page__others > header {
    flex-wrap: wrap;
  }
}
/* The driver's portrait, or the silhouette standing in for one. The portraits are 10:13, so the frame
   is too and nothing is cut off; a square headshot standing in for a missing portrait is anchored at
   the top, where the face is. */
.gb3-team-profiles__driver-portrait {
  display: grid;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 10/13;
  place-items: center;
  background: var(--gb3-light-hover);
  color: rgba(17, 17, 19, 0.2);
}

.gb3-team-profiles__driver-portrait img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 0;
     object-position: 50% 0;
}

.gb3-team-profiles__driver-portrait svg {
  align-self: end;
  width: 72%;
  height: auto;
}

.gb3-team-profiles__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
}

/* The enquiry is the point of this page for a driver looking for a seat, so it is a button rather
   than one more small-caps link in a column of them - and it keeps that weight on a phone, where it
   used to be display:none. */
.gb3-team-profiles__enquire {
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  background: var(--gb3-red);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-profiles__enquire:hover {
  background: var(--gb3-ink-light);
  color: #fff;
}

/* Onto the team's own page: solid dark, so it reads as the card's main way in beside the outlined
   website link, without competing with the red enquiry button. */
.gb3-team-profiles__more {
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  border: 1px solid var(--gb3-ink-light);
  background: var(--gb3-ink-light);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-profiles__more:hover {
  border-color: var(--gb3-team-colour, var(--gb3-ink-light));
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-team-profiles__website {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  border: 1px solid var(--gb3-line-light);
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-team-profiles__website:hover {
  border-color: var(--gb3-team-colour, var(--gb3-ink-light));
  background: var(--gb3-light-hover);
  color: var(--gb3-ink-light);
}

@media screen and (max-width: 39.9375em) {
  .gb3-season-page__hero {
    min-height: 0;
    padding: 220px 0 0;
  }
  .gb3-season-page__hero > img,
  .gb3-season-page__hero-scrim {
    top: 0;
    bottom: auto;
    height: 220px;
  }
  .gb3-season-page__hero > div {
    max-width: none;
    padding: 18px 16px 20px;
    background: var(--gb3-dark);
  }
  .gb3-season-page__hero h1 {
    margin: 12px 0;
    font-size: 40px;
  }
  .gb3-season-page__hero p {
    font-size: 14px;
    line-height: 1.55;
  }
  .gb3-team-championship > header a {
    margin-left: 0;
  }
  .gb3-team-championship article {
    min-height: 44px;
    grid-template-columns: 26px minmax(0, 1fr) 66px;
    gap: 12px;
    padding: 12px 0 14px;
  }
  .gb3-team-championship__mark,
  .gb3-team-championship__progress {
    display: none;
  }
  .gb3-team-championship__mobile-progress {
    display: block;
    height: 3px;
    margin: 5px 0;
    background: var(--gb3-line-dark);
  }
  .gb3-team-championship__mobile-progress > i {
    display: block;
    height: 100%;
    background: var(--gb3-red);
  }
  .gb3-team-profiles article {
    grid-template-columns: 1fr;
  }
  .gb3-team-profiles__mark {
    width: 100%;
    height: 84px;
    min-height: 84px;
    box-sizing: border-box;
    padding: 0 18px;
  }
  .gb3-team-profiles article > div:last-child {
    padding: 14px 16px 16px;
  }
  /* Full width, side by side, so the two calls to action stay the last thing in the card rather
     than wrapping into a ragged pair. */
  .gb3-team-profiles__actions > a {
    flex: 1 1 auto;
    justify-content: center;
  }
  .gb3-race-with-us__hero-media {
    order: -1;
    min-height: 260px;
  }
  .gb3-race-with-us__hero-copy {
    gap: 16px;
    padding: 18px 16px 24px;
  }
  .gb3-race-with-us__hero h1 {
    font-size: 40px;
    line-height: 0.96;
  }
  .gb3-race-with-us__car-image {
    order: -1;
    min-height: 220px;
  }
}
/* Inner wrappers that were relying on .gb3-site-shell's old 1280px cap to stay narrow. With the shell
   full-width they need the constraint themselves, exactly as every other inner wrapper in this file
   already does it. The section around each keeps its own background, and that is what now bleeds.

   WHICH CAP A WRAPPER TAKES DEPENDS ON WHERE ITS GUTTER IS - see --gb3-shell and --gb3-column at the
   top of this file. Getting it wrong is invisible until the window is wider than the shell plus both
   gutters (~1352px), because below that the cap never binds and everything lines up anyway. */
/* 1. Gutter inside the wrapper. */
.gb3-home-hero__content,
.gb3-directory-tools,
.gb3-driver-directory-grid,
.gb3-directory-team-grid,
.gb3-team-championship,
.gb3-team-profiles,
.gb3-profile-tools,
.gb3-profile-hero,
.gb3-profile-season,
.gb3-profile-others,
.gb3-standings-full,
.gb3-standings-rounds,
.gb3-media-partners__hero-copy,
.gb3-media-partners__media > header,
.gb3-media-partners__partners > header,
.gb3-media-partners__lead,
.gb3-media-partners__columns,
.gb3-media-partners__assets,
.gb3-media-partners__grid,
.gb3-media-partners__reach,
.gb3-media-partners__commercial,
.gb3-weekend-timetable,
.gb3-season-page__hero,
.gb3-profile-hero__copy,
.gb3-profile-summary {
  width: 100%;
  max-width: var(--gb3-shell);
  margin-right: auto;
  margin-left: auto;
}

/* 2. Gutter on the section around the wrapper - .gb3-championship, .cms-gb3-snapshot--news and the
      Race with us bands all carry `padding: 0 var(--gb3-gutter)` themselves. */
.cms-gb3-news,
.gb3-team-grid,
.gb3-championship__header,
.gb3-standings-layout,
.gb3-calendar-feature,
.gb3-calendar-rail-wrap,
.gb3-race-with-us__hero,
.gb3-race-with-us__figures,
.gb3-race-with-us__car > header,
.gb3-race-with-us__car-content,
.gb3-race-with-us__value > header,
.gb3-race-with-us__licence-points,
.gb3-race-with-us__ladder,
.gb3-race-with-us__value-columns,
.gb3-race-with-us__steps > header,
.gb3-race-with-us__step-grid,
.gb3-race-with-us__enquiry,
.gb3-footer .gb3-partners > .grid-container {
  width: 100%;
  max-width: var(--gb3-column);
  margin-right: auto;
  margin-left: auto;
}

/* ---------------------------------------------------------------------------------------------
   Standings page (GB3ChampionshipSurface.StandingsDirectory)

   The whole field and every round, as opposed to the homepage teaser the Standings surface renders.
   Two real <table>s rather than the div/role=table the teaser uses: this is genuinely tabular, the
   round grid needs colspan headers, and a screen reader announcing row and column here is the point.

   Both tables scroll inside their own container. The round grid is 8 rounds x 3 races wide and can
   never fit a phone, and the page body must not scroll sideways to accommodate it.
   --------------------------------------------------------------------------------------------- */
.gb3-standings-page {
  padding-bottom: 8px;
}

.gb3-standings-full,
.gb3-standings-rounds {
  padding: 38px var(--gb3-gutter) 6px;
  color: var(--gb3-ink-dark);
}

.gb3-standings-full > header,
.gb3-standings-rounds > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 18px;
}

.gb3-standings-full > header h2,
.gb3-standings-rounds > header h2 {
  margin: 0;
  font-size: 30px;
  font-weight: 800;
}

.gb3-standings-full > header span,
.gb3-standings-rounds > header span {
  color: var(--gb3-ink-dark-meta);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* The way across to the teams' championship, which has its own page. */
.gb3-standings-full > header a {
  margin-left: auto;
  color: var(--gb3-ink-dark);
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-standings-full > header a:hover {
  color: var(--gb3-red);
}

.gb3-standings-rounds__scroll {
  overflow-x: auto;
  /* Momentum scrolling on the round grid, which is the one people will drag. */
  -webkit-overflow-scrolling: touch;
}

/* The drivers' table fits without scrolling on a desktop, so its wrapper is deliberately NOT a scroll
   container there. `overflow-x: auto` would make it one - the other axis cannot stay `visible` beside a
   non-visible axis, so it silently becomes `auto` too - and a sticky header inside a scroll container
   sticks to THAT container, not the viewport. Uncapped, the container never scrolls, so the header
   would never stick to anything and would scroll away with the page.
   Below 64em the table is wider than the screen and has to scroll, and there the header follows it. */
.gb3-standings-full__scroll {
  overflow: visible;
}

@media screen and (max-width: 63.998em) {
  .gb3-standings-full__scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
.gb3-standings-full__table,
.gb3-standings-rounds__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  /* Narrower than the scroll container would allow it to shrink to, so columns stay readable and the
     container scrolls instead of the text wrapping to nothing. Includes the 52px portrait column. */
  min-width: 872px;
}

.gb3-standings-full__table thead th,
.gb3-standings-rounds__table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 0 10px 10px;
  background: var(--gb3-dark);
  /* Not border-bottom: a separated table would scroll the row's own border away from the stuck
     header. An inset shadow is painted by the cell, so it stays with it. */
  box-shadow: inset 0 -1px 0 var(--gb3-line-dark);
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  font-weight: 400;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

/* On a desktop the drivers' table is NOT a scroll container (see .gb3-standings-full__scroll), so its
   header sticks to the VIEWPORT - and the site header is sticky there too, so at top: 0 the column
   labels slide underneath the red bar and vanish. They stop just below the bar instead. Desktop only:
   below 64em the table is its own scroll container, where top: 0 is the top of the table.
   After the rule above on purpose - same specificity, so it is source order that lets this win. */
@media print, screen and (min-width: 64em) {
  .gb3-standings-full__table thead th {
    top: var(--gb3-sticky-header);
  }
}
.gb3-standings-full__table tbody td,
.gb3-standings-full__table tbody th {
  padding: 13px 10px;
  border-bottom: 1px solid var(--gb3-line-dark);
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
}

.gb3-standings-full__table tbody tr:hover {
  background: var(--gb3-dark-band);
}

.gb3-standings-full__table .is-pos,
.gb3-standings-full__table .is-num {
  width: 58px;
  font: 700 14px var(--gb3-mono);
}

.gb3-standings-full__table tbody .is-num {
  color: var(--gb3-ink-dark-meta);
}

.gb3-standings-full__table .is-driver,
.gb3-standings-full__table .is-team {
  text-align: left;
}

/* The portrait column. Tight padding on the right so the picture sits against the name it belongs
   to rather than floating between two columns. */
.gb3-standings-full__table .is-portrait {
  width: 52px;
}

.gb3-standings-full__table tbody .is-portrait {
  padding-right: 0;
}

.gb3-standings-full__portrait {
  display: grid;
  overflow: hidden;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  margin: 0 auto;
  place-items: center;
  background: var(--gb3-dark-tile);
}

.gb3-standings-full__portrait img {
  width: 100%;
  height: 100%;
  /* From the top: these are head-and-shoulders shots in a square crop, so centring them cuts the
     forehead off. */
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 12%;
     object-position: 50% 12%;
}

.gb3-standings-full__portrait b {
  color: var(--gb3-ink-dark-meta);
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.04em;
}

.gb3-standings-full__table .is-driver a {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.gb3-standings-full__table .is-driver small {
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-standings-full__table .is-driver strong {
  font-size: 16px;
  font-weight: 700;
}

.gb3-standings-full__table .is-driver a:hover strong {
  color: var(--gb3-red);
}

.gb3-standings-full__table .is-team {
  color: var(--gb3-ink-dark-secondary);
  font-size: 13px;
}

.gb3-standings-full__table .is-nat,
.gb3-standings-full__table .is-stat {
  color: var(--gb3-ink-dark-secondary);
  font: 12px var(--gb3-mono);
}

/* Inline rather than a flex cell: making a <td> a flex container takes it out of the table's own
   column sizing, and this column sits between eight others that depend on it. */
.gb3-standings-full__table .is-nat {
  white-space: nowrap;
}

.gb3-standings-full__table .is-nat .gb3-flag {
  margin-right: 8px;
}

.gb3-standings-full__table .is-points {
  font: 700 18px var(--gb3-mono);
}

.gb3-standings-full__table .is-gap {
  width: 76px;
  color: var(--gb3-ink-dark-meta);
  font: 11px var(--gb3-mono);
}

/* The leader and the rest of the podium, marked the same way the season log marks a win. */
.gb3-standings-full__table tbody tr.is-leader .is-pos {
  background: var(--gb3-red);
  color: #fff;
}

.gb3-standings-full__table tbody tr.is-podium .is-pos {
  background: #242427;
}

/* --- round by round --- */
.gb3-standings-rounds__table {
  min-width: 960px;
}

.gb3-standings-rounds__scroll {
  /* dvh second so it wins where supported - mobile 100vh includes the retracting URL bar and
     overshoots, which would put the scrollbar back off screen on exactly the devices this is for. */
  max-height: calc(100vh - 150px);
  max-height: calc(100dvh - 150px);
  overflow: auto;
  /* Swiping the grid sideways must not start dragging the page with it. */
  overscroll-behavior-x: contain;
}

/* Two header rows: the round names, then R1/R2/R3 beneath them. The second has to stick below the
   first, so both get a fixed height and the second is offset by it. */
.gb3-standings-rounds__table thead tr:first-child th {
  height: 46px;
  top: 0;
}

.gb3-standings-rounds__table thead tr:nth-child(2) th {
  height: 24px;
  top: 46px;
}

/* The driver column sticks sideways and its header sticks in both axes at once, so it needs to sit
   above both - the plain header cells and the plain body cells of that column. */
.gb3-standings-rounds__table thead .is-driver,
.gb3-standings-rounds__table thead .is-points {
  z-index: 4;
}

.gb3-standings-rounds__table thead .is-driver {
  left: 0;
}

.gb3-standings-rounds__table .is-driver {
  box-shadow: inset -1px 0 0 var(--gb3-line-dark);
}

.gb3-standings-rounds__table thead .is-round {
  border-left: 1px solid var(--gb3-line-dark);
  padding-top: 4px;
}

.gb3-standings-rounds__table thead .is-round b {
  display: block;
  color: var(--gb3-ink-dark);
  font-size: 11px;
  font-weight: 700;
}

.gb3-standings-rounds__table thead .is-round small {
  display: block;
  margin-top: 2px;
  font-size: 9px;
}

.gb3-standings-rounds__table .is-driver {
  position: sticky;
  left: 0;
  z-index: 3;
  width: 168px;
  /* Opaque: the result columns scroll underneath this one. */
  background: var(--gb3-dark);
  text-align: left;
}

.gb3-standings-rounds__table thead .is-driver,
.gb3-standings-rounds__table thead .is-points {
  vertical-align: bottom;
}

.gb3-standings-rounds__table tbody .is-driver a {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.gb3-standings-rounds__table tbody .is-driver b {
  min-width: 24px;
  color: var(--gb3-ink-dark-meta);
  font: 700 11px var(--gb3-mono);
}

.gb3-standings-rounds__table tbody .is-driver span {
  font-size: 14px;
  font-weight: 700;
}

.gb3-standings-rounds__table tbody .is-driver a:hover span {
  color: var(--gb3-red);
}

.gb3-standings-rounds__table tbody td,
.gb3-standings-rounds__table tbody th {
  padding: 8px 6px;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  font-weight: 400;
  text-align: center;
}

.gb3-standings-rounds__table tbody tr:hover .is-driver {
  background: var(--gb3-dark-band);
}

.gb3-standings-rounds__table td.is-race {
  border-left: 1px solid rgba(245, 244, 244, 0.06);
}

/* Each round's first race takes the heavier rule, so rounds read as groups. */
.gb3-standings-rounds__table td.is-race:nth-child(3n+2) {
  border-left: 1px solid var(--gb3-line-dark);
}

.gb3-standings-rounds__table .is-race i {
  display: grid;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  place-items: center;
  background: var(--gb3-dark-band);
  font: 700 11px var(--gb3-mono);
  font-style: normal;
}

.gb3-standings-rounds__table .is-race i.is-win {
  background: var(--gb3-red);
  color: #fff;
}

.gb3-standings-rounds__table .is-race i.is-second {
  background: #3a3a3e;
  color: #fff;
}

.gb3-standings-rounds__table .is-race i.is-third {
  background: var(--gb3-bronze);
  color: #fff;
}

.gb3-standings-rounds__table .is-race i.is-empty {
  background: transparent;
  color: var(--gb3-ink-dark-meta);
}

/* A status, not a position - DNF, DNS, DSQ. Sized down because the label is letters, not a number. */
.gb3-standings-rounds__table .is-race i.is-status {
  background: transparent;
  border: 1px solid var(--gb3-line-dark);
  color: var(--gb3-ink-dark-meta);
  font-size: 9px;
}

.gb3-standings-rounds__table tbody .is-points {
  font: 700 14px var(--gb3-mono);
}

@media screen and (max-width: 39.9375em) {
  .gb3-standings-full,
  .gb3-standings-rounds {
    padding: 28px 16px 4px;
  }
  .gb3-standings-full > header h2,
  .gb3-standings-rounds > header h2 {
    font-size: 24px;
  }
  .gb3-standings-full > header,
  .gb3-standings-rounds > header {
    flex-wrap: wrap;
    gap: 4px 16px;
  }
  .gb3-standings-rounds__table .is-driver {
    width: 132px;
  }
  .gb3-standings-rounds__scroll {
    max-height: calc(100vh - 110px);
    max-height: calc(100dvh - 110px);
  }
}
/* ---------------------------------------------------------------------------------------------
   Scrollbars on the dark sections

   Same treatment the calendar rail already used - thin, square, transparent track, thumb inset by a
   transparent border with background-clip - but keyed to the dark palette, and picking up the red on
   hover so a draggable bar reads as interactive like everything else on the site.

   background-COLOR on the hover, not the `background` shorthand: the shorthand resets background-clip
   and the thumb would snap out to full width on hover.

   The corner matters here. The round grid scrolls in both axes at once, so WebKit paints a
   scrollbar-corner between the two bars, and left alone it is a light grey square sitting in the
   middle of a black table.
   --------------------------------------------------------------------------------------------- */
.gb3-standings-full__scroll,
.gb3-standings-rounds__scroll,
.gb3-profile-others > div,
.gb3-weekend-timetable > div {
  scrollbar-width: thin;
  scrollbar-color: var(--gb3-ink-dark-meta) transparent;
}

.gb3-standings-full__scroll::-webkit-scrollbar,
.gb3-standings-rounds__scroll::-webkit-scrollbar,
.gb3-profile-others > div::-webkit-scrollbar,
.gb3-weekend-timetable > div::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.gb3-standings-full__scroll::-webkit-scrollbar-track,
.gb3-standings-rounds__scroll::-webkit-scrollbar-track,
.gb3-profile-others > div::-webkit-scrollbar-track,
.gb3-weekend-timetable > div::-webkit-scrollbar-track {
  background: var(--gb3-dark-band);
}

.gb3-standings-full__scroll::-webkit-scrollbar-thumb,
.gb3-standings-rounds__scroll::-webkit-scrollbar-thumb,
.gb3-profile-others > div::-webkit-scrollbar-thumb,
.gb3-weekend-timetable > div::-webkit-scrollbar-thumb {
  background-color: var(--gb3-ink-dark-meta);
  border: 2px solid transparent;
  background-clip: padding-box;
}

.gb3-standings-full__scroll::-webkit-scrollbar-thumb:hover,
.gb3-standings-rounds__scroll::-webkit-scrollbar-thumb:hover,
.gb3-profile-others > div::-webkit-scrollbar-thumb:hover,
.gb3-weekend-timetable > div::-webkit-scrollbar-thumb:hover {
  background-color: var(--gb3-red);
}

.gb3-standings-rounds__scroll::-webkit-scrollbar-corner,
.gb3-standings-full__scroll::-webkit-scrollbar-corner {
  background: var(--gb3-dark-band);
}

/* The season log scrolls sideways on phones, on the light band. */
@media screen and (max-width: 39.9375em) {
  .gb3-profile-season__log {
    scrollbar-width: thin;
    scrollbar-color: var(--gb3-ink-light-meta) transparent;
  }
  .gb3-profile-season__log::-webkit-scrollbar {
    height: 8px;
  }
  .gb3-profile-season__log::-webkit-scrollbar-track {
    background: transparent;
  }
  .gb3-profile-season__log::-webkit-scrollbar-thumb {
    background-color: var(--gb3-ink-light-meta);
    border: 2px solid transparent;
    background-clip: padding-box;
  }
}
/* =============================================================================================
   Motion

   The theme is deliberately hard-edged - square corners, mono type, flat blocks - so the motion is
   mechanical: short, sharp, and gone. Nothing floats, nothing loops near the hero video, and the one
   thing that repeats (the live marker) repeats because it is reporting state, not decorating.

   Everything here is either pure CSS or added by gb3-2026.js AFTER the page has rendered. Nothing in
   the markup starts hidden: GB3 publishes as static HTML, so a rule that hid content until a script
   revealed it would leave a blank page whenever the script failed or was slow.
   ============================================================================================= */
/* --- 1. Ease the hovers that already existed ---------------------------------------------------
   There were 35 :hover rules in this file and two transitions, so every one of them snapped. Named
   properties rather than `all`: `all` would animate layout properties too, turning a reflow into a
   frame-by-frame repaint, and would catch things like the sticky header's box-shadow. */
.gb3-home-hero__actions a,
.cms-gb3-snapshot__link,
.gb3-championship__all-link,
.gb3-team-card,
.gb3-driver-directory-card,
.gb3-standings-table__row,
.gb3-news-list__article > a,
.gb3-profile-socials a,
.gb3-primary-item > a,
.gb3-submenu a,
.gb3-submenu-toggle,
.gb3-live-timing,
.gb3-standings-full__table tbody tr,
.gb3-standings-rounds__table tbody tr,
.social-bar a,
footer a {
  transition: background-color 130ms linear, border-color 130ms linear, color 130ms linear, transform 130ms cubic-bezier(0.2, 0, 0, 1);
}

/* The hover moves the colour of the heading INSIDE the link, so the transition belongs there. */
.gb3-news-list__article > a h3,
.gb3-news-list__lead > a h2,
.gb3-news-list__briefing article > a h3,
.gb3-standings-full__table .is-driver a strong,
.gb3-standings-rounds__table tbody .is-driver a span {
  transition: color 130ms linear;
}

/* --- 2. Live marker ---------------------------------------------------------------------------
   Functional, not decorative: it only exists while a session is actually running, and it is the one
   looping animation on the page. Sized and placed like a recording light. */
.gb3-home-hero__event > span.is-live::before {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  animation: gb3-live-pulse 1.5s ease-in-out infinite;
  background: var(--gb3-red);
  content: "";
  vertical-align: baseline;
}

@keyframes gb3-live-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.25;
  }
}
/* --- 3. Hero entrance -------------------------------------------------------------------------
   One pass on load, giving the video a beat before the text lands. `backwards` so each line holds at
   its start state through its delay rather than flashing in first. Pure CSS, so there is no state in
   which these stay invisible - the reduced-motion block below removes the animation outright rather
   than leaving it paused at opacity 0. */
@keyframes gb3-rise {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.gb3-home-hero__kicker,
.gb3-home-hero__content h1,
.gb3-home-hero__summary,
.gb3-home-hero__actions,
.gb3-home-hero__footer,
.gb3-season-page__hero > div > *,
.gb3-profile-hero__copy > *,
.gb3-race-with-us__hero-copy > * {
  animation: gb3-rise 520ms cubic-bezier(0.2, 0, 0, 1) backwards;
}

/* Interior heroes stagger by position rather than by name - they hold different elements on each
   page, so there is nothing stable to enumerate. */
.gb3-season-page__hero > div > *:nth-child(1),
.gb3-profile-hero__copy > *:nth-child(1),
.gb3-race-with-us__hero-copy > *:nth-child(1) {
  animation-delay: 60ms;
}

.gb3-season-page__hero > div > *:nth-child(2),
.gb3-profile-hero__copy > *:nth-child(2),
.gb3-race-with-us__hero-copy > *:nth-child(2) {
  animation-delay: 140ms;
}

.gb3-season-page__hero > div > *:nth-child(3),
.gb3-profile-hero__copy > *:nth-child(3),
.gb3-race-with-us__hero-copy > *:nth-child(3) {
  animation-delay: 230ms;
}

.gb3-season-page__hero > div > *:nth-child(n+4),
.gb3-profile-hero__copy > *:nth-child(n+4),
.gb3-race-with-us__hero-copy > *:nth-child(n+4) {
  animation-delay: 320ms;
}

.gb3-home-hero__kicker {
  animation-delay: 60ms;
}

.gb3-home-hero__content h1 {
  animation-delay: 140ms;
}

.gb3-home-hero__summary {
  animation-delay: 230ms;
}

.gb3-home-hero__actions {
  animation-delay: 320ms;
}

.gb3-home-hero__footer {
  animation-delay: 410ms;
}

/* --- 4. Scroll reveals ------------------------------------------------------------------------
   .gb3-reveal is applied by script, never by the markup. That ordering is the whole safety story:
   with no JS the sections are simply visible, and there is no flash of hidden content to manage. */
.gb3-reveal {
  opacity: 0;
  transform: translateY(12px);
}

.gb3-reveal.is-revealed {
  opacity: 1;
  transform: none;
  transition: opacity 560ms cubic-bezier(0.2, 0, 0, 1), transform 560ms cubic-bezier(0.2, 0, 0, 1);
}

/* --- 5. Reduced motion ------------------------------------------------------------------------
   Everything above is off. The reveal keeps its revealed state rather than its hidden one, so a
   reader who has asked for no motion still sees the page rather than nothing. */
@media (prefers-reduced-motion: reduce) {
  .gb3-home-hero__kicker,
  .gb3-home-hero__content h1,
  .gb3-home-hero__summary,
  .gb3-home-hero__actions,
  .gb3-home-hero__footer,
  .gb3-season-page__hero > div > *,
  .gb3-profile-hero__copy > *,
  .gb3-race-with-us__hero-copy > *,
  .gb3-home-hero__event > span.is-live::before {
    animation: none;
  }
  .gb3-reveal,
  .gb3-reveal.is-revealed {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/* ---------------------------------------------------------------------------------------------
   Softening the full-bleed dark bands

   The dark sections run edge to edge while their content stops at --gb3-shell, so on a wide screen
   each one reads as a hard slab with a lot of flat black either side. This lifts the outer margins
   slightly so the band looks lit across the middle and eases away at the edges.

   The fade is measured in from each EDGE rather than out from the content column. Anchoring it to the
   column was the obvious first idea and was wrong in practice: the margin outside the content is only
   ~70px a side at 1440 and nothing at all below 1280, so the effect ranged from barely visible to
   literally absent on the window sizes most people use. Measuring from the edge means it always has
   somewhere to happen; clamped so it cannot swallow a narrow screen or run away on a wide one.

   It therefore overlaps the content column on smaller windows. That is fine - it tints the background
   behind the text by a few per cent, it does not sit over it.

   background-IMAGE over each section's own background-colour, so one rule gives the same relative
   lift to bands that start from three different darks rather than flattening them to one.
   --------------------------------------------------------------------------------------------- */
.cms-gb3-snapshot--car,
.cms-gb3-snapshot--partners,
.gb3-championship--standings,
.gb3-standings-full,
.gb3-standings-rounds,
.gb3-profile-others,
.gb3-team-championship,
.gb3-race-with-us__car,
.gb3-race-with-us__steps,
.gb3-media-partners__hero,
.gb3-media-partners__partners {
  background-image: linear-gradient(90deg, var(--gb3-edge-lift) 0, transparent var(--gb3-edge-fade), transparent calc(100% - var(--gb3-edge-fade)), var(--gb3-edge-lift) 100%);
}

/* Anchor targets linked from the main menu - "The Car" and "Enquiries" both land inside this page, and
   the team profiles' enquiry buttons land on #enquire. scroll-margin so the heading is not tucked under
   the header, which is sticky at every width; --gb3-anchor-offset carries the right clearance for each. */
.gb3-race-with-us__car,
.gb3-race-with-us__steps {
  scroll-margin-top: var(--gb3-anchor-offset);
}

/* =============================================================================================
   Media & partners

   Two audiences on one page, split at #media and #partners, both reachable from the hero and from
   the main menu. Press half on the light band, partners on dark, so the join does the work of
   separating them without a divider.
   ============================================================================================= */
.gb3-media-partners__hero {
  position: relative;
  display: flex;
  min-height: 420px;
  align-items: center;
  overflow: hidden;
  background-color: var(--gb3-dark-tile);
  color: var(--gb3-ink-dark);
}

.gb3-media-partners__hero-media,
.gb3-media-partners__hero-scrim {
  position: absolute;
  inset: 0;
}

.gb3-media-partners__hero-media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-media-partners__hero-scrim {
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.95) 0%, rgba(10, 10, 11, 0.8) 44%, rgba(10, 10, 11, 0.25) 100%);
}

.gb3-media-partners__hero-copy {
  position: relative;
  width: 100%;
  padding: 54px var(--gb3-gutter);
}

.gb3-media-partners__hero-copy h1 {
  margin: 12px 0 16px;
  font-size: 58px;
  font-weight: 800;
  line-height: 0.96;
}

.gb3-media-partners__hero-copy p {
  max-width: 54ch;
  margin: 0 0 24px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 16px;
  line-height: 1.6;
}

.gb3-media-partners__hero-copy > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.gb3-media-partners__hero-copy > div a,
.gb3-media-partners__cta {
  padding: 14px 22px;
  background: var(--gb3-red);
  color: #fff;
  font: 700 11px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-media-partners__secondary {
  background: transparent !important;
  border: 1px solid rgba(245, 244, 244, 0.45);
  color: var(--gb3-ink-dark) !important;
}

/* --- media half, on the light band --- */
.gb3-media-partners__media {
  padding: 56px 0 64px;
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
  scroll-margin-top: var(--gb3-anchor-offset);
}

.gb3-media-partners__media > header,
.gb3-media-partners__partners > header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  padding: 0 var(--gb3-gutter);
}

.gb3-media-partners__media > header h2,
.gb3-media-partners__partners > header h2 {
  margin: 0;
  font-size: 38px;
  font-weight: 800;
}

.gb3-media-partners__media > header span,
.gb3-media-partners__partners > header span {
  color: var(--gb3-ink-light-meta);
  font: 700 10px var(--gb3-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-media-partners__partners > header span {
  color: var(--gb3-ink-dark-meta);
}

.gb3-media-partners__lead {
  max-width: 70ch;
  margin: 14px auto 30px;
  padding: 0 var(--gb3-gutter);
  color: var(--gb3-ink-light-body);
  font-size: 15px;
  line-height: 1.65;
}

.gb3-media-partners__partners .gb3-media-partners__lead {
  color: var(--gb3-ink-dark-secondary);
}

.gb3-media-partners__columns {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 40px;
  padding: 0 var(--gb3-gutter);
}

.gb3-media-partners__columns h3,
.gb3-media-partners__assets h3,
.gb3-media-partners__reach h3,
.gb3-media-partners__commercial h3 {
  margin: 0 0 16px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-media-partners__contact {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 18px 20px;
  margin-bottom: 10px;
  background: var(--gb3-light-band);
}

.gb3-media-partners__contact strong {
  font-size: 17px;
}

.gb3-media-partners__contact span {
  color: var(--gb3-ink-light-meta);
  font: 10px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-media-partners__contact a {
  color: var(--gb3-red-light);
  font-size: 14px;
  font-weight: 700;
}

.gb3-media-partners__step {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-media-partners__step b {
  color: var(--gb3-red-light);
  font: 700 13px var(--gb3-mono);
}

.gb3-media-partners__step span {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.gb3-media-partners__step strong {
  font-size: 15px;
}

.gb3-media-partners__step small {
  color: var(--gb3-ink-light-body);
  font-size: 13px;
  line-height: 1.55;
}

.gb3-media-partners__assets {
  margin-top: 34px;
  padding: 0 var(--gb3-gutter);
}

.gb3-media-partners__assets > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.gb3-media-partners__assets a {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 20px;
  border: 1px solid var(--gb3-line-light);
}

.gb3-media-partners__assets a:hover {
  border-color: var(--gb3-red);
}

.gb3-media-partners__assets strong {
  font-size: 15px;
}

.gb3-media-partners__assets small {
  color: var(--gb3-ink-light-body);
  font-size: 13px;
}

.gb3-media-partners__assets em {
  color: var(--gb3-ink-light-meta);
  font: 700 9px var(--gb3-mono);
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* --- partners half, on dark --- */
.gb3-media-partners__partners {
  padding: 56px 0 66px;
  background-color: var(--gb3-dark-band);
  color: var(--gb3-ink-dark);
  scroll-margin-top: var(--gb3-anchor-offset);
}

.gb3-media-partners__grid {
  display: grid;
  /* Five, not auto-fit: ten partners over six columns leaves an orphan row of four. */
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  padding: 0 var(--gb3-gutter);
  background: var(--gb3-line-dark);
}

.gb3-media-partners__partner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 24px 20px;
  background: var(--gb3-dark);
}

.gb3-media-partners__partner-mark {
  display: grid;
  width: 100%;
  min-height: var(--gb3-partner-mark);
  place-items: center;
  margin-bottom: 8px;
}

.gb3-media-partners__partner-mark img {
  max-width: 100%;
  /* Pixels, not a percentage. A percentage height on a CENTRED grid item has no definite grid area to
     resolve against and silently falls back to auto - both `max-height: 100%` and `height: 100%` did
     exactly that here, and every logo rendered at its natural size, spilling over the partner name.
     Capping the height also normalises ten logos whose proportions run from 1.23 to 1.76. */
  max-height: var(--gb3-partner-mark);
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center;
     object-position: center;
  /* The logos are a mix of full-colour and white-on-transparent, on a dark tile. */
  filter: brightness(0) invert(1);
  opacity: 0.82;
}

.gb3-media-partners__partner:hover .gb3-media-partners__partner-mark img {
  opacity: 1;
}

.gb3-media-partners__partner-mark b {
  color: var(--gb3-ink-dark);
  font-size: 17px;
  font-weight: 800;
}

.gb3-media-partners__partner strong {
  font-size: 15px;
}

.gb3-media-partners__partner small {
  color: var(--gb3-ink-dark-meta);
  font: 9px var(--gb3-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

a.gb3-media-partners__partner:hover strong {
  color: var(--gb3-red);
}

.gb3-media-partners__reach {
  margin-top: 34px;
  padding: 0 var(--gb3-gutter);
}

.gb3-media-partners__reach > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1px;
  background: var(--gb3-line-dark);
}

.gb3-media-partners__reach > div > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 22px 20px;
  background: var(--gb3-dark);
}

.gb3-media-partners__reach strong {
  font: 700 34px var(--gb3-mono);
}

.gb3-media-partners__reach span {
  color: var(--gb3-ink-dark-meta);
  font-size: 13px;
}

.gb3-media-partners__commercial {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
  gap: 34px;
  margin-top: 38px;
  padding: 34px var(--gb3-gutter) 0;
  border-top: 1px solid var(--gb3-line-dark);
}

.gb3-media-partners__commercial p {
  max-width: 56ch;
  margin: 0 0 20px;
  color: var(--gb3-ink-dark-secondary);
  font-size: 15px;
  line-height: 1.65;
}

.gb3-media-partners__commercial .gb3-media-partners__contact {
  background: var(--gb3-dark);
  border: 1px solid var(--gb3-line-dark);
}

.gb3-media-partners__commercial .gb3-media-partners__contact span {
  color: var(--gb3-ink-dark-meta);
}

.gb3-media-partners__commercial .gb3-media-partners__contact a {
  color: var(--gb3-ink-dark);
}

.gb3-media-partners__cta {
  display: inline-block;
}

@media screen and (max-width: 63.998em) {
  .gb3-media-partners__columns,
  .gb3-media-partners__commercial {
    grid-template-columns: minmax(0, 1fr);
  }
  .gb3-media-partners__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-media-partners__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-media-partners__hero {
    min-height: 360px;
  }
  .gb3-media-partners__hero-copy {
    padding: 32px 16px;
  }
  .gb3-media-partners__hero-copy h1 {
    font-size: 40px;
  }
  .gb3-media-partners__hero-scrim {
    background: linear-gradient(180deg, rgba(10, 10, 11, 0.6) 0%, rgba(10, 10, 11, 0.93) 62%);
  }
  .gb3-media-partners__media,
  .gb3-media-partners__partners {
    padding: 38px 0 44px;
  }
  .gb3-media-partners__media > header,
  .gb3-media-partners__partners > header,
  .gb3-media-partners__lead,
  .gb3-media-partners__columns,
  .gb3-media-partners__assets,
  .gb3-media-partners__grid,
  .gb3-media-partners__reach,
  .gb3-media-partners__commercial {
    padding-left: 16px;
    padding-right: 16px;
  }
  .gb3-media-partners__media > header h2,
  .gb3-media-partners__partners > header h2 {
    font-size: 28px;
  }
}
/* =============================================================================================
   Next-round countdown

   Sits inside the calendar band's featured round. Arrives hidden with placeholder digits and is
   only ever revealed by gb3-2026.js - see the comment on the markup for why a baked site cannot
   stamp the numbers in. [hidden] is honoured by the global reset, but this block sets display on
   the element, so it has to say so again.
   ============================================================================================= */
/* The panel this sits in is already brand red with white type, so the clock is cut INTO it -
   darkened cells and hairlines rather than the dark tiles the rest of the site uses, which would
   have read as black boxes dropped on the red. */
.gb3-calendar-feature__countdown {
  display: flex;
  gap: 1px;
  margin: 20px 0 2px;
  background: rgba(10, 10, 11, 0.26);
}

.gb3-calendar-feature__countdown[hidden] {
  display: none;
}

.gb3-calendar-feature__countdown > div {
  display: flex;
  min-width: 62px;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 10px 10px 9px;
  background: rgba(10, 10, 11, 0.2);
}

.gb3-calendar-feature__countdown strong {
  /* Tabular figures, or the whole row jitters once a second as the digits change width. */
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 24px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.gb3-calendar-feature__countdown small {
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--gb3-mono);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* =============================================================================================
   Top-bar socials

   Inline SVG, drawn in currentColor, so they inherit the utility bar's link colours and hover
   with everything else on the row. Sized in the box rather than on the svg so a network we do not
   recognise - which falls back to a link glyph - occupies exactly the same space.
   ============================================================================================= */
.gb3-social-link {
  gap: 0;
  padding: 0 2px;
}

.gb3-social-link svg {
  display: block;
  width: 17px;
  height: 17px;
}

@media screen and (max-width: 39.9375em) {
  /* The copy panel is a flex COLUMN with align-items: flex-start, so a row inside it shrinks to its
     content - four cells of 32px, which cramps both the two-digit figures and the word "Days".
     Stretching it to the panel gives flex: 1 1 0 something real to divide. */
  .gb3-calendar-feature__countdown {
    align-self: stretch;
  }
  .gb3-calendar-feature__countdown > div {
    min-width: 0;
    flex: 1 1 0;
    padding: 9px 4px 8px;
  }
  .gb3-calendar-feature__countdown strong {
    font-size: 20px;
  }
}
/* --- Race results ---------------------------------------------------------------------------------
   The results pages the season's Publish pages writes onto the GB3 site - the championship page's
   seasons, a page per season and one per session - and the latest results that head /results. The same
   pages as Motorsport News' results, drawn in the site's own furniture: the dark header band every
   interior page has, a white body, and the red / dark / bronze podium the standings already use. */
.gb3-race-results,
.gb3-results {
  background: var(--gb3-light);
  color: var(--gb3-ink-light);
}

.gb3-race-results__body,
.gb3-results__inner {
  width: min(100%, var(--gb3-shell));
  margin: 0 auto;
  padding: 40px var(--gb3-gutter) 96px;
}

.gb3-results-section__head h2,
.gb3-results-classification__head h2 {
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
}

.gb3-results-section__head {
  margin: 0 0 22px;
}

.gb3-results-empty,
.gb3-results__empty {
  margin: 0;
  color: var(--gb3-ink-light-meta);
}

/* The header band. The page template's own title hero stands down on the season and session pages
   (PageHasOwnHero), so this is the only one - same band, same type. */
.gb3-results-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark);
  color: var(--gb3-ink-dark);
}

.gb3-results-hero__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-results-hero__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.92), rgba(10, 10, 11, 0.62));
}

.gb3-results-hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100%, var(--gb3-shell));
  flex-direction: column;
  gap: 30px;
  margin: 0 auto;
  padding: 36px var(--gb3-gutter) 44px;
}

.gb3-results-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-results-crumbs li + li::before {
  margin-right: 8px;
  color: var(--gb3-ink-dark-tertiary);
  content: "/";
}

.gb3-results-crumbs a {
  color: var(--gb3-ink-dark-secondary);
}

.gb3-results-crumbs a:hover {
  color: var(--gb3-ink-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.gb3-results-crumbs [aria-current] {
  color: var(--gb3-ink-dark);
}

.gb3-results-hero__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
}

.gb3-results-hero__kicker {
  margin: 0 0 12px;
  color: var(--gb3-red);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results-hero h1 {
  margin: 0;
  color: var(--gb3-ink-dark);
  font-size: 56px;
  font-weight: 800;
  line-height: 0.96;
}

.gb3-results-hero__meta {
  margin: 14px 0 0;
  color: var(--gb3-ink-dark-secondary);
  font-size: 16px;
}

/* The circuit, beside the heading rather than under a 30-row table where nobody sees it. */
.gb3-results-circuit {
  display: grid;
  flex: 0 1 400px;
  grid-template-columns: 136px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--gb3-line-dark);
  background: var(--gb3-dark-tile);
}

.gb3-results-circuit img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 92px;
  -o-object-fit: cover;
     object-fit: cover;
}

.gb3-results-circuit > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 14px 18px;
}

.gb3-results-circuit small {
  color: var(--gb3-ink-dark-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results-circuit strong {
  font-size: 18px;
  line-height: 1.15;
}

.gb3-results-circuit em {
  color: var(--gb3-ink-dark-secondary);
  font-size: 13px;
  font-style: normal;
}

/* Previous / every round / next. */
.gb3-results-rounds {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
  margin: 0 0 40px;
  border: 1px solid var(--gb3-line-light);
}

.gb3-results-rounds__step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: background 130ms linear;
}

.gb3-results-rounds__step.is-next {
  justify-content: flex-end;
}

a.gb3-results-rounds__step:hover {
  background: var(--gb3-light-band);
}

.gb3-results-rounds__picker {
  position: relative;
  border-right: 1px solid var(--gb3-line-light);
  border-left: 1px solid var(--gb3-line-light);
}

.gb3-results-rounds__picker summary {
  display: flex;
  box-sizing: border-box;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 10px 40px;
  cursor: pointer;
  list-style: none;
  text-align: center;
}

.gb3-results-rounds__picker summary::-webkit-details-marker {
  display: none;
}

.gb3-results-rounds__picker summary::after {
  position: absolute;
  top: 50%;
  right: 18px;
  color: var(--gb3-ink-light-meta);
  content: "▾";
  transform: translateY(-50%);
}

.gb3-results-rounds__picker[open] summary::after {
  content: "▴";
}

.gb3-results-rounds__picker summary:hover,
.gb3-results-rounds__picker[open] summary {
  background: var(--gb3-light-band);
}

.gb3-results-rounds__picker summary:focus {
  outline: none;
}

.gb3-results-rounds__picker summary:focus-visible {
  outline: 2px solid var(--gb3-red-light);
  outline-offset: -2px;
}

.gb3-results-rounds__picker summary small {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results-rounds__picker summary span {
  font-size: 16px;
  font-weight: 700;
}

.gb3-results-rounds__menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 1px);
  right: -1px;
  left: -1px;
  max-height: 420px;
  padding: 6px 0;
  overflow-y: auto;
  border: 1px solid var(--gb3-line-light);
  background: var(--gb3-light);
  box-shadow: 0 18px 40px rgba(10, 10, 11, 0.16);
}

.gb3-results-rounds__picker ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-results-rounds__group + .gb3-results-rounds__group {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--gb3-line-light);
}

.gb3-results-rounds__group > p {
  margin: 0;
  padding: 10px 18px 6px 21px;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results-rounds__picker li > a,
.gb3-results-rounds__picker li > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 18px;
  border-left: 3px solid transparent;
  color: var(--gb3-ink-light);
  font-size: 15px;
}

.gb3-results-rounds__picker li > a:hover {
  background: var(--gb3-light-band);
}

.gb3-results-rounds__picker li > .is-active {
  border-left-color: var(--gb3-red);
  background: var(--gb3-light-band);
  font-weight: 700;
}

.gb3-results-rounds__picker li small {
  flex: none;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
}

/* The round's sessions, one boxed tab each. A GB3 weekend runs to eleven sessions (three tests, three
   practices, two qualifyings, three races), more than one row holds - so they WRAP on a desktop, where a
   sideways scroll hides half of them behind a scrollbar, and scroll only on a phone, where a wrapped block
   would push the classification off the first screen. The phone scroll hides its bar; arrows either side
   and a fade on whichever edge has more say there is more. The arrows sit BESIDE the row, not over it, so
   they never cover a tab. */
.gb3-results-sessions-wrap {
  margin: 0 0 34px;
}

.gb3-results-sessions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.gb3-results-sessions > a,
.gb3-results-sessions > span {
  flex: none;
  padding: 12px 18px 10px;
  border: 1px solid var(--gb3-line-light);
  border-bottom: 3px solid var(--gb3-line-light);
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.gb3-results-sessions > a:hover {
  border-color: var(--gb3-ink-light-meta);
  color: var(--gb3-ink-light);
}

.gb3-results-sessions > .is-active {
  border-color: var(--gb3-ink-light);
  border-bottom-color: var(--gb3-red);
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
}

/* Desktop wraps, so there is never anything to scroll to - hidden here as well as by the script, so they
   cannot flash in while it measures. */
.gb3-results-sessions__nav {
  display: none;
}

@media screen and (max-width: 39.9375em) {
  .gb3-results-rounds {
    margin-bottom: 28px;
  }
  .gb3-results-sessions-wrap {
    display: flex;
    align-items: stretch;
    gap: 6px;
  }
  .gb3-results-sessions {
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent);
            mask-image: linear-gradient(to right, #000 calc(100% - 40px), transparent);
  }
  .gb3-results-sessions::-webkit-scrollbar {
    display: none;
  }
  .gb3-results-sessions > a,
  .gb3-results-sessions > span {
    scroll-snap-align: start;
  }
  .gb3-results-sessions-wrap.is-enhanced .gb3-results-sessions {
    -webkit-mask-image: none;
            mask-image: none;
  }
  .gb3-results-sessions-wrap.can-scroll-next .gb3-results-sessions {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
  }
  .gb3-results-sessions-wrap.can-scroll-prev .gb3-results-sessions {
    -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(to left, #000 calc(100% - 28px), transparent);
  }
  .gb3-results-sessions-wrap.can-scroll-prev.can-scroll-next .gb3-results-sessions {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 28px, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(to right, transparent, #000 28px, #000 calc(100% - 28px), transparent);
  }
  .gb3-results-sessions__nav {
    display: flex;
    flex: none;
    width: 40px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--gb3-ink-light);
    background: #fff;
    color: var(--gb3-ink-light);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
  }
  .gb3-results-sessions__nav[hidden] {
    display: none;
  }
  .gb3-results-sessions__nav:hover:not(:disabled) {
    border-color: var(--gb3-red);
    background: var(--gb3-red);
    color: #fff;
  }
  .gb3-results-sessions__nav:disabled {
    cursor: default;
    opacity: 0.25;
  }
  .gb3-results-sessions__nav::before {
    width: 9px;
    height: 9px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    content: "";
  }
  .gb3-results-sessions__nav--prev::before {
    margin-left: 3px;
    transform: rotate(-135deg);
  }
  .gb3-results-sessions__nav--next::before {
    margin-right: 3px;
    transform: rotate(45deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .gb3-results-sessions > a,
  .gb3-results-sessions__nav {
    transition: none;
  }
}
.gb3-results-classification__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  margin: 0 0 20px;
}

.gb3-results-provisional {
  margin: 0;
  padding: 6px 10px;
  border: 1px solid var(--gb3-red-light);
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* The classification. */
.gb3-results-classification {
  overflow-x: auto;
}

.gb3-results-classification table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}

.gb3-results-classification thead th {
  padding: 10px 12px;
  border-bottom: 2px solid var(--gb3-ink-light);
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.gb3-results-classification tbody td,
.gb3-results-classification tbody th {
  padding: 11px 12px;
  border-bottom: 1px solid var(--gb3-line-light-soft);
  text-align: left;
  vertical-align: middle;
}

.gb3-results-classification tbody tr:hover {
  background: var(--gb3-light-band);
}

.gb3-results-classification .is-pos {
  width: 64px;
}

.gb3-results-classification .is-pos b,
.gb3-results__race li > b {
  display: inline-grid;
  min-width: 34px;
  height: 28px;
  padding: 0 4px;
  box-sizing: border-box;
  place-items: center;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
  font-family: var(--gb3-mono);
  font-size: 13px;
  font-weight: 700;
}

.gb3-results-classification tbody tr:hover .is-pos b {
  background: var(--gb3-light);
}

.gb3-results-classification .is-first .is-pos b,
.gb3-results__race li.is-first > b {
  background: var(--gb3-red-light);
  color: #fff;
}

.gb3-results-classification .is-second .is-pos b,
.gb3-results__race li.is-second > b {
  background: #242427;
  color: #fff;
}

.gb3-results-classification .is-third .is-pos b,
.gb3-results__race li.is-third > b {
  background: var(--gb3-bronze-light);
  color: #fff;
}

.gb3-results-classification .is-num {
  width: 56px;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 13px;
}

.gb3-results-classification tbody .is-driver {
  font-weight: 700;
}

/* The team under the name - only on a phone, where the team column is dropped. */
.gb3-results-classification .is-driver small {
  display: none;
}

.gb3-results-classification .is-team,
.gb3-results-classification .is-class {
  color: var(--gb3-ink-light-body);
}

.gb3-results-classification .is-time,
.gb3-results-classification .is-laps {
  font-family: var(--gb3-mono);
  font-size: 13px;
  text-align: right;
  white-space: nowrap;
}

.gb3-results-classification thead .is-time,
.gb3-results-classification thead .is-laps {
  text-align: right;
}

.gb3-results-classification .is-laps {
  width: 64px;
  color: var(--gb3-ink-light-meta);
}

.gb3-results-notes {
  margin: 32px 0 0;
  padding: 20px 24px;
  background: var(--gb3-light-band);
}

.gb3-results-notes h2 {
  margin: 0 0 8px;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results-notes p {
  margin: 4px 0 0;
  color: var(--gb3-ink-light-body);
  font-size: 14px;
  line-height: 1.5;
}

/* A season: a tile per round with results, the latest first. */
.gb3-results-round-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-results-round {
  display: flex;
  height: 100%;
  flex-direction: column;
  border-top: 3px solid transparent;
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
  transition: border-color 130ms linear, background 130ms linear;
}

.gb3-results-round:hover {
  border-top-color: var(--gb3-red);
  background: var(--gb3-light-hover);
}

.gb3-results-round__image {
  display: block;
  overflow: hidden;
  aspect-ratio: 16/9;
  background: var(--gb3-dark-tile);
}

.gb3-results-round__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 300ms ease;
}

.gb3-results-round:hover .gb3-results-round__image img {
  transform: scale(1.03);
}

.gb3-results-round__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  padding: 18px 20px 20px;
}

.gb3-results-round__body small {
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-results-round__body strong {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
}

.gb3-results-round__body em {
  color: var(--gb3-ink-light-meta);
  font-size: 14px;
  font-style: normal;
}

.gb3-results-round__cta {
  margin-top: auto;
  padding-top: 16px;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* The championship page's seasons. Below the latest results, so less space above than a page top. */
.gb3-race-results--championship .gb3-race-results__body {
  padding-top: 24px;
}

.gb3-results-seasons {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-results-seasons a {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px 24px 24px;
  border-top: 3px solid var(--gb3-red);
  background: var(--gb3-light-band);
  color: var(--gb3-ink-light);
  transition: background 130ms linear;
}

.gb3-results-seasons a:hover {
  background: var(--gb3-light-hover);
}

.gb3-results-seasons strong {
  font-size: 44px;
  font-weight: 800;
  line-height: 1;
}

.gb3-results-seasons a > span {
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* The latest round, heading /results: the round on the left with the way into its pages, and its races'
   top finishers side by side. */
.gb3-results__inner {
  padding-bottom: 24px;
}

.gb3-results__card {
  background: var(--gb3-light-band);
}

.gb3-results__card + .gb3-results__card {
  margin-top: 16px;
}

.gb3-results__card > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  -moz-column-gap: 24px;
       column-gap: 24px;
  padding: 24px 24px 22px;
  border-bottom: 1px solid var(--gb3-line-light);
}

.gb3-results__card > header > * {
  grid-column: 1;
}

.gb3-results__card > header p {
  margin: 0 0 8px;
  color: var(--gb3-red-light);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gb3-results__card > header h3 {
  margin: 0;
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
}

.gb3-results__card > header span {
  margin-top: 8px;
  color: var(--gb3-ink-light-meta);
  font-size: 15px;
}

.gb3-results__card > header .gb3-results__link {
  grid-column: 2;
  grid-row: 1/span 3;
}

.gb3-results__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  background: var(--gb3-ink-light);
  color: #fff;
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.gb3-results__link:hover {
  background: var(--gb3-red-light);
  color: #fff;
}

.gb3-results__races {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.gb3-results__race {
  min-width: 0;
  padding: 18px 24px 22px;
}

.gb3-results__race + .gb3-results__race {
  border-left: 1px solid var(--gb3-line-light);
}

.gb3-results__race h4 {
  margin: 0 0 10px;
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.gb3-results__race ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.gb3-results__race li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 7px 0;
  border-top: 1px solid var(--gb3-line-light-soft);
  font-size: 14px;
}

.gb3-results__race li > b {
  min-width: 30px;
  height: 24px;
  background: var(--gb3-light);
  font-size: 12px;
}

.gb3-results__race li > span {
  overflow: hidden;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gb3-results__race li > em {
  color: var(--gb3-ink-light-meta);
  font-family: var(--gb3-mono);
  font-size: 12px;
  font-style: normal;
}

@media screen and (max-width: 63.998em) {
  .gb3-results-hero__row {
    flex-direction: column;
    align-items: stretch;
  }
  .gb3-results-circuit {
    flex-basis: auto;
    max-width: 480px;
  }
  .gb3-results-round-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .gb3-results__race + .gb3-results__race {
    border-left: 0;
    border-top: 1px solid var(--gb3-line-light);
  }
}
@media screen and (max-width: 39.9375em) {
  .gb3-race-results__body,
  .gb3-results__inner {
    padding: 28px 16px 64px;
  }
  .gb3-results__inner {
    padding-bottom: 16px;
  }
  .gb3-results-hero__inner {
    gap: 22px;
    padding: 26px 16px 32px;
  }
  .gb3-results-hero h1 {
    font-size: 40px;
  }
  .gb3-results-section__head h2,
  .gb3-results-classification__head h2 {
    font-size: 28px;
  }
  .gb3-results-circuit {
    grid-template-columns: 104px minmax(0, 1fr);
  }
  /* Arrows only either side of the round picker; the words stay for screen readers. */
  .gb3-results-rounds {
    grid-template-columns: 52px minmax(0, 1fr) 52px;
  }
  .gb3-results-rounds__step {
    justify-content: center;
    padding: 12px 0;
    font-size: 16px;
  }
  .gb3-results-rounds__step.is-next {
    justify-content: center;
  }
  .gb3-results-rounds__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .gb3-results-rounds__picker summary {
    padding: 10px 30px 10px 14px;
  }
  .gb3-results-rounds__picker summary::after {
    right: 12px;
  }
  .gb3-results-rounds__menu {
    right: -53px;
    left: -53px;
  }
  /* Position, driver (with the team beneath) and time: the rest is dropped rather than squeezed. */
  .gb3-results-classification table {
    font-size: 14px;
  }
  .gb3-results-classification thead th,
  .gb3-results-classification tbody td,
  .gb3-results-classification tbody th {
    padding-right: 8px;
    padding-left: 8px;
  }
  .gb3-results-classification .is-num,
  .gb3-results-classification .is-team,
  .gb3-results-classification .is-class,
  .gb3-results-classification .is-laps {
    display: none;
  }
  .gb3-results-classification .is-pos {
    width: 48px;
  }
  .gb3-results-classification .is-driver small {
    display: block;
    margin-top: 2px;
    color: var(--gb3-ink-light-meta);
    font-size: 12px;
    font-weight: 400;
  }
  .gb3-results-round-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .gb3-results__card > header {
    grid-template-columns: minmax(0, 1fr);
    padding: 20px 18px;
  }
  .gb3-results__card > header .gb3-results__link {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    margin-top: 16px;
  }
  .gb3-results__race {
    padding: 16px 18px 20px;
  }
}