/* Honest Path School — shared 2026 classroom CSS */
:root{
  --navy:#12233f; --red:#b22234; --paper:#f6f1e6; --card:#fffdf8;
  --ink:#111; --gold:#b0892e; --line:#d7c9a5; --focus:#0b57d0; --muted:#334;
}
*{box-sizing:border-box}
html{font-size:20px}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--paper);color:var(--ink);line-height:1.55}
a{color:var(--focus)}
a:focus,button:focus,video:focus,iframe:focus{outline:3px solid var(--focus);outline-offset:3px}
.wrap,header,main,footer{max-width:860px;margin:0 auto;padding:1.1rem}
.topbar{background:var(--navy);color:#fff}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:.7rem 1.2rem;align-items:center;justify-content:space-between;padding:.7rem 1.1rem}
.brand{color:#fff;text-decoration:none;font-weight:800}
.nav a{color:#fff;text-decoration:none;margin-right:.9rem;font-weight:700}
.kicker{color:var(--gold);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.8rem}
h1{font-size:2rem;line-height:1.15;margin:.35rem 0 1rem;color:var(--navy)}
h2{font-size:1.3rem;color:var(--navy);margin:1.8rem 0 .7rem}
h3{font-size:1.05rem;color:var(--navy);margin:.15rem 0 .45rem}
.banner{background:var(--navy);color:#fff;padding:1rem 1.1rem;border-radius:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1rem 1.1rem;margin:.7rem 0}
.btn{display:block;background:var(--navy);color:#fff;text-decoration:none;padding:.9rem 1rem;border-radius:12px;font-weight:700;margin:.5rem 0}
.btn.secondary{background:#fff;color:var(--navy);border:2px solid var(--navy)}
.btn.red{background:var(--red)}
.grid{display:grid;gap:.7rem}
@media(min-width:640px){.grid.two{grid-template-columns:1fr 1fr}}
.lesson-link{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem;text-decoration:none;color:var(--ink)}
.lesson-link strong{color:var(--navy);display:block}
.player{background:#000;border-radius:12px;overflow:hidden;aspect-ratio:16/9}
.player iframe,.player video{width:100%;height:100%;border:0;display:block;background:#000}
.fallback{background:#111;color:#fff;padding:1.2rem;border-radius:12px}
.small,.muted{font-size:.95rem;color:var(--muted)}
.pager{display:flex;gap:.6rem;flex-wrap:wrap;margin:1.2rem 0}
.pager a{flex:1;min-width:140px;text-align:center}
footer{color:#333;font-size:.95rem;padding-bottom:3rem}
hr.line{border:0;border-top:1px solid var(--line);margin:1.4rem 0}
