/* Resources page only. Shared colors, navigation, and footer come from homepage.css. */
.resources-page .site-nav a[aria-current="page"] {
    color: var(--gold);
    text-decoration: underline;
    text-underline-offset: 7px;
}

.resources-intro { padding-block: 56px 36px; border-bottom: 1px solid var(--line); }
.resources-intro h1 {
    margin-top: 12px;
    font-size: clamp(42px, 5vw, 60px);
    line-height: 1.12;
    letter-spacing: -1.8px;
}
.resources-intro > p:last-child { max-width: 610px; margin-top: 18px; }
.resources-content { padding-block: 36px 64px; }
.resources-content h2 { font-size: 34px; }

/* Software entries and their original scientific illustrations. */
.software-list { margin-top: 28px; }
.software-entry { min-width: 0; padding-block: 30px; border-top: 1px solid var(--line); }
.software-entry--illustrated { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.6fr); gap: 48px; align-items: center; }
.software-copy { min-width: 0; }
.resource-category { color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.software-entry h3 { margin-top: 8px; font: 400 28px/1.3 Georgia, 'Times New Roman', serif; }
.software-entry h3 + p { margin-top: 12px; font-size: 15px; }
.resource-link { display: inline-flex; align-items: baseline; gap: 14px; margin-top: 15px; padding-block: 7px; font-size: 13px; font-weight: 600; text-decoration-color: #a8b3b8; }
.resource-link span { font-weight: 400; }
.resource-figure { width: 100%; min-width: 0; }
.resource-figure > a { display: block; }
.resource-figure img { width: 100%; height: auto; }
.resource-figure figcaption { margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.65; }
.resource-figure figcaption a { display: inline-block; margin-left: 4px; color: inherit; }
.resource-figure figcaption a:hover { color: var(--gold); }
.resource-figure--bifurcation { max-width: 510px; justify-self: center; }
.software-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; }

.reading-section { margin-top: 28px; padding: 32px 36px; background: var(--tint); border-top: 2px solid var(--gold); }
.reading-section h2 { margin-top: 8px; }
.reading-list { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; margin-top: 26px; }
.reading-list h3 { font-size: 18px; }
.reading-list h3 a { text-decoration-color: #a8b3b8; }
.reading-list h3 span { display: inline-block; margin-left: 8px; color: var(--gold); font-size: 15px; }
.reading-list p { max-width: 420px; margin-top: 10px; font-size: 14px; }
.resources-page .site-footer { border-top: 1px solid var(--line); }

@media (max-width: 1000px) {
    .resources-intro { padding-top: 44px; }
    .software-entry--illustrated { grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 32px; }
    .software-pair { column-gap: 32px; }
    .reading-section { padding-inline: 28px; }
}

@media (max-width: 800px) {
    .software-entry--illustrated { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .software-copy { max-width: 580px; }
    .resource-figure--bifurcation { justify-self: start; }
    .reading-list { gap: 26px; }
}

@media (max-width: 600px) {
    .resources-intro { padding-block: 35px 26px; }
    .resources-intro > p:last-child { font-size: 15px; }
    .resources-content { padding-block: 26px 40px; }
    .resources-content h2 { font-size: 30px; }
    .software-list { margin-top: 23px; }
    .software-entry { padding-block: 25px; }
    .software-entry h3 { font-size: 26px; }
    .resource-link { padding-block: 10px; }
    .software-pair, .reading-list { grid-template-columns: minmax(0, 1fr); }
    .reading-section { margin-top: 14px; padding: 26px 20px; }
    .reading-list { margin-top: 24px; }
    .reading-list article + article { padding-top: 23px; border-top: 1px solid var(--line); }
}

@media print {
    .resources-intro { padding-block: 15px 20px; }
    .resources-intro h1 { font-size: 36px; }
    .resources-content { padding-block: 20px; }
    .software-entry { break-inside: avoid; padding-block: 20px; }
    .software-entry--illustrated { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 24px; }
    .resource-figure--bifurcation { max-width: 300px; }
    .reading-section { background: transparent; padding: 20px 0; break-inside: avoid; }
}