/* Per-grade landing pages (grades/*.html). Loaded after styles.css. */
.grade-page{max-width:72ch;margin:0 auto;padding-top:8px;padding-bottom:var(--sect)}
.grade-page .crumbs{font:500 13.5px/1.4 var(--sans);color:var(--muted);margin:0 0 18px}
.grade-page .crumbs a{color:var(--muted)}
.grade-page h1{font-family:var(--disp);font-size:clamp(28px,5vw,44px);letter-spacing:-.03em;line-height:1.08;margin:10px 0 14px}
.grade-page .lede{font-size:19px;color:var(--ink-soft);margin:0 0 14px}
.grade-page .dates{font:500 13.5px/1.4 var(--sans);color:var(--muted);margin:0 0 22px}
.grade-page h2{font-family:var(--disp);font-size:clamp(22px,3.4vw,28px);letter-spacing:-.02em;line-height:1.15;margin:44px 0 12px}
.grade-page h3{font-family:var(--disp);font-size:19px;font-weight:600;letter-spacing:-.02em;margin:26px 0 8px}
.grade-page p,.grade-page li{font-size:17px;line-height:1.6}
.grade-page ul{padding-left:1.2em}
.grade-page .wrap-x{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.grade-page table.comp{border-collapse:collapse;width:100%;font-size:15.5px;margin:8px 0 6px}
.grade-page table.comp th,.grade-page table.comp td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top}
.grade-page table.comp th{font-weight:700;background:var(--oat-2)}
.grade-page .note{font-size:14.5px;color:var(--muted)}
.grade-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:22px 0 8px}
.grade-cta .btn{font-size:16px}
.grade-cta a.text-link{font-weight:600;color:var(--oxblood)}
.grade-related{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:16px 20px;margin:40px 0 0}
.grade-related p{margin:4px 0}
.grade-page .sources li{font-size:15px;overflow-wrap:anywhere}