.hh-school-counselors{background:#e6f5f3;border:1px solid #b8dfdc;border-radius:16px;padding:24px;margin:24px 0;color:#40364a;clear:both}
.hh-school-counselors h2{color:#087f8c;font-size:1.4rem;line-height:1.25;margin:0 0 12px}
.hh-school-counselors h3{color:#60328b;font-size:1.1rem;margin:20px 0 12px}
.hh-school-counselors p{margin:8px 0 14px;line-height:1.5}
.hh-school-counselors .hh-school-counselor-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px 24px;padding:0;margin:0}
.hh-school-counselors .hh-school-counselor-list li{padding:0;margin:0;min-width:0}
.hh-school-counselors a{color:#60328b;font-weight:700;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.hh-school-counselors a:focus-visible{outline:3px solid #087f8c;outline-offset:4px;border-radius:2px}
.hh-school-counselors .hh-school-counselor-list a{display:inline-block;padding:8px 0;font-size:1rem;line-height:1.4}
.hh-school-counselors .hh-school-counselor-list span{display:block;font-size:.85rem;line-height:1.4;color:#534d5d}
.hh-school-counselors .hh-school-counselor-source{font-size:.85rem;margin:16px 0 0}
@media(max-width:480px){.hh-school-counselors{padding:18px}.hh-school-counselors .hh-school-counselor-list{grid-template-columns:1fr}}

/* Website section title: match the visual weight of neighboring dashboard headings.
   Scoped to the website so the installed app keeps its compact heading. */
body:not(.hh-club-only-app) section.hh-school-counselors > h2{
 font-size:clamp(26px,2.5vw,34px)!important;
 font-weight:800!important;
 line-height:1.2!important;
 color:#60328b!important;
 margin:0 0 18px!important;
 padding:0 0 12px!important;
 border-bottom:4px solid #087f8c;
 letter-spacing:-.02em;
}

/* Campus headings remain semantic labels above their visible counselor lists. */
section.hh-school-counselors[data-hh-school-counselors="MHS"] > h3{
 display:block;
 box-sizing:border-box;
 background:#60328b!important;
 color:#fff!important;
 font-size:clamp(19px,2vw,24px)!important;
 font-weight:800!important;
 line-height:1.3!important;
 margin:24px 0 16px!important;
 padding:14px 20px!important;
 border-radius:12px;
 border-left:5px solid #f7cf50;
 letter-spacing:0;
}

/* Blue sampled from Lake Creek High School's official website header/footer,
   https://lakecreekhs.misd.org/ (October 24, 2026): rgb(0,64,118). */
section.hh-school-counselors[data-hh-school-counselors="MHS"] > h3[data-hh-counselor-campus="Lake Creek High School"]{
 background:#004076!important;
}