/* Schools directory. Scoped to .page--schools. Matches the site's orange pill look. */
.page--schools {
	--sc-accent: #ff7a00;
	--sc-accent-dark: #e56c00;
	--sc-tint: #fff4e8;
	--sc-border: #ececec;
	--sc-text: #1f1f1f;
	--sc-muted: #606060;
}
.page--schools .sc-container { max-width: 75rem; margin: 0 auto; padding: 0 1.5rem; box-sizing: border-box; }
.sc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Hero */
.sc-hero { padding: 3.5rem 0 1.5rem; text-align: center; }
.sc-hero__title { font-size: clamp(1.9rem, 1.4rem + 2vw, 2.75rem); font-weight: 700; line-height: 1.2; margin-bottom: .75rem; }
.sc-hero__text { max-width: 38rem; margin: 0 auto 1.75rem; color: var(--sc-muted); font-size: 1.125rem; line-height: 1.5; }
.sc-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.sc-tab {
	padding: .6rem 1.25rem;
	border: 1px solid var(--sc-border);
	border-radius: 999px;
	background: #fff;
	font-weight: 500;
	transition: background-color .2s, color .2s, border-color .2s;
}
.sc-tab:hover { border-color: var(--sc-accent); color: var(--sc-accent); }
.sc-tab.is-active { background: var(--sc-accent); border-color: var(--sc-accent); color: #fff; }

/* Filters: one compact row */
.sc-browse { padding: 1rem 0 4rem; }
.sc-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.sc-search { flex: 1 1 14rem; min-width: 0; display: block; }
.sc-search input {
	width: 100%;
	padding: .65rem 1.1rem;
	border: 1px solid var(--sc-border);
	border-radius: 999px;
	background: #fff;
	font-size: 1rem;
}
.sc-search input:focus { outline: 2px solid var(--sc-accent); outline-offset: 1px; }
.sc-groups { display: flex; flex-wrap: wrap; gap: .5rem; }
.sc-dd { position: relative; }
.sc-dd__btn {
	display: flex; align-items: center; gap: .45rem;
	padding: .65rem 1.1rem;
	border: 1px solid var(--sc-border);
	border-radius: 999px;
	background: #fff;
	font-size: .95rem;
	cursor: pointer;
	list-style: none;
	white-space: nowrap;
}
.sc-dd__btn::-webkit-details-marker { display: none; }
.sc-dd__btn::after { content: ""; width: .45rem; height: .45rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.sc-dd[open] .sc-dd__btn::after { transform: translateY(1px) rotate(-135deg); }
.sc-dd__btn:hover, .sc-dd[open] .sc-dd__btn { border-color: var(--sc-accent); }
.sc-dd.has-value .sc-dd__btn { border-color: var(--sc-accent); background: var(--sc-tint); }
.sc-dd__n { min-width: 1.25rem; padding: 0 .35rem; border-radius: 999px; background: var(--sc-accent); color: #fff; font-size: .8rem; line-height: 1.25rem; text-align: center; }
.sc-dd__menu {
	position: absolute; z-index: 20; top: calc(100% + .4rem); left: 0;
	min-width: 12rem; max-height: 18rem; overflow-y: auto; padding: .4rem;
	border: 1px solid var(--sc-border); border-radius: 16px; background: #fff;
	box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
}
.sc-dd--right .sc-dd__menu { left: auto; right: 0; }
@media (max-width: 600px) {
	.sc-toolbar { position: relative; }
	.sc-dd { position: static; }
	.sc-dd__menu, .sc-dd--right .sc-dd__menu { left: 0; right: 0; top: 100%; margin-top: .4rem; min-width: 0; }
}
.sc-chip {
	display: flex; align-items: center; gap: .6rem; width: 100%;
	padding: .55rem .7rem; border-radius: 10px; text-align: left; font-size: .95rem; white-space: nowrap;
}
.sc-chip::before { content: ""; flex: 0 0 1rem; width: 1rem; height: 1rem; border: 1.5px solid #bbb; border-radius: 4px; }
.sc-chip:hover { background: var(--sc-tint); }
.sc-chip[aria-pressed="true"]::before { background: var(--sc-accent) center / .7rem no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.5 5 9.5 10 3' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E"); border-color: var(--sc-accent); }
.sc-chip:focus-visible, .sc-tab:focus-visible, .sc-clear:focus-visible, .sc-dd__btn:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 2px; }

.sc-status { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2rem; margin-bottom: 1rem; }
.sc-count { color: var(--sc-muted); }
.sc-clear { color: var(--sc-accent); text-decoration: underline; font-weight: 500; }

/* Cards */
.sc-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
.school-card[hidden] { display: none; }
.school-card__inner {
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--sc-border);
	border-radius: 24px;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .05);
}
.school-card__media { position: relative; aspect-ratio: 16 / 10; background: var(--sc-tint); }
.school-card__media > img:first-child { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.school-card__badge {
	position: absolute;
	left: 1.25rem;
	bottom: -1.75rem;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	border: 3px solid #fff;
	background: #fff;
	object-fit: contain;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .15);
}
.school-card__badge--initials {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--sc-accent);
	color: #fff;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .02em;
}
.school-card__body { display: flex; flex-direction: column; flex: 1; padding: 2.5rem 1.25rem 1.25rem; }
.school-card__name { font-size: 1.25rem; font-weight: 700; line-height: 1.3; margin-bottom: .5rem; }
.school-card__loc { display: flex; align-items: center; gap: .4rem; margin-bottom: .9rem; color: var(--sc-muted); }
.school-card__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.school-card__tags li { padding: .2rem .7rem; border-radius: 999px; background: var(--sc-tint); font-size: .85rem; font-weight: 500; }
.school-card__contact { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--sc-border); }
.school-card__contact li { margin-bottom: .45rem; }
.school-card__contact li:last-child { margin-bottom: 0; }
.school-card__contact a { display: flex; align-items: center; gap: .55rem; color: var(--sc-text); font-size: .95rem; max-width: 100%; }
.school-card__contact a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.school-card__contact a:hover span { color: var(--sc-accent); text-decoration: underline; }
.school-card__apply { margin-top: 1rem; }
.school-card svg {
	flex: 0 0 1.1rem;
	width: 1.1rem;
	height: 1.1rem;
	fill: none;
	stroke: var(--sc-accent);
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Empty + footer note */
.sc-empty { max-width: 32rem; margin: 2rem auto; padding: 2rem 1.5rem; text-align: center; border-radius: 24px; background: #fffaf5; }
.sc-empty[hidden] { display: none; }
.sc-empty__title { font-size: 1.35rem; font-weight: 700; margin-bottom: .5rem; }
.sc-empty__text { margin-bottom: 1.25rem; color: var(--sc-muted); line-height: 1.5; }
.sc-note { margin-top: 2.5rem; text-align: center; color: var(--sc-muted); font-size: .95rem; }
.sc-note a { color: var(--sc-accent); text-decoration: underline; }

@media (max-width: 600px) {
	.page--schools .sc-container { padding: 0 1rem; }
	.sc-hero { padding-top: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
	.sc-tab, .sc-chip { transition: none; }
}