.directory-page{max-width:1180px;margin:auto;padding:40px 28px 72px}
.directory-heading{max-width:800px;margin:32px 0}
.directory-heading h1{font-size:clamp(30px,5vw,48px);line-height:1.15;margin:14px 0}
.directory-heading p,.directory-help p{color:#5b5870;line-height:1.7}
.directory-controls{padding:24px;background:#f5f3ff;border:1px solid #e5defa;border-radius:20px}
.directory-controls>label{display:block;font-weight:650;margin-bottom:10px}
.directory-search{display:flex;gap:12px;align-items:stretch}
.directory-search input{min-width:0;flex:1;padding:14px 16px;border:1px solid #bbb4cd;border-radius:12px;background:white;font:inherit;color:#292338}
.directory-search button{white-space:normal}
.directory-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.directory-filters button{font:inherit;padding:9px 15px;border:1px solid #d4cde2;border-radius:24px;background:white;color:#49405d;cursor:pointer}
.directory-filters button[aria-pressed=true]{background:#6743d2;border-color:#6743d2;color:white}
.directory-page :focus-visible{outline:3px solid #7b5cf4;outline-offset:3px}
#directory-count{margin:24px 0 16px;color:#655d76;font-weight:600}
#directory-empty{padding:26px;border:1px dashed #bcb0d6;border-radius:16px}
.directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.directory-card{display:flex;flex-direction:column;min-width:0;padding:24px;border:1px solid #e4deed;border-radius:18px;background:white;transition:border-color .15s}
.directory-card:hover,.directory-card:focus-within{border-color:#8f70df}
.directory-card h2{font-size:20px;line-height:1.35;margin:14px 0 10px;overflow-wrap:anywhere}
.directory-card h2 a{color:#2e2443;text-decoration:none}
.directory-card h2 a:hover{text-decoration:underline}
.directory-card>p{color:#655d76;line-height:1.6;font-size:14px;margin:0 0 22px}
.directory-card .directory-lesson{margin-top:auto;font-size:14px;font-weight:600;color:#6541c4;overflow-wrap:anywhere}
.directory-help{margin-top:42px;padding:28px;background:#f7f5fb;border-radius:18px}
.directory-page [hidden]{display:none!important}
@media(max-width:900px){.directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.directory-page{padding:24px 18px 48px}.directory-grid{grid-template-columns:minmax(0,1fr)}.directory-controls{padding:18px}.directory-search{flex-wrap:wrap}.directory-search input{flex-basis:100%;width:100%}.directory-search button{padding:9px 14px}.directory-card{padding:21px}.directory-filters button{font-size:14px;padding:8px 13px}}