/* refresh.css: the site-wide refresh layer for the subpages (the homepage carries the same rules inline).
   Load it after the page's own <style> so it wins equal-specificity rules.
   Square corners, neutral bands, themed browser surfaces, labels in sentence-case sans instead of
   tracked mono caps, and the motion grammar driven by motion.js (hidden start states only under
   html.hp-motion, which motion.js sets; without JavaScript everything stays visible). */

/* ---- tokens ---- */
:root, html { --radius-sm: 0 !important; --radius-md: 0 !important; --surface-sunken: #F1F0ED !important; }
:root { --hp-band: #F1F0ED; --hp-rule: #DCD9D3; }

/* ---- browser surfaces ---- */
::selection { background: var(--accent); color: #FFFFFF; }
html { scrollbar-color: #B5B1AA var(--bg); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 0; }
.tnum { font-variant-numeric: tabular-nums lining-nums; }

/* ---- labels: sentence-case sans, not tracked mono caps ---- */
.uc-eyebrow, .uc-chip, .uc-pipe-label, .uc-transcript-tag, .uc-pipe-mid span, .uc-report-foot, .uc-rank-prev, .uc-rank-num,
nav[aria-label="Breadcrumb"] ol {
  font-family: var(--font-sans) !important; text-transform: none !important; letter-spacing: 0 !important;
}
.uc-eyebrow { font-size: .9375rem !important; font-weight: 600; }
.uc-chip, .uc-pipe-label, .uc-transcript-tag, .uc-pipe-mid span, .uc-report-foot { font-size: 12.5px !important; font-weight: 600; }
nav[aria-label="Breadcrumb"] ol { font-size: .9375rem !important; }

/* ---- square shapes (true circles such as photos, dots and step nodes keep border-radius:50%) ---- */
.uc-tag, .uc-bar, .uc-bar > span { border-radius: 0 !important; }

/* ---- no thick coloured edge accents on boxes ---- */
.uc-hidden-row, .uc-quotes { border-left-width: 1px !important; }

/* ---- readable small text ---- */
.uc-rank-prev, .uc-pipe-label, .uc-transcript-tag { color: var(--ink-soft) !important; }

/* ---- motion grammar (shared with the homepage) ---- */
html.hp-motion .hp-rh { clip-path: inset(0 0 100% 0); transform: translate3d(0, .45em, 0); transition: clip-path 1100ms cubic-bezier(.16,1,.3,1), transform 1100ms cubic-bezier(.16,1,.3,1); }
html.hp-motion .hp-rh.hp-in { clip-path: inset(-10% 0 -25% 0); transform: none; }
html.hp-motion .hp-rb { opacity: 0; transform: translate3d(0, 34px, 0); filter: blur(6px); transition: opacity 900ms cubic-bezier(.16,1,.3,1), transform 1100ms cubic-bezier(.16,1,.3,1), filter 900ms cubic-bezier(.16,1,.3,1); transition-delay: calc(var(--hp-i, 0) * 70ms + 80ms); }
html.hp-motion .hp-rb.hp-in { opacity: 1; transform: none; filter: none; }

/* hero: breadcrumb, title, lead and action rise in on load (CSS only, so no flash and no JS needed) */
@keyframes hpHeroRise { from { opacity: 0; transform: translate3d(0, 36px, 0); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@media (prefers-reduced-motion: no-preference) {
  .hp-rise { animation: hpHeroRise 1200ms cubic-bezier(.16,1,.3,1) both; animation-delay: var(--hp-d, 120ms); }
}
#top > div:first-child { will-change: transform; }