.courses-example{--blue:#0066d6;--deep:#0052ac;--sky:#7db8ff;--ink-hi:#fafdff;--ink-mid:#e6f0fef7;--ink-low:#cee0f7d9;--ink-faint:#b2caea94;--line:#84aae22b;--card:#0d1c3a8c;--ease:cubic-bezier(.16, 1, .3, 1)}:root:not(.dark) .courses-example{--ink-hi:#0b1e3f;--ink-mid:#0b1e3ff0;--ink-low:#0b1e3fcc;--ink-faint:#0b1e3f99;--line:#0b1e3f29;--card:#fff}.courses-example{width:100%;font-family:var(--font-sans), sans-serif;color:var(--ink-mid);flex-direction:column;gap:16px;padding-bottom:24px;display:flex;position:relative;overflow-x:clip}.courses-example button{font-family:inherit}.courses-example :is(button,a):focus-visible{outline-offset:4px;outline:2px solid #7db8ff}.courses-example .band{background:linear-gradient(135deg,#0066d626,#0d1c3a99);border:1.5px solid #0066d680;border-radius:18px;flex-wrap:wrap;align-items:center;gap:22px;padding:17px 22px;display:flex;position:relative;overflow:hidden;box-shadow:0 16px 44px #0066d633}:root:not(.dark) .courses-example .band{background:linear-gradient(135deg,#0066d612,#fff)}.courses-example .band:before{content:"";pointer-events:none;background:linear-gradient(100deg,#0000 44%,#7db8ff17 50%,#0000 56%) 0 0/240% 100%;animation:4.5s linear infinite courses-sheen;position:absolute;inset:0}@keyframes courses-sheen{to{background-position:-140% 0}}.courses-example .bandv{display:block}.courses-example .bk{font-family:var(--font-heading), sans-serif;letter-spacing:.2em;color:var(--ink-faint);font-size:10.5px;font-weight:700}.courses-example .bn{font-family:var(--font-heading), sans-serif;color:var(--ink-hi);font-size:38px;font-weight:700;line-height:1}.courses-example .bc{font-family:var(--font-heading), sans-serif;background:linear-gradient(90deg, var(--sky), #2e8af0);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:38px;font-weight:700;line-height:1}:root:not(.dark) .courses-example .bc{background:linear-gradient(90deg,#0066d6,#0052ac);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.courses-example .bnote{color:var(--ink-faint);margin-top:13px;font-size:12.5px;line-height:1.65;position:relative}.courses-example .bnote b{color:var(--ink-low)}.courses-example .brow{flex-wrap:wrap;align-items:flex-end;gap:26px;display:flex;position:relative}.courses-example .bcell.right{text-align:right;margin-left:auto}.courses-example .bn2{font-family:var(--font-heading), sans-serif;color:var(--ink-low);font-size:38px;font-weight:700;line-height:1}.courses-example .bgold{font-family:var(--font-heading), sans-serif;color:var(--ink-hi);text-shadow:0 0 22px #0066d673;font-size:38px;font-weight:700;line-height:1}.courses-example .track{background:#84aae224;border-radius:8px;height:9px;margin:26px 8px 20px 0;position:relative;overflow:visible}.courses-example .track .seg{position:absolute;top:0;bottom:0}.courses-example .track .seg.now{background:linear-gradient(90deg, var(--deep), var(--sky));border-radius:8px 0 0 8px;left:0}.courses-example .track .seg.aim{background:repeating-linear-gradient(90deg,#7db8ffd9 0 7px,#7db8ff4d 7px 12px);animation:2.2s ease-in-out infinite courses-pulse}.courses-example .tick{font-family:var(--font-heading), sans-serif;font-size:11.5px;font-weight:700;position:absolute;top:-21px;transform:translate(-50%)}.courses-example .tick b{color:var(--sky)}:root:not(.dark) .courses-example .tick b{color:var(--deep)}.courses-example .flag{font-family:var(--font-heading), sans-serif;font-size:11.5px;font-weight:700;position:absolute;top:-21px;transform:translate(-100%)}.courses-example .flag b{color:var(--ink-hi)}.courses-example .track:after{content:"";background:var(--blue);border-radius:2px;width:2.5px;position:absolute;top:-5px;bottom:-5px;right:0;box-shadow:0 0 12px #0066d699}.courses-example .grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.courses-example .course{background:var(--card);border:1px solid var(--line);transition:transform .3s var(--ease), box-shadow .3s var(--ease);border-radius:18px;flex-direction:column;gap:11px;padding:18px 19px 16px;display:flex;position:relative;overflow:hidden}.courses-example .course:before{content:"";background:linear-gradient(180deg, var(--blue), transparent);border-radius:3px;width:3px;position:absolute;top:16px;bottom:16px;left:0}.courses-example .course:hover{transform:translateY(-3px);box-shadow:0 18px 46px #0066d633}:root:not(.dark) .courses-example .course{box-shadow:0 6px 18px #0b1e3f0f}.courses-example .chead{align-items:center;gap:11px;display:flex}.courses-example .src{width:44px;height:44px;font-family:var(--font-heading), sans-serif;border-radius:12px;flex:none;justify-content:center;align-items:center;font-size:10.5px;font-weight:700;display:flex}.courses-example .src.yt{color:#ff8b80;background:#f0655a24;border:1px solid #f0655a59}.courses-example .src.co{color:var(--sky);background:#0066d61f;border:1px solid #0066d666}.courses-example .src.ud{color:#c4a2ff;background:#a878ff1f;border:1px solid #a878ff59}.courses-example .src.pd{color:var(--sky);background:#0066d61a;border:1px solid #0066d659}:root:not(.dark) .courses-example .src.yt{color:#c22b1f}:root:not(.dark) .courses-example .src.co{color:#0052ac}:root:not(.dark) .courses-example .src.ud{color:#6a3fc9}:root:not(.dark) .courses-example .src.pd{color:#0052ac}.courses-example .cname{font-family:var(--font-heading), sans-serif;color:var(--ink-hi);overflow-wrap:anywhere;font-size:16px;font-weight:700}.courses-example .cwhy{color:var(--ink-faint);margin-top:2px;font-size:12.5px}.courses-example .cwhy b{color:var(--ink-low)}.courses-example .lift{background:#0066d60f;border:1px solid #0066d652;border-radius:13px;align-items:center;gap:13px;padding:11px 13px;display:flex}:root:not(.dark) .courses-example .lift{background:#f2f7fe}.courses-example .ln{font-family:var(--font-heading), sans-serif;white-space:nowrap;color:var(--sky);font-size:23px;font-weight:700;line-height:1}:root:not(.dark) .courses-example .ln{color:#0052ac}.courses-example .lbody{flex:1;min-width:0}.courses-example .ll{font-family:var(--font-heading), sans-serif;letter-spacing:.12em;color:var(--ink-faint);font-size:10.5px;font-weight:700}.courses-example .lbar{background:#84aae226;border-radius:5px;height:6px;margin-top:6px;position:relative;overflow:hidden}.courses-example .lbar i{background:linear-gradient(90deg, var(--blue), var(--sky));border-radius:5px;position:absolute;top:0;bottom:0;left:0}.courses-example .lbar em{background:repeating-linear-gradient(90deg,#7db8ffcc 0 6px,#7db8ff47 6px 10px);border-radius:5px;animation:2.2s ease-in-out infinite courses-pulse;position:absolute;top:0;bottom:0}@keyframes courses-pulse{0%,to{opacity:.75}50%{opacity:1}}.courses-example .cfoot{justify-content:space-between;align-items:center;gap:10px;display:flex}.courses-example .price{font-family:var(--font-heading), sans-serif;letter-spacing:.06em;color:var(--ink-low);font-size:11.5px;font-weight:700}.courses-example .price.free{color:var(--sky)}:root:not(.dark) .courses-example .price.free{color:#0052ac}.courses-example .act{font-family:var(--font-heading), sans-serif;white-space:nowrap;cursor:pointer;color:var(--sky);background:#0066d614;border:1px solid #0066d673;border-radius:11px;padding:10px 17px;font-size:12.5px;font-weight:600}.courses-example .act:hover{background:#0066d629}.courses-example .act.primary{color:#fff;background:linear-gradient(135deg, #1478e8, var(--deep));border-color:#0000;box-shadow:0 8px 22px #0066d64d}.courses-example .act.done{cursor:default;color:var(--sky);background:#0066d614;border-color:#0066d673}:root:not(.dark) .courses-example .act{color:#0052ac;background:#fff}:root:not(.dark) .courses-example .act.primary{color:#fff;background:linear-gradient(135deg, #1478e8, var(--deep));border-color:#0000}:root:not(.dark) .courses-example .act.done{color:#0052ac}.courses-example .player{border:1px solid var(--line);background:#02060f;border-radius:18px;grid-column:1/-1;overflow:hidden}.courses-example .pscreen{aspect-ratio:16/7;background:radial-gradient(500px 260px at 50% 55%,#0052ac61,#0000 70%),linear-gradient(#050d1e,#030916);justify-content:center;align-items:center;display:flex;position:relative}.courses-example .pshimmer{pointer-events:none;background:linear-gradient(100deg,#0000 44%,#ffffff08 50%,#0000 56%) 0 0/260% 100%;animation:5.5s linear infinite courses-sheen;position:absolute;inset:0}.courses-example .pbig{cursor:pointer;color:#fff;background:#f0655aeb;border:none;border-radius:50%;width:72px;height:72px;font-size:23px;position:relative;box-shadow:0 12px 36px #f0655a73}.courses-example .ptitle{max-width:calc(100% - 32px);font-family:var(--font-heading), sans-serif;color:#fafdffeb;font-size:12.5px;font-weight:700;position:absolute;top:13px;left:16px}.courses-example .pnote{text-align:right;color:#e6f0fe73;max-width:calc(100% - 28px);font-size:11.5px;position:absolute;bottom:11px;right:14px}.courses-example .pfoot{font-family:var(--font-heading), sans-serif;letter-spacing:.14em;color:var(--ink-faint);justify-content:space-between;align-items:center;gap:10px;padding:11px 16px;font-size:10.5px;font-weight:700;display:flex}.courses-example .after{text-align:center;background:linear-gradient(135deg,#0066d621,#0d1c3a8c);border:1.5px solid #0066d680;border-radius:18px;grid-column:1/-1;padding:20px;position:relative;overflow:hidden}:root:not(.dark) .courses-example .after{background:linear-gradient(135deg,#0066d612,#fff)}.courses-example .after:before{content:"";pointer-events:none;background:linear-gradient(100deg,#0000 44%,#7db8ff14 50%,#0000 56%) 0 0/240% 100%;animation:5s linear infinite courses-sheen;position:absolute;inset:0}.courses-example .af1{font-family:var(--font-heading), sans-serif;color:var(--ink-hi);font-size:16px;font-weight:700;position:relative}.courses-example .af2{color:var(--ink-faint);margin:6px 0 13px;font-size:12.5px;position:relative}.courses-example .go{font-family:var(--font-heading), sans-serif;cursor:pointer;color:#fff;background:linear-gradient(135deg, #1478e8, var(--deep));border:none;border-radius:12px;padding:13px 26px;font-size:13.5px;font-weight:600;position:relative;box-shadow:0 10px 30px #0066d659}@media (max-width:820px){.courses-example .grid{grid-template-columns:1fr}}@media (max-width:600px){.courses-example .band{padding:16px}.courses-example .brow{gap:16px}.courses-example .bcell.right{text-align:left;margin-left:0}.courses-example .cfoot{flex-wrap:wrap}.courses-example .act,.courses-example .go{white-space:normal}}@media (prefers-reduced-motion:reduce){.courses-example *,.courses-example :before,.courses-example :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
