/* ============================================================
   Masters of Abstraction — deck-matched theme
   Loaded after site.css, scoped to body.moa so the
   Nobel Heroes pages keep the shared near-black system.

   Palette sampled directly from the 2026 sponsorship deck:
     page base      #050713   panel fill   #0E1A38
     blue glow      #265198   lifted panel #12254B
     gold           #CBA452   hairline     #9C8248
     bright gold    #E6C982   cream        #F2EAD8
   ============================================================ */

body.moa{
  --ink:#050713;
  --ink-2:#080F22;
  --line:rgba(203,164,82,.17);
  --line-2:rgba(203,164,82,.36);
  --brass:#CBA452;
  --brass-l:#E6C982;
  --text:rgba(242,234,216,.82);
  --muted:rgba(236,229,213,.55);
  --faint:rgba(236,229,213,.34);

  --moa-cream:#F2EAD8;
  --moa-panel:#0E1A38;
  --moa-panel-2:#12254B;
  --moa-frame:rgba(203,164,82,.38);
}

/* ---------- the field: navy base with the deck's blue glow ---------- */
body.moa section.s{
  background:
    radial-gradient(ellipse 60% 76% at 50% 46%,
      rgba(38,81,152,.34), rgba(21,44,86,.13) 46%, transparent 72%),
    var(--ink);
}
body.moa section.s.s-alt{
  background:
    radial-gradient(ellipse 64% 80% at 50% 44%,
      rgba(38,81,152,.40), rgba(21,44,86,.16) 46%, transparent 74%),
    var(--ink-2);
}
body.moa .hero::after{
  background:radial-gradient(ellipse 54% 58% at 50% 46%,
    rgba(44,92,168,.60), rgba(23,49,95,.26) 44%, transparent 70%);
}

/* ---------- the gold frame: opening and closing slide only ---------- */
body.moa .hero::before,
body.moa .close::before{
  content:'';
  position:absolute;
  inset:clamp(14px,2.2vw,30px);
  border:1px solid var(--moa-frame);
  pointer-events:none;
  z-index:1;
}
body.moa .hero::before{top:calc(var(--nav-h) + clamp(14px,2.2vw,30px))}
body.moa .close{position:relative;overflow:hidden;
  background:radial-gradient(ellipse 52% 64% at 50% 50%,
    rgba(38,81,152,.34), rgba(21,44,86,.12) 48%, transparent 72%),
    var(--ink)}
body.moa .close .wrap{position:relative;z-index:2}

/* ---------- hero: the deck's centred title slide ---------- */
body.moa .hero .wrap{text-align:center}
body.moa .hero-h{max-width:none;margin:0 auto}
body.moa .hero-sub{max-width:52ch;margin-left:auto;margin-right:auto}
body.moa .hero-sup{position:relative;padding-bottom:clamp(26px,3.4vw,40px)}
body.moa .hero-sup::after{
  content:'';position:absolute;left:50%;bottom:clamp(11px,1.5vw,18px);transform:translateX(-50%);
  width:62px;height:1px;background:var(--brass);opacity:.62;
}
body.moa .hero-act{flex-direction:column;justify-content:center;gap:16px}
/* the deck stacks its label above the logo lockup, centred */
body.moa .hero .lock{margin-left:auto;margin-right:auto;gap:22px}
body.moa .hero .lock-row{flex-direction:column;align-items:center;gap:13px}
body.moa .hero .lock-row+.lock-row{padding-top:22px}
body.moa .hero .lock-lab{width:auto;letter-spacing:.26em;text-align:center}
body.moa .hero .lock-set{justify-content:center}
body.moa .hero .lock-txt{text-align:center}

/* ---------- type: cream, not white ---------- */
body.moa h1,body.moa h2,body.moa h3,body.moa h4,
body.moa .hero-h,body.moa .col-t,body.moa .row-t,body.moa .nm-n,
body.moa .lock-txt,body.moa .sw-fact dd,body.moa .day-n,
body.moa .sw-tab[aria-selected="true"] .t-n{color:var(--moa-cream)}

/* the deck sets its labels far wider than the shared system */
body.moa .eyebrow{letter-spacing:.4em;font-size:9px}
body.moa .hero-meta{letter-spacing:.38em}
body.moa .lock-lab,body.moa .col-k{letter-spacing:.24em}

/* ---------- nav / menu retinted to navy ---------- */
body.moa nav{background:rgba(5,7,19,.72)}
body.moa nav.on{background:rgba(5,7,19,.94);border-bottom-color:var(--line)}
body.moa .mmenu{background:rgba(5,7,19,.98)}
body.moa .btn-solid{color:#0A1226}

/* ---------- thesis: ruled columns with gold italic numerals ---------- */
body.moa #thesis .col-top{
  border-top:none;
  border-left:1px solid var(--line);
  padding-top:0;
  padding-left:clamp(14px,1.7vw,24px);
}
body.moa #thesis .col-top:first-child{border-left:none;padding-left:0}
body.moa #thesis .col-k{
  font-family:var(--serif);
  font-style:italic;
  font-size:23px;
  letter-spacing:0;
  text-transform:none;
  color:var(--brass);
  position:relative;
  padding-bottom:13px;
  margin-bottom:15px;
}
body.moa #thesis .col-k::after{
  content:'';position:absolute;left:0;bottom:0;width:26px;height:1px;background:var(--brass);
}

/* ---------- six themes: the deck's bordered navy rows ---------- */
body.moa #themes .rows{
  border-top:none;
  display:flex;
  flex-direction:column;
  gap:9px;
}
body.moa #themes .row{
  background:var(--moa-panel);
  border:1px solid rgba(203,164,82,.34);
  border-left:4px solid var(--brass);
  padding:clamp(17px,2vw,22px) clamp(18px,2.4vw,28px);
  transition:background .3s,border-color .3s;
}
body.moa #themes .row:hover{
  background:var(--moa-panel-2);
  border-color:rgba(203,164,82,.55);
}
body.moa #themes .row-n{font-size:20px}

/* ---------- diamond bullets, as in the deck ---------- */
body.moa .itm::before{
  content:'◆';
  width:auto;height:auto;border-radius:0;background:none;
  color:var(--brass);font-size:7px;line-height:1;margin-top:8px;
}
body.moa .tick li{padding-left:18px}
body.moa .tick li::before{
  content:'◆';
  width:auto;height:auto;background:none;
  color:var(--brass);font-size:6.5px;line-height:1;top:8px;
}

/* ---------- closing lockup, set like the deck's slide footer ---------- */
body.moa .close p{
  font-family:var(--serif);
  font-size:clamp(10px,1.1vw,12.5px);
  letter-spacing:.34em;
  color:var(--brass);
  text-transform:uppercase;
  position:relative;
  padding-top:30px;
  margin-bottom:40px;
}
body.moa .close p::before{
  content:'';position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:56px;height:1px;background:var(--brass);opacity:.6;
}

/* ---------- labelled blocks: gold left bar, as in the deck ---------- */
body.moa .col-top{
  border-top:none;
  border-left:2px solid var(--brass);
  padding:1px 0 1px clamp(15px,1.6vw,20px);
}
body.moa .stat-n{color:var(--brass-l)}
/* tighter gutter so the deck's three-up stat row stays on one line */
body.moa .stats{gap:clamp(22px,2.8vw,38px)}
body.moa .stat-l{max-width:132px}
body.moa .fcopy{color:rgba(236,229,213,.34)}

/* ---------- responsive ---------- */
@media(max-width:860px){
  body.moa #thesis .col-top{border-left:none;padding-left:0;
    border-top:1px solid var(--line);padding-top:20px}
  body.moa #themes .row{padding:18px 18px 18px 16px}
  body.moa .hero .lock-lab{width:auto}
}