/**
 * AIPressRoom site UI — the About page (1.15.0).
 *
 * Its own file, loaded only on /about/, for the same reason the pages sheet is
 * separate from the shell: this layout is used by one page, and a change to it
 * should not rename (and re-download) a stylesheet five other pages share.
 * THE FILENAME CARRIES THE VERSION: the next change ships site-ui-about-v3.css.
 *
 * Loaded after site-ui-pages-v*.css, whose reset, tokens and .aipr-ui-page
 * container it relies on. Selectors are scoped under .aipr-ui-pg so they win
 * ties with that sheet by order, not by !important.
 *
 * ONE DELIBERATE EXCEPTION TO THE SITE GRAMMAR (owner, 2026-09-28): the
 * headline is up to 112px, above the nine sizes in site-ui-v6.css. It is the
 * brand line, used once, and it has to do the job a 44px headline cannot.
 *
 * v2 (1.15.1): the headline is sized from the column it sits in, not from the
 * viewport. v1 guessed the column as the viewport less 40px; on the live site
 * was 80px less on a phone (until 1.15.2 the body carried .aipr-ui-page too,
 * see class-ui-pages.php body_class), so "The AI industry," broke onto two lines
 * at 320-390px. 13.6cqw keeps the longer clause at about 93% of the column at
 * every width, measured on the live page from 320 to 1920.
 * Everything else here is from the nine: 12 label · 15 · 17 · 20 · 32.
 *
 * The four commitment titles are serif. Rule 1 of the grammar gives the serif
 * to words someone said on the record; these are ours.
 */

.aipr-ui-pg .aipr-ui-page--about {
    max-width: var(--aipr-ui-container);
    padding-bottom: 120px;
}

.aipr-ui-pg .aipr-ui-ab-label {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--aipr-ui-mute);
}

/* ─── The line ─────────────────────────────────────────────── */
.aipr-ui-pg .aipr-ui-ab-hero { padding: 96px 0 120px; container-type: inline-size; }
.aipr-ui-pg .aipr-ui-ab-h1 {
    margin-top: 28px;
    /* "The AI industry," is about 6.85 times the font size wide. The first
       line is for browsers without container units (before Safari 16). */
    font-size: clamp(32px, 10vw, 112px);
    font-size: min(112px, 13.6cqw);
    font-weight: 800;
    line-height: .96;
    letter-spacing: -.04em;
    color: var(--aipr-ui-ink);
}
.aipr-ui-pg .aipr-ui-ab-h1 span { display: block; }
.aipr-ui-pg .aipr-ui-ab-dek {
    margin-top: 40px;
    max-width: 33em;
    font-size: 20px;
    line-height: 1.55;
    color: var(--aipr-ui-body);
    text-wrap: pretty;
}

/* ─── Blocks: 2px ink opens, 1px separates ─────────────────── */
.aipr-ui-pg .aipr-ui-ab-blk { border-top: 2px solid var(--aipr-ui-ink); padding-top: 20px; }
.aipr-ui-pg .aipr-ui-ab-blk + .aipr-ui-ab-blk { margin-top: 120px; }

.aipr-ui-pg .aipr-ui-ab-pr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 56px;
    margin-top: 8px;
}
.aipr-ui-pg .aipr-ui-ab-pr li { padding: 36px 0 40px; border-bottom: 1px solid var(--aipr-ui-line); scroll-margin-top: calc(var(--aipr-ui-h) + 24px); }
.aipr-ui-pg .aipr-ui-ab-pr li:nth-last-child(-n+2) { border-bottom: 0; }
.aipr-ui-pg .aipr-ui-ab-pr h3 {
    font-family: 'AIPR Serif', ui-serif, 'New York', Georgia, 'Times New Roman', serif;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -.01em;
    color: var(--aipr-ui-ink);
    text-wrap: balance;
}
.aipr-ui-pg .aipr-ui-ab-pr p { margin-top: 14px; max-width: 30em; font-size: 17px; line-height: 1.6; color: var(--aipr-ui-body); }
.aipr-ui-pg .aipr-ui-ab-pr a { display: inline-block; margin-top: 16px; font-size: 15px; font-weight: 600; color: var(--aipr-ui-ink); }

.aipr-ui-pg .aipr-ui-ab-idx { margin-top: 12px; }
.aipr-ui-pg .aipr-ui-ab-idx a {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr) auto;
    gap: 24px;
    align-items: baseline;
    padding: 18px 0;
    border-bottom: 1px solid var(--aipr-ui-line);
}
.aipr-ui-pg .aipr-ui-ab-idx a::after { content: "\2192"; font-size: 17px; font-weight: 600; color: var(--aipr-ui-ink); }
.aipr-ui-pg .aipr-ui-ab-idx b { font-size: 20px; font-weight: 600; color: var(--aipr-ui-ink); }
.aipr-ui-pg .aipr-ui-ab-idx span { font-size: 17px; color: var(--aipr-ui-mute); }

/* ─── Sign-off ─────────────────────────────────────────────── */
.aipr-ui-pg .aipr-ui-ab-close { margin-top: 120px; }
.aipr-ui-pg .aipr-ui-ab-sign {
    max-width: 24em;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -.015em;
    color: var(--aipr-ui-ink);
    text-wrap: balance;
}
.aipr-ui-pg .aipr-ui-ab-links { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 32px; font-size: 15px; font-weight: 600; }
.aipr-ui-pg .aipr-ui-ab-links a { color: var(--aipr-ui-ink); border-bottom: 1px solid var(--aipr-ui-ink); padding-bottom: 2px; }

/* Purple is interaction and nothing else. */
.aipr-ui-pg .aipr-ui-ab-pr a:hover,
.aipr-ui-pg .aipr-ui-ab-idx a:hover b,
.aipr-ui-pg .aipr-ui-ab-idx a:hover::after,
.aipr-ui-pg .aipr-ui-ab-links a:hover { color: var(--aipr-ui-accent); border-color: var(--aipr-ui-accent); }

/* ─── Narrower screens ─────────────────────────────────────── */
@media (max-width: 860px) {
    .aipr-ui-pg .aipr-ui-page--about { padding-bottom: 72px; }
    .aipr-ui-pg .aipr-ui-ab-hero { padding: 56px 0 72px; }
    .aipr-ui-pg .aipr-ui-ab-h1 { margin-top: 18px; }
    .aipr-ui-pg .aipr-ui-ab-dek { margin-top: 24px; font-size: 18px; }
    .aipr-ui-pg .aipr-ui-ab-blk + .aipr-ui-ab-blk { margin-top: 72px; }
    .aipr-ui-pg .aipr-ui-ab-pr { grid-template-columns: 1fr; }
    .aipr-ui-pg .aipr-ui-ab-pr li { padding: 28px 0 32px; }
    .aipr-ui-pg .aipr-ui-ab-pr li:nth-last-child(2) { border-bottom: 1px solid var(--aipr-ui-line); }
    .aipr-ui-pg .aipr-ui-ab-pr h3 { font-size: 28px; }
    .aipr-ui-pg .aipr-ui-ab-idx a { grid-template-columns: minmax(0, 1fr) auto; row-gap: 2px; }
    .aipr-ui-pg .aipr-ui-ab-idx a::after { grid-row: 1; grid-column: 2; }
    .aipr-ui-pg .aipr-ui-ab-idx span { grid-column: 1; font-size: 15px; }
    .aipr-ui-pg .aipr-ui-ab-close { margin-top: 72px; }
    .aipr-ui-pg .aipr-ui-ab-sign { font-size: 24px; }
}
@media (max-width: 600px) {
    .aipr-ui-pg .aipr-ui-ab-h1 { line-height: 1; letter-spacing: -.035em; }
}