/* nairajournal.io  -  exchange history page (/exchange/)
   How Nigeria got a stock market  -  same visual grammar as /money/ and /rates/
   but with a distinct industrial papel token for the equity era.
   Uses site's existing CSS variables. Motion decorative, off under prefers-reduced-motion. */

.mh-progress-bar{position:sticky;top:0;z-index:8;background:var(--forest);color:#f3f6ee;border-bottom:2px solid var(--green-deep);padding:10px 0;}
.mh-progress-inner{display:flex;justify-content:space-between;align-items:center;gap:12px;}
.mh-progress-era{font-family:'Public Sans',sans-serif;font-weight:700;font-size:.82rem;letter-spacing:.04em;color:#d7e3cf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mh-progress-count{font-family:'Public Sans',sans-serif;font-weight:800;font-variant-numeric:tabular-nums;font-size:.82rem;color:var(--amber-bright);white-space:nowrap;flex-shrink:0;}

.mh-hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--forest);color:#f3f6ee;}
.mh-hero-bg{position:absolute;inset:0;z-index:0;}
.mh-hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,24,18,.45) 0%,rgba(12,24,18,.15) 30%,rgba(12,24,18,.72) 72%,rgba(12,24,18,.97) 100%);}
.mh-hero-inner{position:relative;z-index:2;padding-top:120px;padding-bottom:88px;max-width:780px;}
.mh-hero-eyebrow-row{display:flex;align-items:center;gap:14px;margin-bottom:22px;}
.mh-eyebrow-line{width:36px;height:2px;background:var(--amber-bright);flex-shrink:0;}
.mh-hero-eyebrow{font-family:'Public Sans',sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--amber-bright);}
.mh-hero-h1{font-size:clamp(2.6rem,1.8rem + 4vw,5rem);font-weight:900;line-height:1.02;letter-spacing:-.025em;margin:0 0 20px;max-width:20ch;text-wrap:balance;}
.mh-hero-br{display:none;}
@media (min-width:641px){.mh-hero-br{display:block;}}
.mh-hero-dek{font-family:'Vollkorn',serif;font-style:italic;font-size:1.18rem;line-height:1.7;color:#cfdcc6;max-width:52ch;margin-bottom:28px;}
.mh-hero-intro-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:20px 24px;margin-bottom:28px;max-width:64ch;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
.mh-hero-intro-card p{font-family:'Vollkorn',serif;font-size:1.02rem;line-height:1.72;color:#d7e3cf;margin:0;}
.mh-hero-meta{display:flex;gap:8px;flex-wrap:wrap;}
.mh-meta-pill{font-family:'Public Sans',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9fb39a;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:100px;padding:4px 12px;}

.mh-timeline{max-width:1160px;margin:0 auto;padding:0 20px;}
@media (min-width:861px){.mh-timeline{padding:0 40px;}}
.mh-era{position:relative;padding:72px 0 72px 32px;border-bottom:1px solid var(--rule);}
.mh-era:last-child{border-bottom:none;}
@media (min-width:861px){.mh-era{padding:96px 0 96px 0;}}
.mh-era-spine{position:absolute;left:10px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent 0%,var(--rule-strong) 8%,var(--rule-strong) 92%,transparent 100%);}
@media (min-width:861px){.mh-era-spine{display:none;}}
.mh-era-content{position:relative;}
.mh-era-header{display:flex;align-items:center;gap:12px;margin-bottom:32px;}
.mh-era-dot{width:24px;height:24px;border-radius:50%;background:var(--paper);border:2px solid var(--rule-strong);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;}
.mh-era-dot-inner{width:10px;height:10px;border-radius:50%;background:var(--green-deep);}
.mh-era-date{font-family:'Public Sans',sans-serif;font-weight:800;font-variant-numeric:tabular-nums;font-size:.92rem;color:var(--ink);letter-spacing:.01em;}
.mh-era-badge{font-family:'Public Sans',sans-serif;font-size:.64rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);background:color-mix(in srgb,var(--green) 8%,var(--paper));border:1px solid var(--rule);border-radius:100px;padding:3px 10px;}

.mh-era-grid{display:grid;grid-template-columns:1fr;gap:32px;}
@media (min-width:861px){.mh-era-grid{grid-template-columns:1fr 1fr;gap:56px;align-items:start;}}
.mh-col-text{}
@media (min-width:861px){.mh-col-text{order:1;}.mh-col-text-right{order:2;}}
.mh-col-img{}
@media (min-width:861px){.mh-col-img{order:2;}.mh-col-img-left{order:1;}}

.mh-era-h2{font-size:clamp(1.5rem,.8rem + 2.4vw,2.2rem);font-weight:900;line-height:1.1;letter-spacing:-.015em;margin:0 0 8px;text-wrap:balance;max-width:22ch;}
.mh-era-eyebrow{font-family:'Public Sans',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.14em;color:var(--green-deep);margin:0 0 14px;text-transform:uppercase;}
.mh-era-summary{font-family:'Vollkorn',serif;font-size:1.06rem;line-height:1.72;color:var(--ink);max-width:58ch;margin-bottom:24px;}

.mh-figure{margin:0;}
.mh-figure-frame{position:relative;background:var(--forest);border-radius:10px;overflow:hidden;border:1px solid rgba(233,168,59,.2);box-shadow:0 20px 48px -20px rgba(12,24,18,.55);aspect-ratio:4/3;display:grid;place-items:center;}
.mh-figure-cap{font-size:.8rem;line-height:1.56;color:var(--ink-muted);margin-top:12px;max-width:52ch;}
.mh-figure-placeholder-frame{background:linear-gradient(145deg,var(--forest),color-mix(in srgb,var(--forest) 82%,var(--green) 18%));}
.mh-placeholder-index{font-family:var(--display);font-weight:400;font-size:3.2rem;line-height:1;color:rgba(255,255,255,.14);letter-spacing:-.02em;}
.mh-placeholder-year{font-family:var(--sans);font-weight:800;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:6px;}

.mh-gap-box{display:flex;gap:12px;align-items:flex-start;background:color-mix(in srgb,var(--amber-bright) 6%,var(--paper-raised));border:1px solid color-mix(in srgb,var(--amber) 30%,transparent);border-radius:8px;padding:14px 16px;margin:20px 0;max-width:60ch;}
.mh-gap-label{font-family:'Public Sans',sans-serif;font-weight:700;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);margin:0 0 4px;}
.mh-gap-text{font-size:.88rem;line-height:1.6;color:var(--ink-muted);margin:0;}

.mh-sources{margin:20px 0;}
.mh-src-toggle{display:inline-flex;align-items:center;gap:8px;font-family:'Public Sans',sans-serif;font-size:.78rem;font-weight:600;color:var(--green-deep);background:none;border:1px solid var(--rule);border-radius:100px;padding:6px 14px;cursor:pointer;transition:background .15s ease,border-color .15s ease;}
.mh-src-toggle:hover{background:color-mix(in srgb,var(--green) 6%,transparent);border-color:var(--green);}
.mh-chevron{transition:transform .2s ease;}
.mh-src-toggle[aria-expanded="true"] .mh-chevron{transform:rotate(180deg);}
.mh-src-list{margin:12px 0 0;padding:0;}
.mh-src-list ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule);}
.mh-src-item{padding:10px 0;border-bottom:1px solid var(--rule);font-size:.82rem;line-height:1.5;}
.mh-src-item a{color:var(--green-deep);text-decoration:underline;text-underline-offset:2px;font-weight:600;}
.mh-src-item a:hover{color:var(--ink);}
.mh-src-acc{color:var(--sage);font-style:italic;}

.mh-share-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:20px;}
.mh-share-label{font-family:'Public Sans',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-muted);}
.mh-share-wa,.mh-share-copy{display:inline-flex;align-items:center;gap:6px;font-family:'Public Sans',sans-serif;font-size:.78rem;font-weight:700;border-radius:100px;padding:6px 14px;cursor:pointer;transition:background .15s ease,transform .1s ease;}
.mh-share-wa:active,.mh-share-copy:active{transform:scale(.97);}
.mh-share-wa{background:#25d366;color:#fff;text-decoration:none;border:none;}
.mh-share-wa:hover{background:#1ebe5d;color:#fff;}
.mh-share-copy{background:none;border:1px solid var(--rule);color:var(--ink-muted);}
.mh-share-copy:hover{background:color-mix(in srgb,var(--green) 6%,transparent);border-color:var(--green);color:var(--ink);}
.mh-share-copy.is-copied{color:var(--green-deep);border-color:var(--green);}

.mh-closing{background:var(--forest);color:#f3f6ee;padding:80px 0 72px;border-top:2px solid var(--green-deep);}
.mh-closing-inner{max-width:720px;}
.mh-closing-h2{font-size:clamp(1.6rem,1rem + 2.4vw,2.4rem);font-weight:900;line-height:1.1;letter-spacing:-.015em;margin:0 0 20px;color:#fdfff9;text-wrap:balance;}
.mh-closing-p{font-family:'Vollkorn',serif;font-size:1.06rem;line-height:1.72;color:#cfdcc6;max-width:64ch;margin-bottom:28px;}
.mh-closing-cta{display:flex;gap:12px;flex-wrap:wrap;margin:0 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-family:'Vollkorn',serif;font-size:.88rem;color:#9fb39a;font-style:italic;border-top:1px solid rgba(159,179,154,.25);padding-top:20px;max-width:72ch;}

.mh-era-content{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease;}
.mh-era.is-visible .mh-era-content{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){
  .mh-era-content{opacity:1!important;transform:none!important;transition:none;}
}