/*
   Skill Sakhi reusable public components.
   Keep shared cards, headers, CTAs, sliders and form shells here.
*/
:root{
  --ss-comp-red:#e30613;
  --ss-comp-ink:#07111f;
  --ss-comp-muted:#667085;
  --ss-comp-line:#e8edf3;
  --ss-comp-soft:#f8fafc;
  --ss-comp-glass:rgba(255,255,255,.82);
  --ss-comp-shadow:0 22px 70px rgba(16,24,40,.10);
  --ss-comp-radius:18px;
}
.ss-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 24px}
.ss-section-head h2{margin:0;font-size:clamp(28px,3vw,44px);line-height:1.02;font-weight:950;letter-spacing:-.055em;color:var(--ss-comp-ink)}
.ss-section-head p{margin:9px 0 0;color:var(--ss-comp-muted);font-size:15px;line-height:1.65;max-width:680px}
.ss-section-head a{display:inline-flex;align-items:center;gap:8px;color:var(--ss-comp-red);font-weight:900;text-decoration:none}
.ss-grid{display:grid;gap:22px}.ss-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ss-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ss-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ss-grid.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.ss-card,.ss-course-card,.ss-mentor-card,.ss-testimonial-card,.ss-info-card,.ss-cta-card{border:1px solid var(--ss-comp-line);border-radius:var(--ss-comp-radius);background:var(--ss-comp-glass);box-shadow:var(--ss-comp-shadow);backdrop-filter:blur(16px) saturate(1.2);overflow:hidden}
.ss-card,.ss-course-card,.ss-mentor-card,.ss-testimonial-card{transition:transform .24s cubic-bezier(.22,.61,.36,1),box-shadow .24s cubic-bezier(.22,.61,.36,1),border-color .24s cubic-bezier(.22,.61,.36,1)}
.ss-card:hover,.ss-course-card:hover,.ss-mentor-card:hover,.ss-testimonial-card:hover{transform:translateY(-7px);border-color:rgba(227,6,19,.24);box-shadow:0 34px 95px rgba(16,24,40,.16)}
.ss-course-card{display:flex;flex-direction:column;color:var(--ss-comp-ink);text-decoration:none}
.ss-course-media{height:178px;background:linear-gradient(135deg,#07111f,#18243a);position:relative;overflow:hidden}
.ss-course-media img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.ss-course-card:hover .ss-course-media img{transform:scale(1.07)}
.ss-course-media b{position:absolute;left:12px;top:12px;background:linear-gradient(135deg,#e30613,#ff3142);color:#fff;border-radius:7px;padding:6px 10px;font-size:11px;font-weight:950;box-shadow:0 10px 24px rgba(227,6,19,.24)}
.ss-course-body{display:flex;flex-direction:column;gap:9px;padding:17px}
.ss-course-body strong{font-size:16px;line-height:1.35;font-weight:950;letter-spacing:-.02em}
.ss-course-body small{font-size:12px;color:var(--ss-comp-muted);font-weight:750}
.ss-course-rating{display:inline-flex;align-items:center;gap:5px;color:#f59e0b;font-size:13px;font-weight:900}
.ss-course-foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;padding-top:12px;border-top:1px solid var(--ss-comp-line)}
.ss-course-foot em{font-style:normal;font-size:19px;font-weight:950;color:var(--ss-comp-ink)}
.ss-course-foot i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--ss-comp-line);color:var(--ss-comp-red)}
.ss-pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;background:#fff1f2;color:var(--ss-comp-red);padding:8px 12px;font-size:12px;font-weight:900}
.ss-cta-card{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:32px 40px;background:linear-gradient(135deg,#e30613,#ff3142);color:#fff;box-shadow:0 26px 70px rgba(227,6,19,.24)}
.ss-cta-card h2,.ss-cta-card h3{margin:0 0 8px;font-size:clamp(24px,3vw,36px);letter-spacing:-.045em;font-weight:950}
.ss-cta-card p{margin:0;color:rgba(255,255,255,.82)}
.ss-cta-card a{height:52px;border-radius:10px;background:#fff;color:var(--ss-comp-ink);display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 26px;font-weight:950;text-decoration:none}
.ss-form-shell{border:1px solid var(--ss-comp-line);border-radius:var(--ss-comp-radius);background:var(--ss-comp-glass);box-shadow:var(--ss-comp-shadow);padding:28px}
.ss-form-shell input,.ss-form-shell select,.ss-form-shell textarea{width:100%;border:1px solid #d8dee8;border-radius:10px;background:#fff;min-height:48px;padding:0 15px;outline:0}
.ss-form-shell textarea{padding-top:14px;min-height:120px}
.ss-form-shell input:focus,.ss-form-shell select:focus,.ss-form-shell textarea:focus{border-color:var(--ss-comp-red);box-shadow:0 0 0 4px rgba(227,6,19,.08)}
.testi-page{font-family:Inter,Arial,sans-serif;background:linear-gradient(180deg,#fff,#fbfcff 55%,#fff);color:var(--ss-comp-ink)}
.testi-wrap{max-width:1360px;margin:auto;padding:0 34px}
.testi-hero{padding:56px 0 24px;text-align:center}
.testi-kicker{display:inline-flex;align-items:center;gap:8px;background:#fff1f2;color:var(--ss-comp-red);border-radius:999px;padding:9px 15px;font-size:13px;font-weight:950}
.testi-title{font-size:clamp(42px,5vw,76px);line-height:.98;letter-spacing:-.06em;font-weight:950;margin:22px auto 16px;max-width:860px}
.testi-title span{color:var(--ss-comp-red)}.testi-sub{max-width:660px;margin:auto;color:var(--ss-comp-muted);font-size:17px;line-height:1.75}
.testi-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:34px auto 46px;max-width:980px;border:1px solid var(--ss-comp-line);border-radius:18px;background:var(--ss-comp-glass);box-shadow:var(--ss-comp-shadow);overflow:hidden;backdrop-filter:blur(16px)}
.testi-stat{padding:24px;text-align:center;border-right:1px solid var(--ss-comp-line)}.testi-stat:last-child{border-right:0}.testi-stat b{display:block;font-size:30px;letter-spacing:-.04em}.testi-stat span{font-size:13px;color:var(--ss-comp-muted);font-weight:800}
.t-carousel-shell{position:relative;margin-bottom:52px}.t-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 4px 34px;scrollbar-width:none}.t-track::-webkit-scrollbar{display:none}
.tcard{scroll-snap-align:start;min-width:395px;padding:30px;border:1px solid var(--ss-comp-line);border-radius:22px;background:var(--ss-comp-glass);box-shadow:0 18px 55px rgba(16,24,40,.08);backdrop-filter:blur(16px);position:relative;overflow:hidden}
.tcard:before{content:'"';position:absolute;right:24px;top:0;font-size:110px;line-height:1;font-weight:950;color:#fff1f2}.tstars{color:#ffb020;letter-spacing:2px;font-size:17px;margin-bottom:18px}.tquote{font-size:16px;line-height:1.8;color:#344054;min-height:116px;position:relative;z-index:1}
.tmeta{display:flex;align-items:center;gap:14px;margin-top:24px;padding-top:18px;border-top:1px solid var(--ss-comp-line)}.tavatar{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#07111f,#e30613);color:#fff;font-weight:950;overflow:hidden}.tavatar img{width:100%;height:100%;object-fit:cover}
.tname{font-size:16px;font-weight:950}.trole{font-size:13px;color:var(--ss-comp-muted);margin-top:3px}.t-controls{display:flex;gap:12px;justify-content:center}.t-controls button{width:46px;height:46px;border:1px solid var(--ss-comp-line);border-radius:50%;background:#fff;box-shadow:0 12px 30px rgba(16,24,40,.08);cursor:pointer;color:var(--ss-comp-ink)}
.testi-cta{margin:42px 0 0;border-radius:20px;background:linear-gradient(135deg,#e30613,#ff3142);box-shadow:0 26px 70px rgba(227,6,19,.24);display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;color:#fff;padding:34px 44px}.testi-cta h2{font-size:30px;letter-spacing:-.04em;margin:0 0 8px}.testi-cta p{margin:0;color:rgba(255,255,255,.82)}.testi-cta a{height:52px;border-radius:10px;background:#fff;color:var(--ss-comp-ink);padding:0 26px;display:inline-flex;align-items:center;gap:10px;font-weight:950;text-decoration:none}

/* Course catalog component */
.cl{--r:#e30613;--b:#050505;--m:#667085;--line:#e9edf3;--soft:#fafbff;font-family:Inter,Arial,sans-serif;background:#fff;color:#111}
.cl-wrap{max-width:1400px;margin:0 auto;padding:0 34px}
.cl-hero{padding:38px 0 24px}
.cl-title{font-size:54px;line-height:1;letter-spacing:-.055em;font-weight:950;margin:0 0 14px}
.cl-title .dot,.cl-title span{color:var(--r)}
.cl-sub{color:#667085;font-size:16px;margin:0}
.cl-layout{display:grid;grid-template-columns:280px 1fr;gap:28px;padding:26px 0 54px}
.cl .filters{border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 55px rgba(16,24,40,.07);padding:22px;background:#fff;position:sticky;top:108px}
.cl .filters h3{font-size:15px;margin:0 0 18px}
.cl .filter-title{font-size:12px;font-weight:950;margin:22px 0 11px}
.cl .filter-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#344054;padding:8px 0}
.cl .filter-row input{accent-color:var(--r)}
.cl .filter-count{color:#98a2b3}
.cl .topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.cl .search-big{height:48px;max-width:520px;flex:1;border:1px solid #dfe3ea;border-radius:12px;display:flex;align-items:center;padding:0 16px;background:#fff}
.cl .search-big input{border:0;outline:0;flex:1}
.cl .search-big button{border:0;background:#fff;font-size:20px}
.cl .sort{height:44px;border:1px solid #dfe3ea;border-radius:10px;padding:0 14px;background:#fff}
.cl .course-list{display:grid;gap:18px}
.cl .course-row{display:grid;grid-template-columns:220px 1fr auto;gap:18px;border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 42px rgba(16,24,40,.06);overflow:hidden;text-decoration:none;color:#111;background:#fff}
.cl .course-thumb{height:160px;background:#111}
.cl .course-thumb img{width:100%;height:100%;object-fit:cover}
.cl .course-info{padding:18px 0}
.cl .course-info h3{font-size:20px;line-height:1.2;margin:0 0 8px;font-weight:950}
.cl .course-info p{font-size:13px;color:#667085;line-height:1.55;max-width:680px;margin:0 0 12px}
.cl .course-tags{display:flex;gap:8px;flex-wrap:wrap}
.cl .course-tags span{font-size:11px;font-weight:850;background:#f4f5f7;border-radius:999px;padding:6px 10px}
.cl .course-side{padding:18px 20px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:10px}
.cl .badge{background:#fff1f2;color:var(--r);font-size:11px;font-weight:950;padding:7px 10px;border-radius:999px}
.cl .price{font-size:21px;font-weight:950;color:#138a37}
.cl .rating{font-size:13px;font-weight:900}
.cl .rating i{color:#f59e0b}
.cl .pager{display:flex;justify-content:center;gap:8px;margin-top:28px}
.cl .pager a,.cl .pager span{width:38px;height:38px;border-radius:8px;border:1px solid var(--line);display:grid;place-items:center;text-decoration:none;color:#111;font-weight:900}
.cl .pager .active{background:var(--r);color:#fff;border-color:var(--r)}
@media(max-width:900px){
  .cl-layout,.cl .course-row{grid-template-columns:1fr}
  .cl .filters{position:static}
  .cl .course-side{align-items:flex-start}
  .cl .topbar{flex-direction:column;align-items:stretch}
  .cl-wrap{padding:0 18px}
}