/* =========================================================================
   file:  fistandrose.persagen.org/css/fistandrose.css
   description:  Journal layer for "Fist and Rose" (loads AFTER wpi.css)
   created:  2026-Oct-14
   version:  v01 [2026-Oct-14] DRAFT
   notes:  * Article-header classes mirror the planned fistandrose.sty
             title block (authors, affiliations, ORCID, dates, DOI, license).
   ========================================================================= */

:root {
  --rose: #e0001a;        /* from the logo (#ff0a1c darkened for text contrast) */
  --leaf: #0aa85a;        /* logo green: decorative only */
}

/* ---- Masthead ------------------------------------------------------------ */
.masthead { display: flex; align-items: center; gap: 1.25rem; max-width: var(--measure); margin: 1.5rem auto 0; padding-bottom: 1rem; border-bottom: 3px solid var(--rose); }
.masthead img { height: 5.5rem; width: auto; flex: none; }
.masthead .title { font-size: 2.4rem; font-weight: 700; line-height: 1.1; margin: 0; }
.masthead .title a, .masthead .title a:hover { color: inherit; font-weight: 700; }
.masthead .tagline { margin: .25rem 0 0; color: var(--muted); font-size: 1rem; }

nav.site { max-width: var(--measure); margin: 0 auto; padding: .5rem 0; border-bottom: 1px solid var(--rule); display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; font-size: 1.05rem; }
nav.site a[aria-current="page"] { font-weight: 700; border-bottom: 2px solid var(--green); }

/* ---- Article header (mirrors the LaTeX title block) ----------------------- */
.article-header { margin: 1.5rem 0; padding-bottom: 1rem; border-bottom: 1px solid var(--rule); }
.article-type { font-size: .9rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rose); margin: 0; }
.article-header h1 { font-size: 2rem; margin: .25rem 0 .75rem; }
.authors { margin: .25rem 0; font-weight: 700; }
.authors sup { font-weight: 400; margin-left: .1em; }
.orcid { display: inline-block; width: 1em; height: 1em; vertical-align: -.1em; margin-left: .25em; background: url("../img/orcid.svg") center/contain no-repeat; }
.affiliations { margin: .25rem 0 0; padding: 0; list-style: none; font-size: .95rem; color: var(--muted); }
.affiliations li { margin: 0; }
.corresponding { font-size: .95rem; margin: .5rem 0 0; }

.meta { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: .75rem 0 0; padding: .5rem 0; font-size: .9rem; border-top: 1px solid var(--rule); }
.meta dt { display: inline; font-weight: 700; }
.meta dd { display: inline; margin: 0 0 0 .25rem; }
.meta div { white-space: nowrap; }

.abstract { margin: 1.5rem 0; padding: .75rem 1rem; background: var(--surface); border-left: 4px solid var(--leaf); }
.abstract h2 { font-size: 1.1rem; margin: 0 0 .25rem; }
.keywords { font-size: .95rem; }
.keywords strong { font-style: italic; }

.cite-box { margin: 1.5rem 0; padding: .75rem 1rem; border: 1px solid var(--rule); font-size: .95rem; }
.cite-box h2 { font-size: 1rem; margin: 0 0 .25rem; }

/* ---- Issue / article lists ------------------------------------------------ */
.toc-list { list-style: none; margin: 1rem 0; padding: 0; }
.toc-list li { margin: 0 0 1.25rem; }
.toc-list .t { font-size: 1.15rem; font-weight: 700; }
.toc-list .by { font-size: .95rem; color: var(--muted); }

footer.site { max-width: var(--measure); margin: 3rem auto 0; padding-top: 1rem; border-top: 1px solid var(--rule); font-size: .9rem; color: var(--muted); }

@media (max-width: 36rem) {
  .masthead { flex-direction: column; align-items: flex-start; }
  .masthead .title { font-size: 2rem; }
}

/* ---- Template placeholders (delete .todo styling when final) ------------ */
.todo { background: #fff6c8; padding: 0 .25rem; }
