:root{--ink:#102345;--muted:#475771;--accent:#1749a1;--accent-dark:#0e3379;--line:#dde2ef;--tint:#f1f5fc;--white:#fff;--radius:18px}
*{box-sizing:border-box}
body{margin:0;font:16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--white)}
a{color:var(--accent);text-underline-offset:3px}
a:hover{color:var(--accent-dark)}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #1a5bc9;outline-offset:4px}
h1,h2,h3,p{margin:0 0 .65em}
h1,h2,h3{line-height:1.16;letter-spacing:-.027em}
h1{font-size:clamp(2.45rem,6vw,4.8rem);max-width:15ch}
h2{font-size:clamp(1.4rem,2.7vw,2.35rem)}
h3{font-size:1.35rem}
p{color:var(--muted)}
.shell{width:min(1160px,calc(100% - 44px));margin-inline:auto}
.header{border-bottom:1px solid var(--line);background:#fff;position:relative;z-index:2}
.navrow{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:80px}
.brand{display:inline-block;flex-shrink:0}
.brand img{object-fit:contain}
nav{display:flex;align-items:center;gap:clamp(12px,2vw,26px)}
nav a,.dropdown summary{color:var(--ink);text-decoration:none;font-weight:650;white-space:nowrap;font-size:.94rem}
nav a:hover,nav a[aria-current],.dropdown[open] summary{color:var(--accent)}
.dropdown{position:relative}
.dropdown summary{cursor:pointer}
.dropdown div{position:absolute;top:calc(100% + 10px);left:-12px;min-width:215px;background:white;border:1px solid var(--line);box-shadow:0 14px 30px #10234514;border-radius:12px;padding:8px}
.dropdown a{display:block;padding:8px 10px}
.navtoggle{color:var(--accent);background:white;border:1px solid var(--line);padding:8px 13px;border-radius:8px;font-weight:700}
.button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:720;background:var(--accent);color:white;border:1px solid var(--accent);border-radius:9px;padding:10px 18px;min-height:46px;width:max-content;max-width:100%;text-align:center}
.button:hover{background:var(--accent-dark);color:white}
.button.outline{background:white;color:var(--accent);border-color:var(--line)}
.button.outline:hover{border-color:var(--accent);background:var(--tint)}
.button.compact{font-size:.93rem;padding:7px 13px;min-height:39px}
.actions,.pills,.inline-form{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.hero{background:linear-gradient(124deg,#f5f8ff,#eaf2fd);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:26px;padding-block:52px}
.hero .eyebrow{border-left:4px solid #f6b528;padding-left:10px}
.hero h1{font-size:clamp(3rem,6vw,5.15rem);margin-block:.19em .27em}
.hero p,.intro p{font-size:1.14rem;max-width:57ch;margin-bottom:24px}
.hero img{width:min(100%,470px);justify-self:end;max-height:390px;object-fit:contain}
.eyebrow{display:block;color:var(--accent);font-weight:800;letter-spacing:.09em;text-transform:uppercase;font-size:.74rem;margin-bottom:10px}
.intro{background:var(--tint);padding-block:48px 34px;border-bottom:1px solid var(--line)}
.intro h1{font-size:clamp(2.2rem,5.5vw,4rem);max-width:22ch}
.back{display:inline-block;margin-bottom:20px}
.section{padding-block:55px}
.section-head{max-width:720px;margin-bottom:26px}
.section-head h2{margin-bottom:8px}
.tint{background:var(--tint)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{border:1px solid var(--line);border-radius:var(--radius);background:white;overflow:hidden}
.card-inner{padding:22px}
.card h2,.record h2,.side h2{font-size:1.22rem}
.card h2 a,.card h3 a{color:var(--ink);text-decoration:none}
.card h2 a:hover,.card h3 a:hover{text-decoration:underline}
.card small{display:block;color:var(--muted)}
.cover{width:100%;height:auto;aspect-ratio:2.15;object-fit:cover;background:var(--tint)}
.text-link{display:inline-block;font-weight:720;margin-top:10px;text-decoration:none}
.text-link:hover{text-decoration:underline}
.notice,.record{padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--tint);margin-bottom:14px}
.notice h2{font-size:1.4rem}
.record{background:white;margin-top:14px;overflow-wrap:anywhere}
.error{background:#fff0f0;color:#8c1d21;padding:12px;border-radius:8px}
.filters{display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:20px}
.pills a,.link-button{display:inline-block;text-decoration:none;font-weight:650;background:var(--tint);color:var(--accent);border:1px solid var(--line);border-radius:25px;padding:5px 12px}
.pills a:hover,.link-button:hover,.pills a[aria-current]{background:#e6eefc;border-color:#94afd7}
.search,.inline-form{display:flex;align-items:end;gap:8px}
input:not([type=checkbox]),select,textarea{width:100%;border:1px solid #b9c1d3;border-radius:7px;padding:8px 10px;color:var(--ink);background:white}
input[type=file]{white-space:normal}
.form{display:grid;gap:14px}
.form label,.inline-form label{display:grid;gap:5px;font-weight:640}
.form label.check{display:block;font-weight:500}
.detail-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:28px;align-items:start}
.side .button{margin-bottom:8px}
.prose{max-width:760px;overflow-wrap:anywhere}
.prose h2{font-size:1.7rem;margin-top:1.1em}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{color:var(--muted)}
.syllabus{padding-left:26px}
.syllabus li{padding:7px 4px}
.facts{display:grid;grid-template-columns:auto 1fr;gap:9px 18px}
.facts dt{font-weight:720}
.facts dd{margin:0}
.article-image{width:100%;border-radius:12px;margin-bottom:24px}
.reading details{border-bottom:1px solid var(--line);padding:13px 0}
.reading summary{font-weight:720;cursor:pointer}
.spaced{margin-top:35px}
.preline{white-space:pre-line}
.muted{color:var(--muted)}
footer{background:#f5f6fb;border-top:1px solid var(--line);padding-top:38px}
.footgrid{display:grid;grid-template-columns:1.4fr .8fr 1fr;gap:22px}
.footgrid div>a:not(.brand){display:block;margin-top:5px}
.footgrid p{max-width:30ch}
.bottom{display:flex;justify-content:space-between;gap:12px;margin-top:30px;border-top:1px solid var(--line);padding-block:15px;color:var(--muted);font-size:.9rem}
.skip{position:absolute;left:-9999px}
.skip:focus{left:10px;top:8px;z-index:10;background:white;padding:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.narrow{max-width:460px}
.edit-form{max-width:760px}
.admin h1{font-size:clamp(2rem,4vw,3.25rem)}
.admin-nav{margin:16px 0 22px}
.admin-thumb{width:220px}
@media(max-width:900px){
.navrow{flex-wrap:wrap;min-height:70px;padding-block:10px}
.navtoggle:not([hidden]){display:block;margin-left:auto}
nav{width:100%;order:4;flex-wrap:wrap}
.navrow nav[data-collapsed=true]{display:none}
.dropdown div{position:static;min-width:0;box-shadow:none}
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
.shell{width:calc(100% - 30px)}
.navrow{gap:8px}
.brand img{width:128px}
.header-cta{display:none}
nav{display:grid;gap:8px}
.hero-grid,.detail-grid,.grid,.grid.two,.footgrid{grid-template-columns:1fr}
.hero-grid{padding-block:36px}
.hero img{max-height:250px;justify-self:center}
.intro,.section{padding-block:33px}
.intro p,.hero p{font-size:1rem}
.card-inner{padding:17px}
}

/* Academy visual system */
:root {
  --navy: #0a1936;
  --deep: #0c224c;
  --gold: #f6bf55;
  --accent: #184da8;
  --ink: #102345;
  --line: #dce5f2;
  --radius: 14px;
}
.icon { width: 1.2em; height: 1.2em; flex: 0 0 auto; vertical-align: middle; }
.icon-link, .share a, .share button { display: inline-flex; align-items: center; gap: .55em; }
.header { box-shadow: 0 4px 20px #1023450a; }
.header .button { border-radius: 6px; }
.hero, .intro {
  color: white;
  background: radial-gradient(ellipse at 76% 30%, #1a4285, transparent 53%), linear-gradient(125deg, var(--navy), var(--deep));
  position: relative;
}
.hero::before, .intro::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(#9cbaff13 1px, transparent 1px), linear-gradient(90deg, #9cbaff13 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(90deg, transparent, #000 70%);
}
.hero > *, .intro > * { position: relative; }
.hero-grid { padding-block: clamp(44px, 7vw, 94px) 32px; gap: clamp(20px, 5vw, 74px); }
.hero h1 { max-width: 12ch; line-height: 1.01; letter-spacing: -.065em; }
.hero h1 em { color: var(--gold); font-style: normal; }
.hero p, .intro p { color: #d2dff6; }
.hero .eyebrow, .intro .eyebrow, .intro .back { color: #fbd287; }
.hero .button:not(.outline) { background: var(--gold); color: var(--navy); border-color: var(--gold); }
.hero .button:not(.outline):hover { background: #ffd785; }
.hero .button.outline { background: transparent; color: white; border-color: #a6c1e980; }
.hero .button.outline:hover { background: #ffffff16; }
.hero-visual { position: relative; isolation: isolate; }
.hero-visual::before {
  content: "";
  position: absolute;
  inset: 9% 2% 2% 12%;
  z-index: -1;
  border-radius: 120px 18px 90px 18px;
  border: 1px solid #a8c8ff55;
  background: linear-gradient(145deg, #77a9fa50, #ffffff0a);
}
.hero img { margin-inline: auto; max-height: 460px; filter: drop-shadow(0 22px 24px #040c2180); }
.hero-tracks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
  border-top: 1px solid #a8c8ff55;
  padding-block: 20px;
}
.hero-tracks span { color: #b9cdea; font-size: .78rem; font-weight: 750; text-transform: uppercase; letter-spacing: .1em; }
.hero-tracks a { color: white; text-decoration: none; font-weight: 680; }
.hero-tracks a:hover { text-decoration: underline; }
.hero-tracks b { color: var(--gold); }
.intro { padding-block: clamp(45px, 7vw, 85px); }
.intro p { margin-bottom: 0; }
.section-head .eyebrow { display: inline-flex; align-items: center; gap: 9px; }
.section-head .eyebrow::before { content: ""; width: 22px; height: 2px; background: #c88715; }
.card { box-shadow: 0 7px 22px #1023450a; }
.card:has(.text-link):hover { border-color: #a8bedf; }
.cover { border-bottom: 1px solid var(--line); }
.reasons { background: #f2f6fc; border-block: 1px solid var(--line); }
.reason { padding: 23px 24px 16px; border-left: 2px solid #cad9ee; }
.feature-icon {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 9px;
  background: #eaf1ff;
  color: var(--accent);
  flex: 0 0 auto;
}
.reason .feature-icon { margin-bottom: 14px; }
.story { margin: 0; padding: 23px 24px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--gold); border-radius: var(--radius); display: flex; flex-direction: column; box-shadow: 0 7px 22px #1023450a; }
.quote-mark { color: var(--accent); font: 700 3.4rem/.8 Georgia, serif; }
.story blockquote { margin: 8px 0 16px; color: #344763; }
.story figcaption { margin-top: auto; font-weight: 760; }
.site-footer { background: var(--navy); color: white; padding-top: 52px; }
.site-footer p, .site-footer .bottom { color: #bdcce5; }
.site-footer a { color: #e4edff; text-decoration: none; }
.site-footer a:hover { color: white; text-decoration: underline; }
.site-footer .brand { background: white; padding: 6px 10px; border-radius: 8px; margin-bottom: 10px; }
.site-footer .bottom { border-color: #ffffff30; }
.site-footer .footgrid div > a.icon-link { display: flex; align-items: center; gap: 8px; }
.social-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.social-links a {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--accent);
  background: #edf3fe;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.site-footer .social-links a { color: white; background: #ffffff12; border-color: #ffffff35; }
.social-links a:hover { background: #dce9fe; }
.site-footer .social-links a:hover { background: #ffffff30; }
.contact-methods { display: grid; }
.contact-methods a { padding: 12px 0; border-bottom: 1px solid var(--line); text-decoration: none; overflow-wrap: anywhere; }
.contact-methods a:hover { text-decoration: underline; }
.contact-methods small { display: block; color: var(--muted); }
.social-heading { font-size: 1rem; margin-top: 22px; }
.share a, .share button { border-radius: 7px; }
.back-top {
  position: fixed;
  z-index: 3;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--accent);
  color: white;
  border: 1px solid #ffffff80;
  box-shadow: 0 5px 18px #0a193644;
}
.back-top:hover { color: white; background: var(--navy); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (max-width: 620px) {
  .hero-grid { padding-top: 42px; }
  .hero-visual { width: min(100%, 310px); margin-inline: auto; }
  .hero-tracks { gap: 6px 15px; }
  .hero-tracks span { flex-basis: 100%; }
  .reason { padding: 13px 16px; }
}

.story-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 20px) / 2);
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 10px;
}
.story-track > .story { scroll-snap-align: start; }
.story-controls { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.story-controls button {
  min-width: 44px;
  min-height: 44px;
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--accent);
  font: inherit;
  cursor: pointer;
}
.story-controls button:hover { background: #eaf1ff; }
@media (max-width: 620px) {
  .story-track { grid-auto-columns: 100%; }
}