/* Hallmark · shape: Federation index · genre: editorial · theme: custom (design.md) · job: attend · idea: "Who runs Asian weightlifting, what it stands for, and where its records and photographs live." · vibe: "arena-dark, poster-loud, scoreboard-exact"
 * paper: oklch(98.5% 0.004 91.4) · accent: oklch(43.3% 0.178 29.2) · display: Barlow Condensed 800 · body: Inter · hero: poster, the lead story's photograph full-bleed with the head low-left; the live centre while a championship runs · nav: slab, a red bar on a yellow rule · footer: mast, the logo large over the offices · imagery: photographs, AWF's own · signature: the results desk, medals set like a scoreboard
 * axes: warm-paper/condensed-caps/red-yellow · posture: full palette · contrast: pass · fold: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 · weakest: P, a federation's committees are lists of names by nature; each body became a sheet with its name set as a display head beside portrait cards, so 92 seats read as one federation, not a directory dump */

/* ---------- Shared ---------- */
.ia-measure { max-width: var(--measure); }
.ia-flow > * + * { margin-top: var(--space-lg); }
.ia-flow > .ia-subhead, .ia-flow > .ia-timeline, .ia-flow > .ia-roster, .ia-flow > .ia-spec, .ia-flow > .ia-figures { margin-top: var(--space-2xl); }
.ia-flow > h3.ia-subhead { margin-top: var(--space-xl); }
.ia-flow > .ia-subhead + * { margin-top: var(--space-md); }
.ia-flow > :first-child { margin-top: 0; }
.ia-body .ia-flow > .ia-p:first-child { font-size: var(--text-lead); line-height: 1.5; }
.ia-p { font-size: var(--text-md); line-height: 1.6; max-width: var(--measure); }
.ia-lines, .ia-list, .ia-prose { max-width: var(--measure); }
.ia-lines p { line-height: 1.6; }
.ia-lines p + p { margin-top: var(--space-2xs); }
.ia-list { margin: 0; padding-left: var(--space-lg); line-height: 1.6; }
.ia-list li + li { margin-top: var(--space-xs); }
.ia-list li::marker { color: var(--color-red); }
.ia-prose > * + * { margin-top: var(--space-md); }
.ia-p a, .ia-lines a, .ia-list a, .ia-prose a { text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
.ia-p a:hover, .ia-lines a:hover, .ia-list a:hover, .ia-prose a:hover { text-decoration-color: var(--color-mark); text-decoration-thickness: 2px; }
.ia-p a:focus-visible, .ia-lines a:focus-visible, .ia-list a:focus-visible, .ia-prose a:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.ia-p a:active, .ia-lines a:active, .ia-list a:active, .ia-prose a:active { color: var(--color-mark); }
.ia-subhead { overflow-wrap: break-word; min-width: 0; }
h3.ia-subhead { font-size: var(--text-title); }

/* Figures in the text: side by side at one height (each grows by its own width to height ratio) */
.ia-figures { display: flex; flex-wrap: wrap; gap: var(--space-md); max-width: calc(var(--measure) + 16rem); }
.ia-figure { flex: var(--ia-ratio, 1.5) 1 0; min-width: min(100%, 14rem); margin: 0; background: var(--color-paper-3); }
.ia-figure__img { display: block; width: 100%; height: auto; }

/* ---------- Portrait: 4:5 in its own colour; it leans in on hover and focus (site.css, Photographs) ---------- */
.ia-portrait { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--color-paper-3); }
.ia-portrait__img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.ia-portrait--initials { display: grid; place-items: center; background: var(--color-arena-2); color: var(--color-on-arena-2); }
.ia-portrait__initials { font: 800 var(--text-display-s)/1 var(--font-display); text-transform: uppercase; }

/* ---------- Person card ----------
 * The card is a size container and the name scales with it (10% of the card, 13 to 20px), so the longest
 * one-word names (Uppariputtanggoon, about 0.95 of the card) stay whole in the narrowest cards instead of
 * breaking mid-word. Lead and feature names keep their own display size. */
.ia-person { position: relative; display: grid; gap: var(--space-sm); align-content: start; min-width: 0; container-type: inline-size; }
.ia-person__body { display: grid; gap: var(--space-2xs); align-content: start; min-width: 0; }
.ia-person__name { margin: 0; max-width: none; font: 600 var(--text-lg)/1.25 var(--font-body); font-size: clamp(var(--text-xs), 10cqi, var(--text-lg)); overflow-wrap: break-word; min-width: 0; }
.ia-person__link { color: inherit; text-decoration: none; }
.ia-person__link::after { content: ""; position: absolute; inset: 0; z-index: var(--z-raised); }
.ia-person__link:hover { text-decoration: underline; text-decoration-color: var(--color-mark); text-decoration-thickness: 2px; text-underline-offset: 0.2em; }
.ia-person__link:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.ia-person__role { font-size: var(--text-sm); color: var(--color-ink-2); }
.ia-person__country { display: flex; align-items: center; gap: var(--space-xs); font-size: var(--text-sm); color: var(--color-ink-2); }
.ia-person--lead .ia-person__name, .ia-person--feature .ia-person__name { font: 800 var(--text-3xl)/1.02 var(--font-display); text-transform: uppercase; max-width: 14ch; }
.ia-person--lead .ia-person__role, .ia-person--feature .ia-person__role { font-size: var(--text-md); font-weight: 600; color: var(--color-ink); }
.ia-person--lead .ia-person__body, .ia-person--feature .ia-person__body { gap: var(--space-xs); }
.ia-person--feature { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--space-lg); align-items: end; }

/* ---------- Hub head: the two facts as scoreboard numerals ---------- */
.ia-head { padding-block: var(--space-3xl) var(--space-2xl); }
.ia-head__inner { display: grid; gap: var(--space-2xl); }
.ia-head__text { display: grid; gap: var(--space-lg); }
.ia-head__lead { color: var(--color-on-arena-2); }
.ia-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) var(--space-2xl); margin: 0; padding: 0; list-style: none; }
.ia-fact { border-top: 4px solid var(--color-yellow); }
.ia-fact__link { display: grid; gap: var(--space-xs); justify-items: start; padding-top: var(--space-md); color: inherit; text-decoration: none; }
.ia-fact__num { font: 800 var(--text-numeral)/1 var(--font-display); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ia-fact__label { font-weight: 600; font-size: var(--text-lg); line-height: 1.3; }
.ia-fact__link:hover .ia-fact__label { text-decoration: underline; text-decoration-color: var(--color-mark); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
.ia-fact__link:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 4px; }

/* ---------- Hub: the lead photograph straddles the arena and the paper ---------- */
.ia-leadphoto { margin: 0; background: linear-gradient(to bottom, var(--color-arena) 50%, var(--color-paper) 50%); }
.ia-leadphoto__frame { width: calc(100% - 2 * var(--gutter)); max-width: calc(var(--container) - 2 * var(--gutter)); margin-inline: auto; aspect-ratio: 2 / 1; overflow: clip; background: var(--color-arena-2); }
.ia-leadphoto__img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }

/* ---------- Hub: about AWF, the introduction beside the collage ---------- */
.ia-about { padding-block: var(--space-3xl) var(--space-2xl); }
.ia-about__inner { display: grid; gap: var(--space-xl) var(--space-2xl); align-items: center; }
.ia-about__inner--figure { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
.ia-about__text { display: grid; gap: var(--space-lg); align-content: start; }
.ia-about__title { overflow-wrap: break-word; min-width: 0; }
.ia-about__p { max-width: var(--measure); font-size: var(--text-lead); line-height: 1.5; }
.ia-about__figure { margin: 0; background: var(--color-paper-3); }
.ia-about__img { display: block; width: 100%; height: auto; }

/* ---------- Hub: the structure, a ladder from Congress to the member federations ---------- */
.ia-structure { padding-block: var(--space-xl) var(--space-2xl); }
.ia-structure__title { margin-bottom: var(--space-xl); }
.ia-structure__list { margin: 0; padding: 0; list-style: none; border-top: 4px solid var(--color-ink); }
.ia-structure__level { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-2xs) var(--space-2xl); align-items: baseline; padding-block: var(--space-sm); border-bottom: 1px solid var(--color-rule); }
.ia-structure__name { font: 800 var(--text-2xl)/1.05 var(--font-display); text-transform: uppercase; overflow-wrap: break-word; min-width: 0; }
.ia-structure__link { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: none; }
.ia-structure__link:hover { text-decoration: underline; text-decoration-color: var(--color-mark); text-decoration-thickness: 3px; text-underline-offset: 0.15em; }
.ia-structure__link:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.ia-structure__link:active { color: var(--color-mark); }
.ia-structure__parts { max-width: 60ch; color: var(--color-ink-2); line-height: 1.5; }

/* ---------- Hub: who leads ---------- */
.ia-leaders { padding-block: var(--space-2xl) var(--space-3xl); }
.ia-leaders__title { margin-bottom: var(--space-2xl); }
.ia-leaders__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2xl); margin: 0; padding: 0; list-style: none; }

/* ---------- Hub: the index on the red band ---------- */
.ia-index { --ia-line: color-mix(in oklab, var(--color-paper) 35%, transparent); padding-block: var(--space-3xl); }
.ia-index__title { margin-bottom: var(--space-xl); }
.ia-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ia-line); border-left: 1px solid var(--ia-line); }
.ia-tiles__item { display: grid; border-right: 1px solid var(--ia-line); border-bottom: 1px solid var(--ia-line); }
.ia-tiles__item--wide { grid-column: span 2; }
.ia-tiles__item--full { grid-column: 1 / -1; }
.ia-tile { display: flex; flex-direction: column; justify-content: space-between; gap: var(--space-lg); min-height: 13rem; padding: var(--space-lg); color: inherit; text-decoration: none; }
.ia-tile--photo { justify-content: flex-start; }
.ia-tile:hover { background: var(--color-red-deep); }
.ia-tile:focus-visible { outline: 3px solid var(--color-focus); outline-offset: -3px; }
.ia-tile__photo { display: block; margin: calc(-1 * var(--space-lg)) calc(-1 * var(--space-lg)) 0; aspect-ratio: 16 / 9; overflow: hidden; background: var(--color-red-deep); }
.ia-tile__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ia-tile__name { margin: 0; max-width: none; font: 800 var(--text-3xl)/1.02 var(--font-display); text-transform: uppercase; overflow-wrap: break-word; min-width: 0; }
.ia-tile__text { max-width: 46ch; }
.ia-tiles__item--full .ia-tile { min-height: 0; flex-flow: row wrap; align-items: baseline; justify-content: space-between; }

/* ---------- Page head and the Focus on AWF strip ---------- */
.ia-pagehead { padding-block: var(--space-3xl) var(--space-xl); }
.ia-pagehead__title { max-width: 16ch; }
.ia-pagehead--person { padding-bottom: var(--space-2xl); }
.ia-pagehead--person .ia-pagehead__inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-2xl); align-items: end; }
.ia-pagehead__name { margin-top: var(--space-lg); max-width: 18ch; font: 800 var(--text-section)/1.02 var(--font-display); text-transform: uppercase; overflow-wrap: break-word; min-width: 0; }
.ia-pagehead__country { display: flex; align-items: center; gap: var(--space-sm); margin-top: var(--space-md); font-weight: 600; font-size: var(--text-lg); }
.ia-pagehead__portrait { width: 100%; max-width: 26rem; justify-self: end; }

.ia-subnav { border-block: 1px solid var(--color-rule); background: var(--color-paper); color: var(--color-ink); }
.ia-subnav__list { position: relative; display: flex; gap: var(--space-md); margin: 0; padding: var(--space-xs) var(--space-2xs); list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: var(--color-muted) transparent; }
/* Nav links are 15px (DESIGN.md), so all eleven fit on one line at 1440px; narrower screens scroll the strip. */
.ia-subnav__link { display: inline-flex; align-items: center; min-height: 44px; border-bottom: 3px solid transparent; color: var(--color-ink-2); font-size: var(--text-sm); font-weight: 600; text-decoration: none; white-space: nowrap; }
.ia-subnav__link--parent { color: var(--color-ink); }
.ia-subnav__link:hover { color: var(--color-ink); border-bottom-color: var(--color-rule); }
.ia-subnav__link[aria-current="page"] { color: var(--color-ink); border-bottom-color: var(--color-mark); }
.ia-subnav__link:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }

/* ---------- Page body ---------- */
.ia-body { padding-block: var(--space-2xl) var(--space-3xl); }
.ia-body--intro { padding-bottom: 0; }
.ia-body--split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-2xl); align-items: start; }
.ia-body--split .ia-body__main { grid-column: 1; grid-row: 1; }
/* The spec column sticks just under the header, which stays on screen (and under a signed-in editor's toolbar) */
.ia-body--split .ia-body__aside { grid-column: 2; grid-row: 1; position: sticky; top: calc(var(--masthead-top) + var(--masthead-h) + var(--space-lg)); }

/* Spec cells: the profile's label and value pairs */
.ia-spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-lg); max-width: var(--measure); margin: 0; border-top: 2px solid var(--color-ink); }
.ia-body--split .ia-spec { grid-template-columns: minmax(0, 1fr); }
.ia-body__aside:only-child .ia-spec { max-width: none; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ia-spec__cell { display: grid; gap: var(--space-2xs); align-content: start; padding-block: var(--space-md); border-bottom: 1px solid var(--color-rule); }
.ia-spec dt { font-size: var(--text-sm); color: var(--color-ink-2); }
.ia-spec dd { display: grid; gap: var(--space-3xs); margin: 0; font-weight: 600; line-height: 1.4; }

/* Timeline: a career by year */
.ia-timeline { max-width: var(--measure); }
.ia-timeline__list { margin: var(--space-md) 0 0; padding: 0; list-style: none; border-top: 2px solid var(--color-ink); }
.ia-timeline__item { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); column-gap: var(--space-lg); align-items: baseline; padding-block: var(--space-sm); border-bottom: 1px solid var(--color-rule); }
.ia-timeline__when { font: 800 var(--text-xl)/1.05 var(--font-display); text-transform: uppercase; font-variant-numeric: tabular-nums; }
.ia-timeline__what { line-height: 1.45; }

/* Roster: a list of names written into a page's text */
.ia-roster__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-lg); margin: var(--space-lg) 0 0; padding: 0; list-style: none; border-top: 2px solid var(--color-ink); }
.ia-roster__item { display: grid; gap: var(--space-3xs); align-content: start; padding-block: var(--space-md); border-bottom: 1px solid var(--color-rule); }
.ia-roster__name { font-weight: 600; font-size: var(--text-lg); line-height: 1.3; }
.ia-roster__role { font-size: var(--text-sm); color: var(--color-ink-2); }
.ia-roster__country { display: flex; align-items: center; gap: var(--space-xs); font-size: var(--text-sm); color: var(--color-ink-2); }

/* ---------- Executive Board ---------- */
.ia-boardwrap { padding-block: var(--space-2xl) var(--space-3xl); }
.ia-board { display: grid; gap: var(--space-3xl); }
.ia-board__title { margin-bottom: var(--space-xl); }
.ia-board__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-xl) var(--space-lg); margin: 0; padding: 0; list-style: none; }
.ia-board__grid--lead { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2xl) var(--space-lg); }

/* ---------- Committees, commissions and the other bodies: a sheet per group ---------- */
.ia-bodywrap { padding-block: var(--space-2xl) var(--space-3xl); }
.ia-bodies { display: grid; gap: var(--space-3xl); }
.ia-bodyindex__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); column-gap: var(--space-lg); margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--color-ink); }
.ia-bodyindex__link { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-md); min-height: 44px; padding-block: var(--space-sm); border-bottom: 1px solid var(--color-rule); color: inherit; font-weight: 600; text-decoration: none; }
.ia-bodyindex__count { color: var(--color-ink-2); font-size: var(--text-sm); font-weight: 400; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ia-bodyindex__link:hover .ia-bodyindex__name { text-decoration: underline; text-decoration-color: var(--color-mark); text-decoration-thickness: 2px; text-underline-offset: 0.2em; }
.ia-bodyindex__link:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.ia-bodyindex__link:active .ia-bodyindex__name { color: var(--color-mark); }
/* No scroll margin of its own: the page's scroll padding (base.css) already clears the header */
.ia-group { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-lg) var(--space-2xl); padding-top: var(--space-lg); border-top: 4px solid var(--color-ink); }
.ia-group__head { display: grid; gap: var(--space-xs); align-content: start; }
.ia-group__title { max-width: 14ch; font-size: var(--text-3xl); overflow-wrap: break-word; min-width: 0; }
.ia-group__count { color: var(--color-ink-2); font-size: var(--text-sm); font-variant-numeric: tabular-nums; }
.ia-group__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-xl) var(--space-lg); margin: 0; padding: 0; list-style: none; }
.ia-group__vacant { align-self: start; justify-self: start; padding: var(--space-xs) var(--space-md); border: 1px dashed var(--color-muted); color: var(--color-ink-2); font-weight: 600; }
.ia-group--vacant { border-top-width: 1px; border-top-color: var(--color-rule); }
.ia-bodies--solo .ia-group { grid-template-columns: minmax(0, 1fr); padding-top: 0; border-top: 0; }
.ia-bodies--solo .ia-group__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* ---------- Secretariat: the contact lines as an office ---------- */
.ia-offices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xl) var(--space-2xl); padding-block: var(--space-2xl) 0; }
.ia-office { display: grid; gap: var(--space-lg); align-content: start; padding-top: var(--space-lg); border-top: 4px solid var(--color-red); }
.ia-office__title { max-width: none; font-size: var(--text-3xl); }
.ia-office__list { display: grid; gap: var(--space-md); margin: 0; }
.ia-office__row { display: grid; gap: var(--space-2xs); }
.ia-office__row dt { color: var(--color-ink-2); font-size: var(--text-sm); font-weight: 600; }
.ia-office__row dd { display: grid; justify-items: start; gap: 0; margin: 0; font-size: var(--text-lg); line-height: 1.4; }
.ia-office__phone, .ia-office__mail { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: underline; text-decoration-color: var(--color-rule); text-decoration-thickness: 2px; }
.ia-office__phone { font: 800 var(--text-2xl)/1.15 var(--font-display); text-underline-offset: 0.12em; }
.ia-office__mail { font-weight: 600; text-underline-offset: 0.2em; overflow-wrap: anywhere; }
.ia-office__note { color: var(--color-ink-2); font-size: var(--text-sm); }
.ia-office__phone:hover, .ia-office__mail:hover { text-decoration-color: var(--color-mark); }
.ia-office__phone:focus-visible, .ia-office__mail:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.ia-office__phone:active, .ia-office__mail:active { color: var(--color-mark); }

/* ---------- Contact us: the line under the offices (bank and payment details on request) ---------- */
.contact-head__note { max-width: var(--measure); margin-top: var(--space-2xl); color: var(--color-on-arena-2); font-size: var(--text-md); line-height: 1.6; }
.contact-head__mail { color: var(--color-on-arena); font-weight: 600; text-decoration: underline; text-decoration-color: var(--color-on-arena-2); text-decoration-thickness: 2px; text-underline-offset: 0.2em; overflow-wrap: anywhere; }
.contact-head__mail:hover { text-decoration-color: var(--color-mark); }
.contact-head__mail:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.contact-head__mail:active { color: var(--color-mark); }

/* ---------- Anti-doping ---------- */
.ia-cleanhead { padding-block: var(--space-3xl) var(--space-2xl); }
.ia-cleanhead__inner { display: grid; gap: var(--space-lg); }
.ia-cleanhead__lead { color: var(--color-on-arena-2); }
.ia-cleanintro { padding-block: var(--space-3xl); }
.ia-cleanintro__inner { display: grid; gap: var(--space-xl) var(--space-2xl); align-items: center; }
.ia-cleanintro__inner--figure { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
.ia-cleanintro__text .ia-p:first-child { font-size: var(--text-lead); line-height: 1.5; }
.ia-cleanintro__figure { margin: 0; background: var(--color-paper-3); }
.ia-cleanintro__img { display: block; width: 100%; height: auto; }
.ia-clean { padding-block: var(--space-3xl); border-top: 4px solid var(--color-yellow); }
.ia-clean__title { margin-bottom: var(--space-xl); }
.ia-clean__tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); margin: 0; padding: 0; list-style: none; }
.ia-clean__tiles > li { display: grid; }
.ia-cleantile { display: flex; flex-direction: column; gap: var(--space-xs); min-height: 16rem; padding: var(--space-lg); border: 1px solid color-mix(in oklab, var(--color-paper) 45%, transparent); color: inherit; text-decoration: none; }
.ia-cleantile:hover { background: var(--color-red-deep); border-color: var(--color-paper); }
.ia-cleantile:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.ia-cleantile__name { margin-bottom: auto; padding-bottom: var(--space-lg); font: 800 var(--text-display-s)/1 var(--font-display); text-transform: uppercase; overflow-wrap: break-word; min-width: 0; }
.ia-cleantile__full { font-weight: 600; font-size: var(--text-lg); line-height: 1.3; }
.ia-cleantile__text { max-width: 58ch; line-height: 1.5; }
.ia-cleantile__host { padding-top: var(--space-xs); font-size: var(--text-sm); text-decoration: underline; text-underline-offset: 0.2em; }
.ia-cleantext { padding-block: var(--space-3xl); }

/* ---------- Small originals: a single large portrait (page head, lead and feature cards) under 320px wide is not
 * blown up past 1.4 times its width. Portraits in a grid of cards never take the class (awf_about_portrait()
 * 'cap'), so every frame in a row is the same size and the names below them line up. ---------- */
.ia-portrait--small { width: min(100%, calc(var(--ia-native) * 1.4)); }

/* ---------- Responsive ---------- */
@media (max-width: 75rem) {
  .ia-board__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ia-group__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ia-bodies--solo .ia-group__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* A short window keeps the profile's spec column in the flow: stuck under the header it could run past the fold */
@media (max-height: 40rem) {
  .ia-body--split .ia-body__aside { position: static; }
}
/* Hub tiles: two columns until four are wide enough for the longest one-word titles (SECRETARIAT is 190px
   in the 39px display face; a quarter tile holds it from about 68rem) */
@media (max-width: 70rem) {
  .ia-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ia-tiles__item--wide, .ia-tiles__item--full { grid-column: auto; }
  .ia-tiles__item--full .ia-tile { flex-direction: column; align-items: stretch; }
}
@media (max-width: 60rem) {
  .ia-leaders__grid, .ia-about__inner--figure, .ia-cleanintro__inner--figure, .ia-group, .ia-offices { grid-template-columns: minmax(0, 1fr); }
  .ia-pagehead--person .ia-pagehead__inner { grid-template-columns: minmax(0, 1fr); }
  .ia-pagehead__portrait { justify-self: start; max-width: 22rem; }
  .ia-body--split { grid-template-columns: minmax(0, 1fr); }
  .ia-body--split .ia-body__main, .ia-body--split .ia-body__aside { grid-column: 1; grid-row: auto; position: static; }
  .ia-roster__list, .ia-body__aside:only-child .ia-spec { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ia-group__grid, .ia-bodies--solo .ia-group__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ia-group__title { max-width: 22ch; }
}
@media (max-width: 40rem) {
  .ia-head { padding-block: var(--space-2xl) var(--space-xl); }
  .ia-facts { grid-template-columns: minmax(0, 1fr); }
  .ia-leadphoto__frame { aspect-ratio: 3 / 2; }
  .ia-structure__level { grid-template-columns: minmax(0, 1fr); }
  .ia-leaders, .ia-index, .ia-clean, .ia-cleantext, .ia-cleanintro, .ia-about { padding-block: var(--space-2xl); }
  .ia-pagehead { padding-block: var(--space-2xl) var(--space-lg); }
  .ia-pagehead__portrait { max-width: 18rem; }
  .ia-person--feature, .ia-person--lead { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--space-md); align-items: end; }
  .ia-person--lead .ia-person__name, .ia-person--feature .ia-person__name { font-size: var(--text-2xl); }
  .ia-tiles, .ia-clean__tiles, .ia-roster__list, .ia-spec, .ia-body__aside:only-child .ia-spec { grid-template-columns: minmax(0, 1fr); }
  .ia-tile { min-height: 0; }
  .ia-cleantile { min-height: 12rem; }
  .ia-board__grid, .ia-group__grid, .ia-bodies--solo .ia-group__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg) var(--space-md); }
  .ia-board__grid--lead { grid-template-columns: minmax(0, 1fr); }
  .ia-bodies { gap: var(--space-2xl); }
  .ia-timeline__item { grid-template-columns: 6rem minmax(0, 1fr); column-gap: var(--space-md); }
  .ia-timeline__when { font-size: var(--text-lg); }
}
/* ---------- Pressed: instant, no motion ---------- */
.ia-tile:active, .ia-cleantile:active { background: var(--color-red-deep); transform: translateY(1px); }
.ia-person__link:active, .ia-fact__link:active, .ia-subnav__link:active { opacity: 0.8; }

@media (prefers-reduced-motion: reduce) {
  .ia-tile:active, .ia-cleantile:active { transform: none; }
}