/* Use the same season-dots layers as the hub, with a shorter reading header. */
.index-hero.college-dots-hero[data-season-dots] { --dots-brightness:.8; --glow-intensity:.6; --dots-background-tint:11.11111111111111%; }
html:not([data-fs-theme="dark"]) .index-hero.college-dots-hero[data-season-dots]:not([data-college-dots-mode="dark"]) {
  --ink:#223748; --muted:#526779; --link:#285b7e; --line:#cadde7;
  --season-glow:0 156 207; background:#e8f3f8;
}
html:not([data-fs-theme="dark"]) .index-hero.college-dots-hero[data-season-dots]:not([data-college-dots-mode="dark"])::before { --season-dot:#8baebe; filter:none; }
[data-college-base] .college-dots-inner { position:relative; padding-block:48px 32px; }
[data-college-base] .college-dots-hero h1 { margin:0 0 18px; max-width:900px; font:800 40px/1.12 var(--font-exo),sans-serif; letter-spacing:-.025em; color:var(--ink); text-transform:none; font-style:normal; }
.college-dots-breadcrumbs { display:flex; align-items:center; gap:10px; justify-content:flex-end; position:absolute; right:var(--college-page-gutter); top:24px; color:var(--muted); font:400 12px/1.5 var(--font-actor),sans-serif; }
.college-dots-breadcrumbs a { color:inherit; text-decoration:none; }
.college-dots-breadcrumbs a:hover { text-decoration:underline; }
[data-college-base] .college-dots-eyebrow { position:absolute; top:23px; left:var(--college-page-gutter); margin:0; font:600 11px/1.5 var(--font-exo),sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
[data-college-base] .college-dots-description { max-width:780px; margin:0; color:var(--muted); font:400 16px/1.7 var(--font-actor),sans-serif; }
.college-dots-description .college-dots-count { white-space:nowrap; }
@media(max-width:767px) {
  [data-college-base] .college-dots-inner { padding-block:28px; text-align:center; }
  .college-dots-breadcrumbs { position:static; justify-content:center; margin-bottom:20px; font-size:11px; }
  [data-college-base] .college-dots-eyebrow { position:static; margin-bottom:10px; }
  [data-college-base] .college-dots-hero h1 { font-size:28px; line-height:1.2; margin-bottom:12px; }
  [data-college-base] .college-dots-description { font-size:13px; line-height:1.6; }
}
