/*
Theme Name: UK Gaming Club
Theme URI: https://ukgamingclub.uk
Author: UK Gaming Club Editorial
Author URI: https://ukgamingclub.uk
Description: Icy Swiss child theme for UK Gaming Club. One content measure, zero radii, hairline rules, one crimson accent. Own header and footer chrome, independent of the Astra header builder version.
Template: astra
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: ukgc
*/

/* 01 - Design tokens */

:root {
  --ukgc-ground: #F4F6F8;
  --ukgc-paper: #FFFFFF;
  --ukgc-ink: #16181D;
  --ukgc-ink-soft: #3A4A5A;
  --ukgc-ink-pale: #5A6470;
  --ukgc-accent: #C8102E;
  --ukgc-accent-deep: #9C0C24;
  /* Alias kept so every hover state resolves */
  --ukgc-accent-dark: #9C0C24;
  --ukgc-rule: #D8DDE2;
  --ukgc-rule-col: #E3E7EB;
  --ukgc-panel: #EDF1F5;
  --ukgc-footer-ground: #EEF1F4;
  --ukgc-zebra: #FAFBFC;
  --ukgc-measure: 72rem;
  --ukgc-stack: "Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif;
  --ukgc-hairline: 1px solid var(--ukgc-rule);
}

/* 02 - Base reset and typography */

*,
*::before,
*::after {
  box-sizing: border-box;
  border-radius: 0;
}

html {
  background-color: var(--ukgc-ground);
}

body {
  margin: 0;
  font-family: var(--ukgc-stack);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--ukgc-ink);
  background-color: var(--ukgc-ground);
  font-variant-numeric: tabular-nums;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

body.ukgc-site {
  font-family: var(--ukgc-stack);
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--ukgc-stack);
  color: var(--ukgc-ink);
  line-height: 1.2;
}

p {
  overflow-wrap: break-word;
}

table {
  border-collapse: collapse;
}

/* 03 - Selection, focus, links */

::selection {
  background: var(--ukgc-accent);
  color: #FFFFFF;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--ukgc-accent);
  outline-offset: 2px;
}

input:focus,
select:focus,
textarea:focus {
  outline: 2px solid var(--ukgc-accent);
  outline-offset: 1px;
}

.ukgc-body a {
  color: var(--ukgc-ink);
  text-decoration: underline;
  text-decoration-color: var(--ukgc-accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  transition: color 120ms linear;
}

.ukgc-body a:hover,
.ukgc-body a:focus-visible {
  color: var(--ukgc-accent-dark);
  text-decoration-color: var(--ukgc-accent);
}

/* 04 - Motion guard */

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    transition: none;
    animation: none;
    scroll-behavior: auto;
  }
}

/* 05 - Astra compatibility layer */

.site-content .ast-container {
  max-width: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.site-content .ast-row {
  margin-left: 0;
  margin-right: 0;
  max-width: none;
}

#primary,
.site-main {
  float: none;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.entry-content {
  max-width: none;
  margin: 0;
  padding: 0;
}

.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
  background-color: transparent;
  border-bottom: 0;
  margin: 0;
  padding: 0;
}

/* The one measure contract leaves no room for a sidebar column */
#secondary,
.ast-separate-container #secondary,
.widget-area {
  display: none;
}

.ast-pagination {
  max-width: var(--ukgc-measure);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 32px);
}

.ast-pagination .page-numbers {
  border: 0;
  color: var(--ukgc-ink-soft);
}

.ast-pagination .page-numbers.current,
.ast-pagination .page-numbers:hover {
  background-color: var(--ukgc-panel);
  color: var(--ukgc-accent);
}

/* Header and footer are full bleed bands with the same inner measure */
.main-header-bar .ast-container,
.site-footer .ast-container,
#colophon .ast-container {
  max-width: var(--ukgc-measure);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: clamp(16px, 4vw, 32px);
  padding-right: clamp(16px, 4vw, 32px);
}

/* 06 - The one width rule */

.ukgc-sheet {
  max-width: var(--ukgc-measure);
  margin-inline: auto;
  padding-inline: clamp(16px, 4vw, 32px);
  padding-block: 0.5rem clamp(2.5rem, 5vw, 4rem);
}

.ukgc-sheet > * {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* 07 - Micro label system */

.ukgc-eyebrow,
.ukgc-crumbs,
.ukgc-ticker__label,
.ukgc-contents__label,
.ukgc-board__rank,
.ukgc-board__scorelabel,
.ukgc-board__micro,
.ukgc-table thead th,
.ukgc-compare thead th,
.ukgc-calc label,
.ukgc-calc__label,
.ukgc-care h2,
.ukgc-care h3,
.ukgc-onward h2,
.ukgc-onward h3,
.ukgc-micro {
  font-family: var(--ukgc-stack);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.ukgc-eyebrow {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
  margin: 0 0 0.75rem;
}

.ukgc-micro {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ukgc-ink-pale);
  margin: 0 0 0.5rem;
}

/* 08 - Breadcrumbs */

.ukgc-crumbs {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
  border-bottom: var(--ukgc-hairline);
  padding-block: 0.75rem;
  margin-bottom: 0;
}

.ukgc-crumbs a {
  color: var(--ukgc-ink-pale);
  text-decoration: none;
  transition: color 120ms linear;
}

.ukgc-crumbs a:hover,
.ukgc-crumbs a:focus-visible {
  color: var(--ukgc-accent);
}

.ukgc-crumbs__sep {
  color: var(--ukgc-ink-pale);
  padding-inline: 0.5rem;
}

.ukgc-crumbs [aria-current="page"],
.ukgc-crumbs__current {
  color: var(--ukgc-ink);
}

/* 09 - Hero */

.ukgc-hero {
  padding-block: 2.5rem 1.5rem;
  margin-block: 0;
}

.ukgc-hero h1,
.ukgc-hero .ukgc-hero__title {
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4.5vw, 3rem);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -0.025em;
}

.ukgc-standfirst,
.ukgc-hero .ukgc-standfirst {
  margin: 0;
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  line-height: 1.5;
  color: var(--ukgc-ink-pale);
  max-width: none;
}

/* 10 - Ticker strip */

.ukgc-ticker {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 1.5rem;
  row-gap: 0.4rem;
  border-top: var(--ukgc-hairline);
  border-bottom: var(--ukgc-hairline);
  padding-block: 0.9rem;
  margin-block: 0 2.5rem;
}

.ukgc-ticker__label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
}

.ukgc-ticker__num,
.ukgc-ticker strong {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.015em;
  font-variant-numeric: tabular-nums;
  color: var(--ukgc-ink);
}

.ukgc-ticker__caption,
.ukgc-ticker small {
  font-size: 0.9rem;
  color: var(--ukgc-ink-pale);
}

/* 11 - Contents strip */

.ukgc-contents {
  border-top: var(--ukgc-hairline);
  border-bottom: var(--ukgc-hairline);
  padding-block: 1rem;
  margin-block: 0 2.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 1.5rem;
  row-gap: 0.5rem;
}

.ukgc-contents__label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
  flex: 0 0 auto;
}

.ukgc-contents ol,
.ukgc-contents ul {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  column-gap: 1.1rem;
  row-gap: 0.35rem;
  counter-reset: ukgc-toc;
  flex: 1 1 auto;
  min-width: 0;
}

.ukgc-contents li {
  counter-increment: ukgc-toc;
}

.ukgc-contents li::before {
  content: counter(ukgc-toc) ". ";
  color: var(--ukgc-accent);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.ukgc-contents a {
  color: var(--ukgc-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--ukgc-rule);
  transition: color 120ms linear, border-color 120ms linear;
}

.ukgc-contents a:hover,
.ukgc-contents a:focus-visible {
  color: var(--ukgc-accent);
  border-bottom-color: var(--ukgc-accent);
}

/* 12 - The comparison board */

.ukgc-boardlead {
  font-size: 1rem;
  color: var(--ukgc-ink);
  margin: 1.25rem 0 0.75rem;
  max-width: none;
}

.ukgc-board {
  border: var(--ukgc-hairline);
  background: var(--ukgc-paper);
  padding: 1.25rem;
  margin: 1.25rem 0 2rem;
}

.ukgc-board__cols {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.ukgc-board__col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-width: 0;
  border: var(--ukgc-hairline);
  background: var(--ukgc-paper);
  padding: 1rem;
  border-radius: 0;
}

.ukgc-board__rank {
  align-self: flex-start;
  display: inline-block;
  background: var(--ukgc-accent);
  color: #FFFFFF;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.5rem;
  line-height: 1.3;
}

.ukgc-board__brand {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

.ukgc-board__score {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
}

.ukgc-board__scorenum {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--ukgc-ink);
}

.ukgc-board__scorelabel {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
}

.ukgc-board__offer {
  margin: 0;
  font-weight: 600;
  font-size: 0.95rem;
}

.ukgc-board__chips {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: var(--ukgc-hairline);
  flex: 1 1 auto;
}

.ukgc-board__chips li {
  padding: 0.4rem 0;
  border-bottom: var(--ukgc-hairline);
  font-size: 0.85rem;
  color: var(--ukgc-ink-pale);
}

.ukgc-board__chips li:last-child {
  border-bottom: 0;
}

.ukgc-board__cta {
  display: block;
  width: 100%;
  text-align: center;
  background: var(--ukgc-accent);
  color: #FFFFFF;
  border: 0;
  font: inherit;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  padding: 0.7rem 0.75rem;
  cursor: pointer;
  border-radius: 0;
  transition: background-color 120ms linear, color 120ms linear;
}

.ukgc-board__cta:hover,
.ukgc-board__cta:focus-visible {
  background: var(--ukgc-accent-dark);
  color: #FFFFFF;
  text-decoration: none;
}

.ukgc-board__terms {
  font-size: 0.75rem;
  color: var(--ukgc-ink-pale);
  margin: 0;
}

/* Board breakpoints */

@media (max-width: 1099px) {

  .ukgc-board__cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 599px) {

  .ukgc-board__cols {
    grid-template-columns: 1fr;
  }
}

/* 13 - Data tables */

.ukgc-table-wrap,
.ukgc-compare-wrap {
  overflow-x: auto;
  overflow-y: hidden;
  width: 100%;
  margin: 1.25rem 0;
  -webkit-overflow-scrolling: touch;
}

.ukgc-table,
.ukgc-compare {
  width: 100%;
  border-collapse: collapse;
  background: var(--ukgc-paper);
  font-size: 0.9rem;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}

.ukgc-table {
  min-width: 40rem;
}

.ukgc-compare {
  min-width: 56rem;
}

.ukgc-table thead th,
.ukgc-compare thead th {
  text-align: left;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid var(--ukgc-ink);
}

.ukgc-table thead th:not(:first-child),
.ukgc-compare thead th:not(:first-child) {
  text-align: right;
}

.ukgc-table tbody th,
.ukgc-compare tbody th {
  text-align: left;
  font-weight: 600;
  padding: 0.6rem 0.9rem;
  border-bottom: var(--ukgc-hairline);
}

.ukgc-table tbody td,
.ukgc-compare tbody td {
  padding: 0.6rem 0.75rem;
  border-bottom: var(--ukgc-hairline);
  vertical-align: top;
  color: var(--ukgc-ink);
}

/* Column separators, the only vertical rules allowed */
.ukgc-table thead th + thead th,
.ukgc-table tbody td + tbody td,
.ukgc-table tbody th + tbody td,
.ukgc-compare thead th + thead th,
.ukgc-compare tbody td + tbody td,
.ukgc-compare tbody th + tbody td {
  border-left: 1px solid var(--ukgc-rule-col);
}

.ukgc-table tbody td:not(:first-child),
.ukgc-compare tbody td:not(:first-child) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.ukgc-table tbody tr:first-child td,
.ukgc-compare tbody tr:first-child td {
  border-top: 1px solid var(--ukgc-ink);
}

.ukgc-table tbody tr:hover,
.ukgc-compare tbody tr:hover {
  background: var(--ukgc-zebra);
}

.ukgc-table tbody td:first-child,
.ukgc-compare tbody td:first-child {
  font-weight: 600;
}

/* Status tags */

.ukgc-tag--uk,
.ukgc-tag--off {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.25rem 0.55rem;
  white-space: nowrap;
  border-radius: 0;
}

.ukgc-tag--uk {
  background: var(--ukgc-ink-soft);
  color: #FFFFFF;
  border: 1px solid var(--ukgc-ink-soft);
}

.ukgc-tag--off {
  background: transparent;
  color: var(--ukgc-accent);
  border: 1px solid var(--ukgc-accent);
}

.ukgc-compare-note {
  font-size: 0.8rem;
  color: var(--ukgc-ink-pale);
  border-top: var(--ukgc-hairline);
  margin: 0.75rem 0 0;
  padding-top: 0.6rem;
}

/* 14 - Figures and chart ink */

.ukgc-figure {
  border: var(--ukgc-hairline);
  background: var(--ukgc-paper);
  padding: 1rem;
  margin: 1.5rem 0;
}

.ukgc-figure__title {
  margin: 0 0 1rem;
  font-size: 1rem;
  font-weight: 700;
}

.ukgc-figure img,
.ukgc-figure svg {
  width: 100%;
  height: auto;
  display: block;
}

.ukgc-figure figcaption,
.ukgc-figure__caption {
  border-top: var(--ukgc-hairline);
  margin-top: 0.6rem;
  padding-top: 0.5rem;
  font-size: 0.8rem;
  line-height: 1.5;
  color: var(--ukgc-ink-pale);
}

.ukgc-figure text {
  font-family: var(--ukgc-stack);
  font-variant-numeric: tabular-nums;
}

.ukgc-ch-axis {
  fill: #5A6470;
  stroke: none;
}

.ukgc-ch-axis line,
.ukgc-ch-axis path,
.ukgc-ch-axis polyline {
  stroke: #5A6470;
  fill: none;
}

.ukgc-ch-grid {
  stroke: #D8DDE2;
  fill: none;
}

.ukgc-ch-grid line,
.ukgc-ch-grid path,
.ukgc-ch-grid polyline {
  stroke: #D8DDE2;
  fill: none;
}

/* Series: lines get stroke, bars and markers get fill */
.ukgc-ch-series-1 {
  stroke: #C8102E;
  fill: none;
}

.ukgc-ch-series-1 rect,
.ukgc-ch-series-1 circle {
  fill: #C8102E;
}

.ukgc-ch-series-2 {
  stroke: #3A4A5A;
  fill: none;
}

.ukgc-ch-series-2 rect,
.ukgc-ch-series-2 circle {
  fill: #3A4A5A;
}

.ukgc-ch-label {
  fill: #16181D;
  stroke: none;
}

/* 15 - Calculator */

.ukgc-calc {
  border: var(--ukgc-hairline);
  background: var(--ukgc-panel);
  padding: 1.25rem;
  margin: 1.5rem 0;
}

.ukgc-calc__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 1rem;
}

.ukgc-calc__field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.ukgc-calc label,
.ukgc-calc__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
}

.ukgc-calc input[type="number"],
.ukgc-calc input[type="text"],
.ukgc-calc select {
  width: 100%;
  font: inherit;
  color: var(--ukgc-ink);
  background: var(--ukgc-paper);
  border: 1px solid var(--ukgc-rule);
  border-radius: 0;
  padding: 0.5rem 0.6rem;
  font-variant-numeric: tabular-nums;
}

.ukgc-calc input::placeholder {
  color: var(--ukgc-ink-pale);
}

.ukgc-calc__out {
  background: var(--ukgc-paper);
  border: var(--ukgc-hairline);
  padding: 0.9rem 1rem;
  margin-top: 1rem;
  font-variant-numeric: tabular-nums;
}

.ukgc-calc__headline {
  font-weight: 700;
  margin: 0 0 0.5rem;
}

.ukgc-calc__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.3rem 0;
  border-bottom: var(--ukgc-hairline);
  font-variant-numeric: tabular-nums;
}

.ukgc-calc__row:last-child {
  border-bottom: 0;
}

.ukgc-calc__rowlabel {
  color: var(--ukgc-ink-pale);
}

.ukgc-calc__rowval {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.ukgc-calc__note {
  font-size: 0.78rem;
  color: var(--ukgc-ink-pale);
  margin: 0.75rem 0 0;
}

.ukgc-calc__fields > .ukgc-calc__field:first-child:nth-last-child(1) {
  grid-column: 1 / -1;
}

@media (max-width: 599px) {

  .ukgc-calc__fields {
    grid-template-columns: 1fr;
  }
}

/* 16 - FAQ */

.ukgc-faq {
  margin: 2rem 0;
}

.ukgc-faq details {
  border-bottom: var(--ukgc-hairline);
}

.ukgc-faq details:first-child,
.ukgc-faq details:first-of-type {
  border-top: var(--ukgc-hairline);
}

.ukgc-faq summary {
  position: relative;
  cursor: pointer;
  padding: 0.8rem 2rem 0.8rem 0;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.4;
  color: var(--ukgc-ink);
  list-style: none;
  transition: color 120ms linear;
}

.ukgc-faq summary::-webkit-details-marker {
  display: none;
}

.ukgc-faq summary::after {
  content: "+";
  position: absolute;
  right: 0;
  top: 0.7rem;
  color: var(--ukgc-accent);
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1;
}

.ukgc-faq details[open] summary::after {
  content: "-";
}

.ukgc-faq details[open] summary {
  color: var(--ukgc-accent-dark);
}

.ukgc-faq summary:hover {
  color: var(--ukgc-accent-dark);
}

.ukgc-faq__a {
  padding: 0 0 1rem;
  color: var(--ukgc-ink);
  line-height: 1.6;
}

.ukgc-faq__a p,
.ukgc-faq details > p {
  margin: 0;
}

/* h3 and p variant of the FAQ */

.ukgc-faq h3 {
  border-top: var(--ukgc-hairline);
  margin: 1.5rem 0 0.4rem;
  padding-top: 1.1rem;
  font-size: 1rem;
  font-weight: 700;
}

.ukgc-faq h3 + p {
  margin-top: 0;
}

/* 17 - Care block */

.ukgc-care {
  border: var(--ukgc-hairline);
  border-left: 3px solid var(--ukgc-accent);
  background: var(--ukgc-panel);
  padding: 1.1rem 1.25rem;
  margin: 2rem 0;
  font-size: 0.92rem;
  line-height: 1.6;
}

.ukgc-care h2,
.ukgc-care h3 {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ukgc-ink);
  margin: 0 0 0.6rem;
}

.ukgc-care p {
  font-size: 0.92rem;
  line-height: 1.6;
  margin: 0 0 0.6rem;
}

.ukgc-care a {
  color: var(--ukgc-ink);
  text-decoration: underline;
  text-decoration-color: var(--ukgc-accent);
  text-underline-offset: 2px;
}

.ukgc-care a:hover {
  color: var(--ukgc-accent-dark);
}

.ukgc-care__stat {
  color: var(--ukgc-ink-pale);
  margin-bottom: 0;
}

.ukgc-care > :last-child {
  margin-bottom: 0;
}

/* 18 - Onward links */

.ukgc-onward {
  margin: 2rem 0;
}

.ukgc-onward h2,
.ukgc-onward h3 {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--ukgc-ink-pale);
  margin: 0 0 0.75rem;
  padding-bottom: 0.6rem;
  border-bottom: var(--ukgc-hairline);
}

.ukgc-onward ul,
.ukgc-onward ol {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem 2rem;
}

.ukgc-onward li {
  border-left: 2px solid var(--ukgc-rule);
  padding-left: 0.75rem;
  font-size: 0.95rem;
}

.ukgc-onward a {
  color: var(--ukgc-ink);
  text-decoration: underline;
  text-decoration-color: var(--ukgc-accent);
  text-underline-offset: 2px;
  transition: color 120ms linear;
}

.ukgc-onward a:hover,
.ukgc-onward a:focus-visible {
  color: var(--ukgc-accent-dark);
}

@media (max-width: 767px) {

  .ukgc-onward ul,
  .ukgc-onward ol {
    grid-template-columns: 1fr;
  }
}

/* 19 - Colophon */

.ukgc-colophon {
  border-top: var(--ukgc-hairline);
  margin-top: 3rem;
  padding: 1.25rem 0 2.5rem;
  font-size: 0.8rem;
  line-height: 1.6;
  color: var(--ukgc-ink-pale);
}

.ukgc-colophon p {
  margin: 0 0 0.5rem;
}

.ukgc-colophon strong,
.ukgc-colophon b {
  color: var(--ukgc-ink);
  font-weight: 700;
}

.ukgc-colophon a {
  color: var(--ukgc-ink);
  text-decoration: underline;
  text-decoration-color: var(--ukgc-rule);
  text-underline-offset: 2px;
}

.ukgc-colophon a:hover {
  color: var(--ukgc-accent-dark);
  text-decoration-color: var(--ukgc-accent);
}

/* 20 - Body prose defaults */

.ukgc-body {
  font-size: 1rem;
  margin-block: 0 2.5rem;
}

.ukgc-body > * {
  max-width: 100%;
  min-width: 0;
}

.ukgc-body h2,
h2.ukgc-h2 {
  font-size: clamp(1.35rem, 2.4vw, 1.7rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
  margin: 3rem 0 0;
  padding-bottom: 0.5rem;
  border-bottom: var(--ukgc-hairline);
}

h2.ukgc-h2 + p,
.ukgc-body h2 + p {
  margin-top: 1rem;
}

.ukgc-body h3 {
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 2.25rem 0 0.6rem;
}

.ukgc-body h4 {
  font-size: 1.02rem;
  font-weight: 700;
  margin: 1.75rem 0 0.5rem;
}

.ukgc-body h2:first-child {
  margin-top: 0.5rem;
}

.ukgc-body p {
  line-height: 1.65;
  margin: 0 0 1.1rem;
}

.ukgc-body ul,
.ukgc-body ol {
  margin: 0 0 1.1rem;
  padding-left: 1.5rem;
}

.ukgc-body li {
  margin: 0 0 0.35rem;
}

.ukgc-body li::marker {
  color: var(--ukgc-ink-pale);
}

.ukgc-body blockquote {
  margin: 1.75rem 0;
  padding: 0.2rem 0 0.2rem 1.4rem;
  border-left: 1px solid var(--ukgc-ink-soft);
  color: var(--ukgc-ink-soft);
  font-size: 1.02rem;
}

.ukgc-body blockquote p:last-child {
  margin-bottom: 0;
}

.ukgc-body hr {
  border: 0;
  border-top: var(--ukgc-hairline);
  margin: 2.5rem 0;
}

.ukgc-body strong,
.ukgc-body b {
  font-weight: 700;
}

/* 21 - Utility site pages modifier */

.ukgc-page--site .ukgc-body {
  line-height: 1.7;
}

.ukgc-page--site .ukgc-body p {
  margin-bottom: 1.25rem;
}

.ukgc-page--site .ukgc-hero {
  padding-block: clamp(1.5rem, 3vw, 2.25rem) 1rem;
}

/* 22 - Site header */

#masthead,
.site-header,
.main-header-bar {
  background-color: var(--ukgc-paper);
  border-bottom: var(--ukgc-hairline);
  box-shadow: none;
}

.site-branding {
  padding-block: 0.9rem;
  line-height: 1.2;
}

.site-title,
.site-title a {
  font-family: var(--ukgc-stack);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--ukgc-ink);
  text-decoration: none;
}

.site-title a:hover,
.site-title a:focus-visible {
  color: var(--ukgc-ink);
}

.site-description {
  color: var(--ukgc-ink-pale);
  font-size: 0.78rem;
}

/* Navigation stays one row and scrolls when it cannot fit */

.main-header-bar-navigation,
.main-navigation {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.main-navigation ul,
.main-header-menu,
.ast-inline-menu {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.main-navigation li,
.main-header-menu .menu-item {
  white-space: nowrap;
}

.main-navigation a,
.main-header-menu .menu-link,
.ast-inline-menu .menu-link {
  font-family: var(--ukgc-stack);
  font-size: 0.95rem;
  color: var(--ukgc-ink-soft);
  text-decoration: none;
  padding: 0.6rem 0.8rem;
  white-space: nowrap;
  transition: color 120ms linear;
}

.main-navigation a:hover,
.main-navigation a:focus-visible,
.main-header-menu .menu-link:hover,
.main-header-menu .menu-link:focus-visible,
.ast-inline-menu .menu-link:hover,
.ast-inline-menu .menu-link:focus-visible {
  color: var(--ukgc-accent);
}

.main-navigation ul ul {
  background: var(--ukgc-paper);
  border: var(--ukgc-hairline);
  box-shadow: none;
  min-width: 12rem;
}

.ast-mobile-menu-trigger-fill,
.ast-mobile-menu-trigger-minimal,
.menu-toggle {
  color: var(--ukgc-ink);
  background: transparent;
  border: 1px solid var(--ukgc-rule);
  border-radius: 0;
}

@media (max-width: 600px) {

  .main-navigation a,
  .main-header-menu .menu-link,
  .ast-inline-menu .menu-link {
    font-size: 0.9rem;
    padding: 0.5rem 0.55rem;
  }

  .site-title,
  .site-title a {
    font-size: 1.2rem;
  }
}

/* 23 - Site footer */

.site-footer,
#colophon {
  background-color: var(--ukgc-footer-ground);
  border-top: var(--ukgc-hairline);
  margin-top: 0;
  color: var(--ukgc-ink-pale);
  font-size: 0.85rem;
  padding-block: 2rem;
}

.site-footer .ukgc-sheet {
  padding-block: 0;
}

.site-footer p {
  color: var(--ukgc-ink-pale);
  font-size: 0.85rem;
  margin: 0 0 0.5rem;
}

.site-footer a {
  color: var(--ukgc-ink-soft);
  text-decoration: none;
  transition: color 120ms linear;
}

.site-footer a:hover,
.site-footer a:focus-visible {
  color: var(--ukgc-accent);
}

.site-footer nav ul,
.footer-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1rem;
}

.site-footer nav a,
.footer-nav a {
  font-size: 0.85rem;
  padding: 0.25rem 0;
  display: inline-block;
}

/* 24 - Small screen guards */

@media (max-width: 400px) {

  .ukgc-board {
    padding: 0.9rem;
  }

  .ukgc-board__col {
    padding: 0.85rem;
  }

  .ukgc-calc {
    padding: 1rem;
  }

  .ukgc-figure {
    padding: 0.75rem;
  }

  .ukgc-hero h1 {
    font-size: 1.9rem;
  }
}

/* Board refresh placeholder */

.ukgc-board--refresh {
  border-top: 1px solid var(--ukgc-rule);
  border-bottom: 1px solid var(--ukgc-rule);
}

.ukgc-board__refresh {
  margin: 0;
  padding: 1.25rem 0;
  color: var(--ukgc-ink);
}

.ukgc-board__refresh::before {
  content: none;
}

/* 25 - Own chrome templates: teaser list and page title support */

.ukgc-teaser {
  border-bottom: var(--ukgc-hairline);
  padding-block: 1.25rem;
}

.ukgc-teaser__h {
  margin: 0 0 0.35rem;
  font-size: 1.2rem;
  font-weight: 700;
}

.ukgc-teaser__h a {
  color: var(--ukgc-ink);
  text-decoration: none;
}

.ukgc-teaser__h a:hover,
.ukgc-teaser__h a:focus-visible {
  color: var(--ukgc-accent);
}

.ukgc-teaser__meta {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  color: var(--ukgc-ink-pale);
  font-variant-numeric: tabular-nums;
}

.ukgc-sheet--tmpl {
  padding-block: 0 clamp(2.5rem, 5vw, 4rem);
}