/* ============================================================
   nairajournal.io — money history page (/money/)
   "the public ledger, printed" extended into a scroll-driven timeline.
   Uses the site's existing CSS variables and type system. Respects
   prefers-reduced-motion (motion is decorative, not essential).
   ============================================================ */

/* ---------- hero ---------- */
.mh-hero{position:relative;min-height:88vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--forest);color:#f3f6ee;border-bottom:1px solid var(--rule-strong);}
.mh-hero-bg{position:absolute;inset:0;z-index:0;}
.mh-hero-img{position:absolute;inset:0;width:100%;height:120%;object-fit:cover;object-position:center top;opacity:.42;will-change:transform;}
.mh-hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,24,18,.55) 0%,rgba(12,24,18,.2) 35%,rgba(12,24,18,.75) 78%,rgba(12,24,18,.96) 100%);}
.mh-hero-inner{position:relative;z-index:2;padding-top:120px;padding-bottom:96px;max-width:760px;}
.mh-hero-eyebrow{color:var(--amber-bright);}
.mh-hero-eyebrow::after{background:rgba(233,168,59,.5);}
.mh-hero-h1{font-size:clamp(2.4rem,1.6rem + 3.6vw,4.6rem);font-weight:900;line-height:1.02;letter-spacing:-.025em;margin:18px 0 22px;max-width:18ch;text-wrap:balance;}
.mh-hero-dek{font-family:'Vollkorn',serif;font-style:italic;font-size:var(--fs-dek);line-height:1.7;color:#d7e3cf;max-width:56ch;}
.mh-hero-meta{margin-top:30px;padding-top:16px;border-top:1px solid rgba(159,179,154,.3);display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:.78rem;color:#9fb39a;letter-spacing:.04em;text-transform:uppercase;}
.mh-dot{width:5px;height:5px;border-radius:50%;background:var(--green-deep);display:inline-block;}
.mh-scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:#9fb39a;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;animation:mh-cue 2.4s ease-in-out infinite;}
.mh-scroll-cue svg{animation:mh-cue-arrow 2.4s ease-in-out infinite;}
@keyframes mh-cue{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes mh-cue-arrow{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* ---------- sticky rail ---------- */
.mh-rail{position:sticky;top:0;z-index:6;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:saturate(140%) blur(8px);-webkit-backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--rule);}
.mh-rail-title{display:none;}
.mh-rail-list{max-width:1160px;margin:0 auto;padding:10px 20px;display:flex;gap:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x proximity;}
.mh-rail-list::-webkit-scrollbar{display:none;}
.mh-rail-item{flex:0 0 auto;scroll-snap-align:start;display:flex;flex-direction:column;gap:1px;padding:7px 12px;border-right:1px solid var(--rule);text-decoration:none;color:var(--ink-muted);transition:color .15s ease,background .15s ease;white-space:nowrap;}
.mh-rail-item:last-child{border-right:none;}
.mh-rail-item:hover{color:var(--ink);background:color-mix(in srgb,var(--green) 5%,transparent);}
.mh-rail-year{font-family:'Public Sans',sans-serif;font-weight:800;font-variant-numeric:tabular-nums;font-size:.76rem;color:var(--ink);letter-spacing:.02em;}
.mh-rail-note{font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sage);}
.mh-rail-item.is-active{background:var(--green);color:#fdfff9;}
.mh-rail-item.is-active .mh-rail-year{color:#fdfff9;}
.mh-rail-item.is-active .mh-rail-note{color:rgba(253,255,249,.78);}
@media (min-width:861px){
  .mh-rail-item{padding:10px 22px;}
  .mh-rail-year{font-size:.9rem;}
  .mh-rail-note{font-size:.62rem;letter-spacing:.08em;}
}

/* ---------- timeline spine + eras ---------- */
.mh-timeline{position:relative;max-width:1080px;margin:0 auto;padding:0 20px;}
.mh-spine{position:absolute;left:30px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--rule) 0%,var(--rule-strong) 8%,var(--rule-strong) 92%,var(--rule) 100%);}
@media (min-width:861px){.mh-spine{left:60px;}}

.mh-era{position:relative;display:grid;grid-template-columns:1fr;gap:0;padding:56px 0 56px 64px;border-bottom:1px solid var(--rule);}
@media (min-width:861px){.mh-era{padding:84px 0 84px 140px;}}
.mh-era:last-child{border-bottom:none;}

/* the era stamp sits to the LEFT of the spine; the dot sits ON the spine.
   The stamp text gets a solid background so the spine never shows through it. */
.mh-era-stamp{position:absolute;left:0;top:54px;width:48px;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding-right:6px;background:var(--paper);z-index:3;}
@media (min-width:861px){.mh-era-stamp{top:82px;width:96px;padding-right:10px;}}
.mh-era-stamp::before{content:"";position:absolute;left:18px;top:5px;width:13px;height:13px;border-radius:50%;background:var(--paper);border:2px solid var(--rule-strong);z-index:4;transition:background .25s ease,border-color .25s ease,transform .25s ease;}
@media (min-width:861px){.mh-era-stamp::before{left:48px;}}
.mh-era-year{font-family:'Public Sans',sans-serif;font-weight:800;font-variant-numeric:tabular-nums;font-size:.84rem;color:var(--ink);background:var(--paper);padding:0 4px 0 0;letter-spacing:.01em;line-height:1.1;}
@media (min-width:861px){.mh-era-year{font-size:.92rem;}}
.mh-era-note{font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sage);background:var(--paper);padding:0 4px 0 0;line-height:1.15;}
@media (min-width:861px){.mh-era-note{font-size:.62rem;letter-spacing:.1em;}}

/* reveal-on-scroll */
.mh-era-body{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease;}
.mh-era.is-visible .mh-era-body{opacity:1;transform:none;}
.mh-era .eyebrow{margin-bottom:8px;}
.mh-era-h2{font-size:var(--fs-h2);font-weight:900;line-height:1.12;letter-spacing:-.012em;max-width:24ch;margin-bottom:16px;text-wrap:balance;}
.mh-era-summary{font-family:'Vollkorn',serif;font-size:1.12rem;line-height:1.72;color:var(--ink);max-width:62ch;margin-bottom:28px;}

/* the naira's birth gets the flag-green accent */
.mh-era-birth{background:linear-gradient(180deg,color-mix(in srgb,var(--green) 6%,transparent) 0%,transparent 100%);}
.mh-era-birth .mh-era-stamp,.mh-era-birth .mh-era-year,.mh-era-birth .mh-era-note{background:color-mix(in srgb,var(--green) 6%,var(--paper));}
.mh-era-birth .mh-era-stamp::before{background:var(--green);border-color:var(--green-deep);box-shadow:0 0 0 5px color-mix(in srgb,var(--green) 18%,transparent);}
.mh-era-birth .eyebrow{color:var(--green);}
.mh-era-birth .mh-era-h2{color:var(--green-deep);}
.mh-era-birth .mh-era-year{color:var(--green-deep);}

/* ---------- specimens (lit museum frames) ---------- */
.mh-specs{display:grid;grid-template-columns:1fr;gap:24px;margin:8px 0 32px;}
@media (min-width:641px){.mh-specs{grid-template-columns:1fr 1fr;}}
.mh-spec{margin:0;display:flex;flex-direction:column;gap:10px;}
.mh-spec-frame{position:relative;background:var(--forest);border-radius:var(--radius-l);overflow:hidden;border:1px solid rgba(233,168,59,.22);box-shadow:0 18px 40px -22px rgba(12,24,18,.6);aspect-ratio:1/1;}
.mh-spec-frame::before{content:"";position:absolute;inset:8px;border:1px solid rgba(233,168,59,.28);pointer-events:none;border-radius:3px;z-index:2;}
.mh-spec-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.mh-spec:hover .mh-spec-frame img{transform:scale(1.04);}
.mh-spec figcaption{font-size:.82rem;line-height:1.55;color:var(--ink-muted);max-width:54ch;}
.mh-spec-tag{display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);background:color-mix(in srgb,var(--amber) 10%,transparent);padding:2px 8px;border-radius:2px;margin-right:6px;vertical-align:.08em;}
.mh-spec-illu .mh-spec-frame{background:var(--forest-raised,#152820);background:linear-gradient(160deg,#152820,#0c1812);}
.mh-spec-photo .mh-spec-tag{color:var(--green-deep);background:color-mix(in srgb,var(--green) 10%,transparent);}

/* single-specimen eras go full width on desktop */
.mh-specs:has(> .mh-spec:only-child){grid-template-columns:1fr;max-width:540px;}
.mh-specs:has(> .mh-spec:only-child) .mh-spec-frame{aspect-ratio:4/3;}

/* ---------- facts / sources ---------- */
.mh-facts{list-style:none;counter-reset:fact;margin:20px 0 0;padding:0;border-top:1px solid var(--rule);max-width:70ch;}
.mh-fact{counter-increment:fact;padding:18px 0 18px 40px;border-bottom:1px solid var(--rule);position:relative;}
.mh-fact::before{content:counter(fact,decimal-leading-zero);position:absolute;left:0;top:20px;font-family:'Public Sans',sans-serif;font-weight:800;font-variant-numeric:tabular-nums;font-size:.78rem;color:var(--gold);letter-spacing:.04em;}
.mh-fact-text{font-size:.98rem;line-height:1.68;color:var(--ink);margin-bottom:8px;}
.mh-fact-src{font-size:.78rem;color:var(--ink-muted);line-height:1.5;}
.mh-fact-src a{color:var(--green-deep);text-decoration:underline;text-underline-offset:2px;font-weight:600;}
.mh-fact-src a:hover{color:var(--ink);}
.mh-fact-acc{color:var(--sage);font-style:italic;}

/* ---------- gap notes (honest about the record) ---------- */
.mh-gap{margin:22px 0 0;padding:16px 18px;background:color-mix(in srgb,var(--amber-bright) 7%,var(--paper-raised));border-left:3px solid var(--amber);border-radius:0 var(--radius-s) var(--radius-s) 0;font-size:.9rem;line-height:1.62;color:var(--ink-muted);max-width:70ch;}
.mh-gap-label{display:block;font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-bottom:6px;}

/* ---------- closing ---------- */
.mh-closing{background:var(--forest);color:#f3f6ee;padding:72px 0 64px;border-top:1px solid var(--rule-strong);}
.mh-closing h2{font-size:var(--fs-h2);font-weight:900;max-width:22ch;margin-bottom:20px;color:#fdfff9;}
.mh-closing p{font-family:'Vollkorn',serif;font-size:1.08rem;line-height:1.72;color:#cfdcc6;max-width:64ch;margin-bottom:22px;}
.mh-closing-cta{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 32px;}
.mh-closing-cta .btn-primary{background:var(--green);color:#fdfff9;}
.mh-closing-cta .btn-primary:hover{background:var(--green-deep);}
.mh-closing-cta .btn-ghost{border-color:#cfdcc6;color:#cfdcc6;}
.mh-closing-cta .btn-ghost:hover{background:#cfdcc6;color:var(--forest);}
.mh-closing-note{font-size:.84rem;color:#9fb39a;font-style:italic;border-top:1px solid rgba(159,179,154,.28);padding-top:18px;max-width:72ch;}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .mh-hero-img{transform:none!important;}
  .mh-scroll-cue,.mh-scroll-cue svg{animation:none;}
  .mh-era-body{opacity:1!important;transform:none!important;transition:none;}
  .mh-spec:hover .mh-spec-frame img{transform:none;}
  html{scroll-behavior:auto;}
}
/* the reveal-on-scroll should not hide content from no-JS readers or search engines */
@media (scripting:none){.mh-era-body{opacity:1;transform:none;}}
.no-js .mh-era-body{opacity:1;transform:none;}