/* Course catalog v2 (2026-10-17) — same system as home v7: navy hero, chip filters, cover-filled cards (.v-bc from home4.css). */
body[data-page="courses"]{--n0:#011835;--b0:#0050ed;--b2:#7fb0ff;--gold:#f5b942;--ice:#eef4ff;--bn:'Anek Bangla','Hind Siliguri',system-ui,sans-serif}
:root[data-theme="dark"] body[data-page="courses"]{--ice:#0d1a38}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) body[data-page="courses"]{--ice:#0d1a38}}
.cg-hero{background:radial-gradient(80% 120% at 85% 10%,#0a3a9c,var(--n0) 60%),var(--n0);color:#fff;padding:36px 0 44px}
.cg-crumbs{display:flex;align-items:center;gap:6px;font-size:13.5px;color:#9fb6e0;margin-bottom:14px}.cg-crumbs .i{width:14px;height:14px}
.cg-hero h1{font-family:var(--bn);font-weight:800;color:#fff;font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.15}
.cg-hero p{color:#c3d3f2;margin-top:8px;font-size:1.05rem}
.cg-search{display:flex;align-items:center;gap:10px;max-width:560px;margin-top:22px;padding:0 16px;height:52px;border-radius:16px;background:#fff;box-shadow:0 18px 40px rgba(0,0,0,.3)}
.cg-search .i{color:#6b7aa6;flex:none}
.cg-search input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:16px;color:#0b1430;height:100%}
.cg{padding:26px 24px 70px}
.cg-bar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.cg-filters{display:flex;flex-wrap:wrap;gap:8px 18px;flex:1;min-width:0}
.cg-filters .fgroup{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cg-filters h4{font-size:12.5px;font-weight:600;color:var(--faint);margin:0 4px 0 0}
.cg-filters .fopt{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;border:1px solid var(--line2);background:var(--card);color:var(--mut);font-size:14px;cursor:pointer;user-select:none;transition:background .2s,color .2s,border-color .2s}
.cg-filters .fopt:hover{color:var(--ink);border-color:var(--b2)}
.cg-filters .fopt input{position:absolute;opacity:0;width:0;height:0}
.cg-filters .fopt:has(input:checked){background:var(--n0);border-color:var(--n0);color:#fff}
.cg-filters .fopt em{font-style:normal;font-size:12px;opacity:.6}
.cg-tools{display:flex;gap:8px;align-items:center}
.cg-tools select{height:38px;border-radius:12px;border:1px solid var(--line2);background:var(--card);padding:0 12px;font:inherit;color:var(--txt)}
.cg-ftoggle{display:none;height:38px;border-radius:12px;border:1px solid var(--line2);background:var(--card);padding:0 12px;font:inherit;color:var(--txt);align-items:center;gap:6px;cursor:pointer}
.cg-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 14px}
.cg-meta .count{color:var(--mut);font-size:14.5px;margin:0}
.cg-chip-x{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:99px;padding:5px 10px 5px 14px;background:var(--ice);color:var(--b0);font:inherit;font-size:13.5px;font-weight:600;cursor:pointer}
.cg-chip-x .i{width:14px;height:14px}
.cg-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cg-card{aspect-ratio:4/3;border-radius:22px}
.cg-card.soon>img,.cg-card.soon .v-bc-ic{opacity:.5}
.cg-card .v-bc-txt b{font-size:17px}
.v-tix.soon b{color:#5b6382}.v-tix.soon b .i{width:16px;height:16px}
.cg .empty{grid-column:1/-1;padding:40px;text-align:center;color:var(--mut);border:1px dashed var(--line2);border-radius:20px}
@media (max-width:1100px){.cg-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){
  .cg{padding:18px 16px 56px}
  .cg-hero{padding:26px 0 30px}
  .cg-filters{display:none;flex-direction:column;gap:10px;width:100%}
  .cg-filters.open{display:flex}
  .cg-ftoggle{display:inline-flex}
  .cg-tools{width:100%;justify-content:space-between}
  .cg-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .cg-card{aspect-ratio:3/4}.cg-card .v-bc-txt b{font-size:15px}.cg-card .v-bc-txt{left:12px;right:12px;bottom:12px}
  .cg-card .v-bc-top{left:10px;right:10px;top:10px}.v-tix{padding:5px 10px 6px}.v-tix b{font-size:16px}
}

.v-bc-top em{white-space:nowrap}

/* simple filter row (2026-10-17): সব + schools only */
.cg-filters{display:flex;flex-wrap:wrap;gap:8px}
.cg-filters .fopt{border:1px solid var(--line2);background:var(--card);color:var(--mut);border-radius:99px;padding:8px 18px;font:inherit;font-size:15px;cursor:pointer}
.cg-filters .fopt.on{background:var(--n0);border-color:var(--n0);color:#fff}
@media (max-width:760px){.cg-filters,.cg-filters.open{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px}.cg-filters::-webkit-scrollbar{display:none}.cg-filters .fopt{flex:none}}