.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);--courses-bar-glint:#2e8af0;--courses-card-deep:#0d1c3a;--courses-lift-light:#f2f7fe;--courses-player:#02060f;--courses-player-note:#e6f0fe;--courses-player-title:#fafdff;--courses-screen-base:#030916;--courses-screen-top:#050d1e;--courses-track-line:#84aae2;--courses-udemy-ink:#c4a2ff;--courses-udemy-ink-light:#6a3fc9;--courses-udemy-tint:#a878ff;--courses-youtube-ink:#ff8b80;--courses-youtube-ink-light:#c22b1f}: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:2px solid var(--k-sky);outline-offset:4px}.courses-example .band{background:linear-gradient(135deg, rgb(from var(--k-ring-b) r g b / 15%), rgb(from var(--courses-card-deep) r g b / 60%));border:1.5px solid rgb(from var(--k-ring-b) r g b / 50%);box-shadow:0 16px 44px rgb(from var(--k-ring-b) r g b / 20%);border-radius:18px;flex-wrap:wrap;align-items:center;gap:22px;padding:17px 22px;display:flex;position:relative;overflow:hidden}:root:not(.dark) .courses-example .band{background:linear-gradient(135deg, rgb(from var(--k-ring-b) r g b / 7%), var(--k-on-accent))}.courses-example .band:before{content:"";pointer-events:none;background:linear-gradient(100deg, transparent 44%, rgb(from var(--k-sky) r g b / 9%) 50%, transparent 56%);background-size: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), var(--courses-bar-glint));-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, var(--k-ring-b), var(--k-deep));-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 rgb(from var(--k-ring-b) r g b / 45%);font-size:38px;font-weight:700;line-height:1}.courses-example .track{background:rgb(from var(--courses-track-line) r g b / 14%);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, rgb(from var(--k-sky) r g b / 85%) 0 7px, rgb(from var(--k-sky) r g b / 30%) 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);width:2.5px;box-shadow:0 0 12px rgb(from var(--k-ring-b) r g b / 60%);border-radius:2px;position:absolute;top:-5px;bottom:-5px;right:0}.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{box-shadow:0 18px 46px rgb(from var(--k-ring-b) r g b / 20%);transform:translateY(-3px)}:root:not(.dark) .courses-example .course{box-shadow:0 6px 18px rgb(from var(--k-navy) r g b / 6%)}.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:var(--courses-youtube-ink);background:rgb(from var(--k-flag) r g b / 14%);border:1px solid rgb(from var(--k-flag) r g b / 35%)}.courses-example .src.co{color:var(--sky);background:rgb(from var(--k-ring-b) r g b / 12%);border:1px solid rgb(from var(--k-ring-b) r g b / 40%)}.courses-example .src.ud{color:var(--courses-udemy-ink);background:rgb(from var(--courses-udemy-tint) r g b / 12%);border:1px solid rgb(from var(--courses-udemy-tint) r g b / 35%)}.courses-example .src.pd{color:var(--sky);background:rgb(from var(--k-ring-b) r g b / 10%);border:1px solid rgb(from var(--k-ring-b) r g b / 35%)}:root:not(.dark) .courses-example .src.yt{color:var(--courses-youtube-ink-light)}:root:not(.dark) .courses-example .src.co{color:var(--k-deep)}:root:not(.dark) .courses-example .src.ud{color:var(--courses-udemy-ink-light)}:root:not(.dark) .courses-example .src.pd{color:var(--k-deep)}.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:rgb(from var(--k-ring-b) r g b / 6%);border:1px solid rgb(from var(--k-ring-b) r g b / 32%);border-radius:13px;align-items:center;gap:13px;padding:11px 13px;display:flex}:root:not(.dark) .courses-example .lift{background:var(--courses-lift-light)}.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:var(--k-deep)}.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:rgb(from var(--courses-track-line) r g b / 15%);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, rgb(from var(--k-sky) r g b / 80%) 0 6px, rgb(from var(--k-sky) r g b / 28%) 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:var(--k-deep)}.courses-example .act{font-family:var(--font-heading), sans-serif;white-space:nowrap;cursor:pointer;color:var(--sky);background:rgb(from var(--k-ring-b) r g b / 8%);border:1px solid rgb(from var(--k-ring-b) r g b / 45%);border-radius:11px;padding:10px 17px;font-size:12.5px;font-weight:600}.courses-example .act:hover{background:rgb(from var(--k-ring-b) r g b / 16%)}.courses-example .act.primary{color:var(--k-on-accent);background:linear-gradient(135deg, var(--k-runway-lamp), var(--deep));box-shadow:0 8px 22px rgb(from var(--k-ring-b) r g b / 30%);border-color:#0000}.courses-example .act.done{cursor:default;color:var(--sky);background:rgb(from var(--k-ring-b) r g b / 8%);border-color:rgb(from var(--k-ring-b) r g b / 45%)}:root:not(.dark) .courses-example .act{color:var(--k-deep);background:var(--k-on-accent)}:root:not(.dark) .courses-example .act.primary{color:var(--k-on-accent);background:linear-gradient(135deg, var(--k-runway-lamp), var(--deep));border-color:#0000}:root:not(.dark) .courses-example .act.done{color:var(--k-deep)}.courses-example .player{background:var(--courses-player);border:1px solid var(--line);border-radius:18px;grid-column:1/-1;overflow:hidden}.courses-example .pscreen{aspect-ratio:16/7;background:radial-gradient(500px 260px at 50% 55%, rgb(from var(--k-deep) r g b / 38%), transparent 70%), linear-gradient(180deg, var(--courses-screen-top), var(--courses-screen-base));justify-content:center;align-items:center;display:flex;position:relative}.courses-example .pshimmer{pointer-events:none;background:linear-gradient(100deg, transparent 44%, rgb(from var(--k-on-accent) r g b / 3%) 50%, transparent 56%);background-size:260% 100%;animation:5.5s linear infinite courses-sheen;position:absolute;inset:0}.courses-example .pbig{cursor:pointer;width:72px;height:72px;color:var(--k-on-accent);background:rgb(from var(--k-flag) r g b / 92%);box-shadow:0 12px 36px rgb(from var(--k-flag) r g b / 45%);border:none;border-radius:50%;font-size:23px;position:relative}.courses-example .ptitle{max-width:calc(100% - 32px);font-family:var(--font-heading), sans-serif;color:rgb(from var(--courses-player-title) r g b / 92%);font-size:12.5px;font-weight:700;position:absolute;top:13px;left:16px}.courses-example .pnote{text-align:right;max-width:calc(100% - 28px);color:rgb(from var(--courses-player-note) r g b / 45%);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, rgb(from var(--k-ring-b) r g b / 13%), rgb(from var(--courses-card-deep) r g b / 55%));border:1.5px solid rgb(from var(--k-ring-b) r g b / 50%);border-radius:18px;grid-column:1/-1;padding:20px;position:relative;overflow:hidden}:root:not(.dark) .courses-example .after{background:linear-gradient(135deg, rgb(from var(--k-ring-b) r g b / 7%), var(--k-on-accent))}.courses-example .after:before{content:"";pointer-events:none;background:linear-gradient(100deg, transparent 44%, rgb(from var(--k-sky) r g b / 8%) 50%, transparent 56%);background-size: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:var(--k-on-accent);background:linear-gradient(135deg, var(--k-runway-lamp), var(--deep));box-shadow:0 10px 30px rgb(from var(--k-ring-b) r g b / 35%);border:none;border-radius:12px;padding:13px 26px;font-size:13.5px;font-weight:600;position:relative}@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}}
