/* ===================================================================
   Site-wide consistency pass (13 October 2026).
   Loaded last on every page, after the section packages, so the same
   kind of element looks the same everywhere. Every rule here comes from
   a WebKit audit of all 20 pages at 1440 and 390px; the majority style
   of the site's own sections is the standard.

   Specialised sections keep their own display type, because there the
   large type is the design itself: the five page heroes, the
   championship trophy selector (the selected cup's name), the prizes
   poster, the Cricket Guides book and the Duration and exclusivity
   heading.

   The !important flags are deliberate: the packages set these values
   with their own, often more specific, selectors, and this layer exists
   to override all of them.
   =================================================================== */

/* 1. Eyebrow labels. The audit found 11-17px at 0.12-0.28em (and 9-10px
      on phones). The site's own majority is 14px, 0.15em, bold. */
main :is(.eyebrow, .zc-eyebrow, .zgo-eyebrow, .zs-eyebrow, .zsa-eyebrow, .zg-eyebrow, .zh-eyebrow, .znh-eyebrow, .z4-eyebrow, .znf-kicker):not(:is([aria-hidden="true"], [class*="device"], dialog) *) {
  font: 600 var(--ds-eyebrow)/1.25 var(--ds-ui) !important;
  letter-spacing: .14em !important;
}
/* Card tags (small labels inside cards) were 9-13px. */
main .v-tag { font-size: 12px !important; letter-spacing: 0.14em !important; }
@media (max-width: 700px) {
  main :is(.eyebrow, .zc-eyebrow, .zgo-eyebrow, .zs-eyebrow, .zsa-eyebrow, .zg-eyebrow, .zh-eyebrow, .znh-eyebrow, .z4-eyebrow, .znf-kicker):not(:is([aria-hidden="true"], [class*="device"], dialog) *) {
    font-size: var(--ds-eyebrow) !important;
  }
  /* About's map city labels dropped to 7px on phones. */
  main .zg-city { font-size: 10px !important; }
}

/* 2. Decorative outline words. Faint 100-346px watermark words (PPI,
      CLUB, COMMUNITY, 3 YEARS, WEEKDAYS, RECORD) behind ordinary
      sections. They carry no information and crowd the copy. */
main :is(.ppi-outline, .v-outline-word, .v5-three-years, .zc-giant-word, .zgo-outline) { display: none !important; }
/* The Sponsors audience graph reserved 65-95px above its icons for its
   watermark word; with the word gone, the space goes too. On narrow
   phones the four labels were squeezed into one row, so they sit 2 x 2
   there, without the decorative wire that joins them in a line. */
main .v-audience { padding-top: 0 !important; min-height: 0 !important; }
@media (max-width: 420px) {
  main .v-audience-nodes { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; row-gap: 4px !important; }
  main .v-audience > :is(.v-wire, .v-live-wire) { display: none !important; }
}
/* U18 is the under-18 section's actual illustration (letters, badge and
   tagline, positioned relative to each other), so it stays and is scaled
   as one unit. The scale property composes with the reveal transform. */
@media (min-width: 701px) { main .pl-u18-art { scale: 0.75; } }

/* 3. Step numbers (01, 02, 03...). Six sizes, 34-106px, across the
      site's step lists. One size everywhere; each list keeps its style. */
main :is(.v-outline-number, .ch-stage-num, .v3-thresholds li > strong, .tr-step-n, .v5-step-n, .step-title .v-num) {
  font-size: 40px !important;
  line-height: 1 !important;
}
/* Step numerals drawn behind step artwork were 76-155px. */
main .zgo-step-number { font-size: 72px !important; }
main .zs-step-number { font-size: 56px !important; }
@media (max-width: 700px) {
  main :is(.v-outline-number, .ch-stage-num, .v3-thresholds li > strong, .tr-step-n, .v5-step-n, .step-title .v-num) { font-size: 32px !important; }
  main .zgo-step-number { font-size: 56px !important; }
  main .zs-step-number { font-size: 44px !important; }
}

/* Shared call-to-action style across page and section packages. */
html body main :is(.button, .zh-cta, .zc-cta, .zgo-button, .zs-button, .zt-button, .zps-button, .znh-button, .z4-button, .znf-button, .tp-button):not(:is([aria-hidden="true"], [class*="device"], dialog, .form-card) *) {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  min-height: 48px !important;
  height: auto !important;
  padding: 13px 24px !important;
  border: 1px solid #2984ff !important;
  border-radius: 10px !important;
  background: #0062ff !important;
  color: #fff !important;
  box-shadow: none !important;
  font: 700 1rem/1.25 "Barlow Condensed", sans-serif !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  text-decoration: none !important;
  text-align: center !important;
  max-width: 100%;
}
html body main :is(.button, .zh-cta, .zc-cta, .zgo-button, .zs-button, .zt-button, .zps-button, .znh-button, .z4-button, .znf-button, .tp-button):hover {
  background: #0754d9 !important;
  border-color: #168dff !important;
}
html body main :is(.button, .zh-cta, .zc-cta, .zgo-button, .zs-button, .zt-button, .zps-button, .znh-button, .z4-button, .znf-button, .tp-button):focus-visible {
  outline: 3px solid #00bfff !important;
  outline-offset: 4px !important;
}
html body main :is(.button, .zh-cta, .zc-cta, .zgo-button, .zs-button, .zt-button, .zps-button, .znh-button, .z4-button, .znf-button, .tp-button) svg {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0;
}
html body main #start-a-club .actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
html body main #start-a-club .actions .button {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
}
@media(max-width: 700px) {
  html body main :is(.button, .zh-cta, .zc-cta, .zgo-button, .zs-button, .zt-button, .zps-button, .znh-button, .z4-button, .znf-button, .tp-button) {
    font-size: 1rem !important;
    padding: 13px 24px !important;
  }
}

/* 5. Body copy. Main paragraphs were 14px on phones on Corporate,
      College and Careers (16px elsewhere), and the championship cycle's
      step text was 13px. */
@media (max-width: 700px) {
  main :is(.v5-copy, .section-copy) > p:not(.eyebrow):not(.note) { font-size: 16px !important; }
}
main .ch-stage p { font-size:var(--ds-copy)!important; }

/* 6. No pause / motion buttons. Every section package shipped its own
      (Pause motion, Pause effects, Pause animation, or a bare Ⅱ), 54 of
      them across the site. They are hidden rather than deleted because
      several package scripts look their button up and would stop
      working without it. Motion still stops for anyone whose device
      asks for reduced motion, and pauses off screen and in hidden tabs. */
:is(.zh-motion, .znh-motion, .zgf-motion, .zpv3-motion-toggle, .zt-motion,
    .zc-motion-toggle, .zc-pause, .zgo-pause, .zsa-motion, .zs-motion,
    .motion-control, .z4-motion, .znf-motion, [data-zinga-motion-toggle]) {
  display: none !important;
}
