/*
 * SPDX-FileCopyrightText: 2026-present TeamCalendar
 * SPDX-License-Identifier: LicenseRef-Proprietary
 *
 * The eleven static pages' stylesheet — what renders inside their main region
 * (PRD 170, build item 8).
 *
 * It sits where `picker.css` sits for the layout: `layout.css` is the site's
 * chrome and every document links it, and each kind of document adds the one
 * stylesheet for what fills its main region. A static page has no picker, so it
 * links this instead.
 *
 * **It styles by ELEMENT, and that is the whole shape of the file.** Production
 * renders these pages with Tailwind, and `port.mjs` drops those classes on the
 * way in — a `bg-white py-12` that resolves to nothing is a false claim about
 * where the styling lives. What arrives here is a document: headings,
 * paragraphs, lists, a description list of contact addresses, one postal
 * address. One hook survives the port — `.page-copy`, the copy's outermost
 * element — so these rules reach the ported words and nothing else in the
 * document.
 *
 * Served from /assets like every other asset, with the same conventional
 * filename and the same hour of revalidating cache.
 */

/* The measure is `layout.css`'s and is already applied by `.site-main`. What is
   left here is vertical rhythm, which the captured copy has none of: production
   carried it in utility classes on nearly every element. */
.page-copy {
    color: var(--ink);
    /* The docs pages quote sample feed addresses in running text, and a phone
       viewport is narrower than one of them. */
    overflow-wrap: break-word;
}

.page-copy h1,
.page-copy h2,
.page-copy h3 {
    margin: calc(var(--step) * 2) 0 var(--step);
    letter-spacing: -0.01em;
    /* The legal pages arrive with their headings in capitals — production's
       copy, and not ours to rewrite — so the weight carries the hierarchy and
       the size stays modest enough for a shouted line to fit. */
    text-wrap: balance;
}

.page-copy > :first-child {
    margin-top: 0;
}

.page-copy h1 {
    font-size: 1.75rem;
    font-weight: 650;
}

.page-copy h2 {
    font-size: 1.375rem;
    font-weight: 650;
}

.page-copy h3 {
    font-size: 1.0625rem;
    font-weight: 650;
}

.page-copy p,
.page-copy li,
.page-copy dd {
    /* Longer than the site's own copy, because these are documents to read
       rather than controls to scan. */
    line-height: 1.7;
}

.page-copy p {
    margin: 0 0 var(--step);
}

.page-copy ul,
.page-copy ol {
    margin: 0 0 var(--step);
    padding-inline-start: 1.5rem;
}

.page-copy li {
    margin-bottom: 0.375rem;
}

/* Production numbers both tables of contents with `list-decimal`; the class is
   gone and an `<ol>` numbers itself, so nothing is needed but the marker being
   outside the measure rather than inside the text. */
.page-copy ol {
    list-style: decimal;
}

/* The contact page's four blocks of addresses. Each is a `<dl>` whose `<dt>` is
   `sr-only` — the label exists for a screen reader and not on screen — so the
   list needs no marker column and no margin of its own. */
.page-copy dl {
    margin: 0 0 var(--step);
}

.page-copy dd {
    margin: 0 0 0.375rem;
}

.page-copy address {
    font-style: normal;
}

.page-copy a {
    color: var(--accent);
}

.page-copy a:hover,
.page-copy a:focus-visible {
    text-decoration: none;
}