/* MAGAZINE EDITORIAL -- one reading style for every intro / editorial body on the site.
   Wrap any run of editorial blocks in an element with class "mag-prose" and this does the rest:
   text flows through two columns (one when the space is narrow), section heads get a gold rule, the first
   paragraph a drop cap, lead paragraphs become a full-width standfirst, pull quotes / facts / callouts are
   typeset as magazine furniture, and images and timelines span the page. Works for the About hub articles,
   the guide / moving pages, sports, news -- the markup names below are the ones those templates already emit.
   (Selectors are doubled -- ".mag-prose.mag-prose" -- so a page's own inline styles cannot undo the look.) */

.mag-prose.mag-prose {
    columns: 2 270px;
    column-gap: 44px;
    column-rule: 1px solid #e7e0d3;
    orphans: 3;
    widows: 3;
    max-width: none;
}

/* Section heads */
.mag-prose.mag-prose > h3, .mag-prose.mag-prose > h4, .mag-prose.mag-prose > h2 {
    margin: 28px 0 10px;
    padding-top: 12px;
    border-top: 2px solid #c9a24a;
    color: #163855;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
    break-after: avoid;
    break-inside: avoid;
}

.mag-prose.mag-prose > h3:first-child, .mag-prose.mag-prose > h4:first-child, .mag-prose.mag-prose > h2:first-child {
    margin-top: 0;
}

/* Body copy flows from column to column like a printed page */
.mag-prose.mag-prose > p {
    margin: 0 0 14px;
    color: #3f474d;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    line-height: 1.7;
    text-align: left;
}

/* Lead paragraph: a standfirst across the full width */
.mag-prose.mag-prose > p.ah-lead {
    column-span: all;
    margin: 0 0 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e7e0d3;
    color: #163855;
    font-size: 21px;
    line-height: 1.55;
}

/* Drop cap on the opening paragraph */
.mag-prose.mag-prose > p:first-of-type:not(.ah-lead)::first-letter,
.mag-prose.mag-prose > p.ah-lead + p:not(.muted)::first-letter {
    float: left;
    margin: 4px 10px 0 0;
    color: #163855;
    font-size: 58px;
    font-weight: 700;
    line-height: 0.82;
}

/* Pull quotes */
.mag-prose.mag-prose > blockquote, .mag-prose.mag-prose > p.ah-sports-fact {
    margin: 10px 0 22px;
    padding: 14px 0 0;
    border: 0;
    border-top: 3px solid #163855;
    background: none;
    color: #163855;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-style: italic;
    line-height: 1.4;
    break-inside: avoid;
}

.mag-prose.mag-prose > blockquote cite {
    display: block;
    margin-top: 8px;
    color: #7d8388;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-style: normal;
    letter-spacing: .04em;
}

/* Fact and callout boxes */
.mag-prose.mag-prose > aside, .mag-prose.mag-prose > div.pg-quick-fact, .mag-prose.mag-prose > div.pg-callout:not(.pg-timeline) {
    margin: 8px 0 22px;
    padding: 14px 18px;
    border: 0;
    border-left: 3px solid #c9a24a;
    border-radius: 0;
    background: #fbf7ee;
    break-inside: avoid;
}

.mag-prose.mag-prose > aside.ah-editorial-callout, .mag-prose.mag-prose > div.pg-callout:not(.pg-timeline) {
    border-left-color: #163855;
    background: #f1f4f6;
}

.mag-prose.mag-prose > aside small, .mag-prose.mag-prose .pg-quick-fact-label, .mag-prose.mag-prose .pg-callout-label {
    display: block;
    margin-bottom: 5px;
    color: #9c7428;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.mag-prose.mag-prose > aside strong, .mag-prose.mag-prose > aside p, .mag-prose.mag-prose > div.pg-quick-fact p, .mag-prose.mag-prose > div.pg-callout p {
    margin: 0;
    color: #163855;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    line-height: 1.55;
}

.mag-prose.mag-prose > aside strong { font-weight: 700; }

/* Images and timelines run across the full page width */
.mag-prose.mag-prose > figure, .mag-prose.mag-prose > section, .mag-prose.mag-prose > div.pg-timeline {
    column-span: all;
    margin: 28px 0;
}

.mag-prose.mag-prose > figure img {
    display: block;
    width: 100%;
    max-height: 460px;
    object-fit: cover;
    border-radius: 6px;
}

.mag-prose.mag-prose > figure figcaption {
    padding: 8px 2px 0;
    color: #6d747b;
    font-size: 12px;
    font-style: italic;
    line-height: 1.5;
}

.mag-prose.mag-prose > section {
    padding: 20px 26px;
    border-left: 3px solid #c9a24a;
    background: #f8f6f1;
}

.mag-prose.mag-prose > section > h3 { margin-top: 0; }
.mag-prose.mag-prose > section p { margin: 0; color: #3f474d; font-size: 15px; line-height: 1.65; }

/* Standfirst / summary line that sits above an article */
.ah-editorial p.ah-lead {
    color: #163855;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    line-height: 1.55;
}

/* Single-column variant (legal text, short descriptions) and the legal look: no drop cap, tighter type */
.mag-prose.mag-prose.mag-single {
    columns: 1;
    column-rule: 0;
    max-width: 760px;
}

.mag-prose.mag-prose.mag-legal > p { font-size: 15px; line-height: 1.7; }

.mag-prose.mag-prose.mag-legal > p:first-of-type::first-letter {
    float: none;
    margin: 0;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.mag-prose.mag-prose > :is(ul, ol) {
    margin: 0 0 14px;
    padding-left: 22px;
    color: #3f474d;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    line-height: 1.7;
}

/* Source / method note at the end of a magazine block: small, full width, set off by a rule */
.mag-prose.mag-prose > p.muted {
    column-span: all;
    margin: 18px 0 0;
    padding-top: 10px;
    border-top: 1px solid #e7e0d3;
    color: #747b82;
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1.55;
}

/* Internal-link lists ("More events", "Other AVAs", "More moving guides") -- shared by every page */
.il-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.il-list li { padding: 9px 0; border-top: 1px solid #ece7df; font-size: 15px; line-height: 1.45; }
.il-list li:first-child { border-top: 0; }
.il-list a { color: #163855; font-weight: 600; text-decoration: none; }
.il-list a:hover { text-decoration: underline; }
.il-list span { display: block; color: #6b737a; font-size: 13px; font-weight: 400; margin-top: 2px; }
.il-cols { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 0 28px; }

/* In-text links the site adds to editorial copy */
.mag-prose a.il, .il-inline { color: inherit; text-decoration: underline; text-decoration-color: #c9a24a; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mag-prose a.il:hover { color: #163855; }

/* Visible breadcrumb trail */
.crumbs { font-size: 13px; color: #6b737a; margin: 0 0 18px; }
.crumbs.crumbs-wide { max-width: 1180px; margin: 14px auto 0; padding: 0 20px; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; }
.crumbs li + li::before { content: "\203A"; margin: 0 8px; color: #a39a8c; }
.crumbs a { color: #163855; text-decoration: none; font-weight: 600; }
.crumbs a:hover { text-decoration: underline; }
.crumbs [aria-current] { color: #4d555c; }
