/* Public course catalog (course-catalog.js): course cards, the courses grid and course-page details. */
.cc-accent-violet{--cc:#7c3aed;--cc-soft:#f3edff}
.cc-accent-sky{--cc:#0284c7;--cc-soft:#e6f4fd}
.cc-accent-mint{--cc:#059669;--cc-soft:#e3f7ef}
.cc-accent-sun{--cc:#d97706;--cc-soft:#fff3dc}
.cc-accent-pink{--cc:#db2777;--cc-soft:#ffe9f2}
.cc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;margin-top:26px}
.cc-card{display:flex;border:1px solid #ece6f8;border-radius:24px;background:#fff;box-shadow:0 10px 30px rgba(60,30,120,.07);overflow:hidden;transition:transform .2s,box-shadow .2s}
.cc-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(60,30,120,.13)}
.cc-card.is-featured{border-color:var(--cc);box-shadow:0 0 0 2px var(--cc-soft),0 14px 34px rgba(60,30,120,.12)}
.cc-card-link{display:flex;flex-direction:column;width:100%;color:inherit;text-decoration:none}
.cc-cover{position:relative;display:block;aspect-ratio:16/10;background:var(--cc-soft);overflow:hidden}
.cc-cover img{width:100%;height:100%;object-fit:cover;display:block}
.cc-badge{position:absolute;top:14px;inset-inline-start:14px;padding:5px 12px;border-radius:999px;background:var(--cc);color:#fff;font-size:12px;font-weight:800;box-shadow:0 6px 14px rgba(0,0,0,.15)}
.cc-badge--soon{background:#475569}
.cc-card-body{display:flex;flex:1;flex-direction:column;gap:8px;padding:18px 20px 20px}
.cc-title{color:#22163a;font-size:21px;line-height:1.35}
.cc-sub{color:#6f6585;font-size:14px;line-height:1.6}
.cc-facts{display:flex;flex-wrap:wrap;gap:6px}
.cc-facts span{padding:3px 10px;border-radius:999px;background:var(--cc-soft);color:var(--cc);font-size:12px;font-weight:700}
.cc-card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:12px;border-top:1px dashed #ece6f8}
.cc-price{color:#6f6585;font-size:13px}
.cc-price b{color:#22163a;font-size:20px}
.cc-cta{color:var(--cc);font-weight:800;font-size:14px;white-space:nowrap}
.cc-back{display:inline-flex;margin-bottom:10px;color:var(--cc,#7c3aed);font-weight:700;text-decoration:none}
.cc-heading .eyebrow{color:var(--cc)}
.plancomparison.cc-single{grid-template-columns:minmax(0,520px);justify-content:center}
@media (max-width:600px){.cc-grid{grid-template-columns:1fr}.cc-title{font-size:19px}}