/* Betting School: site/betting-school/*.html, written by tools/build-school.py.
   Reading pages, so the measure is narrow and the type is larger than the
   board's. Tokens only from styles.css; no second palette. */

.sch{max-width:1100px;margin:0 auto;padding:104px 20px 40px;position:relative;z-index:1}
.sch .lede{font-size:18px;color:var(--text);line-height:1.7;margin:0 0 26px}
.sch-crumb{font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--hero-dim);margin:0 0 22px}
.sch-crumb a{color:var(--green);text-decoration:none}

/* hub */
.sch-hero{max-width:760px;margin-bottom:34px}
.sch-hero h1,.sch-body h1{font-family:'Rajdhani',sans-serif;font-weight:700;text-transform:uppercase;
  color:var(--white);line-height:1.05;letter-spacing:.02em;margin:10px 0 18px}
.sch-hero h1{font-size:clamp(40px,7vw,64px)}
.sch-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.sch-card{display:block;background:var(--card);border:1px solid var(--border);border-radius:9px;
  padding:20px;text-decoration:none;transition:border-color .15s}
.sch-card:hover{border-color:var(--green)}
.sch-card .n{font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--green)}
.sch-card h2{font-family:'Rajdhani',sans-serif;font-size:21px;font-weight:700;color:var(--white);margin:8px 0 6px}
.sch-card p{font-size:14.5px;color:var(--hero-dim);line-height:1.6;margin:0}

/* lesson */
.sch-grid{display:grid;grid-template-columns:210px minmax(0,1fr);gap:40px;align-items:start}
.sch-side{position:sticky;top:86px;display:flex;flex-direction:column;gap:2px}
.sch-side a{display:flex;gap:10px;padding:9px 12px;border-radius:5px;text-decoration:none;
  font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--hero-dim)}
.sch-side a span{color:var(--muted)}
.sch-side a:hover{color:var(--text);background:var(--card)}
.sch-side a.on{color:var(--text);background:var(--card);box-shadow:inset 3px 0 0 var(--green)}
.sch-side a.on span{color:var(--green)}

.sch-body{max-width:720px;font-size:16.5px;line-height:1.75;color:var(--text)}
.sch-body h1{font-size:clamp(34px,5.5vw,52px)}
.sch-body h2{font-family:'Rajdhani',sans-serif;font-size:25px;font-weight:700;color:var(--white);
  margin:38px 0 12px;letter-spacing:.02em}
.sch-body p{margin:0 0 16px}
.sch-body ul{margin:0 0 18px;padding-left:20px}
.sch-body li{margin-bottom:6px}
.sch-body b{color:var(--white)}
.sch-body a{color:var(--green)}

.sch-body .ex,.sch-body .note,.sch-body .keys{border:1px solid var(--border);border-radius:8px;
  padding:15px 18px;margin:0 0 14px;background:var(--card)}
.sch-body .ex b:first-child,.sch-body .note > b,.sch-body .keys > b{display:block;
  font-family:'Rajdhani',sans-serif;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-bottom:6px}
.sch-body .note{border-color:rgba(255,201,77,.35)}
.sch-body .note p:last-child,.sch-body .note ul:last-child,.sch-body .keys ul{margin-bottom:0}
.sch-body .keys{border-color:var(--green);margin-top:34px}
.sch-body .keys > b{color:var(--green)}
.sch-body .formula{font-family:'Rajdhani',sans-serif;font-size:24px;font-weight:700;color:var(--gold);
  text-align:center;padding:16px;border:1px solid var(--border2);border-radius:8px;margin:0 0 16px;
  background:var(--card)}

.sch-body .t{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:15.5px}
.sch-body .t th,.sch-body .t td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--border)}
.sch-body .t th{font-family:'Rajdhani',sans-serif;font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--hero-dim)}

.sch-pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:40px 0 0}
.sch-pn a{display:block;border:1px solid var(--border);border-radius:8px;padding:13px 16px;
  text-decoration:none;color:var(--white);font-family:'Rajdhani',sans-serif;font-size:18px;font-weight:700}
.sch-pn a:hover{border-color:var(--green)}
.sch-pn a.nx{text-align:right}
.sch-pn small{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}

.sch-cta{margin:40px 0 0;padding:26px;border:1px solid var(--border2);border-radius:10px;
  background:var(--surface);text-align:center}
.sch-cta h2{font-family:'Rajdhani',sans-serif;font-size:26px;font-weight:700;color:var(--white);margin:0 0 8px}
.sch-cta p{color:var(--hero-dim);margin:0 auto 18px;max-width:520px;line-height:1.65}

.sch-foot{max-width:1100px;margin:0 auto;padding:30px 20px 50px;border-top:1px solid var(--border);
  font-size:13.5px;color:var(--hero-dim);text-align:center;position:relative;z-index:1}
.sch-foot p{margin:0 0 10px}
.sch-foot a{color:var(--hero-dim)}
.sch-foot .sch-rg{color:var(--muted);max-width:640px;margin:0 auto 10px}

@media(max-width:860px){
  .sch{padding-top:88px}
  .sch-grid{grid-template-columns:1fr;gap:0}
  /* The lesson list becomes a row you swipe, above the lesson. */
  .sch-side{position:static;flex-direction:row;overflow-x:auto;gap:6px;margin:0 -20px 22px;
    padding:0 20px 6px;scrollbar-width:none}
  .sch-side::-webkit-scrollbar{display:none}
  .sch-side a{flex:none;white-space:nowrap;border:1px solid var(--border)}
  .sch-pn{grid-template-columns:1fr}
  .sch-pn a.nx{text-align:left}
}

/* /picks/ hub: one heading per sport above its cards. */
.sch-group{font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--white);margin:34px 0 14px}

/* Links in a hub intro, which sits outside .sch-body. */
.sch .lede a{color:var(--green)}