/* Interior pages — combined design system, conventional fast treatment */
:root{
  --ink:#221226; --white:#FCF9F8; --stone:#B7B09C; --stone-ghost:#EFECE4;
  --crimson:#9B1D31; --coral:#FF585D; --grey:#6E6864; --line:#E8E1DC;
  --sans:'Hanken Grotesk',system-ui,sans-serif;
  --serif:'Source Serif 4',Georgia,serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
body{margin:0; background:var(--white); color:var(--ink); font-family:var(--sans); font-size:1.03rem; line-height:1.65}
.wrap{max-width:48rem; margin:0 auto; padding-inline:clamp(1.2rem,4vw,3rem)}
.wrap.wide{max-width:72rem}
a{text-decoration:none; color:var(--crimson); transition:color .3s var(--ease)}
a:hover{color:var(--coral)}
a:focus-visible{outline:2px solid var(--crimson); outline-offset:3px}
h1,h2,h3{margin:0; letter-spacing:-.03em; text-wrap:balance}
p{max-width:65ch}

.pill{display:inline-block; border-radius:999px; padding:.8rem 1.9rem; font-weight:700; font-size:.9rem; transition:background .3s var(--ease), color .3s var(--ease)}
.pill.solid{background:var(--crimson); color:#fff}
.pill.solid:hover{background:var(--coral); color:#fff}
.pill.dark{background:#3A1F42; color:#fff}
.pill.dark:hover{background:var(--crimson); color:#fff}
.kicker{font-size:.74rem; font-weight:800; letter-spacing:.24em; text-transform:uppercase; color:var(--crimson); margin:0 0 1rem}

header.site{position:sticky; top:0; z-index:50; background:rgba(252,249,248,.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--line)}
.site-inner{display:flex; align-items:center; gap:1.6rem; padding-block:1rem}
.brand{font-weight:800; font-size:1.02rem; letter-spacing:-.02em; color:var(--ink); margin-right:auto; white-space:nowrap}
nav.primary{display:flex; gap:1.15rem; flex-wrap:wrap}
nav.primary a{color:var(--ink); font-size:.85rem; font-weight:600}
nav.primary a:hover{color:var(--crimson)}
nav.primary a[aria-current]{color:var(--crimson)}
header .cta{background:var(--crimson); color:#fff; border-radius:999px; padding:.5rem 1.25rem; font-weight:700; font-size:.78rem}
header .cta:hover{background:var(--coral); color:#fff}
@media (max-width:46rem){ nav.primary{display:none} }

.pagehero{padding:clamp(3.5rem,8vw,6rem) 0 clamp(2.2rem,5vw,3.5rem); border-bottom:1px solid var(--line)}
.pagehero h1{font-size:clamp(2.6rem,7vw,4.6rem); font-weight:800; line-height:1; margin-bottom:1.1rem}
.pagehero .dek{font-family:var(--serif); font-style:italic; font-size:clamp(1.1rem,2.3vw,1.4rem); color:var(--grey); max-width:38rem; margin:0}

section{padding-block:clamp(2.8rem,6vw,4.5rem)}
section + section{border-top:1px solid var(--line)}
section h2{font-size:clamp(1.7rem,4vw,2.5rem); font-weight:800; margin-bottom:1.2rem}
.lede{color:var(--grey)}

/* numbered path */
.path{list-style:none; margin:1.5rem 0 0; padding:0; counter-reset:step}
.path li{display:grid; grid-template-columns:3.2rem 1fr; gap:1.2rem; padding:1.3rem 0; border-top:1px solid var(--line); counter-increment:step}
.path li::before{content:counter(step, decimal-leading-zero); font-weight:800; font-size:1.3rem; color:var(--crimson); font-variant-numeric:tabular-nums}
.path .t{font-weight:800; letter-spacing:-.01em}
.path .d{font-size:.94rem; color:var(--grey); margin-top:.2rem}

/* tiles */
.tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); gap:1rem; margin-top:1.8rem}
.tile{border:1.5px solid var(--line); border-radius:1.1rem; padding:1.5rem}
.tile .gr{font-size:.68rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--stone)}
.tile h3{font-size:1.08rem; font-weight:800; margin:.45rem 0 .35rem}
.tile p{font-size:.88rem; color:var(--grey); margin:0}

/* table */
.tbl{width:100%; border-collapse:collapse; margin-top:1.5rem; font-variant-numeric:tabular-nums}
.tbl th{text-align:left; font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--grey); font-weight:800; padding:.55rem .9rem .55rem 0; border-bottom:2px solid var(--ink)}
.tbl td{padding:.75rem .9rem .75rem 0; border-bottom:1px solid var(--line); vertical-align:top}
.tbl td:first-child{font-weight:800; color:var(--crimson); white-space:nowrap}

/* FAQ */
details{border-top:1px solid var(--line)}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer; padding:1.15rem 2rem 1.15rem 0; font-weight:700; letter-spacing:-.01em; list-style:none; position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+"; position:absolute; right:.2rem; top:50%; transform:translateY(-50%); font-weight:800; color:var(--crimson); font-size:1.2rem; transition:transform .3s var(--ease)}
details[open] summary::after{content:"–"}
details .a{padding:0 0 1.3rem; color:var(--grey); font-size:.97rem; max-width:60ch}

/* callout */
.callout{background:var(--stone-ghost); border-radius:1.2rem; padding:1.8rem 2rem; margin-top:1.8rem}
.callout p{margin:0 0 1rem}
.callout p:last-child{margin:0}
.big{font-size:clamp(2.4rem,6vw,3.6rem); font-weight:800; letter-spacing:-.04em; color:var(--crimson); line-height:1; font-variant-numeric:tabular-nums}

/* people */
.pgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:2.2rem; margin-top:1.5rem}
.pgroup h3{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--crimson); margin:0 0 .9rem; font-weight:800}
.pgroup ul{list-style:none; margin:0; padding:0}
.pgroup li{padding:.6rem 0; border-top:1px solid var(--line); line-height:1.4}
.pgroup .nm{font-weight:700; display:block; letter-spacing:-.01em}
.pgroup .rl{font-size:.8rem; color:var(--grey)}

/* go further */
.further{background:var(--stone-ghost); padding-block:clamp(2.8rem,6vw,4rem)}
.further h2{font-size:1rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--grey); margin-bottom:1.4rem}
.fgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); gap:1rem}
.fcard{background:#fff; border:1.5px solid var(--line); border-radius:1.1rem; padding:1.5rem; display:block; color:var(--ink); transition:border-color .3s var(--ease), transform .3s var(--ease)}
.fcard:hover{border-color:var(--ink); transform:translateY(-3px); color:var(--ink)}
.fcard .t{font-weight:800}
.fcard .d{font-size:.85rem; color:var(--grey); margin-top:.3rem}
.fcard .go{font-size:.75rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--crimson); margin-top:.8rem; display:block}

footer{padding:2.6rem 0 4rem; font-size:.8rem; color:var(--grey)}
footer .legal{border-top:1px solid var(--line); padding-top:1.4rem; margin-top:1.4rem; line-height:1.7}
footer a{font-weight:700}

@media (prefers-reduced-motion:reduce){ .fcard:hover{transform:none} }

/* ---------- data-viz & diagrams ---------- */
.viz{border:1.5px solid var(--line); border-radius:1.2rem; padding:1.8rem 1.6rem; margin-top:1.8rem; background:#fff}
.viz .vt{font-weight:800; letter-spacing:-.01em; margin:0 0 .2rem}
.viz .vs{font-size:.82rem; color:var(--grey); margin:0 0 1.4rem}
.viz .vnote{font-size:.72rem; color:var(--grey); margin:1.2rem 0 0; letter-spacing:.03em}
.viz svg text{font-family:var(--sans)}
.legend{display:flex; gap:1.2rem; flex-wrap:wrap; margin-top:1rem; font-size:.75rem; font-weight:600; color:var(--grey)}
.legend .k{display:inline-flex; align-items:center; gap:.45rem}
.legend .sw{width:.85rem; height:.85rem; border-radius:3px; display:inline-block}
.tip{
  position:fixed; z-index:90; pointer-events:none; background:var(--ink); color:#fff;
  font-size:.78rem; font-weight:600; padding:.5rem .8rem; border-radius:.5rem; opacity:0;
  transition:opacity .15s ease; max-width:16rem; line-height:1.45;
}
.tip .tl{color:var(--stone); font-size:.65rem; letter-spacing:.14em; text-transform:uppercase; display:block}
/* day timeline */
.daytl{position:relative; margin-top:.5rem}
.dayrow{display:grid; grid-template-columns:5.2rem 1fr; gap:1rem; align-items:stretch}
.dayrow .t{font-size:.74rem; font-weight:700; color:var(--grey); font-variant-numeric:tabular-nums; text-align:right; padding-top:.35rem}
.dayblock{
  border-radius:.55rem; margin-bottom:4px; padding:.45rem .9rem; color:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease); cursor:default;
}
.dayblock:hover{transform:translateX(4px); box-shadow:0 8px 24px -12px rgba(13,11,10,.4)}
.dayblock .bn{font-weight:800; font-size:.82rem; letter-spacing:.02em}
.dayblock .bm{font-size:.68rem; opacity:.85; font-variant-numeric:tabular-nums; white-space:nowrap}
.dayblock.cls{background:var(--crimson)}
.dayblock.pry{background:var(--gold, #8F7226); color:#fff}
.dayblock.brk{background:var(--stone); color:var(--ink)}
.dayblock.brk .bm{opacity:.7}
/* diagrams */
.flow{display:grid; gap:.7rem; margin-top:1.6rem}
.flow .fstep{display:grid; grid-template-columns:2.6rem 1fr; gap:1rem; align-items:start}
.flow .fnum{
  width:2.6rem; height:2.6rem; border-radius:50%; background:var(--crimson); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1rem;
}
.flow .fstep.alt .fnum{background:var(--stone); color:var(--ink)}
.flow .ft{font-weight:800; letter-spacing:-.01em}
.flow .fd{font-size:.9rem; color:var(--grey); margin-top:.15rem; max-width:56ch}
.flow .farrow{margin-left:1.1rem; color:var(--stone); font-size:1.1rem; line-height:.6}
/* arches graphic (network) */
.netarches{display:flex; gap:1.2rem; align-items:flex-end; flex-wrap:wrap; margin-top:1.8rem}
.na{
  width:8.5rem; height:10.5rem; border-top-left-radius:999px; border-top-right-radius:999px;
  border-bottom-left-radius:.6rem; border-bottom-right-radius:.6rem;
  display:flex; align-items:flex-end; justify-content:center; padding-bottom:.9rem;
  font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; text-align:center;
}
.na.built{background:var(--crimson); color:#fff}
.na.ghost{border:2px dashed var(--stone); color:var(--grey); height:9rem; width:7.5rem}
/* glossary */
.gloss{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:1rem; margin-top:1.6rem}
.gterm{border:1.5px solid var(--line); border-radius:1.1rem; padding:1.4rem 1.5rem}
.gterm .gw{font-family:var(--serif); font-size:1.25rem; font-weight:600}
.gterm .gk{font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--stone); font-weight:800; margin:.1rem 0 .5rem}
.gterm p{font-size:.88rem; color:var(--grey); margin:0}
:root{--gold:#8F7226}

/* ---------- person cards with portraits ---------- */
.pcard{display:grid; grid-template-columns:5.5rem 1fr; gap:1.4rem; border-top:1px solid var(--line); padding:1.7rem 0; align-items:start}
.pphoto{position:relative; width:5.5rem; height:5.5rem; border-radius:50%; overflow:hidden; background:var(--stone-ghost); display:flex; align-items:center; justify-content:center}
.pphoto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.pphoto span{font-weight:800; color:var(--stone); font-size:1.15rem; letter-spacing:.05em}
.pcard h3{font-size:1.22rem; font-weight:800; margin:0; letter-spacing:-.02em}
.pcard .creds{font-size:.86rem; color:var(--grey); margin:.15rem 0 .35rem; font-style:italic; font-family:var(--serif)}
.pcard .prole{font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--crimson); font-weight:800; margin:0 0 .6rem}
.pcard .pbio{margin:0; color:var(--grey); font-size:.95rem}
@media (max-width:34rem){ .pcard{grid-template-columns:4rem 1fr; gap:1rem} .pphoto{width:4rem; height:4rem} }

/* ---------- inquiry form ---------- */
.iform{max-width:36rem}
.iform label{display:block; font-size:.74rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--grey); margin:1.3rem 0 .45rem}
.iform input[type=text],.iform input[type=email],.iform input[type=tel],.iform select,.iform textarea{
  width:100%; border:1.5px solid var(--line); border-radius:.7rem; padding:.85rem 1rem;
  font-family:var(--sans); font-size:1rem; color:var(--ink); background:#fff; transition:border-color .3s var(--ease);
}
.iform input:focus,.iform select:focus,.iform textarea:focus{outline:none; border-color:var(--crimson)}
.iform textarea{min-height:8rem; resize:vertical}
.iform .checks{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.2rem}
.iform .checks label{margin:0; text-transform:none; letter-spacing:0; font-size:.9rem; font-weight:600; color:var(--ink);
  border:1.5px solid var(--line); border-radius:999px; padding:.5rem 1.1rem; cursor:pointer; display:inline-flex; gap:.5rem; align-items:center}
.iform .checks input{accent-color:var(--crimson)}
.iform button{margin-top:1.8rem; border:none; cursor:pointer; font-family:var(--sans)}
.iform .note{font-size:.8rem; color:var(--grey); margin-top:1rem}
.imsg{border-radius:1rem; padding:1.4rem 1.6rem; margin-top:1.6rem; font-weight:600; display:none}
.imsg.ok{background:#EAF3EA; color:#1F5222; display:block}
.imsg.err{background:#F8E9EB; color:var(--crimson); display:block}

.fcard .t{display:block}
.fcard .d{display:block}

/* ---------- curriculum: trimester explorer ---------- */
.yeartabs{display:flex; gap:.6rem; flex-wrap:wrap; margin:1.6rem 0 1.2rem}
.yeartabs button{
  border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:999px;
  padding:.55rem 1.3rem; font-family:var(--sans); font-weight:700; font-size:.88rem; cursor:pointer;
  transition:all .25s var(--ease);
}
.yeartabs button:hover{border-color:var(--ink)}
.yeartabs button[aria-selected="true"]{background:var(--crimson); border-color:var(--crimson); color:#fff}
.trigrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:1rem}
.tricell{border:1.5px solid var(--line); border-radius:1.1rem; padding:1.4rem 1.5rem}
.tricell .tri{font-size:.68rem; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--stone); margin-bottom:.9rem}
.tricell .strand{padding:.5rem 0; border-top:1px solid var(--line)}
.tricell .sk{font-size:.66rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--crimson)}
.tricell .sv{font-size:.9rem; color:var(--ink); margin-top:.15rem; line-height:1.45}

/* ---------- curriculum: continuum diagram ---------- */
.contwrap{overflow-x:auto}
.continuum{display:grid; grid-template-columns:7.5rem repeat(4,1fr); gap:4px; min-width:52rem; margin-top:1.6rem}
.continuum .chead{font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--grey); padding:.6rem .9rem}
.continuum .crow{font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--crimson); padding:1rem .9rem 0 0; text-align:right}
.continuum .ccell{background:var(--stone-ghost); border-radius:.7rem; padding:1rem 1.1rem}
.continuum .ccell.hs{background:var(--crimson); color:#fff}
.continuum .cn{font-weight:800; font-size:.95rem; letter-spacing:-.01em}
.continuum .cd{font-size:.78rem; color:var(--grey); margin-top:.25rem; line-height:1.5}
.continuum .ccell.hs .cd{color:#F3D3D8}

/* ---------- placed video (click-to-play) ---------- */
.vplayer{max-width:44rem; margin:1.8rem 0}
.vplayer video{width:100%; border-radius:1.1rem; display:block; background:#000}
.vplayer .vcap{margin-top:.7rem}
.vplayer .vname{font-weight:800; font-size:.95rem}
.vplayer .vrole{font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--crimson); font-weight:800}

.pcard .whois{font-size:.68rem; font-weight:800; letter-spacing:.26em; text-transform:uppercase; color:#8F7226; margin:0 0 .35rem}

/* header dropdowns */
.nitem{position:relative}
.ndrop{position:absolute; top:calc(100% + .5rem); left:50%; transform:translate(-50%,8px); min-width:12rem; background:#FCF9F8; border:1px solid #E8E1DC; border-radius:.7rem; box-shadow:0 26px 55px -18px rgba(34,18,38,.4); padding:.45rem; opacity:0; visibility:hidden; transition:opacity .25s cubic-bezier(.22,.61,.36,1), transform .25s cubic-bezier(.22,.61,.36,1), visibility .25s; z-index:70}
.ndrop::before{content:''; position:absolute; top:-.7rem; left:0; right:0; height:.7rem}
.nitem:hover .ndrop, .nitem:focus-within .ndrop{opacity:1; visibility:visible; transform:translate(-50%,0)}
.ndrop a{display:block; padding:.5rem .85rem; border-radius:.45rem; color:#221226; font-size:.84rem; font-weight:600; white-space:nowrap; text-align:left}
.ndrop a:hover{background:#F1EAE6; color:#9B1D31}

/* ---------- strand rows (scope & sequence) ---------- */
.pgroup{margin-top:1.5rem}
.pgroup .path{display:grid; grid-template-columns:11rem 1fr; gap:1.4rem; padding:1.3rem 0; border-top:1px solid var(--line); margin:0}
.pgroup .path .sk{font-size:.74rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--crimson); padding-top:.15rem}
.pgroup .path .sv{font-size:.95rem; color:var(--grey); line-height:1.6; display:block}
@media (max-width:40rem){ .pgroup .path{grid-template-columns:1fr; gap:.35rem; padding:1.1rem 0} }

/* ---------- mobile menu ---------- */
.menubtn{display:none}
.mmenu{display:none}
@media (max-width:46rem){
  .menubtn{display:flex; flex-direction:column; justify-content:center; gap:5px; background:none; border:0; padding:.6rem .2rem; cursor:pointer; position:relative; z-index:70; color:var(--ink)}
  .menubtn span{display:block; width:22px; height:2px; background:currentColor; border-radius:2px; transition:transform .3s var(--ease), opacity .3s var(--ease)}
  html.navopen .menubtn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  html.navopen .menubtn span:nth-child(2){opacity:0}
  html.navopen .menubtn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mmenu{display:block; position:fixed; inset:0; background:var(--white); z-index:45; padding:5.5rem 1.8rem 3rem; overflow-y:auto; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s}
  html.navopen .mmenu{opacity:1; visibility:visible; transform:none}
  html.navopen{overflow:hidden}
  html.navopen body{overflow:hidden}
  .mmenu .mgrp{border-bottom:1px solid var(--line); padding:.9rem 0}
  .mmenu .mh{display:block; font-weight:800; font-size:1.08rem; color:var(--ink); padding:.35rem 0}
  .mmenu .mgrp a:not(.mh){display:block; padding:.42rem 0 .42rem 1.1rem; font-size:.93rem; color:var(--grey); font-weight:600}
  .mmenu .mgrp a:not(.mh):hover{color:var(--crimson)}
  .mmenu .minq{display:inline-block; margin-top:1.4rem; background:var(--crimson); color:#fff; border-radius:999px; padding:.85rem 2rem; font-weight:700; font-size:.9rem}
}
@media (max-width:46rem){
  .site-inner{gap:.8rem}
  .brand{font-size:.88rem}
  header .cta, header.site .cta{padding:.45rem .95rem; font-size:.72rem}
}