/* Figures whose source is too small to fill the reading column: cap and centre
   rather than upscale. Marked in the markup, so it is never guesswork. */
figure[data-small-source] { max-width: 420px; margin-left: auto; margin-right: auto; }
figure[data-small-source] figcaption { text-align: center; }

/* Responsive layer. The archive is built with inline styles, so its desktop
   geometry cannot express breakpoints; this sheet re-lays it out below 1080px
   by matching the inline style patterns it uses. Substrings avoid colons so
   they match however the browser serialises the style attribute. Nothing here
   applies at desktop widths. */

/* ---------- tablet: sidebars stop being sidebars ---------- */
@media (max-width: 1080px) {
  [style*="1fr 320px"],
  [style*="1fr 280px"],
  [style*="1fr 260px"],
  [style*="1fr 340px"],
  [style*="1fr 360px"],
  [style*="1fr 300px"],
  [style*="1fr 380px"],
  [style*="260px 1fr"],
  [style*="230px 1fr"],
  [style*="5fr 7fr"],
  [style*="7fr 5fr"],
  [style*="1.4fr 1fr 1fr 1fr"],
  [style*="minmax(300px,4fr) minmax(420px,7fr)"],
  [style*="minmax(300px, 4fr) minmax(420px, 7fr)"] {
    grid-template-columns: 1fr !important;
    gap: 44px !important;
  }
  [style*="repeat(6,1fr)"], [style*="repeat(6, 1fr)"],
  [style*="repeat(5,1fr)"], [style*="repeat(5, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  [style*="repeat(4,1fr)"], [style*="repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  /* A collapsed sidebar is a full-width column, so constrain its media by WIDTH.
     Capping height on an aspect-ratio box silently changes the ratio and makes
     object-fit: cover crop hard — never do that. */
  aside > div > [style*="aspect-ratio"],
  aside > div > x-import,
  aside [style*="aspect-ratio"],
  [data-sidebar-media] [style*="aspect-ratio"],
  [data-sidebar-media] > x-import,
  article[id] > div:nth-child(2) > [style*="aspect-ratio"] { max-width: 300px; }
  aside > div > div[data-slot-caption],
  aside figcaption,
  [data-sidebar-media] > div[data-slot-caption],
  [data-sidebar-media] figcaption,
  article[id] > div:nth-child(2) > div:not([style*="aspect-ratio"]) { max-width: 300px; }
  wales-map, journey-map { max-height: 520px; display: block; overflow: hidden; }
  [style*="position: sticky"], [style*="position:sticky"] {
    position: static !important;
  }
  /* the fact strip that straddles the hero edge on desktop */
  [style*="translateY(50%)"] {
    transform: none !important;
    margin-top: 36px !important;
  }
  [style*="48px 36px 0"] { padding-bottom: 48px !important; }
}

/* ---------- mobile: one column, tighter rhythm, smaller display type ---------- */
@media (max-width: 760px) {
  [style*="1240px"], [style*="1180px"], [style*="1120px"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  [style*="132px 36px"], [style*="112px 36px"], [style*="110px 36px"],
  [style*="108px 36px"], [style*="96px 36px"], [style*="88px 36px"],
  [style*="84px 36px"], [style*="76px 36px"], [style*="72px 36px"],
  [style*="64px 36px"] {
    padding-top: 52px !important;
    padding-bottom: 44px !important;
  }
  [style*="repeat(6,1fr)"], [style*="repeat(6, 1fr)"],
  [style*="repeat(5,1fr)"], [style*="repeat(5, 1fr)"],
  [style*="repeat(4,1fr)"], [style*="repeat(4, 1fr)"],
  [style*="repeat(3,1fr)"], [style*="repeat(3, 1fr)"],
  [style*="1fr 1fr 1fr"],
  [style*="1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="110px 1fr"] { grid-template-columns: 76px 1fr !important; }
  h1 { font-size: clamp(32px, 8.6vw, 44px) !important; line-height: 1.08 !important; max-width: none !important; }
  h2 { font-size: clamp(24px, 6vw, 30px) !important; line-height: 1.18 !important; }
  h3 { font-size: clamp(19px, 4.6vw, 23px) !important; }
  /* editorial lede / display figures set inline above 30px */
  [style*="font-size: 76px"], [style*="font-size:76px"],
  [style*="font-size: 72px"], [style*="font-size:72px"],
  [style*="font-size: 66px"], [style*="font-size:66px"],
  [style*="font-size: 64px"], [style*="font-size:64px"],
  [style*="font-size: 60px"], [style*="font-size:60px"],
  [style*="font-size: 58px"], [style*="font-size:58px"],
  [style*="font-size: 56px"], [style*="font-size:56px"],
  [style*="font-size: 54px"], [style*="font-size:54px"],
  [style*="font-size: 52px"], [style*="font-size:52px"] {
    font-size: clamp(30px, 8vw, 40px) !important;
  }
  [style*="font-size: 44px"], [style*="font-size:44px"],
  [style*="font-size: 42px"], [style*="font-size:42px"],
  [style*="font-size: 40px"], [style*="font-size:40px"],
  [style*="font-size: 38px"], [style*="font-size:38px"],
  [style*="font-size: 36px"], [style*="font-size:36px"],
  [style*="font-size: 34px"], [style*="font-size:34px"] {
    font-size: clamp(22px, 5.6vw, 28px) !important;
  }
  [style*="font-size: 23px"], [style*="font-size:23px"],
  [style*="font-size: 24px"], [style*="font-size:24px"] {
    font-size: 19px !important;
  }
  [style*="font-size: 19px"], [style*="font-size:19px"],
  [style*="font-size: 18px"], [style*="font-size:18px"] {
    font-size: 17px !important;
  }
  [style*="font-size: 17.5px"], [style*="font-size:17.5px"] {
    font-size: 16.5px !important;
  }
  /* wide gaps read as dead space on a narrow screen */
  [style*="gap: 88px"], [style*="gap:88px"],
  [style*="gap: 72px"], [style*="gap:72px"],
  [style*="gap: 64px"], [style*="gap:64px"] { gap: 36px !important; }
  /* header: wordmark over controls, nav becomes a swipeable rail */
  header > div:first-child { align-items: flex-start !important; flex-direction: column !important; gap: 16px !important; }
  header nav > div {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    column-gap: 22px !important;
  }
  header nav > div::-webkit-scrollbar { display: none; }
  header nav a { white-space: nowrap; }
  /* portrait frames keep their ratio; they are simply not allowed to be huge */
  aside [style*="aspect-ratio"], aside > div > x-import { max-width: 300px; }
  [style*="aspect-ratio"] { max-width: 100%; }
  [style*="aspect-ratio"] > img,
  [style*="aspect-ratio"] > image-slot { height: 100% !important; object-fit: cover; }
  /* any row-based data list that would otherwise squeeze */
  [style*="overflow-x"] { -webkit-overflow-scrolling: touch; }
  /* comfortable tap targets */
  header nav a, footer a { padding-top: 10px !important; padding-bottom: 10px !important; }
  input, button, select { font-size: 16px !important; min-height: 44px; }
}

/* ---------- small phones ---------- */
@media (max-width: 460px) {
  [style*="1240px"], [style*="1180px"], [style*="1120px"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  [style*="110px 1fr"], [style*="76px 1fr"] { grid-template-columns: 1fr !important; }
  [style*="letter-spacing: 0.26em"], [style*="letter-spacing:0.26em"],
  [style*="letter-spacing: 0.24em"], [style*="letter-spacing:0.24em"] { letter-spacing: 0.16em !important; }
}

/* ---------- pointer-coarse niceties ---------- */
@media (hover: none) {
  a, button { -webkit-tap-highlight-color: rgba(196, 154, 58, 0.25); }
}