/* Brand layer (allbirds practice) — fonts + media radius, §9.9 layer 3 */
@font-face { font-display: swap; font-family: Geograph; font-style: normal; font-weight: 400; src: url(/fonts/allbirds/geograph-regular.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: Geograph; font-style: normal; font-weight: 500; src: url(/fonts/allbirds/geograph-medium.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: Geograph; font-style: normal; font-weight: 700; src: url(/fonts/allbirds/geograph-bold.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Akkurat Mono"; font-style: normal; font-weight: 400; src: url(/fonts/allbirds/akkurat-mono.woff2) format("woff2"); }

/* allbirds rounds all media tiles (their tokens: --radius:20px, xl tiers). 12px matches our card radius. */
img.el-image:not(.uk-border-circle) { border-radius: 12px; }
.uk-inline-clip { border-radius: 12px; overflow: hidden; }

/* less compress strips the unit off 0px custom properties; calc(50% - 0) is invalid and
   breaks uk-position-center-* placement. Restore the unit. */
:root { --uk-position-margin-offset: 0px; }

/* NASA brand type (scoped): heavy grotesque headings, Helvetica body — Geograph must not leak. */
.nasa, .nasa p, .nasa .uk-text-small { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.nasa { font-size: 17px; }
.nasa h1, .nasa h2, .nasa h3, .nasa .uk-h1, .nasa .uk-h2, .nasa .uk-h3,
.nasa [class*="uk-heading-"] { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 700; letter-spacing: -0.01em; }

/* BBC brand (scoped): Reith Serif headlines, Reith Sans body/meta, square corners. */
.bbc, .bbc p, .bbc .uk-text-small { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.bbc h1, .bbc h2, .bbc h3, .bbc .uk-h1, .bbc .uk-h2, .bbc .uk-h3, .bbc .el-title,
.bbc [class*="uk-heading-"] { font-family: Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: 0; }
.bbc .uk-text-meta { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: none; letter-spacing: 0; color: #5A5A5A; }
.bbc .uk-button { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: none; letter-spacing: 0; }
.bbc img.el-image:not(.uk-border-circle), .bbc .uk-inline-clip { border-radius: 0; }
.bbc .uk-card { border-radius: 0; }

/* NASA pages are square-cornered — the allbirds radius must not leak across brands. */
.nasa img.el-image:not(.uk-border-circle), .nasa .uk-inline-clip { border-radius: 0; }

/* NASA news cards (§9.9 layer 3): bottom gradient scrim behind bottom-left text. */
.nasa-card .uk-inline-clip { position: relative; }
.nasa-card .uk-inline-clip::after { content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.05) 40%, rgba(0,0,0,.82) 100%); }
.nasa-card .uk-inline-clip > [class*="uk-position-"] { z-index: 1; }

/* WIRED brand (scoped, exam r5real3): real fonts self-hosted from wired.com/.design/fonts. */
@font-face { font-display: swap; font-family: WiredDisplay; font-weight: 400; src: url(/fonts/wired/wireddisplay.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "WIRED Mono"; font-weight: 400; src: url(/fonts/wired/wiredmono-regular.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "WIRED Mono"; font-weight: 700; src: url(/fonts/wired/wiredmono-bold.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: Apercu; font-weight: 700; src: url(/fonts/wired/apercu-bold.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: Apercu; font-weight: 400; src: url(/fonts/wired/apercu-regular.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Breve Text"; font-weight: 400; src: url(/fonts/wired/brevetext-book.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Breve Text"; font-weight: 700; src: url(/fonts/wired/brevetext-bold.woff2) format("woff2"); }

/* tokens_wired.json: display headlines WiredDisplay 400; card titles Apercu 700;
   deks/body Breve Text serif; rubrics WIRED Mono 700 uppercase; B/W; radius 0. */
.wired, .wired p, .wired .uk-text-small { font-family: "Breve Text", Georgia, serif; }
.wired h1, .wired h2, .wired .uk-h1, .wired .uk-h2, .wired [class*="uk-heading-"] {
  font-family: WiredDisplay, "Arial Narrow", sans-serif; font-weight: 400; letter-spacing: 0; }
.wired h3, .wired .uk-h3, .wired .el-title { font-family: Apercu, Helvetica, sans-serif; font-weight: 700; }
.wired .uk-text-meta { font-family: "WIRED Mono", Monaco, monospace; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: #1a1a1a; }
.wired img.el-image:not(.uk-border-circle), .wired .uk-inline-clip, .wired .uk-card { border-radius: 0; }
.wired .uk-button { font-family: Apercu, Helvetica, sans-serif; text-transform: none; letter-spacing: 0; }

/* WIRED title roles (clip-audit round 1): feature/SE titles are WiredDisplay 26px 400;
   category-grid story titles are Breve serif 19px 400. */
.wired .wd .el-title { font-family: WiredDisplay, "Arial Narrow", sans-serif; font-weight: 400; font-size: 26px; line-height: 1.15; }
.wired .st .el-title { font-family: "Breve Text", Georgia, serif; font-weight: 400; font-size: 19px; line-height: 1.55; }
.wired .el-meta { font-size: 11px; }

/* Wychavon Town brand (scoped, r5real4 — a Webx-built site). tokens: Open Sans everywhere;
   h1 67/700; h3 22/600; body 22/300 lh 1.5; pills radius 500px sage #CBD081 / orange #D0542A;
   navy #2E333F; cream map band; square media. */
@font-face { font-display: swap; font-family: "Open Sans"; font-weight: 300; src: url(/fonts/wychavon/opensans-300.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Open Sans"; font-weight: 400; src: url(/fonts/wychavon/opensans-400.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Open Sans"; font-weight: 600; src: url(/fonts/wychavon/opensans-600.woff2) format("woff2"); }
@font-face { font-display: swap; font-family: "Open Sans"; font-weight: 700; src: url(/fonts/wychavon/opensans-700.woff2) format("woff2"); }
.wyc, .wyc p, .wyc .uk-text-small { font-family: "Open Sans", Arial, sans-serif; }
.wyc p { font-size: 22px; font-weight: 300; line-height: 1.5; }
.wyc h1, .wyc .uk-h1, .wyc [class*="uk-heading-"] { font-family: "Open Sans", Arial, sans-serif; font-weight: 700; letter-spacing: 0; }
.wyc h3, .wyc .uk-h3, .wyc .el-title { font-family: "Open Sans", Arial, sans-serif; font-weight: 600; }
.wyc .uk-text-meta { font-family: "Open Sans", Arial, sans-serif; text-transform: none; letter-spacing: 0; }
.wyc img.el-image:not(.uk-border-circle), .wyc .uk-inline-clip, .wyc .uk-card { border-radius: 0; }
.wyc .uk-button { font-family: "Open Sans", Arial, sans-serif; font-weight: 700; font-size: 14px;
  text-transform: none; letter-spacing: 0; border-radius: 500px; }
.wyc .uk-button-primary { background: #CBD081; color: #2E333F; }
.wyc .uk-button-secondary { background: #D0542A; color: #fff; }
/* hero: orange corner slice behind the navy (brand geometry, layer-3 flourish) */
.wyc-hero { position: relative; overflow: hidden; }
.wyc-hero::before { content: ""; position: absolute; top: 0; left: 0; width: 420px; height: 340px;
  background: #D0542A; clip-path: polygon(0 0, 100% 0, 0 100%); z-index: 0; }
.wyc-hero > * { position: relative; z-index: 1; }

/* wychavon footer: their own green blob SVG over the photo; content above. */
.wyc-footer { position: relative; overflow: hidden; }
.wyc-footer::before { content: none; }
.wyc-footer > * { position: relative; z-index: 1; }
/* wychavon sibling cards: gentle bottom scrim for the white title + pill */
.wyc-card .uk-inline-clip { position: relative; }
.wyc-card .uk-inline-clip::after { content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%); }
.wyc-card .uk-inline-clip > [class*="uk-position-"] { z-index: 1; }

.wyc-footer li { margin-top: 10px; }
.wyc-hero::before { width: 420px; height: 340px; }

/* WebX Wychavon brand tokens + utility classes (recreated from the live customizer). */
:root { --brand-charcoal: #2E333F; --brand-orange: #D0542A; --brand-beige: #F3E9DC; --brand-sage: #CBD081; }
.uk-section-beige { background-color: var(--brand-beige); }
.uk-section-charcoal { background-color: var(--brand-charcoal); color: #fff; }
.uk-text-light-orange { color: var(--brand-orange); }
.uk-text-thin { font-weight: 300; }
.uk-text-bold { font-weight: 700; }
