/* Project Pumper — story shell (parchment comic-book issue).
 *
 * Page-specific styles for templates/shells/story.html. Loaded AFTER pumper.css,
 * so the base body/a overrides below restore the warm parchment palette this
 * page uses in place of pumper.css's dark arcade defaults. Everything else is a
 * verbatim lift of the template's former inline styles into semantic classes.
 */

/* ---- base overrides (parchment palette, was this page's <style> head block) ---- */
body { margin: 0; background: #f5ecd8 }
a { color: #b3541e; text-decoration: none }
a:hover { color: #ff2fa0 }

/* ---- nav (page-specific active link — green, not the shared cyan) ---- */
.story-nav__link--active { color: #39ff5a; border-bottom: 0.3em solid #39ff5a; padding-bottom: 0.4em }

/* ---- header ---- */
.story-header { text-align: center; padding: 3.25em 2.5em 2.75em; background: #f5ecd8; border-bottom: 0.19em solid #1c0a12 }
.story-kicker { font-family: ui-monospace,monospace; font-weight: 700; font-size: 0.75em; letter-spacing: 0.33em; color: #b3541e }
.story-title { margin: 1em auto 0; max-width: 14em; font-family: 'Archivo Black',sans-serif; font-weight: 900; font-size: min(4em,10vw); line-height: 1; color: #1c0a12; text-transform: uppercase }
.story-dek { font-size: 1.06em; color: #5c4a3a; margin: 1.1em 0 0 }

/* ---- article ---- */
.story-article { max-width: 51em; margin: 0 auto; padding: 3em 2em 1.25em }

.story-stage--intro { font-family: 'Press Start 2P',monospace; font-size: 0.7em; color: #ff2fa0; margin-bottom: 1.25em }
.story-stage { font-family: 'Press Start 2P',monospace; font-size: 0.7em; color: #b3541e; margin: 2.25em 0 1.25em }
.story-stage--final { font-family: 'Press Start 2P',monospace; font-size: 0.7em; color: #39ff5a; margin: 2.25em 0 1.25em }

.story-body { font-size: 1.06em; line-height: 1.75; color: #3c2a24; margin: 0 }
.story-body--cont { font-size: 1.06em; line-height: 1.75; color: #3c2a24; margin: 0.85em 0 0 }
.story-dropcap { float: left; font-family: 'Archivo Black',sans-serif; font-size: 3.65em; line-height: .85; padding: 0.07em 0.2em 0 0; color: #ff2fa0 }

.story-pullquote { font-family: 'Archivo Black',sans-serif; font-size: 1.5em; color: #b3541e; border-top: 0.125em solid #1c0a12; border-bottom: 0.125em solid #1c0a12; padding: 0.7em 0; margin: 1.25em 0; font-style: italic }
.story-pullquote--dark { font-family: 'Archivo Black',sans-serif; font-size: 1.5em; color: #1c0a12; border-top: 0.125em solid #1c0a12; border-bottom: 0.125em solid #1c0a12; padding: 0.7em 0; margin: 1.25em 0; font-style: italic }

/* ---- closing CTA ---- */
.story-cta { text-align: center; padding: 2.75em 2.5em 3.25em; background: #080312; border-top: 0.4em solid #ff2fa0; margin-top: 2.75em }
.story-cta__head { font-family: 'Press Start 2P',monospace; font-size: 1em; color: #39ff5a; text-shadow: 0 0 0.85em #39ff5a77 }
.story-cta__actions { display: flex; justify-content: center; gap: 1.1em; margin-top: 1.5em; flex-wrap: wrap }
.story-cta__btn--pink { font-family: 'Press Start 2P',monospace; font-size: 0.7em; background: #ff2fa0; color: #fff; padding: 1.25em 2em; box-shadow: 0.36em 0.36em 0 #7a0e4c }
.story-cta__btn--cyan { font-family: 'Press Start 2P',monospace; font-size: 0.7em; background: #25e8e0; color: #08131a; padding: 1.25em 2em; box-shadow: 0.36em 0.36em 0 #0e5a56 }
.story-legal { font-family: ui-monospace,monospace; font-size: 0.7em; color: #5c4f78; margin-top: 2.4em }