/* ==========================================================================
   Hills Run Club v7: the Stripe-measured layer.

   Every size, weight, radius, margin and duration below was read off
   stripe.com/au (Chromium, 1440 and 390 wide, 21 Sep 2026) and mapped onto
   the HRC palette and Inter. It loads after v6.css and v6-site.css on every
   coded page, the homepage included, and re-declares only what changes.

   Stripe, measured                          HRC v7
   ─────────────────────────────────────────────────────────────────────────
   content column 1232 @1440 (104 margins)   1256 @1440 (92: the header's)
   h1 48/1.15 -0.02em                         .v6-display 48, hero 56/1.03
   large statement 56/1.03 -0.025em           .v6-h1.is-display 56
   h2 32/1.10 -0.02em, grey qualifier same    .v6-h2 32 + .qual
   h3 26/1.12 -0.01em                         .v6-h3 26
   card title 22/1.10 -0.01em                 .v6-card__title 22
   lead 18/1.4 · body 16/1.4 · small 14        .v6-lead 18 · body 16/1.5 · 14
   label 12/24 500                            .v6-label 12
   button 48 · 4px · 0 24 · 16                .v6-btn
   small button 40 · 4px · 0 20 · 14          .v6-btn.is-sm
   ghost: white 65%, 1px tint border, brand   .v6-btn.is-ghost
   link 16/400 brand + 5×8 arrow              .v6-quiet
   card radius 6, 1px light border            .v6-card 8 (7 inner)
   section 88 top / 88 bottom                 .v6-page-sec
   header 76                                  (the live header stays)
   colour .3s cubic-bezier(.25,1,.5,1)        --dur-action / --ease-action
   mobile: h1 34, h2 22, h3 20, margins 16
   ========================================================================== */

/* ── tokens ─────────────────────────────────────────────────────────────── */
:root {
  --font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --measure-article: 50rem; /* the newsroom article: photographs and quotes sit in the measure */
  --measure-text: 45rem;    /* plain reading: a dialog's story, legal pages */
  --container: 1256px;
  --margin: 92px;
  --gutter: 24px;
  --radius-action: 4px;
  --radius-chip: 4px;
  --radius-card: 8px;
  /* Stripe's reveal curve, measured off their customers card. Nicholas's call, 21 Sep. */
  --ease-reveal: cubic-bezier(.7, 0, 0, 1);
  --radius-inner: 7px;
  --section: 88px;
  --stack: 48px;
  --fs-display: 56px; --lh-display: 1.03; --ls-display: -.025em;
  --fs-h1: 48px;      --lh-h1: 1.15;      --ls-h1: -.02em;
  --fs-h2: 32px;      --lh-h2: 1.10;      --ls-h2: -.02em;
  --fs-h3: 26px;      --lh-h3: 1.12;      --ls-h3: -.01em;
  --fs-card: 22px;    --lh-card: 1.10;    --ls-card: -.01em;
  --fs-lead: 18px;    --lh-lead: 1.40;
  --fs-body: 16px;    --lh-body: 1.50;
  --fs-small: 14px;   --lh-small: 1.40;
  --fs-label: 12px;
  --w-heading: 400;
  --w-title: 400;
  --w-ui: 500;
  --orange-ghost-line: #F7C6B7;
}
/* site.css (v4) still sets the column on body, so the column is set there too */
body.hrc-coded, body.hrc-coded:not(.hrc-coded-home) { --container: 1256px; --margin: 92px; --section: 88px; }
.v6-wrap { width: min(var(--container), 100% - var(--margin) * 2); }
@media (max-width: 1180px) { :root, body.hrc-coded, body.hrc-coded:not(.hrc-coded-home) { --margin: 64px; } .v6-wrap { --margin: 64px; } }
@media (max-width: 860px)  { :root, body.hrc-coded, body.hrc-coded:not(.hrc-coded-home) { --margin: 40px; } .v6-wrap { --margin: 40px; } }
@media (max-width: 720px)  { :root, body.hrc-coded, body.hrc-coded:not(.hrc-coded-home) { --margin: 24px; --section: 64px; --stack: 32px; } .v6-wrap { --margin: 24px; } }
@media (max-width: 480px)  { :root, body.hrc-coded, body.hrc-coded:not(.hrc-coded-home) { --margin: 16px; } .v6-wrap { --margin: 16px; } }

/* One column. Every band carries its content in a .v6-wrap, so the band
   itself has no inline padding: that is what put inner pages 72px narrower
   than the homepage. */
body.hrc-coded .v6-page-sec, body.hrc-coded .v6-page-hero, body.hrc-coded .v6-auth, body.hrc-coded .v6-plus-hero,
body.hrc-coded .v6-footer, body.hrc-coded .hrc-native-page, body.hrc-coded .hrc-news-article, body.hrc-coded .hrc-archive,
body.hrc-coded .hrc-not-found, body.hrc-coded .hrc-commerce-page, body.hrc-coded .v6-reelband, body.hrc-coded .v6-dash__hero,
body.hrc-coded .v6-member__headsec, body.hrc-coded .v6-membernav, body.hrc-coded .v6-albumrail { padding-inline: 0; }

/* ── type ───────────────────────────────────────────────────────────────── */
body.hrc-coded { font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body.hrc-coded .v6-display, body.hrc-coded .v6-page-hero .v6-display, body.hrc-coded .v6-h1 {
  font: var(--w-heading) var(--fs-h1)/var(--lh-h1) var(--font-sans); letter-spacing: var(--ls-h1); text-wrap: balance; }
body.hrc-coded .v6-display.is-hero, body.hrc-coded .hrc-v6-home .v6-hero .v6-display, body.hrc-coded .v6-dash__title, body.hrc-coded .v6-plus-hero .v6-display {
  font: var(--w-heading) var(--fs-display)/var(--lh-display) var(--font-sans); letter-spacing: var(--ls-display); }
body.hrc-coded .v6-h2, body.hrc-coded .v6-member__title, body.hrc-coded .v6-auth__panel-in .v6-h2 {
  font: var(--w-heading) var(--fs-h2)/var(--lh-h2) var(--font-sans); letter-spacing: var(--ls-h2); max-width: 26em; text-wrap: balance; }
body.hrc-coded .v6-h2 .qual { color: var(--on-surface-2); font-weight: inherit; }
body.hrc-coded .v6-h2.is-statement { font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--ls-h1); }
body.hrc-coded .v6-h3 { font: var(--w-heading) var(--fs-h3)/var(--lh-h3) var(--font-sans); letter-spacing: var(--ls-h3); }
body.hrc-coded .v6-card__title, body.hrc-coded .v6-perk .v6-card__title, body.hrc-coded .v6-dash__tile .v6-card__title, body.hrc-coded .v6-partner__name,
body.hrc-coded .v6-row__title, body.hrc-coded .v6-dash__next-title, body.hrc-coded .v6-feature .v6-card__title {
  font: var(--w-title) var(--fs-card)/var(--lh-card) var(--font-sans); letter-spacing: var(--ls-card); }
body.hrc-coded .v6-lead, body.hrc-coded .v6-prose.is-lead, body.hrc-coded .v6-member__sub, body.hrc-coded .v6-dash__lead, body.hrc-coded .v6-auth__panel-in .v6-lead {
  font: 400 var(--fs-lead)/var(--lh-lead) var(--font-sans); letter-spacing: 0; }
body.hrc-coded .v6-body, body.hrc-coded .v6-prose, body.hrc-coded .v6-prose p, body.hrc-coded .v6-prose li, body.hrc-coded .v6-card__pad > .v6-prose, body.hrc-coded .v6-dl, body.hrc-coded .v6-perk-card__dl {
  font-size: var(--fs-body); line-height: var(--lh-body); }
body.hrc-coded .v6-small, body.hrc-coded .v6-row__meta span, body.hrc-coded .v6-chip, body.hrc-coded .v6-tally__row, body.hrc-coded .v6-hero__next, body.hrc-coded .v6-dash__next-meta, body.hrc-coded .v6-partner__event {
  font-size: var(--fs-small); line-height: var(--lh-small); letter-spacing: 0; }
body.hrc-coded .v6-series, body.hrc-coded .v6-eyebrow, body.hrc-coded .hrc-run-type { font: var(--w-ui) var(--fs-small)/var(--lh-small) var(--font-sans); letter-spacing: 0; text-transform: none; }
body.hrc-coded .v6-label { font: var(--w-ui) var(--fs-label)/1.4 var(--font-sans); letter-spacing: .04em; }
body.hrc-coded .v6-stat__figure { font: 400 48px/1 var(--font-sans); letter-spacing: -.02em; }
body.hrc-coded .v6-plusmark { font-weight: 900; }

/* Copy widths, so a paragraph never runs past a comfortable measure */
body.hrc-coded .v6-prose { max-width: 60ch; }
body.hrc-coded .v6-split .v6-prose, body.hrc-coded .v6-split .v6-prose p { font-size: var(--fs-lead); line-height: 1.5; }
body.hrc-coded .v6-lead { max-width: 42em; }

/* ── actions ────────────────────────────────────────────────────────────── */
body.hrc-coded .v6-btn, body.hrc-coded .hrc-native-content .button, body.hrc-coded .um .um-button {
  height: 48px; padding: 0 24px; border-radius: var(--radius-action) !important;
  font: var(--w-ui) 16px/1 var(--font-sans); letter-spacing: 0; gap: 8px;
  transition: background-color var(--dur-action) var(--ease-action), color var(--dur-action) var(--ease-action), border-color var(--dur-action) var(--ease-action), box-shadow var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-btn.is-sm { height: 40px; padding: 0 20px; font-size: 14px; }
body.hrc-coded .v6-btn.is-primary { background: var(--orange); border-color: var(--orange); color: #fff; }
body.hrc-coded .v6-btn.is-primary:hover { background: var(--orange-press); border-color: var(--orange-press); }
body.hrc-coded .v6-btn.is-ghost { background: rgba(255,255,255,.65); border-color: var(--orange-ghost-line); color: var(--orange-type-aa); }
body.hrc-coded .v6-btn.is-ghost:hover { background: var(--orange-tint); border-color: var(--orange-tint); color: var(--orange-type-aa); }
body.hrc-coded .v6-band-ink .v6-btn.is-ghost, body.hrc-coded .v6-page-hero .v6-btn.is-ghost, body.hrc-coded .v6-plus-hero .v6-btn.is-ghost, body.hrc-coded .v6-dash__hero .v6-btn.is-ghost {
  background: #fff; border-color: #fff; color: var(--orange-type-aa); }
body.hrc-coded .v6-band-ink .v6-btn.is-ghost:hover, body.hrc-coded .v6-page-hero .v6-btn.is-ghost:hover { background: var(--orange-tint); border-color: var(--orange-tint); color: var(--orange-type-aa); }
body.hrc-coded .v6-btn .v6-chev { width: 10px; height: 10px; }
body.hrc-coded .v6-quiet { font: 400 16px/1.2 var(--font-sans); letter-spacing: 0; gap: 6px; color: var(--orange-type-aa); }
body.hrc-coded .v6-band-ink .v6-quiet, body.hrc-coded .v6-page-hero .v6-quiet { color: var(--orange-on-ink); }
body.hrc-coded .v6-quiet.is-sm { font-size: 14px; }
body.hrc-coded .v6-quiet .v6-chev { width: 10px; height: 10px; transition: transform var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-quiet:hover .v6-chev { transform: translateX(3px); }
body.hrc-coded .v6-quiet:hover { text-decoration: none; }
body.hrc-coded .v6-ico, body.hrc-coded .v6-run { border-radius: var(--radius-chip); }
body.hrc-coded .v6-chip { height: 32px; border-radius: var(--radius-chip); }

/* ── the card ───────────────────────────────────────────────────────────── */
body.hrc-coded .v6-card, body.hrc-coded .v6-card__bloom { border-radius: var(--radius-card); }
body.hrc-coded .v6-card__inner { border-radius: var(--radius-inner); }
body.hrc-coded .v6-card__pad { padding: 24px; }
body.hrc-coded .v6-card__pad > * + * { margin-top: 10px; }
body.hrc-coded .v6-card__pad > .v6-series + .v6-card__top { margin-top: 8px; }
body.hrc-coded .v6-card__pad > .v6-quiet, body.hrc-coded .v6-card__pad > .v6-btn, body.hrc-coded .v6-card__pad > .v6-perk-card__act, body.hrc-coded .v6-card__pad > .v6-card__actions { margin-top: 18px; }
/* the action group: one row, --stack-tight between the buttons, wrapping on a phone */
body.hrc-coded .v6-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--stack-tight, 12px); }
body.hrc-coded .v6-photo, body.hrc-coded .v6-shot, body.hrc-coded .v6-gallery__item, body.hrc-coded .v6-member__panel, body.hrc-coded .v6-auth__card, body.hrc-coded .v6-dash__next { border-radius: var(--radius-card); }
body.hrc-coded .v6-perks__grid { align-items: start; }

/* ── rhythm ─────────────────────────────────────────────────────────────── */
body.hrc-coded .v6-page-sec { padding-block: var(--section); }
body.hrc-coded .v6-page-sec.v6-band-ink { padding-block: var(--section); }
body.hrc-coded .v6-page-sec.v6-band-paper + .v6-page-sec.v6-band-paper > .v6-wrap { padding-top: var(--section); }
body.hrc-coded .v6-page-sec > .v6-wrap > * + * { margin-top: 24px; }
body.hrc-coded .v6-page-sec > .v6-wrap > .v6-h2 + *, body.hrc-coded .v6-page-sec > .v6-wrap > .v6-sechead + * { margin-top: var(--stack); }
body.hrc-coded .v6-page-sec > .v6-wrap > .v6-h2 + .v6-prose.is-lead, body.hrc-coded .v6-page-sec > .v6-wrap > .v6-h2 + .v6-lead { margin-top: 16px; }
body.hrc-coded .v6-page-sec > .v6-wrap > .v6-btn { margin-top: 32px; }
body.hrc-coded .v6-cards { gap: var(--gutter); }
body.hrc-coded .v6-split { gap: 64px; align-items: center; }
body.hrc-coded .v6-split__media .v6-photo { aspect-ratio: 4 / 3; max-width: none; height: auto; }
body.hrc-coded .v6-split__media .v6-photo.is-tall { aspect-ratio: 4 / 3; max-width: none; margin: 0; }
body.hrc-coded .v6-split__media .v6-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.hrc-coded .v6-page-hero { min-height: 520px; padding-block: 140px 72px; }
body.hrc-coded .v6-page-hero__wrap { gap: 16px; }
body.hrc-coded .v6-page-hero .v6-lead { font-size: var(--fs-lead); max-width: 38em; }
body.hrc-coded .v6-statement { padding-block: 120px; }
body.hrc-coded .v6-tabs__tab { font: var(--w-ui) 16px/1.2 var(--font-sans); }
body.hrc-coded .v6-membernav__link { font: var(--w-ui) 15px/1 var(--font-sans); }
body.hrc-coded .v6-acc__q { font: var(--w-title) 18px/1.35 var(--font-sans); letter-spacing: 0; }
body.hrc-coded .v6-dl > div { padding: 12px 0; }
body.hrc-coded .v6-dl dt { width: 120px; }
body.hrc-coded .v6-input, body.hrc-coded .v6-um .um input[type=text], body.hrc-coded .v6-um .um input[type=email], body.hrc-coded .v6-um .um input[type=password], body.hrc-coded .v6-auth .um input[type=text], body.hrc-coded .v6-auth .um input[type=password] {
  height: 44px !important; border-radius: var(--radius-action) !important; font-size: 16px !important; }

/* ── the footer ─────────────────────────────────────────────────────────── */
body.hrc-coded .v6-footer__hd { font: var(--w-ui) 14px/1.4 var(--font-sans); letter-spacing: 0; }
body.hrc-coded .v6-footer__col a, body.hrc-coded .v6-footer__col li { font: 400 15px/1.4 var(--font-sans); }
body.hrc-coded .v6-footer__legal, body.hrc-coded .v6-footer__legal a { font-size: 13px; }

/* ── the homepage, on the same scale ────────────────────────────────────── */
body.hrc-coded-home .hrc-v6-home .v6-hero__wrap { bottom: 72px; }
body.hrc-coded-home .hrc-v6-home .v6-hero__actions { margin-top: 32px; }
body.hrc-coded-home .hrc-v6-home .v6-card__top { padding: 24px 24px 0; }
body.hrc-coded-home .hrc-v6-home .v6-facts { padding-top: 32px; }
body.hrc-coded-home .hrc-v6-home .v6-facts .v6-h3 { font-size: 18px; line-height: 1.3; font-weight: var(--w-ui); }
body.hrc-coded-home .hrc-v6-home .v6-row { min-height: 88px; }
body.hrc-coded-home .hrc-v6-home .v6-reel__caption .v6-h3 { font-size: 20px; }
body.hrc-coded-home .hrc-v6-home .v6-plus__item { font-size: var(--fs-body); }
body.hrc-coded-home .hrc-v6-home .s-promise { padding-bottom: var(--section); }
body.hrc-coded-home .hrc-v6-home .s-next, body.hrc-coded-home .hrc-v6-home .s-featured, body.hrc-coded-home .hrc-v6-home .s-tally, body.hrc-coded-home .hrc-v6-home .s-ways { padding-bottom: var(--section); }
body.hrc-coded-home .hrc-v6-home .s-story, body.hrc-coded-home .hrc-v6-home .s-community { padding-block: var(--section); }
body.hrc-coded-home .hrc-v6-home .s-plus { padding-top: var(--section); }

/* ── phones ─────────────────────────────────────────────────────────────── */
@media (max-width: 1180px) {
  :root { --fs-display: 48px; --fs-h1: 42px; --fs-h2: 30px; --fs-h3: 24px; }
}
@media (max-width: 720px) {
  :root { --fs-display: 40px; --lh-display: 1.05; --fs-h1: 34px; --lh-h1: 1.03; --fs-h2: 22px; --lh-h2: 1.2; --ls-h2: -.01em; --fs-h3: 20px; --lh-h3: 1.2; --fs-card: 18px; --lh-card: 1.2; --fs-lead: 17px; }
  body.hrc-coded .v6-stat__figure { font-size: 40px; }
  body.hrc-coded .v6-page-hero { min-height: 440px; padding-block: 120px 56px; }
  body.hrc-coded .v6-split { gap: 32px; }
  body.hrc-coded .v6-split .v6-prose, body.hrc-coded .v6-split .v6-prose p { font-size: var(--fs-body); }
  body.hrc-coded .v6-card__pad { padding: 20px; }
  body.hrc-coded-home .hrc-v6-home .v6-card__top { padding: 20px 20px 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-quiet .v6-chev { transition: none; }
}

/* An event with no photograph yet: the ink well carries a quiet mark */

/* ── home hero roll ──────────────────────────────────────────────────────────
   The photographs behind the opening take turns: each holds six seconds,
   the next fades in over it across 1.6s, and every frame drifts a little
   the whole time it is up, so nothing ever sits still or jumps. Under
   reduced motion the first photograph stays, still. */
body.hrc-coded .v6-hero__roll { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--ink); }
body.hrc-coded .v6-hero__roll .v6-hero__media {
  opacity: 0; transition: opacity 1600ms ease-in-out; will-change: opacity, transform;
  transform: scale(1.04); transform-origin: var(--kb-o, 50% 50%); backface-visibility: hidden; }
body.hrc-coded .v6-hero__roll .v6-hero__media.is-on {
  opacity: 1; animation: v6-hero-drift var(--kb-t, 7600ms) linear forwards; }
@keyframes v6-hero-drift {
  from { transform: scale(1.04) translate3d(0, 0, 0); }
  to   { transform: scale(1.12) translate3d(var(--kb-x, -1.4%), var(--kb-y, 0.8%), 0); }
}
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-hero__roll .v6-hero__media { transition: none; animation: none; transform: none; }
}

/* ── hero: corner-split (Meta-reference placement, HRC scale) ───────────── */
body.hrc-coded .v6-hero.is-split .v6-hero__wrap {
  top: 0; bottom: 0; height: 100%;
  display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto 1fr auto;
  padding-block: 64px 56px; }
body.hrc-coded .v6-hero.is-split .v6-hero__title { display: contents; }
body.hrc-coded .v6-hero.is-split .v6-hero__word {
  display: block; margin: 0; color: var(--paper);
  font: var(--w-heading) var(--fs-display)/1 var(--font-sans); letter-spacing: var(--ls-display); }
body.hrc-coded .v6-hero.is-split .v6-hero__word.is-tl { grid-row: 1; grid-column: 1; justify-self: start; align-self: start; }
body.hrc-coded .v6-hero.is-split .v6-hero__word.is-br { grid-row: 3; grid-column: 2; justify-self: end; align-self: end; text-align: right; }
body.hrc-coded .v6-hero.is-split .v6-hero__lede { grid-row: 3; grid-column: 1; align-self: end; max-width: 42ch; }
body.hrc-coded .v6-hero.is-split .v6-hero__copy { margin: 0; color: var(--paper); font: 400 var(--fs-lead)/1.4 var(--font-sans); }
body.hrc-coded .v6-hero.is-split .v6-hero__actions { margin-top: 24px; }
body.hrc-coded .v6-hero .v6-btn.is-ghost { background: #fff; border-color: #fff; color: var(--orange-type-aa); }
body.hrc-coded .v6-hero .v6-btn.is-ghost:hover { background: var(--orange-tint); border-color: var(--orange-tint); color: var(--orange-type-aa); }
@media (max-width: 860px) {
  body.hrc-coded .v6-hero.is-split .v6-hero__wrap { grid-template-columns: minmax(0,1fr); grid-template-rows: auto 1fr auto auto; padding-block: 48px 40px; }
  body.hrc-coded .v6-hero.is-split .v6-hero__word.is-br { grid-row: 3; grid-column: 1; margin-bottom: 28px; }
  body.hrc-coded .v6-hero.is-split .v6-hero__lede { grid-row: 4; grid-column: 1; max-width: none; }
}
@media (max-width: 480px) {
  body.hrc-coded .v6-hero.is-split .v6-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
  body.hrc-coded .v6-hero.is-split .v6-hero__actions .v6-btn { width: 100%; }
}
body.hrc-coded .v6-hero.is-split .v6-hero__scrim {
  background: linear-gradient(180deg, rgba(11,11,12,.66) 0%, rgba(11,11,12,.20) 26%, rgba(11,11,12,.18) 44%, rgba(11,11,12,.58) 76%, rgba(11,11,12,.88) 100%); }

/* ── partner marquee: full-colour marks, right to left ──────────────────── */
body.hrc-coded .v6-markband { overflow: hidden; }
body.hrc-coded .v6-markband__in {
  display: flex; align-items: center; gap: 56px;
  padding-left: max(var(--margin), calc((100% - var(--container)) / 2)); }
body.hrc-coded .v6-markband__lead { flex: 0 0 auto; white-space: nowrap; }
body.hrc-coded .v6-markband__vp {
  flex: 1 1 auto; min-width: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 120px), transparent 100%);
          mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 120px), transparent 100%); }
body.hrc-coded .v6-markband__track {
  display: flex; width: max-content;
  animation: v6-markband-scroll 54s linear infinite; }
body.hrc-coded .v6-markband__row {
  display: flex; align-items: center; gap: 72px; padding-right: 72px; }
body.hrc-coded .v6-markband .v6-mark { display: block; opacity: 1; filter: none; }
body.hrc-coded .v6-markband:hover .v6-markband__track,
body.hrc-coded .v6-markband:focus-within .v6-markband__track { animation-play-state: paused; }
@keyframes v6-markband-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 860px) {
  body.hrc-coded .v6-markband__in { display: block; padding-left: 0; }
  body.hrc-coded .v6-markband__lead {
    display: block; margin: 0 0 24px; white-space: normal;
    padding-inline: max(var(--margin), calc((100% - var(--container)) / 2)); }
  body.hrc-coded .v6-markband__vp {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%); }
  body.hrc-coded .v6-markband__row { gap: 48px; padding-right: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-markband__track { animation: none; }
}
body.hrc-coded .v6-markband__vp {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 48px, #000 calc(100% - 120px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 48px, #000 calc(100% - 120px), transparent 100%); }
body.hrc-coded .v6-markband__in { padding-block: 48px; }
@media (max-width: 860px) { body.hrc-coded .v6-markband__in { padding-block: 40px; } }

/* ── the spoken statement: clickable sentences over a photograph stage ──── */
body.hrc-coded .v6-say__head { max-width: 20em; }
body.hrc-coded .v6-say__line {
  appearance: none; -webkit-appearance: none; background: none; border: 0; padding: 0;
  margin: 0; font: inherit; letter-spacing: inherit; color: var(--on-surface-2);
  cursor: pointer; text-align: left;
  transition: color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-say__line:hover { color: var(--on-surface); }
body.hrc-coded .v6-say__line.is-on { color: var(--on-surface); }
body.hrc-coded .v6-say__line:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
body.hrc-coded .v6-say__stage { margin-top: var(--stack); }
body.hrc-coded .v6-say__set {
  display: grid; grid-template-columns: 1.35fr .78fr 1.4fr; gap: 12px;
  animation: v6-say-in .42s var(--ease-action) both; }
body.hrc-coded .v6-say__set[hidden] { display: none; }
body.hrc-coded .v6-say__fig {
  position: relative; margin: 0; height: 420px; overflow: hidden;
  border-radius: var(--radius-card); background: var(--ink); }
body.hrc-coded .v6-say__fig img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform var(--dur-card) var(--ease-card); }
body.hrc-coded .v6-say__fig:hover img, body.hrc-coded .v6-say__fig:focus-within img { transform: scale(1.04); }
body.hrc-coded .v6-say__cap {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 24px; color: #fff;
  background: linear-gradient(180deg, rgba(11,11,12,0), rgba(11,11,12,.86));
  opacity: 0; transform: translateY(10px);
  transition: opacity .35s var(--ease-action), transform .35s var(--ease-action); }
body.hrc-coded .v6-say__fig:hover .v6-say__cap, body.hrc-coded .v6-say__fig:focus-within .v6-say__cap {
  opacity: 1; transform: none; }
body.hrc-coded .v6-say__cap-t { display: block; font: var(--w-ui) var(--fs-lead)/1.3 var(--font-sans); }
body.hrc-coded .v6-say__cap-b { display: block; margin-top: 6px; font: 400 15px/1.45 var(--font-sans); color: rgba(255,255,255,.82); }
@keyframes v6-say-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 1180px) { body.hrc-coded .v6-say__fig { height: 360px; } }
@media (max-width: 860px) {
  body.hrc-coded .v6-say__set { grid-template-columns: 1fr 1fr; }
  body.hrc-coded .v6-say__fig { height: 260px; }
  body.hrc-coded .v6-say__fig:first-child { grid-column: 1 / -1; height: 300px; }
}
@media (max-width: 560px) {
  body.hrc-coded .v6-say__set { grid-template-columns: 1fr; }
  body.hrc-coded .v6-say__fig, body.hrc-coded .v6-say__fig:first-child { height: 260px; }
  body.hrc-coded .v6-say__cap { opacity: 1; transform: none; }
}

/* ── the reel: Stripe's squeeze ─────────────────────────────────────────── */
body.hrc-coded .hrc-v6-home .v6-reel { --reel-height: 460px; }
body.hrc-coded .v6-reel__panel { transition: flex-grow .42s cubic-bezier(.25,1,.5,1); }
body.hrc-coded .v6-reel__caption p { font: 400 var(--fs-lead)/1.45 var(--font-sans); }

/* ── runs so far: numbered, clickable rows with a hover arrow ───────────── */
body.hrc-coded .v6-tally__head {
  background: none; padding: 14px 0; margin-inline: 0; align-items: baseline; }
body.hrc-coded .v6-tally__headline { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
body.hrc-coded .v6-tally__row {
  display: grid; grid-template-columns: auto minmax(0,1fr) auto 18px; align-items: center; gap: 14px;
  text-decoration: none; color: inherit; background: none;
  transition: color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-tally__row:hover { background: none; }
body.hrc-coded .v6-tally__no { color: var(--on-surface-2); font-variant-numeric: tabular-nums; min-width: 3.4ch; }
body.hrc-coded .v6-tally__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-tally__meta { white-space: nowrap; }
body.hrc-coded .v6-tally__go {
  display: inline-flex; width: 18px; color: var(--orange-type-aa); opacity: 0; transform: translateX(-5px);
  transition: opacity var(--dur-action) var(--ease-action), transform var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-tally__row:hover .v6-tally__go,
body.hrc-coded .v6-tally__row:focus-visible .v6-tally__go { opacity: 1; transform: none; }
body.hrc-coded .v6-tally__row:hover .v6-tally__title { color: var(--orange-type-aa); }
@media (max-width: 720px) { body.hrc-coded .v6-tally__meta { font-size: 12px; } }

/* ── two ways: a photograph closes each card ────────────────────────────── */
body.hrc-coded .v6-ways .v6-card__inner { display: flex; flex-direction: column; }
body.hrc-coded .v6-ways .v6-card__figure { margin-top: auto; display: flex; flex-direction: column; }
body.hrc-coded .v6-ways__media {
  height: 236px; overflow: hidden;
  border-radius: 0 0 var(--radius-inner) var(--radius-inner); }
body.hrc-coded .v6-ways__media img { width: 100%; height: 100%; object-fit: cover; display: block; transform-origin: 50% 60%; transition: transform var(--dur-card, .8s) var(--ease-card); }
/* the card's hover lift belongs to the photograph alone here: the facts and the
   link above it stay crisp and in place, and the photograph grows inside its frame */
body.hrc-coded .v6-ways .v6-card:hover .v6-card__figure, body.hrc-coded .v6-ways .v6-card.is-hover .v6-card__figure { transform: none; }
body.hrc-coded .v6-ways .v6-card:hover .v6-ways__media img, body.hrc-coded .v6-ways .v6-card.is-hover .v6-ways__media img { transform: scale(1.05); }
@media (max-width: 860px) { body.hrc-coded .v6-ways__media { height: 200px; } }
@media (prefers-reduced-motion: reduce) { body.hrc-coded .v6-ways .v6-card:hover .v6-ways__media img { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-say__set { animation: none; }
  body.hrc-coded .v6-say__fig img, body.hrc-coded .v6-say__cap,
  body.hrc-coded .v6-tally__go, body.hrc-coded .v6-tally__title { transition: none; }
}
body.hrc-coded .v6-tally__head .v6-quiet { white-space: nowrap; }
@media (max-width: 560px) {
  body.hrc-coded .v6-tally__head { flex-wrap: wrap; row-gap: 10px; }
  body.hrc-coded .v6-tally__headline { flex: 1 1 100%; }
}

/* ── homepage section rhythm: the bands the v6 sheet does not name ──────── */
body.hrc-coded-home .hrc-v6-home .s-say { padding-block: 8px var(--section); }
body.hrc-coded-home .hrc-v6-home .s-next,
body.hrc-coded-home .hrc-v6-home .s-featured,
body.hrc-coded-home .hrc-v6-home .s-tally { padding-block: 0 var(--section); }
body.hrc-coded-home .hrc-v6-home .s-ways { padding-block: var(--section); }
body.hrc-coded-home .hrc-v6-home .v6-ways__head { text-align: center; max-width: 28em; margin-inline: auto; }

/* ── the statement: brand gradient on the chosen sentence, the rest fading ─ */
body.hrc-coded .v6-say__head { max-width: 17em; }
body.hrc-coded .v6-say__line {
  opacity: calc(1 - var(--say-i, 0) * .09);
  transition: color var(--dur-action) var(--ease-action), opacity var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-say__line.is-on {
  opacity: 1;
  background: var(--grad-ember);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; }
body.hrc-coded .v6-say__line:hover { opacity: 1; color: var(--on-surface); }
body.hrc-coded .v6-say__line.is-on:hover { color: transparent; -webkit-text-fill-color: transparent; }

/* ── marquee: the track ends on the content column, like the rule under it ─ */
body.hrc-coded .v6-markband__in {
  padding-right: max(var(--margin), calc((100% - var(--container)) / 2)); }
body.hrc-coded .v6-markband__vp {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 48px, #000 calc(100% - 72px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 48px, #000 calc(100% - 72px), transparent 100%); }
@media (max-width: 860px) {
  body.hrc-coded .v6-markband__in { padding-right: 0; }
}

/* ── the statement: arrows beside the sentences ─────────────────────────── */
body.hrc-coded .v6-say__bar { align-items: flex-start; gap: var(--space-9); }
body.hrc-coded .v6-say__nav { display: flex; gap: 8px; flex: none; }
@media (max-width: 720px) {
  body.hrc-coded .v6-say__bar { flex-wrap: wrap; gap: 24px; }
  body.hrc-coded .v6-say__nav { order: 2; }
}

/* ── the reel: the partner's mark on a plate, bottom right ──────────────── */
body.hrc-coded .hrc-v6-home .v6-reel__label,
body.hrc-coded .v6-reel__label {
  left: auto; right: var(--space-4); bottom: var(--space-4);
  display: inline-flex; align-items: center; gap: 0;
  min-height: 36px; padding: 8px 12px;
  background: rgba(255,255,255,.94); border-radius: var(--radius-action);
  color: var(--ink); font: 500 14px/1 var(--font-sans); letter-spacing: -.01em; }
body.hrc-coded .v6-reel__label .v6-partner { font: 500 14px/1 var(--font-sans); color: var(--ink); letter-spacing: -.01em; }
body.hrc-coded .v6-reel__label .v6-mark { display: block; }
/* only the open panel carries the plate; the slivers stay clean */
body.hrc-coded .v6-reel__panel:not(.is-open) .v6-reel__label { display: none; }
body.hrc-coded .v6-markband__vp {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 56px, #000 calc(100% - 100px), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 56px, #000 calc(100% - 100px), transparent 100%); }
@media (max-width: 860px) {
  body.hrc-coded .v6-reel__panel .v6-reel__label { display: inline-flex; }
}
@media (max-width: 860px) {
  body.hrc-coded .v6-reel__panel:not(.is-open) .v6-reel__label { display: inline-flex; }
}

/* ── the reel plate sits bottom left ────────────────────────────────────── */
body.hrc-coded .hrc-v6-home .v6-reel__label,
body.hrc-coded .v6-reel__label { left: var(--space-4); right: auto; }

/* ── the marquee never stops; hovering a mark does not hold the strip ───── */
body.hrc-coded .v6-markband:hover .v6-markband__track,
body.hrc-coded .v6-markband:focus-within .v6-markband__track { animation-play-state: running; }

/* ── the dialog scrolls inside its own box ──────────────────────────────── */
body.hrc-coded .v6-dialog { display: grid; place-items: center; padding: 40px 32px; overflow: hidden; }
body.hrc-coded .v6-dialog__sheet {
  margin: 0; width: min(1184px, 100%); max-height: calc(100vh - 80px);
  display: flex; flex-direction: column; overflow: hidden; padding: 0; }
body.hrc-coded .v6-dialog__body {
  min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch; padding: 64px; }
body.hrc-coded .v6-dialog__close { top: 20px; right: 20px; z-index: 3; }
body.hrc-coded .v6-dialog [data-d-photo] { height: clamp(220px, 34vh, 420px) !important; }
@media (max-width: 720px) {
  body.hrc-coded .v6-dialog { padding: 0; place-items: end center; }
  body.hrc-coded .v6-dialog__sheet {
    width: 100%; max-height: 92vh; min-height: 0;
    border-radius: var(--radius-card) var(--radius-card) 0 0; }
  body.hrc-coded .v6-dialog__body { padding: 56px 24px 32px; }
}

/* ── chapters: a panel rises over the one above on rounded top corners ──── */
:root { --radius-chapter: 32px; }
@media (max-width: 720px) { :root { --radius-chapter: 24px; } }
body.hrc-coded-home .hrc-v6-home .v6-markband__in { padding-bottom: calc(48px + var(--radius-chapter)); }
body.hrc-coded-home .hrc-v6-home .s-say {
  position: relative; z-index: 1; background: var(--orange-tint);
  border-radius: var(--radius-chapter) var(--radius-chapter) 0 0;
  margin-top: calc(var(--radius-chapter) * -1);
  padding-top: calc(var(--radius-chapter) + 8px); }
body.hrc-coded-home .hrc-v6-home .s-next {
  position: relative; z-index: 2; background: var(--paper);
  border-radius: var(--radius-chapter) var(--radius-chapter) 0 0;
  margin-top: calc(var(--radius-chapter) * -1);
  padding-top: calc(var(--radius-chapter) + 8px); }
/* the dark alternative, one class away */
body.hrc-coded-home .hrc-v6-home .s-say.is-ink { background: var(--grad-ink); }
body.hrc-coded .s-say.is-ink .v6-say__line { color: var(--grey-on-ink); }
body.hrc-coded .s-say.is-ink .v6-say__line:hover { color: var(--paper); }
body.hrc-coded .s-say.is-ink .v6-rule { background: rgba(255,255,255,.14); }

/* ── the statement chapter: flat top, no rule, warm type on the tint ────── */
:root { --on-tint-2: #68615F; }
body.hrc-coded-home .hrc-v6-home .v6-markband__in { padding-bottom: 48px; }
body.hrc-coded-home .hrc-v6-home .s-say {
  border-radius: 0; margin-top: 0; padding-top: var(--section); }
body.hrc-coded .s-say .v6-rule { display: none; }
/* only the runs chapter rises, and it keeps a full section of air above it */
body.hrc-coded-home .hrc-v6-home .s-next {
  padding-top: calc(var(--radius-chapter) + var(--section)); }
/* the cool grey reads cold on a warm ground, so the tint gets a warm one and
   a shorter fade; the arrows take the ghost treatment so they are not the
   same colour as the ground they sit on */
body.hrc-coded .s-say .v6-say__line {
  color: var(--on-tint-2); opacity: calc(1 - var(--say-i, 0) * .06); }
body.hrc-coded .s-say .v6-say__line.is-on { opacity: 1; }
body.hrc-coded .s-say .v6-say__line:hover { color: var(--on-surface); opacity: 1; }
body.hrc-coded .s-say .v6-ico {
  background: var(--paper); border: 1px solid var(--orange-ghost-line);
  color: var(--orange-type-aa); }
body.hrc-coded .s-say .v6-ico:hover { background: var(--orange); border-color: var(--orange); color: #fff; }
/* half the air above both chapter headings */
body.hrc-coded-home .hrc-v6-home .s-say { padding-top: calc(var(--section) / 2); }
body.hrc-coded-home .hrc-v6-home .s-next {
  padding-top: calc(var(--radius-chapter) + var(--section) / 2); }

/* ── series pages ───────────────────────────────────────────────────────── */
body.hrc-coded .v6-series-hero__lead { max-width: 54ch; margin-top: 18px; }
body.hrc-coded .v6-series-hero__next {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 18px;
  font: 400 var(--fs-small)/1.4 var(--font-sans); color: var(--paper); }
body.hrc-coded .v6-page-hero__actions { margin-top: 28px; }
/* the essentials read as words, not figures, so the stat cell takes h3 */
body.hrc-coded .v6-stats--text .v6-stat__figure {
  font: var(--w-heading) var(--fs-h3)/1.25 var(--font-sans); letter-spacing: var(--ls-h3); }
body.hrc-coded .v6-series-prose { max-width: 68ch; }
body.hrc-coded .v6-series-marks { padding-block: 40px 0; }
body.hrc-coded .v6-series-ask {
  display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-9); flex-wrap: wrap; }
body.hrc-coded .v6-series-ask .v6-h2 { max-width: 20em; margin: 0; }
body.hrc-coded .v6-series-ask__act { display: flex; gap: 12px; flex-wrap: wrap; flex: none; }
body.hrc-coded .v6-row.is-empty { grid-template-columns: 1fr; }
body.hrc-coded .hrc-v6-series .v6-more { margin-top: var(--stack); }
@media (max-width: 860px) {
  body.hrc-coded .v6-series-ask { display: block; }
  body.hrc-coded .v6-series-ask__act { margin-top: 28px; }
  body.hrc-coded .v6-stats--text .v6-stat__figure { font-size: 20px; }
}
/* a band that flips the aliases has to paint with them, or it flips nothing */
body.hrc-coded .hrc-v6-series .v6-band-ink,
body.hrc-coded .hrc-v6-series .v6-band-paper { background: var(--surface); color: var(--on-surface); }
/* five essentials, five columns */
body.hrc-coded .v6-stats--text { grid-template-columns: repeat(5, minmax(0,1fr)); }
body.hrc-coded .v6-stats--text .v6-stat__figure {
  font: var(--w-heading) var(--fs-card)/1.25 var(--font-sans); letter-spacing: var(--ls-card); }
@media (max-width: 1180px) { body.hrc-coded .v6-stats--text { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 720px) { body.hrc-coded .v6-stats--text { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* ── event cards: one grid, one baseline ────────────────────────────────── */
body.hrc-coded .v6-cards > .v6-card { height: 100%; }
/* the photograph fills its frame instead of leaving a sliver under it */
/* two lines are reserved for the title, so every date in a row sits level */
  min-height: calc(var(--fs-card) * var(--lh-card) * 2); }
/* the date is the last line of the card, pinned to the foot */
body.hrc-coded .v6-series-note { margin-top: 24px; max-width: 62ch; }

/* Essentials: one baseline for the labels, whatever the value wraps to. */
body.hrc-coded .v6-stats--text .v6-stat { display: flex; flex-direction: column; }
body.hrc-coded .v6-stats--text .v6-stat__figure { min-height: 2.5em; }
body.hrc-coded .v6-stats--text .v6-stat__label { margin-top: auto; padding-top: 14px; }

/* ------------------------------------------------------------------ */
/* The run tile — stripe.com/au/customers' card, in HRC's colours.     */
/* A photograph fills the tile; the partner's mark sits in the top     */
/* corner; the run's three rows hold the foot. The link line waits     */
/* below the tile's edge and rises on hover. One constant ink scrim,   */
/* never a brand colour, deepening slightly on hover so type holds.    */
/* Motion: 600ms (--dur-glyph) on --ease-card; Stripe runs the same    */
/* 600ms on cubic-bezier(.7,0,0,1), which the system does not carry.   */
/* ------------------------------------------------------------------ */
body.hrc-coded .v6-run {
  position: relative; display: block; overflow: hidden; isolation: isolate;
  width: 100%; align-self: start;
  border-radius: var(--radius-card);
  background: var(--ink); color: var(--paper); text-decoration: none; }
/* The square: a in-flow spacer, because a grid item's aspect-ratio does not
   size its row in every engine we support. --run-ratio is the one dial. */
body.hrc-coded .v6-run { --run-ratio: 100%; }
body.hrc-coded .v6-run::before { content: ""; display: block; padding-top: var(--run-ratio); }
body.hrc-coded .v6-run__bg {
  position: absolute; inset: 0 0 -10px 0; z-index: 0; display: block;
  transition: transform var(--dur-glyph) var(--ease-reveal); }
body.hrc-coded .v6-run__bg img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.03);
  transition: transform var(--dur-glyph) var(--ease-reveal); }
body.hrc-coded .v6-run__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(0deg, var(--ink) 0%, rgba(11,11,12,.55) 34%, rgba(11,11,12,0) 78%),
    linear-gradient(180deg, rgba(11,11,12,.42) 0%, rgba(11,11,12,0) 26%);
  opacity: .92; }
body.hrc-coded .v6-run__lift {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: var(--ink); opacity: 0;
  transition: opacity var(--dur-glyph) var(--ease-reveal); }
body.hrc-coded .v6-run__mark {
  position: absolute; z-index: 3; top: var(--space-5); left: var(--space-5);
  color: var(--paper); font: var(--w-ui) var(--fs-small)/1 var(--font-sans); }
body.hrc-coded .v6-run__chip { position: absolute; z-index: 3; top: var(--space-5); right: var(--space-5); }
body.hrc-coded .v6-run__body {
  position: absolute; z-index: 3; inset: auto 0 0 0;
  display: flex; flex-direction: column; gap: 6px;
  padding: var(--space-5);
  transform: translateY(31px);
  transition: transform var(--dur-glyph) var(--ease-reveal); }
body.hrc-coded .v6-run__eyebrow {
  font: var(--w-ui) var(--fs-small)/var(--lh-small) var(--font-sans);
  color: var(--grey-on-ink); }
body.hrc-coded .v6-run__no { color: var(--paper); }
body.hrc-coded .v6-run__title {
  font: var(--w-title) var(--fs-card)/var(--lh-card) var(--font-sans);
  letter-spacing: var(--ls-card); color: var(--paper); }
body.hrc-coded .v6-run__date {
  font: var(--w-ui) var(--fs-small)/var(--lh-small) var(--font-sans);
  color: var(--grey-on-ink); }
body.hrc-coded .v6-run__cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
  font: var(--w-ui) var(--fs-small)/1.4 var(--font-sans); color: var(--orange-on-ink);
  opacity: 0; transition: opacity var(--dur-glyph) var(--ease-reveal); }
body.hrc-coded .v6-run:hover .v6-run__bg,
body.hrc-coded .v6-run:focus-visible .v6-run__bg { transform: translateY(-10px); }
body.hrc-coded .v6-run:hover .v6-run__bg img,
body.hrc-coded .v6-run:focus-visible .v6-run__bg img { transform: scale(1); }
body.hrc-coded .v6-run:hover .v6-run__lift,
body.hrc-coded .v6-run:focus-visible .v6-run__lift { opacity: .22; }
body.hrc-coded .v6-run:hover .v6-run__body,
body.hrc-coded .v6-run:focus-visible .v6-run__body { transform: none; }
body.hrc-coded .v6-run:hover .v6-run__cta,
body.hrc-coded .v6-run:focus-visible .v6-run__cta { opacity: 1; }
body.hrc-coded .v6-run:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-run__bg, body.hrc-coded .v6-run__bg img,
  body.hrc-coded .v6-run__body, body.hrc-coded .v6-run__cta,
  body.hrc-coded .v6-run__lift { transition: none; }
  body.hrc-coded .v6-run__body { transform: none; }
  body.hrc-coded .v6-run__cta { opacity: 1; }
}


/* ── the statement chapter on ink ───────────────────────────────────────── */
/* --grad-ember is built for a light ground: its ramp runs DARK (#FC4B1F to
   #8E3214), which reads richer the paler the paper. On the ink band the same
   ramp collapses - the last stop measures 1.96:1 on #232323. So the ink band
   gets the mirrored ramp, built from colours the system already holds:
   --orange-lift 7.51:1, --orange-on-ink 6.09:1, --orange 4.61:1 on mid ink.
   Same gesture, same palette, kept above the floor. */
:root { --grad-ember-ink: linear-gradient(145deg, var(--orange-lift), var(--orange-on-ink), var(--orange)); }
/* background-image, never the `background` shorthand: the shorthand resets
   background-clip to border-box and the gradient paints the whole box
   instead of the letterforms. */
body.hrc-coded .s-say.is-ink .v6-say__line.is-on { background-image: var(--grad-ember-ink); }
/* the arrows take the ink band's ghost treatment: a clean white chip, no tint
   line, which is what .v6-band-ink .v6-btn.is-ghost already does elsewhere */
body.hrc-coded .s-say.is-ink .v6-ico { border-color: var(--paper); }

/* ── About us ────────────────────────────────────────────────────────────────
   Three shapes and nothing else: the story beside its photograph, the four
   people as one row of cards, and the case for the club as five alternating
   rows inside one band rather than five bands of their own. */

/* the story */
body.hrc-coded .v6-about-story__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 72px; align-items: center; }
body.hrc-coded .v6-about-story .v6-prose p {
  margin: 0 0 18px; max-width: 54ch; color: var(--grey-on-ink);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); }
body.hrc-coded .v6-about-story .v6-prose p:last-child { margin-bottom: 0; }
body.hrc-coded .v6-about-story .v6-prose a { color: var(--orange-on-ink); text-decoration: none; border-bottom: 1px solid rgba(255,122,77,.4); }
body.hrc-coded .v6-about-story .v6-prose a:hover { border-bottom-color: var(--orange-on-ink); }
body.hrc-coded .v6-about-story__fig {
  margin: 0; overflow: hidden; border-radius: var(--radius-card); }
body.hrc-coded .v6-about-story__fig img {
  display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

/* the people */
body.hrc-coded .v6-about-team { --people-gap: 20px; }
body.hrc-coded .v6-rail__head {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0 0 40px; }
body.hrc-coded .v6-rail__head .v6-h2 { margin: 0; }
body.hrc-coded .v6-rail__nav { display: flex; flex: none; gap: 10px; }
/* display:flex outranks the user agent's [hidden] rule, so say it here */
body.hrc-coded .v6-rail__nav[hidden] { display: none; }
body.hrc-coded .v6-rail__arrow {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; padding: 0; cursor: pointer;
  border: 1px solid var(--line); border-radius: 999px;
  background: var(--paper); color: var(--ink);
  transition: background var(--dur-action) var(--ease-action),
              border-color var(--dur-action) var(--ease-action),
              color var(--dur-action) var(--ease-action),
              opacity var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-rail__arrow svg { width: 16px; height: 16px; }
body.hrc-coded .v6-rail__arrow.is-prev svg { transform: rotate(180deg); }
body.hrc-coded .v6-rail__arrow.is-next {
  background: var(--orange-tint); border-color: var(--orange-ghost-line); color: var(--orange-type-aa); }
body.hrc-coded .v6-rail__arrow:hover:not([disabled]) { border-color: var(--orange); color: var(--orange-type-aa); }
body.hrc-coded .v6-rail__arrow[disabled] { opacity: .34; cursor: default; }

body.hrc-coded .v6-people {
  display: grid; grid-auto-flow: column;
  grid-auto-columns: calc((100% - 3 * var(--people-gap)) / 4);
  gap: var(--people-gap); margin: 0; padding: 0 0 4px; list-style: none;
  overflow-x: auto; overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none; }
body.hrc-coded .v6-people::-webkit-scrollbar { display: none; }
body.hrc-coded .v6-people > .v6-person {
  min-width: 0; margin: 0; padding-left: 20px;
  border-left: 1px solid var(--line); scroll-snap-align: start; }
/* three of the four portraits are circle-cropped at source, so the frame is a
   circle: one shape for all four rather than a circle sitting in a square */
body.hrc-coded .v6-person__figure {
  margin: 0 0 22px; overflow: hidden; aspect-ratio: 1 / 1; width: 100%;
  border-radius: 50%; background: var(--paper-hover);
  box-shadow: 0 16px 36px -24px rgba(11, 11, 12, .55); }
body.hrc-coded .v6-person__figure img {
  display: block; width: 100%; height: 100%; object-fit: cover; }
/* the name carries the one accent on the card */
body.hrc-coded .v6-person__name {
  position: relative; margin: 0 0 8px; padding-left: 13px; color: var(--ink);
  font: var(--w-ui) 17px/1.35 var(--font-sans); letter-spacing: -.005em; }
body.hrc-coded .v6-person__name::before {
  content: ""; position: absolute; left: 0; top: .2em; bottom: .2em;
  width: 2px; border-radius: 1px; background: var(--orange); }
body.hrc-coded .v6-person__role {
  margin: 0 0 14px; padding-left: 13px; max-width: 26ch; color: var(--grey);
  font: 400 15px/1.55 var(--font-sans); }
body.hrc-coded .v6-person__social {
  display: inline-flex; align-items: center; gap: 7px; margin-left: 13px; text-decoration: none;
  color: var(--orange-type-aa); font: var(--w-ui) var(--fs-small)/1 var(--font-sans); }
body.hrc-coded .v6-person__social svg { width: 18px; height: 18px; }
body.hrc-coded .v6-person__social:hover span { text-decoration: underline; text-underline-offset: 3px; }

/* the case for it */
body.hrc-coded .v6-about-case__list { display: grid; gap: 80px; }
body.hrc-coded .v6-about-row {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 72px; align-items: center; }
body.hrc-coded .v6-about-row.is-flip .v6-about-row__copy { order: 2; }
body.hrc-coded .v6-about-row__copy p {
  margin: 0 0 18px; max-width: 52ch; color: var(--grey);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); }
body.hrc-coded .v6-about-row__copy p:last-child { margin-bottom: 0; }
body.hrc-coded .v6-about-row__copy b,
body.hrc-coded .v6-about-row__copy strong { color: var(--ink); font-weight: var(--w-ui); }
body.hrc-coded .v6-about-row__fig { margin: 0; overflow: hidden; border-radius: var(--radius-card); }
body.hrc-coded .v6-about-row__fig img {
  display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

@media (max-width: 1080px) {
  body.hrc-coded .v6-people { grid-auto-columns: calc((100% - 1.4 * var(--people-gap)) / 2.4); }
}
@media (max-width: 860px) {
  body.hrc-coded .v6-about-story__grid,
  body.hrc-coded .v6-about-row { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  body.hrc-coded .v6-about-row.is-flip .v6-about-row__copy { order: 0; }
  body.hrc-coded .v6-about-case__list { gap: 56px; }
  body.hrc-coded .v6-about-story .v6-prose p,
  body.hrc-coded .v6-about-row__copy p { max-width: none; }
}
@media (max-width: 560px) {
  body.hrc-coded .v6-people { grid-auto-columns: calc(100% - 46px); }
  body.hrc-coded .v6-rail__head { margin-bottom: 28px; }
}

/* ── photographed titles: the words have to win ──────────────────────────────
   The page hero's scrim is lightest at 34-44% of its height, which is exactly
   where the copy sits, so a lead line over a busy photograph came out at about
   2:1. A centred darkening under the words fixes it without touching the
   photograph's edges. Proposed as a change to the Hero component. */
body.hrc-coded:not(.hrc-coded-home) .v6-page-hero__scrim {
  background:
    radial-gradient(64% 54% at 50% 50%, rgba(11,11,12,.58) 0%, rgba(11,11,12,0) 100%),
    linear-gradient(180deg, rgba(11,11,12,.66) 0%, rgba(11,11,12,.34) 34%, rgba(11,11,12,.44) 66%, rgba(11,11,12,.78) 100%); }
body.hrc-coded:not(.hrc-coded-home) .v6-page-hero .v6-lead { color: rgba(255,255,255,.94); }

/* A statement over a photograph is a chapter opening, not a strip: the v7
   section rhythm had cut it to 88px of padding and 251px of height. */
body.hrc-coded:not(.hrc-coded-home) .v6-page-sec.v6-statement.has-media {
  display: flex; align-items: center; min-height: 440px; padding-block: 112px; }
@media (max-width: 720px) {
  body.hrc-coded:not(.hrc-coded-home) .v6-page-sec.v6-statement.has-media { min-height: 340px; padding-block: 80px; }
}

/* ── a heading owns its clearance ────────────────────────────────────────────
   v6-site.css:12 zeroes the margins of every p and h1-h4 inside a section, at
   (0,4,1) — one class more than any component rule written afterwards. So a
   heading set with `margin: 0 0 24px` silently lost its space and sat straight
   on the paragraph under it, on this page and in the shop. The reset is right;
   this is the rule it was missing. Keep them together. */
html body.hrc-coded:not(.hrc-coded-home) .v6-page-sec
  :is(.v6-h1, .v6-h2, .v6-h3, .v6-display):not(:last-child) { margin-bottom: 20px; }
/* a section head lays its own parts out on a flex row with its own gap */
html body.hrc-coded:not(.hrc-coded-home) .v6-page-sec .v6-sechead
  > :is(.v6-h1, .v6-h2, .v6-h3, .v6-display) { margin-bottom: 0; }
/* the same clearance on the retail documents, which sit outside .v6-page-sec.
   Headings that already carry a v6 or v7 class state their own spacing. */
html body.hrc-coded :is(.enventor-shop, .hrc-commerce-page, .hrc-native-page)
  :is(h1, h2, h3):not([class*="v6-"]):not([class*="hrc-"]):not(:last-child) { margin-bottom: 20px; }

/* ── the event page ──────────────────────────────────────────────────────────
   One template, four states: upcoming, completed, postponed, cancelled. The
   state is said once in the hero chip and again in the card, and the notice
   band only exists when there is something to announce. */
body.hrc-coded .v6-event__chip {
  display: inline-flex; align-items: center; height: 28px; padding: 0 13px; margin: 0 0 4px;
  border-radius: 999px; text-transform: uppercase; letter-spacing: .07em;
  font: var(--w-ui) 12px/1 var(--font-sans); }
body.hrc-coded .v6-event__chip.is-scheduled { background: var(--orange); color: #fff; }
body.hrc-coded .v6-event__chip.is-postponed { background: var(--paper); color: var(--ink); }
body.hrc-coded .v6-event__chip.is-completed { background: rgba(255,255,255,.16); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.34); }
body.hrc-coded .v6-event__chip.is-cancelled { background: var(--ink); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }

/* the notice: the one thing a postponed or cancelled run has to say */
body.hrc-coded .v6-page-sec.v6-event__notice { padding-block: 44px; }
body.hrc-coded .v6-event__notice-in { display: grid; gap: 18px; justify-items: start; }
body.hrc-coded .v6-event__notice-label {
  margin: 0; color: var(--orange-on-ink);
  font: var(--w-title) var(--fs-h3)/1.3 var(--font-sans); letter-spacing: var(--ls-h3); }
body.hrc-coded .v6-event__notice-dates { display: flex; flex-wrap: wrap; gap: 14px 48px; margin: 0; }
body.hrc-coded .v6-event__notice-dates dt {
  margin: 0 0 4px; color: var(--grey-on-ink); text-transform: uppercase; letter-spacing: .05em;
  font: var(--w-ui) var(--fs-small)/1.2 var(--font-sans); }
body.hrc-coded .v6-event__notice-dates dd {
  margin: 0; color: var(--paper); font: 400 18px/1.4 var(--font-sans); }
body.hrc-coded .v6-event.is-cancelled .v6-event__notice-dates dd,
body.hrc-coded .v6-event.is-postponed .v6-event__notice-dates div:not(.is-new) dd {
  color: var(--grey-on-ink); text-decoration: line-through; text-decoration-thickness: 1px; }
body.hrc-coded .v6-event__notice-dates .is-new dd { color: var(--paper); text-decoration: none; }
body.hrc-coded .v6-event__notice-note {
  margin: 0; max-width: 62ch; color: var(--grey-on-ink);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); }

/* the body: the run on the left, the one action on the right */
body.hrc-coded .v6-event__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 72px; align-items: start; }
body.hrc-coded .v6-event__aside { position: sticky; top: 96px; }
body.hrc-coded .v6-event__facts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 40px; margin: 0 0 48px; padding: 0 0 36px; border-bottom: 1px solid var(--line); }
body.hrc-coded .v6-event__facts dt {
  margin: 0 0 6px; color: var(--grey); text-transform: uppercase; letter-spacing: .05em;
  font: var(--w-ui) var(--fs-small)/1.2 var(--font-sans); }
body.hrc-coded .v6-event__facts dd {
  margin: 0; color: var(--ink); font: 400 17px/1.45 var(--font-sans); }
body.hrc-coded .v6-event__facts dd span {
  display: block; margin-top: 3px; color: var(--grey); font-size: 15px; }
body.hrc-coded .v6-event__overview .v6-prose p {
  margin: 0 0 16px; max-width: 64ch; color: var(--grey);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); }
body.hrc-coded .v6-event__overview .v6-prose p:last-child { margin-bottom: 0; }
body.hrc-coded .v6-event__route { margin-top: 48px; }
body.hrc-coded .v6-event__route figure { margin: 0; overflow: hidden; border-radius: var(--radius-card); background: var(--paper-hover); }
body.hrc-coded .v6-event__route img { display: block; width: 100%; }

/* the photographs from a run that has happened */
body.hrc-coded .v6-event__gallery { margin-top: 56px; padding-top: 48px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__gallery .v6-rail__head { margin-bottom: 24px; }
body.hrc-coded .v6-event__grid-photos {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
body.hrc-coded .v6-event__links { display: flex; gap: 22px; margin: 20px 0 0; flex-wrap: wrap; }
body.hrc-coded .v6-event__links a {
  color: var(--orange-type-aa); text-decoration: none;
  font: var(--w-ui) var(--fs-small)/1.4 var(--font-sans);
  border-bottom: 1px solid var(--orange-ghost-line); }
body.hrc-coded .v6-event__count { margin: 0; color: var(--grey); }

/* the card */
body.hrc-coded .v6-event__card {
  padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--paper); }
body.hrc-coded .v6-event__card-when {
  margin: 0 0 16px; color: var(--ink); font: var(--w-title) 19px/1.35 var(--font-sans); }
body.hrc-coded .v6-event__card-when span { display: block; margin-top: 3px; color: var(--grey); font: 400 15px/1.4 var(--font-sans); }
body.hrc-coded .v6-event__card-line { margin: 0 0 18px; color: var(--grey); font: 400 15px/1.55 var(--font-sans); }
body.hrc-coded .v6-event__card-state {
  display: flex; align-items: center; gap: 9px; margin: 0 0 8px;
  color: var(--ink); font: var(--w-ui) 17px/1.3 var(--font-sans); }
body.hrc-coded .v6-event__tick {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 24px; height: 24px; border-radius: 50%; background: var(--orange-tint); color: var(--orange-type-aa); }
body.hrc-coded .v6-event__tick svg { width: 14px; height: 14px; }
body.hrc-coded .v6-event__stat { display: grid; gap: 2px; margin: 0 0 20px; }
body.hrc-coded .v6-event__stat strong {
  color: var(--ink); font: var(--w-heading) var(--fs-h2)/1 var(--font-sans); letter-spacing: var(--ls-h2); }
body.hrc-coded .v6-event__stat span { color: var(--grey); font: 400 15px/1.4 var(--font-sans); }
body.hrc-coded .v6-event__form { display: grid; gap: 14px; }
body.hrc-coded .v6-btn.is-block { display: flex; width: 100%; justify-content: center; }
body.hrc-coded .v6-event__out {
  justify-self: center; padding: 0; border: 0; background: none; cursor: pointer;
  color: var(--grey); font: var(--w-ui) var(--fs-small)/1.4 var(--font-sans); }
body.hrc-coded .v6-event__out:hover { color: var(--orange-type-aa); }

/* the stepper */
body.hrc-coded .v6-stepper { display: grid; gap: 8px; }
body.hrc-coded .v6-stepper label {
  color: var(--grey); text-transform: uppercase; letter-spacing: .04em;
  font: var(--w-ui) var(--fs-small)/1.3 var(--font-sans); }
body.hrc-coded .v6-stepper__row {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: stretch;
  border: 1px solid var(--line); border-radius: var(--radius-action); overflow: hidden; }
body.hrc-coded .v6-stepper__btn {
  border: 0; background: var(--paper-hover); color: var(--ink); cursor: pointer;
  font: var(--w-ui) 18px/1 var(--font-sans);
  transition: background var(--dur-action) var(--ease-action), color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-stepper__btn:hover:not([disabled]) { background: var(--orange-tint); color: var(--orange-type-aa); }
body.hrc-coded .v6-stepper__btn[disabled] { opacity: .35; cursor: default; }
body.hrc-coded .v6-stepper__num {
  height: 46px; border: 0; border-inline: 1px solid var(--line); background: var(--paper);
  color: var(--ink); text-align: center; font: var(--w-ui) 17px/1 var(--font-sans);
  -moz-appearance: textfield; appearance: textfield; }
body.hrc-coded .v6-stepper__num::-webkit-outer-spin-button,
body.hrc-coded .v6-stepper__num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
body.hrc-coded .v6-stepper__num:focus { outline: none; box-shadow: inset 0 0 0 2px var(--orange); }
body.hrc-coded .v6-stepper__note { margin: 0; color: var(--grey); font: 400 13px/1.5 var(--font-sans); }

/* the runs rail at the foot: the run tile, three and a bit across */
body.hrc-coded .v6-rail.v6-runs {
  display: grid; grid-auto-flow: column;
  grid-auto-columns: calc((100% - 2 * var(--gutter)) / 3);
  gap: var(--gutter); margin: 0; padding: 0 0 4px;
  overflow-x: auto; overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none; }
body.hrc-coded .v6-rail.v6-runs::-webkit-scrollbar { display: none; }
body.hrc-coded .v6-rail.v6-runs > * { scroll-snap-align: start; }

@media (max-width: 1080px) {
  body.hrc-coded .v6-event__grid { grid-template-columns: minmax(0, 1fr) 330px; gap: 44px; }
  body.hrc-coded .v6-rail.v6-runs { grid-auto-columns: calc((100% - 1.2 * var(--gutter)) / 2.2); }
  body.hrc-coded .v6-event__grid-photos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  body.hrc-coded .v6-event__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  body.hrc-coded .v6-event__aside { position: static; }
  body.hrc-coded .v6-event__facts { grid-template-columns: minmax(0, 1fr); }
  body.hrc-coded .v6-rail.v6-runs { grid-auto-columns: calc(100% - 44px); }
  body.hrc-coded .v6-event__grid-photos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Consecutive paragraphs are separated. Same cause as the heading rule above:
   the base reset zeroes every p inside a section at (0,4,1), so any component
   that set `margin: 0 0 18px` on its own paragraph lost it silently. Written
   as p + p, it adds space only between paragraphs — never before the first or
   after the last — so it cannot introduce a trailing gap. */
html body.hrc-coded:not(.hrc-coded-home) .v6-page-sec p + p { margin-top: 16px; }
/* a form or a list after a paragraph is not covered by the reset, so it states
   its own step */
html body.hrc-coded .v6-event__form { margin-top: 18px; }

/* ── the event page, second pass ─────────────────────────────────────────────
   The title leads, the series and run number sit under it, the state badge
   under that. When, where and how far moved into the card, each on its own
   line with its own mark. */
body.hrc-coded .v6-event__hero .v6-page-hero__wrap { gap: 12px; }
body.hrc-coded .v6-event__line {
  margin: 0; color: rgba(255,255,255,.88);
  font: var(--w-ui) 15px/1.4 var(--font-sans); letter-spacing: .01em; }
body.hrc-coded .v6-event__chip { margin: 2px 0 0; }

/* the card */
body.hrc-coded .v6-event__price {
  display: flex; align-items: center; gap: 9px; margin: 0 0 20px; padding: 0 0 18px;
  border-bottom: 1px solid var(--line); color: var(--ink);
  font: var(--w-heading) 26px/1 var(--font-sans); letter-spacing: -.01em; }
body.hrc-coded .v6-event__price svg { width: 20px; height: 20px; color: var(--orange); }
body.hrc-coded ul.v6-event__facts {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px;
  margin: 0 0 22px; padding: 0; list-style: none; border: 0; }
body.hrc-coded ul.v6-event__facts li { display: flex; align-items: flex-start; gap: 11px; }
body.hrc-coded .v6-event__ico { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--orange); }
body.hrc-coded .v6-event__ico svg { display: block; width: 20px; height: 20px; }
body.hrc-coded .v6-event__fact {
  display: block; min-width: 0; color: var(--ink); font: 400 15px/1.45 var(--font-sans); }
body.hrc-coded .v6-event__fact strong {
  display: block; margin-bottom: 2px; color: var(--grey); text-transform: uppercase; letter-spacing: .05em;
  font: var(--w-ui) var(--fs-small)/1.2 var(--font-sans); }
body.hrc-coded .v6-event__fact em {
  display: block; margin-top: 2px; color: var(--grey); font: 400 13px/1.45 var(--font-sans); font-style: normal; }

/* adults and children */
body.hrc-coded .v6-party { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.hrc-coded .v6-party .v6-stepper__row { grid-template-columns: 36px minmax(0, 1fr) 36px; }

/* add to calendar */
body.hrc-coded .v6-event__cal { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__cal-label {
  margin: 0 0 10px; color: var(--grey); text-transform: uppercase; letter-spacing: .05em;
  font: var(--w-ui) var(--fs-small)/1.2 var(--font-sans); }
body.hrc-coded .v6-event__cal-row { display: flex; flex-wrap: wrap; gap: 8px; }
body.hrc-coded .v6-event__cal-row a {
  display: inline-flex; align-items: center; height: 32px; padding: 0 12px; text-decoration: none;
  border: 1px solid var(--line); border-radius: var(--radius-action); color: var(--ink);
  font: var(--w-ui) 13px/1 var(--font-sans);
  transition: border-color var(--dur-action) var(--ease-action), color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-event__cal-row a:hover { border-color: var(--orange); color: var(--orange-type-aa); }

/* getting there */
body.hrc-coded .v6-event__where { margin-top: 56px; padding-top: 48px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__address { margin: 0 0 18px; color: var(--ink); font: 400 var(--fs-body)/var(--lh-body) var(--font-sans); }
body.hrc-coded .v6-map {
  position: relative; display: flex; align-items: center; justify-content: center;
  aspect-ratio: 16 / 7; overflow: hidden; border-radius: var(--radius-card);
  background: var(--paper-hover); border: 1px solid var(--line); }
body.hrc-coded .v6-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
body.hrc-coded .v6-event__apps { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; }
body.hrc-coded .v6-btn.is-sm { height: 40px; padding: 0 20px; font-size: 14px; }
body.hrc-coded .v6-event__fold { margin-top: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
body.hrc-coded .v6-event__fold > summary > span { display: inline-flex; align-items: center; gap: 9px; }
body.hrc-coded .v6-event__fold > summary svg:first-child { width: 18px; height: 18px; color: var(--orange); }
body.hrc-coded .v6-event__routefig { margin: 28px 0 0; }
body.hrc-coded .v6-event__routefig img {
  display: block; width: 100%; border-radius: var(--radius-card); background: var(--paper-hover); }
body.hrc-coded .v6-event__routefig figcaption {
  margin-top: 10px; color: var(--grey); font: 400 14px/1.5 var(--font-sans); }

/* who's there */
body.hrc-coded .v6-event__who { margin-top: 56px; padding-top: 48px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-who {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 14px; margin: 0; padding: 0; list-style: none; }
body.hrc-coded .v6-who__card {
  display: grid; justify-items: center; gap: 4px; padding: 22px 16px; text-align: center;
  border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--paper); }
body.hrc-coded .v6-who__card.is-host { border-color: var(--orange-ghost-line); background: var(--orange-tint); }
body.hrc-coded .v6-who__mark {
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  width: 76px; height: 76px; margin-bottom: 10px; border-radius: 50%;
  background: var(--ink); color: var(--paper); }
body.hrc-coded .v6-who__card:not(.is-host) .v6-who__mark { background: var(--paper-hover); color: var(--ink); }
body.hrc-coded .v6-who__mark img { width: 84%; height: 84%; object-fit: contain; }
body.hrc-coded .v6-who__card:not(.is-host) .v6-who__mark img { width: 100%; height: 100%; object-fit: cover; }
body.hrc-coded .v6-who__mark i { font: var(--w-heading) 22px/1 var(--font-sans); font-style: normal; }
body.hrc-coded .v6-who__name { color: var(--ink); font: var(--w-ui) 16px/1.3 var(--font-sans); }
body.hrc-coded .v6-who__role {
  color: var(--grey); text-transform: uppercase; letter-spacing: .06em;
  font: var(--w-ui) 11px/1.4 var(--font-sans); }
body.hrc-coded .v6-who__card.is-host .v6-who__role { color: var(--orange-type-aa); }
/* a partner's artwork on paper, never cropped or recoloured */
body.hrc-coded .v6-who__card:not(.is-host) .v6-who__mark.is-logo { background: var(--paper); border: 1px solid var(--line); }
body.hrc-coded .v6-who__card:not(.is-host) .v6-who__mark.is-logo img { width: 72%; height: 72%; object-fit: contain; }
/* stacked card actions keep the registration form's spacing */
body.hrc-coded .v6-event__acts { display: grid; gap: 14px; }

/* giveaways and prizes */
body.hrc-coded .v6-event__prizes { margin-top: 56px; padding-top: 48px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__plus {
  display: inline-flex; align-items: center; gap: 7px; margin: 0; color: var(--ink);
  font: var(--w-ui) 14px/1 var(--font-sans); }
body.hrc-coded .v6-plus-glyph { display: block; width: 15px; height: 14px; color: var(--orange); }
body.hrc-coded .v6-plus-glyph svg { display: block; width: 100%; height: 100%; fill: currentColor; }
body.hrc-coded .v6-prizes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--gutter); margin: 0; padding: 0; list-style: none; }
body.hrc-coded .v6-prize {
  overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--paper); }
body.hrc-coded .v6-prize__fig { aspect-ratio: 4 / 3; overflow: hidden; background: var(--paper-hover); }
body.hrc-coded .v6-prize__fig img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.hrc-coded .v6-prize__pad { display: grid; justify-items: start; gap: 10px; padding: 18px; }
body.hrc-coded .v6-prize__tag {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px;
  border-radius: 999px; background: var(--orange-tint); color: var(--orange-type-aa);
  font: var(--w-ui) 12px/1 var(--font-sans); }
body.hrc-coded .v6-prize__tag svg { width: 14px; height: 14px; }
body.hrc-coded .v6-prize__name { margin: 0; color: var(--ink); font: var(--w-ui) 17px/1.3 var(--font-sans); }
body.hrc-coded .v6-prize__in {
  display: inline-flex; align-items: center; gap: 7px; margin: 0; color: var(--orange-type-aa);
  font: var(--w-ui) 14px/1.3 var(--font-sans); }
body.hrc-coded .v6-prize__in svg { width: 16px; height: 16px; }

@media (max-width: 860px) {
  body.hrc-coded .v6-who { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.hrc-coded .v6-map { aspect-ratio: 4 / 3; }
}

/* ── the run page, tightened ─────────────────────────────────────────────────
   Every block under the overview sits on the same step: one section of air,
   a hairline, then the block. It was a mix of 56 and 48. */
body.hrc-coded .v6-event__where,
body.hrc-coded .v6-event__who,
body.hrc-coded .v6-event__prizes,
body.hrc-coded .v6-event__gallery {
  margin-top: 52px; padding-top: 44px; border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__route { margin-top: 0; }
body.hrc-coded .v6-event__main > :first-child { margin-top: 0; padding-top: 0; border-top: 0; }
body.hrc-coded .v6-event__where .v6-h2,
body.hrc-coded .v6-event__who .v6-h2,
body.hrc-coded .v6-event__prizes .v6-h2,
body.hrc-coded .v6-event__gallery .v6-h2 { margin-bottom: 22px; }
body.hrc-coded .v6-event__gallery .v6-rail__head,
body.hrc-coded .v6-event__prizes .v6-rail__head { margin-bottom: 22px; }
body.hrc-coded .v6-event__gallery .v6-more { margin: 22px 0 0; display: flex; justify-content: center; }
body.hrc-coded .v6-event__gallery .v6-more .v6-chev.is-down { transform: rotate(90deg); }

/* one adult, stated; children, stepped */
body.hrc-coded .v6-party { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
body.hrc-coded .v6-party__adult {
  display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: var(--radius-action); background: var(--paper-hover);
  color: var(--ink); font: 400 15px/1 var(--font-sans); }
body.hrc-coded .v6-party__num {
  display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  border-radius: 50%; background: var(--orange); color: #fff;
  font: var(--w-ui) 14px/1 var(--font-sans); }
body.hrc-coded .v6-party__you {
  margin-left: auto; color: var(--grey); text-transform: uppercase; letter-spacing: .06em;
  font: var(--w-ui) 11px/1 var(--font-sans); }
body.hrc-coded .v6-party .v6-stepper__row { grid-template-columns: 44px minmax(0, 1fr) 44px; }

/* the way into a partnership sits under the paragraph that argues for it */
/* the button belongs to the paragraph above it, not to a band of its own: the
   wrap's inherited rule and padding are dropped and the section is pulled up
   to sit one step under the copy */
html body.hrc-coded .v6-page-sec.v6-partners-apply {
  padding-top: 0; padding-bottom: var(--section);
  margin-top: calc(32px - var(--section)); }
/* the band-to-band rule is (0,5,0); this has to clear it */
html body.hrc-coded .v6-page-sec.v6-band-paper.v6-partners-apply > .v6-wrap { border-top: 0; padding-top: 0; }
body.hrc-coded .v6-partners-apply .v6-btn .v6-chev { margin-left: 2px; }

/* ── the HRC+ opening ─────────────────────────────────────────────────────
   The copy holds the left half; the three rows of member photographs ride in
   the right half, still moving, faded in from the copy and out at the edge
   and the top and bottom, so they sit behind the opening rather than under
   it. On a phone the rows drop back under the copy. */
body.hrc-coded .v6-plus-hero { min-height: 640px; display: flex; align-items: center; }
body.hrc-coded .v6-plus-hero__wrap { position: relative; z-index: 2; padding-right: 42%; box-sizing: border-box; }
body.hrc-coded .v6-plus-hero__reel {
  position: absolute; top: 0; right: 0; bottom: 0; left: 50%; z-index: 1;
  display: flex; flex-direction: column; justify-content: center; gap: 0;
  padding: 0; background: transparent; overflow: hidden; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 42%, #000 74%, transparent 100%), linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 42%, #000 74%, transparent 100%), linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
body.hrc-coded .v6-plus-hero__reel .v6-marquee { --w: clamp(240px, 21vw, 320px); --gap: 10px; padding: 5px 0; pointer-events: auto; }
/* the headline: one sentence a line, unbroken, over the fade */
body.hrc-coded .v6-plus-hero .v6-display { max-width: none; }
body.hrc-coded .v6-plus-hero .v6-display__line { display: block; white-space: nowrap; }
/* the lead runs the width of the copy column, not a narrower measure of its own */
body.hrc-coded .v6-plus-hero .v6-lead { max-width: none; }
/* eight perks, then the way to the rest */
body.hrc-coded .v6-plus-catalogue__more { display: flex; justify-content: center; margin-top: var(--stack-group); }
body.hrc-coded .v6-plus-hero__reel .v6-marquee::before, body.hrc-coded .v6-plus-hero__reel .v6-marquee::after { display: none; }
body.hrc-coded .v6-plus-hero__reel .v6-marquee__item { border-radius: var(--radius-card); }
@media (max-width: 1180px) {
  body.hrc-coded .v6-plus-hero__wrap { padding-right: 40%; }
  body.hrc-coded .v6-plus-hero__reel { left: 54%; }
}
@media (max-width: 860px) {
  body.hrc-coded .v6-plus-hero { min-height: 0; display: block; }
  body.hrc-coded .v6-plus-hero__wrap { padding-right: 0; }
  body.hrc-coded .v6-plus-hero__reel {
    position: relative; inset: auto; width: auto; margin: var(--stack-group) calc(-1 * var(--margin)) 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
    -webkit-mask-composite: source-over; mask-composite: add; }
  body.hrc-coded .v6-plus-hero__reel .v6-marquee { --w: 160px; }
  body.hrc-coded .v6-plus-hero .v6-display__line { white-space: normal; }
}

/* ── the gallery's album rail ───────────────────────────────────────────────
   Every album readable at rest: a chip on the rail's raised surface with the
   ink rule and paper type; the chosen one is the paper chip. Two arrows at the
   end of the strip step it half a width at a time, and only exist when the
   strip overflows. */
body.hrc-coded .v6-albumrail .v6-chip {
  height: 36px; padding: 0 14px; background: var(--ink-rail); border-color: var(--line-ink); color: var(--paper);
  transition: background var(--dur-action) var(--ease-action), border-color var(--dur-action) var(--ease-action), color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-albumrail .v6-chip:hover { border-color: var(--orange-on-ink); color: var(--orange-on-ink); }
body.hrc-coded .v6-albumrail .v6-chip.is-on { background: var(--paper); border-color: var(--paper); color: var(--ink); }
body.hrc-coded .v6-albumrail .v6-chip.is-on:hover { color: var(--ink); border-color: var(--paper); }
body.hrc-coded .v6-albumrail__nav { margin-left: auto; padding-left: 12px; }
body.hrc-coded .v6-albumrail .v6-rail__arrow {
  width: 36px; height: 36px; background: var(--ink-rail); border-color: var(--line-ink); color: var(--paper); }
body.hrc-coded .v6-albumrail .v6-rail__arrow:hover:not([disabled]) { border-color: var(--orange-on-ink); color: var(--orange-on-ink); }

/* ── one small action, everywhere a row or a card carries one ──────────────
   40px, 18px sides, 14px/500: the run row's View event and its Register /
   Unregister measure the same on the homepage, the series pages and inside
   HRC+. The registered state is the destructive role on paper, as it is in
   the app. The legacy sheet writes these with !important, so this does too. */
html body.hrc-coded .v6-row .v6-btn.is-sm, html body.hrc-coded .v6-card .v6-btn.is-sm {
  height: 40px !important; padding: 0 18px !important; font-size: 14px !important; }
html body.hrc-coded .hrc-register-btn, html body.hrc-coded .hrc-run-card-btn {
  height: 40px !important; min-height: 0 !important; padding: 0 18px !important; font: 500 14px/1 var(--font-sans) !important; border-radius: var(--radius-action) !important; }
html body.hrc-coded .hrc-register-btn.registered, html body.hrc-coded .hrc-register-btn.is-registered, html body.hrc-coded .hrc-register-btn[data-action="unregister"] {
  background: var(--error-tint) !important; border-color: transparent !important; color: var(--error) !important; }
html body.hrc-coded .hrc-register-btn.registered:hover, html body.hrc-coded .hrc-register-btn.is-registered:hover, html body.hrc-coded .hrc-register-btn[data-action="unregister"]:hover {
  background: var(--error-tint) !important; border-color: var(--error) !important; color: var(--error) !important; }

/* ── the header's two legacy states, corrected without touching its sheet ─── */
/* Sign out in the account menu is the destructive role on ink, as in HRC+ */
html #hrc-code-header .hn-acct-menu a.hn-out { color: var(--error-on-ink); }
html #hrc-code-header .hn-acct-menu a.hn-out:hover { color: var(--error-on-ink); background: rgba(239, 95, 91, .14); }
html #hrc-code-header .hn-acct-menu a.hn-out svg { stroke: currentColor; }
/* Contact us is the primary action: it presses to the darker orange, never to black */
html #hrc-code-header .hn-cta:hover, html #hrc-code-header .hn-cta:focus-visible { background: var(--orange-press); color: #fff; }

/* ── the bag's checkout action: the brand orange, white type ─────────────── */
html body.hrc-coded /**
 * Enventor bag drawer: a right-hand slide-in panel over a dimmed page.
 * Scoped under .enventor-bag. Fonts are inherited from the site.
 */

.enventor-bag { --bag-orange: var(--orange); --bag-action: var(--orange-press); }
html body.hrc-coded .enventor-bag-checkout, html body.hrc-coded .enventor-bag-checkout span, html body.hrc-coded .enventor-bag-checkout:hover { color: #fff; }

/* ── the newsroom article ────────────────────────────────────────────────────
   The wireframe's shape: lockup, headline and standfirst centred over the
   photograph, the dateline under it, one 50rem measure for the story with its
   photographs and captions inside it, quotes set as quotes with the person
   and their organisation under them, the notes and the media contact at the
   foot in the small style. */
body.hrc-coded .v6-news__head { padding: 72px var(--margin) 0; background: var(--paper); text-align: center; }
body.hrc-coded .v6-news__measure { max-width: 52rem; margin-inline: auto; }
body.hrc-coded .v6-news__lockup { margin: 0 0 var(--stack-group); }
body.hrc-coded .v6-news__lockup img { display: inline-block; width: auto; max-width: min(420px, 80%); height: auto; }
body.hrc-coded .v6-news__head .v6-eyebrow { margin: 0 0 var(--stack-head); }
body.hrc-coded .v6-news__title {
  margin: 0; color: var(--ink); text-wrap: balance;
  font: var(--w-heading) var(--fs-display)/var(--lh-display) var(--font-sans); letter-spacing: var(--ls-display); }
body.hrc-coded .v6-news__stand {
  margin: var(--stack-head) auto 0; max-width: 44rem; color: var(--grey);
  font: 400 var(--fs-lead)/var(--lh-lead) var(--font-sans); }

/* the photograph across the page, inside the margins */
body.hrc-coded .v6-news__hero { margin: var(--stack-group) 0 0; padding: 0 var(--margin); background: var(--paper); }
body.hrc-coded .v6-news__hero img {
  display: block; width: 100%; aspect-ratio: 3 / 2; max-height: 72vh; object-fit: cover;
  border-radius: var(--radius-card); background: var(--paper-hover); }

body.hrc-coded .v6-news__body { padding: var(--stack-group) var(--margin) var(--section); background: var(--paper); }
body.hrc-coded .v6-news__body > .v6-wrap > * { max-width: var(--measure-article); margin-inline: auto; }
body.hrc-coded .v6-news__meta {
  margin: 0 auto var(--stack-group); color: var(--grey); text-align: center;
  font: var(--w-ui) var(--fs-small)/1.4 var(--font-sans); }
body.hrc-coded .v6-news__p {
  margin: 0 0 var(--stack-block); color: var(--ink);
  font: 400 18px/1.7 var(--font-sans); }
body.hrc-coded .v6-news__p a { color: var(--orange-type-aa); text-decoration: none; border-bottom: 1px solid var(--orange-ghost-line); }
body.hrc-coded .v6-news__p a:hover { border-bottom-color: var(--orange-type-aa); }
body.hrc-coded .v6-news__h2 {
  margin: var(--stack-major) 0 var(--stack-head); color: var(--ink);
  font: var(--w-heading) var(--fs-h2)/var(--lh-h2) var(--font-sans); letter-spacing: var(--ls-h2); }
body.hrc-coded .v6-news__fig { margin: var(--stack-group) auto; }
body.hrc-coded .v6-news__fig img {
  display: block; width: 100%; border-radius: var(--radius-card); background: var(--paper-hover); }
body.hrc-coded .v6-news__fig figcaption {
  margin-top: var(--stack-tight); color: var(--grey); font: 400 14px/1.6 var(--font-sans); }
body.hrc-coded .v6-news__mark { margin: var(--stack-group) auto; text-align: center; }
body.hrc-coded .v6-news__mark img { display: inline-block; width: auto; max-width: min(320px, 70%); height: auto; }

/* the notes at the foot: about each party, then the media contact */
body.hrc-coded .v6-news__notes { margin-top: var(--stack-major); padding-top: var(--stack-group); border-top: 1px solid var(--line); }
body.hrc-coded .v6-news__notes > * { max-width: 50rem; margin-inline: auto; }
body.hrc-coded .v6-news__h3 {
  margin: var(--stack-group) 0 var(--stack-tight); color: var(--ink);
  font: var(--w-ui) 20px/1.3 var(--font-sans); letter-spacing: -.01em; }
body.hrc-coded .v6-news__notes .v6-news__h3:first-child { margin-top: 0; }
body.hrc-coded .v6-news__notes .v6-news__h2 { margin-top: var(--stack-major); }
body.hrc-coded .v6-news__p.is-note { margin-bottom: var(--stack-tight); color: var(--grey); font-size: 15px; line-height: 1.6; }

/* the quote, and the person who said it */
body.hrc-coded .v6-quote { max-width: 50rem; margin: var(--stack-group) auto; }
body.hrc-coded .v6-quote__body {
  position: relative; padding: 32px 34px 30px;
  border: 1px solid var(--orange-ghost-line); border-radius: var(--radius-card);
  background: var(--orange-tint); }
body.hrc-coded .v6-quote__glyph {
  position: absolute; top: 10px; left: 22px; color: var(--orange);
  font: var(--w-heading) 62px/1 var(--font-sans); opacity: .34; }
body.hrc-coded .v6-quote__body p {
  position: relative; margin: 0 0 14px; color: var(--ink);
  font: 400 20px/1.6 var(--font-sans); }
body.hrc-coded .v6-quote__body p:first-of-type::before { content: "\201C"; }
body.hrc-coded .v6-quote__body p:last-of-type { margin-bottom: 0; }
body.hrc-coded .v6-quote__body p:last-of-type::after { content: "\201D"; }
body.hrc-coded .v6-quote__by {
  display: flex; align-items: center; gap: 14px; margin-top: 18px; padding-left: 4px; }
body.hrc-coded .v6-quote__face {
  display: block; flex: none; width: 54px; height: 54px; overflow: hidden;
  border-radius: 50%; background: var(--paper-hover); }
body.hrc-coded .v6-quote__face img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.hrc-coded .v6-quote__who { display: grid; gap: 2px; min-width: 0; }
body.hrc-coded .v6-quote__who strong {
  color: var(--ink); font: var(--w-ui) 16px/1.35 var(--font-sans); }
body.hrc-coded .v6-quote__who span {
  color: var(--grey); font: 400 14px/1.45 var(--font-sans); }
body.hrc-coded .v6-quote__mark { display: block; width: auto; height: 16px; margin-top: 6px; }

/* more from the newsroom */
body.hrc-coded .v6-rail.v6-news__rail {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--gutter)) / 3);
  gap: var(--gutter); margin: 0; padding: 0 0 4px;
  overflow-x: auto; overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none; }
body.hrc-coded .v6-rail.v6-news__rail::-webkit-scrollbar { display: none; }
body.hrc-coded .v6-news__card { display: grid; gap: 10px; text-decoration: none; scroll-snap-align: start; }
body.hrc-coded .v6-news__card-fig {
  display: block; overflow: hidden; aspect-ratio: 3 / 2;
  border-radius: var(--radius-card); background: var(--paper-hover); }
body.hrc-coded .v6-news__card-fig img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--dur-card) var(--ease-card); }
body.hrc-coded .v6-news__card:hover .v6-news__card-fig img { transform: scale(1.035); }
body.hrc-coded .v6-news__card-date { color: var(--grey); font: var(--w-ui) var(--fs-small)/1.3 var(--font-sans); }
body.hrc-coded .v6-news__card-title { color: var(--ink); font: var(--w-ui) 17px/1.35 var(--font-sans); }

@media (max-width: 860px) {
  body.hrc-coded .v6-news__head { padding-top: 48px; }
  body.hrc-coded .v6-news__hero img { aspect-ratio: 4 / 3; }
  body.hrc-coded .v6-news__p { font-size: 17px; }
  body.hrc-coded .v6-quote__body { padding: 26px 22px 24px; }
  body.hrc-coded .v6-quote__body p { font-size: 18px; }
  body.hrc-coded .v6-rail.v6-news__rail { grid-auto-columns: calc(100% - 44px); }
}

/* ── the spacing scale ───────────────────────────────────────────────────────
   Five steps, named for the job they do, measured off the homepage, which is
   the reference for rhythm. A component uses these rather than inventing its
   own numbers; that is what kept producing uneven pages. Raw px in a component
   is now a thing to justify, not a default.

     --stack-head    a heading to whatever sits under it
     --stack-tight   lines that belong to each other
     --stack-block   one block to the next inside a group
     --stack-group   one group to the next, and the air either side of a rule
     --stack-major   one major block in a page column to the next
     --pad-card      the inside of a bordered card
*/
body.hrc-coded {
  --stack-head: 20px;
  --stack-tight: 12px;
  --stack-block: 24px;
  --stack-group: 44px;
  --stack-major: 72px;
  --pad-card: 26px;
}
@media (max-width: 860px) {
  body.hrc-coded { --stack-group: 32px; --stack-major: 52px; --pad-card: 22px; }
}

/* a card responds as one thing: it lifts, its photograph grows a little and
   the bloom follows the cursor. Nothing inside it moves on its own. */
body.hrc-coded .v6-card {
  transition: transform var(--dur-card) var(--ease-card), box-shadow var(--dur-card) var(--ease-card); }
body.hrc-coded .v6-card:hover { transform: translateY(-4px); }
body.hrc-coded .v6-card:hover .v6-card__title,
body.hrc-coded .v6-card.is-hover .v6-card__title { transform: none; }
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-card, body.hrc-coded .v6-card:hover { transform: none; transition: none; }
}

/* ── the run page, on the scale ─────────────────────────────────────────── */
body.hrc-coded .v6-event__where,
body.hrc-coded .v6-event__who,
body.hrc-coded .v6-event__prizes,
body.hrc-coded .v6-event__gallery {
  margin-top: var(--stack-group); padding-top: var(--stack-group); border-top: 1px solid var(--line); }
body.hrc-coded .v6-event__where .v6-h2,
body.hrc-coded .v6-event__who .v6-h2,
body.hrc-coded .v6-event__prizes .v6-h2,
body.hrc-coded .v6-event__gallery .v6-h2 { margin-bottom: var(--stack-head); }
body.hrc-coded .v6-event__gallery .v6-rail__head,
body.hrc-coded .v6-event__prizes .v6-rail__head { margin-bottom: var(--stack-head); }
body.hrc-coded .v6-event__address { margin: 0 0 var(--stack-block); }
body.hrc-coded .v6-event__apps { margin-top: var(--stack-tight); }
body.hrc-coded .v6-event__fold { margin-top: var(--stack-block); }
body.hrc-coded .v6-event__routefig { margin-top: var(--stack-block); }
body.hrc-coded .v6-event__gallery .v6-more { margin-top: var(--stack-block); }
body.hrc-coded .v6-event__links { margin-top: var(--stack-block); }

/* the card, on the scale */
body.hrc-coded .v6-event__card { padding: var(--pad-card); }
body.hrc-coded .v6-event__price {
  margin: 0 0 var(--stack-block); padding-bottom: var(--stack-block); }
body.hrc-coded ul.v6-event__facts { gap: var(--stack-block); margin: 0 0 var(--stack-block); }
body.hrc-coded .v6-event__form { margin-top: var(--stack-block); }
body.hrc-coded .v6-event__cal { margin-top: var(--stack-block); padding-top: var(--stack-block); }
body.hrc-coded .v6-event__cal-label { margin-bottom: var(--stack-tight); }
body.hrc-coded .v6-event__apps { margin-top: var(--stack-block); }
body.hrc-coded .v6-event__card-state { margin-bottom: var(--stack-tight); }

/* who is there, and what is up for grabs: a card keeps its size whether there
   is one of it or six, rather than stretching or shrinking to fill */
body.hrc-coded .v6-who { grid-template-columns: repeat(auto-fill, minmax(200px, 232px)); gap: var(--stack-block); }
body.hrc-coded .v6-prizes { grid-template-columns: repeat(auto-fill, minmax(240px, 300px)); gap: var(--stack-block); }
body.hrc-coded .v6-prize__pad { padding: var(--pad-card); gap: var(--stack-tight); }
body.hrc-coded .v6-who__card { padding: var(--stack-block) var(--stack-block) calc(var(--stack-block) - 4px); }

/* ── the newsroom index ─────────────────────────────────────────────────── */
body.hrc-coded .v6-newsroom .v6-feature__pad { display: grid; gap: var(--stack-tight); align-content: center; padding: var(--stack-group); }
body.hrc-coded .v6-newsroom .v6-feature__pad > * { margin: 0; }
body.hrc-coded .v6-newsroom .v6-feature__pad .v6-prose { max-width: 46ch; color: var(--grey); }
body.hrc-coded .v6-newsroom .v6-feature__date { color: var(--grey); }
body.hrc-coded .v6-newsroom .v6-card__top { padding: 0; }
body.hrc-coded .v6-newsroom .v6-feature__title { margin: 0; }
body.hrc-coded .v6-newsroom .v6-quiet { margin-top: var(--stack-tight); }

/* the map is a strip until it is asked for, not an empty hole the height of a
   photograph */
body.hrc-coded .v6-map { aspect-ratio: auto; padding: 14px; }
body.hrc-coded .v6-map.is-on { padding: 0; aspect-ratio: 16 / 7; }
body.hrc-coded .v6-map .v6-map__open { height: 40px; padding: 0 16px; font-size: 14px; }


/* ── forms, on the system: the Input component written out ──────────────
   48px fields at --radius-action on a --rule border, the label above in
   small/500, focus is the accent border with the 3px tint ring, an error is
   the error colour beside the field in one sentence. Every form on the site
   is built from these classes; a form that needs a new one needs a
   conversation first. */
body.hrc-coded .v6-form { display: grid; gap: var(--stack-block); }
body.hrc-coded .v6-form__row.is-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--stack-block); }
body.hrc-coded .v6-field { display: grid; gap: var(--stack-tight); min-width: 0; margin: 0; padding: 0; border: 0; }
body.hrc-coded .v6-field__label {
  margin: 0; color: var(--on-surface, var(--ink));
  font: var(--w-ui) var(--fs-small, 14px)/1.3 var(--font-sans); letter-spacing: 0; text-transform: none; }
body.hrc-coded .v6-field__opt { color: var(--on-surface-2, var(--grey)); font-weight: 400; }
body.hrc-coded .v6-field__input {
  box-sizing: border-box; width: 100%; height: 48px; padding: 0 16px; margin: 0;
  border: 1px solid var(--rule, var(--line)); border-radius: var(--radius-action);
  background: var(--surface, var(--paper)); color: var(--on-surface, var(--ink));
  font: 400 16px/1.4 var(--font-sans); appearance: none;
  transition: border-color var(--dur-action) var(--ease-action), box-shadow var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-field__input::placeholder { color: var(--on-surface-2, var(--grey)); }
body.hrc-coded .v6-field__input:hover { border-color: var(--on-surface-2, var(--grey)); }
body.hrc-coded .v6-field__input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px var(--orange-tint); }
body.hrc-coded .v6-field__area { height: auto; min-height: 160px; padding: 14px 16px; resize: vertical; }
body.hrc-coded .v6-field.is-invalid .v6-field__input { border-color: var(--error); }
body.hrc-coded .v6-field.is-invalid .v6-field__input:focus { box-shadow: 0 0 0 3px var(--error-tint); }
body.hrc-coded .v6-field__error, body.hrc-coded .v6-form__error {
  margin: 0; color: var(--error); font: 400 var(--fs-small, 14px)/1.4 var(--font-sans); }
body.hrc-coded .v6-form__error { padding: 12px 16px; border: 1px solid var(--error); border-radius: var(--radius-action); background: var(--error-tint); }
body.hrc-coded .v6-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; margin: 0; }

/* a small set of choices is a row of chips; the chosen one takes the accent */
body.hrc-coded .v6-choices { display: flex; flex-wrap: wrap; gap: var(--stack-tight); }
body.hrc-coded .v6-choice { position: relative; display: inline-flex; min-width: 0; cursor: pointer; }
body.hrc-coded .v6-choice input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
body.hrc-coded .v6-choice span {
  display: inline-flex; align-items: center; height: 40px; padding: 0 18px;
  border: 1px solid var(--rule, var(--line)); border-radius: var(--radius-action);
  color: var(--on-surface, var(--ink)); font: var(--w-ui) 14px/1 var(--font-sans);
  transition: border-color var(--dur-action) var(--ease-action), background var(--dur-action) var(--ease-action), color var(--dur-action) var(--ease-action); }
body.hrc-coded .v6-choice:hover span { border-color: var(--on-surface-2, var(--grey)); }
body.hrc-coded .v6-choice input:checked + span { border-color: var(--orange); background: var(--orange-tint); color: var(--orange-type-aa); }
body.hrc-coded .v6-choice input:focus-visible + span { outline: 2px solid var(--orange); outline-offset: 2px; }

body.hrc-coded .v6-form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--stack-tight) var(--stack-block); }
body.hrc-coded .v6-form__note { margin: 0; color: var(--on-surface-2, var(--grey)); }
body.hrc-coded .v6-form__done { display: grid; gap: var(--stack-tight); }
body.hrc-coded .v6-form__done .v6-tile { margin-bottom: var(--stack-tight); }
body.hrc-coded .v6-form__done .v6-card__actions { margin-top: var(--stack-tight); }

/* ── the contact page, on the scale ───────────────────────────────────── */
body.hrc-coded .v6-contact .v6-sechead + .v6-contact__ways { margin-top: var(--stack-group); }
body.hrc-coded .v6-contact__ways .v6-card__pad > .v6-tile { margin-bottom: var(--stack-head); }
/* a glyph in a tile is the 20px icon box, never the tile itself */
body.hrc-coded .v6-tile svg { display: block; width: 20px; height: 20px; }
body.hrc-coded .v6-contact__ways .v6-card__pad > .v6-card__actions { margin-top: auto; padding-top: var(--stack-block); flex-direction: column; align-items: flex-start; }
body.hrc-coded .v6-contact__ways .v6-card__pad { display: flex; flex-direction: column; }
body.hrc-coded .v6-contact__ways .v6-card__inner, body.hrc-coded .v6-contact__ways .v6-card__pad { height: 100%; box-sizing: border-box; }
body.hrc-coded .v6-contact__send { padding-top: 0; }
body.hrc-coded .v6-contact__grid { gap: var(--stack-major); }
body.hrc-coded .v6-contact__copy > * + * { margin-top: var(--stack-head); }
body.hrc-coded .v6-contact__copy > .v6-prose + .v6-dl { margin-top: var(--stack-group); }
body.hrc-coded .v6-contact__copy .v6-prose a { color: var(--orange-type-aa); }
/* the club's Tally form, light theme on a transparent ground, sits in a paper card with the rim */
body.hrc-coded .v6-contact__form {
  position: relative; padding: var(--pad-card); border-radius: var(--radius-card);
  border: 1px solid var(--line); background: var(--paper); color: var(--ink); box-shadow: none; }
body.hrc-coded .v6-contact__form iframe { display: block; width: 100%; border: 0; min-height: 600px; }
@media (max-width: 720px) {
  body.hrc-coded .v6-form__row.is-2 { grid-template-columns: minmax(0, 1fr); }
  body.hrc-coded .v6-contact__form { padding: var(--pad-card); }
  body.hrc-coded .v6-form__foot .v6-btn { width: 100%; }
}

/* ── the fold ────────────────────────────────────────────────────────────────
   The hero stops short of the bottom of the window so a strip of the partner
   band shows under it and the page reads as having more: never taller than
   hero-height, never shorter than 520px, and on a phone the phone rule holds. */
@media (min-width: 721px) {
  body.hrc-coded-home .hrc-v6-home .v6-hero { height: clamp(520px, calc(100svh - 145px - 88px), var(--hero-height)); }
}

/* ── the statement chapter: a full section of air above and below ─────────── */
body.hrc-coded-home .hrc-v6-home .s-say {
  padding-top: calc(var(--section) + 32px);
  padding-bottom: calc(var(--section) + var(--radius-chapter) + 32px); }

/* ── the header over the opening ─────────────────────────────────────────────
   On the homepage the header sits on the photograph with no ground of its
   own, the way Shopify's does: sticky at the top, clear while the page is at
   the top, and its ink ground fades in (200ms) the moment a menu is hovered
   or open, or the page has scrolled. The ground fades out again 350ms after
   the menu closes, so a cursor crossing the bar does not flicker it. The
   opening rides up under the header by the header's own height and pays it
   back in its own height and top padding, so nothing on it moves. The
   header's own sheet is not touched: everything here is an override. */
/* the outermost wrapper is the one that sticks: the inner ones are only as tall as the bar */
body.hrc-coded-home .hrc-site-header, body.hrc-coded-home .hrc-site-header-inner { background: transparent; }
body.hrc-coded-home #hrc-code-header { position: relative; background: transparent; }
/* while the header is clear, a soft shade under it keeps the type readable on a bright sky */
body.hrc-coded-home #hrc-code-header::after {
  content: ""; position: absolute; inset: 0; top: calc(var(--barh, 44px) + 1px); z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.18) 60%, rgba(0,0,0,0) 100%); }
body.hrc-coded-home #hrc-code-header .hn-hdr { background: transparent; }
body.hrc-coded-home #hrc-code-header::before {
  content: ""; position: absolute; inset: 0; top: calc(var(--barh, 44px) + 1px); z-index: 0; pointer-events: none;
  background: var(--bar, #1c1c1c); opacity: 0;
  transition: opacity 200ms cubic-bezier(.4, 0, .2, 1) 350ms; }
body.hrc-coded-home #hrc-code-header.is-stuck::before,
body.hrc-coded-home #hrc-code-header:has(.hn-hdr.hn-is-open)::before,
body.hrc-coded-home #hrc-code-header:has(.hn-mobile.hn-is-open)::before,
body.hrc-coded-home #hrc-code-header:has(.hn-acct.hn-is-open)::before,
body.hrc-coded-home #hrc-code-header:has(.hn-nav-item:hover)::before { opacity: 1; transition-delay: 0s; }
body.hrc-coded-home #hrc-code-header.is-stuck::before { transition-duration: 120ms; }
body.hrc-coded-home #hrc-code-header > * { position: relative; z-index: 1; }
body.hrc-coded-home .hrc-v6-home .v6-hero { margin-top: calc(-1 * var(--hdr-total)); }
body.hrc-coded-home .hrc-v6-home .v6-hero.is-split .v6-hero__wrap { padding-top: calc(24px + var(--hdr-total)); }
@media (min-width: 721px) {
  body.hrc-coded-home .hrc-v6-home .v6-hero { height: clamp(calc(520px + var(--hdr-total)), calc(100svh - 88px), calc(var(--hero-height) + var(--hdr-total))); }
}
@media (max-width: 720px) {
  body.hrc-coded-home .hrc-v6-home .v6-hero { height: calc(var(--hero-height) + var(--hdr-total)); }
}
@media (max-width: 480px) {
  body.hrc-coded-home .hrc-v6-home .v6-hero { height: calc(560px + var(--hdr-total)); }
}
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded-home #hrc-code-header::before { transition: none; }
}

/* ── the header follows the page ────────────────────────────────────────────
   On every page the header sticks to the top of the window as the page
   scrolls under it. Anything else that sticks (a shop sidebar, the event
   aside, the gallery's album rail, the HRC+ rail) now sticks under the
   header rather than behind it, and an anchor jump lands clear of it. */
:root { --hdr-total: 145px; --adminbar: 0px; --hdr-stick: calc(var(--hdr-total) + var(--adminbar)); }
@media (max-width: 1023px) { :root { --hdr-total: 121px; } }
body.admin-bar { --adminbar: 32px; }
@media (max-width: 782px) { body.admin-bar { --adminbar: 46px; } }
html { scroll-padding-top: calc(var(--hdr-stick) + 16px); }
.hrc-site-header { position: sticky; top: var(--adminbar); z-index: 1000; }
body.hrc-coded .v6-event__aside { top: calc(var(--hdr-stick) + 24px); }
:where(body:not(.hrc-coded-home)) .v6-albumrail { top: var(--hdr-stick); }

/* ── the dialog, the way Stripe's cards open ─────────────────────────────────
   The overlay is what scrolls, the sheet is as tall as its story and grows out
   of the card that opened it (0.8s on Stripe's curve), the photograph shows
   whole at 3:2, and the close control rides along at the top right. On a
   phone the sheet is the whole screen. */
body.hrc-coded .v6-dialog {
  display: block; padding: 48px 32px; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
body.hrc-coded .v6-dialog__sheet {
  display: block; margin: 0 auto 48px; width: min(1184px, 100%); max-height: none; overflow: visible; padding: 0;
  transform: translateY(200px); opacity: 0;
  transition: transform var(--dur-glyph) var(--ease-glyph), opacity var(--dur-bloom-in) linear; }
body.hrc-coded .v6-dialog.is-open .v6-dialog__sheet { transform: none; opacity: 1; }
body.hrc-coded .v6-dialog__close { position: sticky; top: 16px; float: right; margin: 16px 16px 0 0; z-index: 3; }
body.hrc-coded .v6-dialog__body { overflow: visible; padding: 64px; }
body.hrc-coded .v6-dialog [data-d-photo] { height: auto !important; aspect-ratio: 3 / 2; max-height: none; }
body.hrc-coded .v6-dialog__story { margin-top: 28px; max-width: var(--measure-text); }
body.hrc-coded .v6-dialog__story p { margin: 0; font-size: 17px; line-height: 1.65; }
body.hrc-coded .v6-dialog__story p + p { margin-top: 16px; }
@media (max-width: 720px) {
  body.hrc-coded .v6-dialog { padding: 0; place-items: initial; }
  body.hrc-coded .v6-dialog__sheet { width: 100%; margin: 0; min-height: 100%; max-height: none; border-radius: 0; }
  body.hrc-coded .v6-dialog__body { padding: 56px 24px 48px; }
  body.hrc-coded .v6-dialog [data-d-photo] { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-motion: reduce) {
  body.hrc-coded .v6-dialog__sheet { transition: none; transform: none; }
}

/* ── the HRC+ band: the portal in the middle, the club floating around it ── */
body.hrc-coded-home .v6-plus__stage { --u: 1px; position: relative; height: 560px; }
body.hrc-coded-home .v6-plus__tile {
  position: absolute; display: block; overflow: hidden; border-radius: var(--radius-card);
  background: var(--ink-rail); box-shadow: 0 14px 36px rgba(0, 0, 0, .38);
  animation: v6-float 7s ease-in-out infinite alternate; }
body.hrc-coded-home .v6-plus__tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.hrc-coded-home .v6-plus__tile.is-1 { left: 3%;  top: 3%;  width: calc(104 * var(--u)); height: calc(104 * var(--u)); animation-delay: -1s; }
body.hrc-coded-home .v6-plus__tile.is-2 { left: 41%; top: 0;   width: calc(88 * var(--u));  height: calc(88 * var(--u));  animation-delay: -4s; }
body.hrc-coded-home .v6-plus__tile.is-3 { left: 76%; top: 6%;  width: calc(112 * var(--u)); height: calc(112 * var(--u)); animation-delay: -2.5s; }
body.hrc-coded-home .v6-plus__tile.is-4 { left: 0;   top: 44%; width: calc(96 * var(--u));  height: calc(96 * var(--u));  animation-delay: -5.5s; }
body.hrc-coded-home .v6-plus__tile.is-5 { left: 83%; top: 46%; width: calc(100 * var(--u)); height: calc(100 * var(--u)); animation-delay: -3s; }
body.hrc-coded-home .v6-plus__tile.is-6 { left: 6%;  top: 78%; width: calc(108 * var(--u)); height: calc(108 * var(--u)); animation-delay: -6s; }
body.hrc-coded-home .v6-plus__tile.is-7 { left: 45%; top: 84%; width: calc(92 * var(--u));  height: calc(92 * var(--u));  animation-delay: -1.8s; }
body.hrc-coded-home .v6-plus__tile.is-8 { left: 74%; top: 76%; width: calc(116 * var(--u)); height: calc(116 * var(--u)); animation-delay: -4.6s; }
body.hrc-coded-home .v6-plus__device {
  position: absolute; left: 50%; top: 50%; width: 70%; transform: translate(-50%, -50%); z-index: 2;
  display: block; overflow: hidden; border-radius: var(--radius-card); background: var(--ink-rail);
  border: 1px solid rgba(255, 255, 255, .08); box-shadow: 0 32px 80px rgba(0, 0, 0, .55); }
body.hrc-coded-home .v6-plus__device img { display: block; width: 100%; height: auto; }
@keyframes v6-float { from { translate: 0 0; } to { translate: 0 -9px; } }
@media (max-width: 1180px) { body.hrc-coded-home .v6-plus__stage { --u: .85px; height: 480px; } }
@media (max-width: 860px)  { body.hrc-coded-home .v6-plus__stage { --u: .7px; height: 360px; margin-top: 40px; } body.hrc-coded-home .v6-plus__device { width: 76%; } }
@media (prefers-reduced-motion: reduce) { body.hrc-coded-home .v6-plus__tile { animation: none; } }

/* 7.37.32 - the mega panel: a partner is its mark on a small paper tile, then its name and what it is to the club */
#hrc-code-header .hn-row.hn-brand { flex-direction: column; align-items: flex-start; gap: 10px; padding: 8px 10px 10px 8px; margin-bottom: 6px; }
#hrc-code-header .hn-row.hn-brand:hover { transform: none; }
#hrc-code-header .hn-brand-tile { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 18px; border-radius: 10px; background: #ffffff; transition: transform 260ms var(--ease); }
#hrc-code-header .hn-row.hn-brand:hover .hn-brand-tile { transform: translateY(-2px); }
#hrc-code-header .hn-brand-tile img { display: block; width: auto; }
#hrc-code-header .hn-row.hn-brand .hn-lbl { font-weight: 500; }
#hrc-code-header .hn-mobile .hn-brand-tile { height: 44px; padding: 0 14px; }
#hrc-code-header .hn-mobile .hn-row.hn-brand { margin-bottom: 4px; }

/* 7.37.33 - the footer on the spacing scale (62-spacing-and-rhythm): stack-group either side of a rule, stack-head under the lockup, stack-tight under a column title */
body.hrc-coded .v6-footer__grid { padding: var(--stack-group) 0; }
body.hrc-coded .v6-footer__lines { margin-top: var(--stack-head); }
body.hrc-coded .v6-footer__hd { margin-bottom: var(--stack-tight); }
body.hrc-coded .v6-footer__legal { padding: var(--stack-group) 0; }
/* the wordmark along the base: dark on ink, the bottom half below the fold */
body.hrc-coded .v6-footer__mark { height: clamp(44px, 7.4vw, 104px); overflow: hidden; }
body.hrc-coded .v6-footer__mark svg { display: block; width: 100%; height: auto; color: rgba(255, 255, 255, .07); }

/* 7.37.33 - the account pages (sign in, create your account, reset): the lockup alone in the header, the club mark over one card on ink, help and legal under it, no footer */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) { background: var(--ink); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .hrc-site-header { position: absolute; top: var(--adminbar, 0px); left: 0; right: 0; z-index: 20; background: transparent; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-topbar, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-nav, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-actions, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-mega, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-mobile, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hn-scrim { display: none !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr { background: transparent; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr-in { height: 88px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth { min-height: 100svh; display: flex; align-items: center; justify-content: center; padding: 128px var(--margin) 56px; background: radial-gradient(56% 56% at 50% 22%, #242424 0%, var(--ink) 48%, #0f0f0f 100%); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .v6-plus__glow { display: none; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__wrap { flex-direction: column; align-items: center; gap: var(--stack-block); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__mark { display: block; width: 72px; height: 72px; margin: 0; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__card { width: min(476px, 100%); padding: 40px; box-shadow: 0 12px 20px -8px rgba(0, 0, 0, .45), 0 1px 0 rgba(255, 255, 255, .08); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__title { text-align: left; font-size: 24px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__sub { text-align: left; max-width: none; margin: var(--stack-tight) 0 0; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__body { margin-top: var(--stack-block); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-label label { font: 500 14px/1.4 var(--font-sans) !important; color: var(--ink) !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-left.um-half, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-right.um-half, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-center { width: 100% !important; float: none !important; }
/* the sign-in card's second action and its inline link: the foot carries them */
body.hrc-coded-login .v6-auth .um .um-right.um-half, body.hrc-coded-login .v6-auth .um .um-col-alt-b { display: none !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__foot { flex-direction: column; align-items: flex-start; gap: var(--stack-tight); margin-top: var(--stack-block); padding-top: var(--stack-head); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__foot span[aria-hidden] { display: none; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__foot a { border-bottom: 0; color: var(--orange-type-aa, var(--orange)); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__legal { display: grid; gap: var(--stack-tight); text-align: center; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__legal p { margin: 0; font: 400 13px/1.5 var(--font-sans); color: var(--grey-on-ink); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__legal a { color: var(--paper); text-decoration: none; transition: color var(--dur-action) var(--ease-action); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__legal a:hover { color: var(--orange); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-footer { display: none; }
@media (max-width: 600px) {
  body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth { padding: 104px var(--margin) 40px; }
  body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__card { padding: var(--pad-card); }
  body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr-in { height: 72px; }
}
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .hrc-site-header-inner, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr { background: transparent !important; box-shadow: none; border: 0; }
html body.hrc-coded:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) { background: var(--ink); }

/* 7.37.36 - the account pages, second pass */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .v6-plus__glow { display: block; }                       /* the HRC+ band's ember, as on the homepage */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth { background: var(--ink); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr-in { gap: 18px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-logo img { height: 30px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-logo-plus img { height: 24px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-logo-sep { display: block; width: 1px; height: 24px; background: rgba(255, 255, 255, .8); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__wrap { gap: 0; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__mark { display: block; width: 72px; height: 72px; margin: 0 0 var(--stack-block); color: var(--ink); }
/* the form: a checkbox sits inline with its text; two short fields share a row; the required mark is error red; links are AA orange */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um label.um-field-checkbox { display: flex !important; align-items: flex-start; gap: var(--stack-tight); width: 100% !important; float: none !important; margin: 0 !important; padding: 0 !important; cursor: pointer; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox-state { flex: 0 0 auto; margin: 1px 0 0 !important; line-height: 1; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox-option { display: block !important; float: none !important; margin: 0 !important; padding: 0 !important; font: 400 14px/1.45 var(--font-sans) !important; color: var(--ink) !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox-state i { color: var(--grey) !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox.active .um-field-checkbox-state i { color: var(--orange) !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-block { font: 400 14px/1.45 var(--font-sans); color: var(--grey); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-block a { color: var(--orange-type-aa) !important; text-decoration: none; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-block a:hover { text-decoration: underline; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-req { color: var(--error) !important; margin-left: 2px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-button:hover, body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um input[type=submit]:hover { background: var(--orange-press) !important; border-color: var(--orange-press) !important; }
body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--stack-tight); }
body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 > .um-field { grid-column: 1 / -1; }
body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 > .um-field-first_name { grid-column: 1; }
body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 > .um-field-last_name { grid-column: 2; }
@media (max-width: 480px) { body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 > .um-field-first_name, body.hrc-coded-register .v6-auth .um-row._um_row_1 .um-col-1 > .um-field-last_name { grid-column: 1 / -1; } }

/* 7.37.38 - the account pages, third pass: the two lockups centred, air under the card, checkbox to text, asterisks only where a field is being created */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-hdr-in { justify-content: center; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) #hrc-code-header .hn-logo-plus img { height: 20px; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth__legal { margin-top: var(--stack-group); }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox-state { width: 18px; margin: 1px var(--stack-tight) 0 0 !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um label.um-field-checkbox { gap: 0; }
body:is(.hrc-coded-login, .hrc-coded-password-reset) .v6-auth .um .um-req { display: none !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-checkbox-state { position: static !important; left: auto !important; top: auto !important; }
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um label.um-field-checkbox > input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; float: none; }

/* 7.37.40 - getting started with HRC+: the split fills the window. Photograph left with the HRC+ lockup and the page's words at its foot; paper right with the account card's content centred in it. */
body.hrc-coded-getting-started-with-hrc .hrc-site-header { right: 50%; }
body.hrc-coded-getting-started-with-hrc .v6-auth.is-split { padding: 0; display: block; min-height: 0; background: var(--ink); overflow: visible; }
body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-plus__glow { display: none; }
body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-auth__wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; width: 100%; max-width: none; margin: 0; min-height: 100svh; border-radius: 0; box-shadow: none; overflow: visible; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel { min-height: 100svh; display: flex; align-items: flex-end; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-in { padding: 64px var(--margin); max-width: 640px; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-plus { display: block; height: 28px; width: auto; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-in .v6-h2 { margin-top: var(--stack-head); max-width: 14em; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-in .v6-lead { margin-top: var(--stack-tight); }
body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-auth__card { width: auto; min-height: 100svh; border-radius: 0; box-shadow: none; padding: 128px max(64px, calc((100% - 396px) / 2)) 56px; display: flex; flex-direction: column; justify-content: center; align-items: stretch; }
body.hrc-coded-getting-started-with-hrc .v6-auth__actions { display: flex; flex-direction: column; gap: var(--stack-tight); }
body.hrc-coded-getting-started-with-hrc .v6-auth__actions .v6-btn { width: 100%; }
body.hrc-coded-getting-started-with-hrc .v6-auth__legal.is-in-card { margin-top: var(--stack-group); text-align: left; }
body.hrc-coded-getting-started-with-hrc .v6-auth__legal.is-in-card p { color: var(--grey); }
body.hrc-coded-getting-started-with-hrc .v6-auth__legal.is-in-card a { color: var(--ink); }
body.hrc-coded-getting-started-with-hrc .v6-auth__legal.is-in-card a:hover { color: var(--orange); }
@media (max-width: 860px) {
  body.hrc-coded-getting-started-with-hrc .hrc-site-header { right: 0; }
  body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-auth__wrap { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  body.hrc-coded-getting-started-with-hrc .v6-auth__panel { min-height: 56svh; }
  body.hrc-coded-getting-started-with-hrc .v6-auth__panel-in { padding: 120px var(--margin) 40px; }
  body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-auth__card { min-height: 0; padding: 40px var(--margin) 48px; }
}

/* 7.37.42 - getting started: no header; the joint lockup sits in the photograph above the title; on a phone the account column comes first */
body.hrc-coded-getting-started-with-hrc .hrc-site-header { display: none; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-lockup { display: flex; align-items: center; gap: 14px; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-lockup img { display: block; height: 26px; width: auto; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-lockup img.is-plus { height: 22px; }
body.hrc-coded-getting-started-with-hrc .v6-auth__panel-sep { display: block; width: 1px; height: 22px; background: rgba(255, 255, 255, .8); }
@media (max-width: 860px) {
  body.hrc-coded-getting-started-with-hrc .v6-auth.is-split .v6-auth__card { order: -1; padding-top: 56px; }
  body.hrc-coded-getting-started-with-hrc .v6-auth__panel-in { padding-top: 64px; }
}

/* 7.37.43 - the partner tiles are one size; a mark that ships on its own ground fills the tile with it */
#hrc-code-header .hn-brand-tile { width: 152px; padding: 0; overflow: hidden; }
#hrc-code-header .hn-brand-tile[style] img { height: 30px; }
#hrc-code-header .hn-mobile .hn-brand-tile { width: 140px; }
#hrc-code-header .hn-mobile .hn-brand-tile[style] img { height: 26px; }

/* 7.37.45 - not found: the page hero over a photograph, centred, then three cards on paper */
body.hrc-coded .hrc-not-found { text-align: center; }
body.hrc-coded .hrc-not-found .v6-eyebrow { color: var(--orange-on-ink); }
body.hrc-coded .hrc-not-found .v6-display { color: #fff; max-width: 14em; }
body.hrc-coded .hrc-not-found .v6-lead { color: rgba(255, 255, 255, .88); max-width: 34em; margin: 0; }
body.hrc-coded .hrc-not-found .hrc-not-found-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--stack-tight); margin-top: var(--stack-tight); }
body.hrc-coded .hrc-not-found__ways .v6-h2 { margin-bottom: var(--stack-group); }
body.hrc-coded .hrc-not-found__ways .v6-card__pad { display: flex; flex-direction: column; gap: var(--stack-tight); min-height: 100%; }
body.hrc-coded .hrc-not-found__ways .v6-card__actions { margin-top: auto; padding-top: var(--stack-tight); }
body.hrc-coded .v6-anchor { display: block; visibility: hidden; height: 0; } /* scroll-padding-top already clears the sticky header */
@media (max-width: 480px) { body.hrc-coded .hrc-not-found .hrc-not-found-actions .v6-btn { width: 100%; } }

/* 7.37.47 - mobile pass: nothing below the 12px label; quiet links get a finger-sized hit area on touch screens */
body.hrc-coded .v6-who__role { font-size: 12px; }
@media (hover: none) {
  body.hrc-coded .v6-quiet { display: inline-flex; align-items: center; min-height: 32px; }
}

/* 7.37.50 - the action audit: every control changes on hover, two heights, no pills.
   Light action: tints like the ghost and keeps its ink text (States: every interactive thing has a hover).
   Rail arrows: the 40px icon button at radius-chip, not a 42px pill; the album rail keeps the chip row's 36.
   Quiet links without a chevron, and UM's text links, underline on hover; the chevron slide stays for the rest.
   The UM primary (Update Account) deepens like every other filled action. */
body.hrc-coded .v6-btn.is-light:hover { background: var(--orange-tint); border-color: var(--orange-tint); color: var(--ink); }
body.hrc-coded .v6-rail__arrow { width: 40px; height: 40px; border-radius: var(--radius-chip); }
body.hrc-coded .v6-albumrail .v6-rail__arrow { width: 36px; height: 36px; }
body.hrc-coded .v6-quiet:not(:has(.v6-chev)):hover, body.hrc-coded .um-link:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
html body.hrc-coded .um .um-button:not(.um-alt):hover, html body.hrc-coded .um input[type=submit].um-button:not(.um-alt):hover { background: var(--orange-press) !important; border-color: var(--orange-press) !important; color: #fff !important; }

/* 7.37.52 - the phone pass (Nicholas's screenshots, 25 September) */
/* the marks strip: on a phone the lead sits above a full-width track, so the marks are in view from the first frame */
@media (max-width: 860px) {
  body.hrc-coded .v6-markband__in { flex-direction: column; align-items: stretch; gap: var(--stack-head); padding-right: 0; }
  body.hrc-coded .v6-markband__lead { white-space: normal; }
  body.hrc-coded .v6-markband__vp { width: 100%; -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 40px), transparent 100%); mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 40px), transparent 100%); }
}
/* the split hero on a phone: the two words stack directly above the copy, bottom-aligned as one block */
@media (max-width: 860px) {
  body.hrc-coded .v6-hero.is-split .v6-hero__wrap { grid-template-rows: 1fr auto auto auto; }
  body.hrc-coded .v6-hero.is-split .v6-hero__word.is-tl { grid-row: 2; align-self: end; }
  body.hrc-coded .v6-hero.is-split .v6-hero__word.is-br { grid-row: 3; grid-column: 1; justify-self: start; align-self: end; text-align: left; margin: 0 0 var(--stack-head); }
  body.hrc-coded .v6-hero.is-split .v6-hero__lede { grid-row: 4; }
}
/* a run row's facts on a phone: one per line */
@media (max-width: 860px) { body.hrc-coded .v6-row__meta { flex-direction: column; align-items: flex-start; gap: 6px; } }
/* the event card: the facts keep their air above the action (the page-section list reset outranked it) */
html body.hrc-coded .v6-page-sec ul.v6-event__facts, html body.hrc-coded .v6-event__card ul.v6-event__facts { margin: 0 0 var(--stack-block); }
/* the dialog and the lightbox sit above the sticky header, so their close controls can be reached */
body.hrc-coded .v6-dialog, body.hrc-coded .v6-lb, .v6-lb { z-index: 1200; }
/* legal pages on a phone: bullets inside the margin */
@media (max-width: 860px) { body.hrc-coded .v6-prose :is(ul, ol) { padding-left: 1.25em; } }
/* the top bar greeting: room for the descender */
html #hrc-code-header .hn-acct-btn .hn-who { line-height: 1.3; }
/* on a phone the admin bar is not fixed, so the header sticks at the very top */
@media (max-width: 782px) { body.admin-bar { --adminbar: 0px; } .hrc-site-header { top: 0; } }

/* 7.37.54 - the home page's full-size actions run full width on a phone (the HRC+ band's Join free / Learn more) */
@media (max-width: 560px) {
  body.hrc-coded .hrc-v6-home .v6-btn.is-primary:not(.is-sm), body.hrc-coded .hrc-v6-home .v6-btn.is-ghost:not(.is-sm), body.hrc-coded .hrc-v6-home .v6-btn.is-light:not(.is-sm) { width: 100%; justify-content: center; }
}
/* the sign-in error: UM paints white text on its own red, and the account pages had turned the text red too. The system's
   error is the cool red on its tint, inline under the field. */
body:is(.hrc-coded-login, .hrc-coded-register, .hrc-coded-password-reset, .hrc-coded-getting-started-with-hrc) .v6-auth .um .um-field-error,
html body.hrc-coded .um .um-field-error {
  display: block; margin: 8px 0 0; padding: 10px 12px; border-radius: var(--radius-action);
  background: var(--error-tint, #FDECE9) !important; color: var(--error, #C8321B) !important;
  font: 400 14px/1.45 var(--font-sans); }
html body.hrc-coded .um .um-field-error .um-field-arrow { display: none !important; }
html body.hrc-coded .um .um-field-error a { color: var(--error, #C8321B) !important; }
/* the page under an open mobile menu: held still without fixing the body (which is what left phones frozen) */
html.hn-lock { overflow: hidden !important; overscroll-behavior: none; }

/* 7.37.56 - the build version sits at the end of the legal row, same grey as the copyright */
body.hrc-coded .v6-footer__ver { font-variant-numeric: tabular-nums; }

/* 7.37.59 - the tablet band, 600-1023px (iPad portrait, the iPhone Duo unfolded): two columns where a phone has one,
   the run row and the HRC+ run card keep their desktop shape, the apparel grid stops squeezing three cards in */
@media (min-width: 600px) and (max-width: 1023px) {
  body.hrc-coded .v6-cards.is-2, body.hrc-coded .v6-cards.is-3, body.hrc-coded .v6-cards.is-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.hrc-coded .hrc-v6-home .v6-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.hrc-coded .v6-row { grid-template-columns: 112px minmax(0, 1fr) auto; }
  body.hrc-coded .hrc-run-card { grid-template-columns: minmax(0, 1fr) auto; }
  body.hrc-coded:not(.hrc-coded-home) .enventor-shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
/* the desktop nav between 1024 and 1180 (iPad landscape): tighter, and no label breaks onto two lines */
@media (min-width: 1024px) and (max-width: 1180px) {
  html #hrc-code-header .hn-hdr-in { gap: 16px; padding: 0 20px; }
  html #hrc-code-header .hn-nav { gap: 0; }
  html #hrc-code-header .hn-nav-btn { font-size: 15px; padding: 0 8px; white-space: nowrap; }
  html #hrc-code-header .hn-cta { padding: 0 14px; margin-left: 4px; font-size: 15px; white-space: nowrap; }
}

/* 7.37.60 - the top bar's next-run tag is a link now; the quiet variant carries no live dot */
html #hrc-code-header .hn-topbar a.hn-tag { color: inherit; text-decoration: none; }
html #hrc-code-header .hn-topbar a.hn-tag:hover { color: #fff; }
