/* The section's split introduction and rite index keep HP's arrangement.
   Article text, images, disclosures, sources, and link lists use the site styles. */
#nr-main { --nr-gold: #d9bb7e; }
.nr-skip { position: fixed; top: -100px; left: 16px; z-index: 99999; padding: 10px 16px; background: var(--bg-container-small); }
.nr-skip:focus { top: 12px; }

.nr-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(24px, 4vw, 56px);
    margin: 24px 0 40px;
}
.nr-hero-copy, .nr-hero > .image, .nr-opening-section, .nr-prose { min-width: 0; }
.nr-hero h1 {
    height: auto;
    padding: 0;
    margin: 0 0 20px;
    border: 0;
    background: none !important;
    animation: none;
    color: var(--nr-gold);
    font-size: clamp(30px, 3.5vw, 46px);
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    text-shadow: none;
    text-transform: none;
}
.nr-hero .nr-eyebrow { margin: 0 0 12px; color: var(--nr-gold); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.nr-hero .nr-subtitle { margin: 0 0 24px; color: var(--title-color); font-size: 20px; }
.nr-hero > .image { width: 100%; max-width: 100%; margin: 0; }
.nr-hero > .image img { display: block; width: 100%; height: auto; max-height: 450px; object-fit: contain; }

.nr-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.nr-prose > .nr-actions { margin: 16px 0; }
.nr-actions a, .nr-actions button {
    padding: 10px 16px;
    border: 1px solid var(--nr-gold);
    border-radius: 8px;
    background: var(--bg-container-small);
    background-image: none;
    color: var(--nr-gold);
    font: inherit;
    font-size: 14px;
    line-height: 1.4;
    text-decoration: none;
    cursor: pointer;
}
.nr-actions .nr-primary-action { background: var(--nr-gold); color: #111821; }
.nr-actions a:hover, .nr-actions button:hover { color: var(--title-color); background: var(--bg-container-medium); }
.nr-actions .nr-primary-action:hover { color: #111821; background: #ecd09a; }
.nr-actions a:focus-visible, .nr-actions button:focus-visible { outline: 2px solid var(--nr-gold); outline-offset: 3px; }
.nr-actions [hidden] { display: none; }

.nr-rite-nav { margin: 0 0 36px; padding: 16px 0; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); }
.nr-rite-nav .title { margin: 0 0 8px; color: var(--nr-gold); font-weight: 600; }
.nr-rite-nav ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; margin: 0; padding: 0; list-style: none; }
.nr-rite-nav li { margin: 0; padding: 0; }
.nr-rite-nav a { display: flex; align-items: baseline; gap: 12px; padding: 10px 8px; background-image: none; text-decoration: none; }
.nr-rite-nav a span { flex: 0 0 24px; color: var(--nr-gold); font-family: 'Cinzel', serif; }
.nr-rite-nav a[aria-current="page"] { color: var(--nr-gold); font-weight: 600; }
.nr-rite-nav a:hover { background: none; color: #f2e2c1 !important; transition: none; }

.nr-opening-layout { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); align-items: start; gap: clamp(24px, 4vw, 60px); }
.nr-opening-layout .further-read { margin: 0; }
.nr-opening-layout .further-read .title { margin-top: 0; color: var(--nr-gold); }
.nr-opening-section > h2:first-child { margin-top: 0; padding-top: 0; border: 0; }
.nr-opening-section h2, .nr-prose h2 { color: var(--nr-gold); }
.nr-prose .accordion + h2 { border-top: 0; border-image: none; }
.nr-prose { width: 100%; }
.nr-prose .references.in-flow h3:first-child { color: var(--nr-gold); }

@media (max-width: 768px) {
    .nr-hero { grid-template-columns: 1fr; margin-top: 16px; }
    .nr-hero h1 { font-size: 30px; overflow-wrap: anywhere; }
    .nr-rite-nav ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nr-opening-layout { display: block; }
    .nr-opening-layout .further-read { margin-bottom: 36px; }
}
@media (max-width: 425px) {
    .nr-hero h1 { font-size: 28px; }
    .nr-rite-nav ul { grid-template-columns: 1fr; }
}
@media print {
    .nr-actions, .nr-rite-nav, .nr-opening-layout .further-read, #nr-main > .further-read { display: none; }
    .nr-hero, .nr-opening-layout { display: block; }
    .nr-hero > .image { max-width: 80mm; margin: 16px 0; }
}