.clp-wrap {
    --clp-ink: #1c1d1f;
    --clp-muted: #6a6f73;
    --clp-line: #d1d7dc;
    --clp-paper: #f7f9fa;
    --clp-white: #fff;
    --clp-brand: #0b6e99;
    --clp-brand-deep: #084d6c;
    --clp-cta: #ec6611;
    --clp-cta-deep: #c4530c;
    --clp-ok: #1e7a46;
    --clp-gold: #b4690e;
    --clp-dark: #1c1d1f;
    --clp-dark-2: #2d2f31;
    font-family: "Noto Sans TC", "Segoe UI", sans-serif;
    color: var(--clp-ink);
    background: var(--clp-paper);
}
.clp-wrap *,
.clp-wrap *::before,
.clp-wrap *::after { box-sizing: border-box; }
.clp-wrap img { max-width: 100%; display: block; }
.clp-wrap a { color: inherit; }
.clp-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.clp-sample-bar {
    background: #111827;
    color: #fde68a;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .04em;
    text-align: center;
    padding: 10px 16px;
}
.clp-sample-bar a { color: #fff; text-decoration: underline; }

.clp-page { position: relative; padding-bottom: 64px; }
.clp-dark-band {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 520px;
    overflow: hidden;
    background:
        radial-gradient(920px 460px at 8% -18%, rgba(14, 116, 144, .55), transparent 58%),
        radial-gradient(720px 420px at 92% -10%, rgba(236, 102, 17, .32), transparent 54%),
        radial-gradient(520px 280px at 70% 118%, rgba(45, 212, 191, .18), transparent 62%),
        linear-gradient(165deg, #07131f 0%, #0d2740 48%, #12324c 100%);
    z-index: 0;
}
.clp-dark-band:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
        radial-gradient(circle, rgba(255,255,255,.16) 1px, transparent 1.6px);
    background-size: 72px 72px, 72px 72px, 24px 24px;
    mask-image: linear-gradient(180deg, #000 0%, #000 62%, transparent 100%);
    pointer-events: none;
}
.clp-dark-band:after {
    content: "";
    position: absolute;
    right: -6%;
    top: -18%;
    width: 58%;
    height: 145%;
    background:
        linear-gradient(90deg, #0d2740 0%, rgba(13,39,64,.35) 28%, transparent 55%),
        var(--clp-hero-photo) right center / cover no-repeat;
    opacity: .28;
    filter: saturate(1.15) contrast(1.05);
    pointer-events: none;
}
.clp-hero-nodes {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}
.clp-hero-nodes span {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: rgba(255,255,255,.7);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
    backdrop-filter: blur(8px);
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
    opacity: .55;
}
.clp-hero-nodes span:before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}
.clp-hero-nodes span:nth-child(1) { left: 1.5%; top: 12%; color: #7dd3fc; }
.clp-hero-nodes span:nth-child(2) { left: 2%; bottom: 10%; color: #99f6e4; }
.clp-hero-nodes span:nth-child(3) { right: 28%; top: 10%; color: #fdba74; }
.clp-hero-nodes span:nth-child(4) { right: 30%; bottom: 14%; color: #c4b5fd; }
.clp-hero-nodes i {
    position: absolute;
    border-radius: 999px;
    filter: blur(2px);
    opacity: .55;
}
.clp-hero-nodes i:nth-of-type(1) {
    left: 4%;
    top: 22%;
    width: 160px;
    height: 2px;
    background: linear-gradient(90deg, #38bdf8, transparent);
    transform: rotate(12deg);
}
.clp-hero-nodes i:nth-of-type(2) {
    left: 6%;
    bottom: 22%;
    width: 2px;
    height: 90px;
    background: linear-gradient(180deg, #99f6e4, transparent);
}
.clp-hero-nodes i:nth-of-type(3) {
    right: 32%;
    top: 20%;
    width: 120px;
    height: 2px;
    background: linear-gradient(90deg, #fdba74, transparent);
    transform: rotate(-14deg);
}
.clp-cert {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
    align-items: start;
    margin-top: 14px;
    padding: 14px 16px;
    border: 1px solid #86efac;
    border-radius: 12px;
    background: linear-gradient(135deg, #ecfdf5 0%, #fff 70%);
    color: #14532d;
}
.clp-cert b {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #166534;
    color: #fff;
    font-size: 18px;
}
.clp-cert strong { display: block; font-size: 15px; font-weight: 900; }
.clp-cert p { margin: 4px 0 0; font-size: 13px; line-height: 1.6; font-weight: 650; }
.clp-cert-hero {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
    padding: 10px 14px;
    border: 1px solid rgba(134, 239, 172, .45);
    border-radius: 12px;
    background: rgba(6, 40, 24, .78);
    color: #dcfce7;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.5;
    max-width: 640px;
}
.clp-cert-hero strong { color: #fff; }
.clp-main {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 40px;
    align-items: start;
    padding-top: 22px;
}
.clp-hero {
    background: transparent;
    color: #fff;
    padding: 0 0 36px;
}
.clp-crumb {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #cec0fc;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 14px;
}
.clp-crumb a { color: #cec0fc; text-decoration: underline; }
.clp-crumb span { color: #9ca3af; }
.clp-hero-grid { display: block; }
.clp-hero h1 {
    margin: 0;
    color: #fff !important;
    font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.18;
    font-weight: 900;
    letter-spacing: -.02em;
}
.clp-hero-en {
    margin: 8px 0 0;
    color: #c5c8cb;
    font-size: 16px;
    font-weight: 700;
}
.clp-lead {
    margin: 14px 0 0;
    max-width: 640px;
    color: #d1d7dc;
    font-size: 17px;
    line-height: 1.7;
    font-weight: 600;
}
.clp-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.clp-pills span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.14);
    font-size: 12px;
    font-weight: 800;
}
.clp-pills b { color: #fbbf24; }
.clp-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
    margin-top: 18px;
    color: #d1d7dc;
    font-size: 13px;
    font-weight: 700;
}
.clp-meta strong { color: #fff; }

.clp-buy {
    background: var(--clp-white);
    color: var(--clp-ink);
    border: 1px solid var(--clp-line);
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.clp-buy-sticky {
    position: sticky;
    top: var(--clp-sticky-top, 196px);
    z-index: 20;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - var(--clp-sticky-top, 196px) - 12px);
    overflow: hidden;
}
.clp-buy-sticky .clp-player,
.clp-buy-sticky .clp-lang-tabs { flex: 0 0 auto; }
.clp-buy-sticky .clp-buy-body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.clp-player {
    position: relative;
    background: #000;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.clp-player video,
.clp-player iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: 0;
    position: absolute;
    inset: 0;
}
.clp-player-poster {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.clp-cover {
    position: absolute;
    inset: 0;
    z-index: 3;
    margin: 0;
    padding: 0;
    border: 0;
    background: #000;
    cursor: pointer;
    text-align: left;
}
.clp-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.clp-cover-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(7,19,31,.18) 0%, rgba(7,19,31,.72) 100%);
}
.clp-cover-play {
    position: absolute;
    left: 50%;
    top: 46%;
    width: 68px;
    height: 68px;
    margin: 0;
    border-radius: 50%;
    background: var(--clp-cta);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 24px;
    line-height: 1;
    transform: translate(-50%, -50%);
    box-shadow: 0 10px 28px rgba(0,0,0,.4);
}
.clp-cover-badge {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, .88);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
}
.clp-cover-caption {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 12px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
}
.clp-cover.is-off { display: none; }
.clp-cover.is-static { cursor: default; }
.clp-preview-end {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 4;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    background: rgba(7, 19, 31, .94);
    color: #fff;
    text-align: center;
}
.clp-preview-end.is-on { display: flex; }
.clp-preview-end strong { font-size: 16px; font-weight: 900; }
.clp-preview-end p { margin: 0; color: #d1d7dc; font-size: 13px; line-height: 1.6; font-weight: 650; }
.clp-preview-end a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 16px;
    margin-top: 6px;
    border-radius: 4px;
    background: var(--clp-cta);
    color: #fff !important;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
}
.clp-preview-note {
    margin: 0;
    padding: 8px 12px;
    background: #111827;
    color: #fde68a;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
}
.clp-lang-tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid var(--clp-line);
}
.clp-lang-tabs button {
    margin: 0;
    border: 0;
    border-right: 1px solid var(--clp-line);
    background: #f3f4f6;
    color: #374151;
    min-height: 42px;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}
.clp-lang-tabs button:last-child { border-right: 0; }
.clp-lang-tabs button.is-on {
    background: #fff;
    color: var(--clp-brand);
    box-shadow: inset 0 -2px 0 var(--clp-brand);
}
.clp-buy-body { padding: 16px 18px 20px; }
.clp-price-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.clp-price-row strong {
    font-size: 32px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.03em;
}
.clp-price-row del { color: var(--clp-muted); font-size: 15px; font-weight: 700; }
.clp-price-note { margin: 6px 0 0; color: var(--clp-ok); font-size: 13px; font-weight: 800; }
.clp-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    margin-top: 12px;
    border: 0;
    border-radius: 4px;
    background: var(--clp-cta);
    color: #fff !important;
    font-size: 16px;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}
.clp-cta:hover { background: var(--clp-cta-deep); }
.clp-cta-ghost {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    margin-top: 8px;
    border: 1px solid var(--clp-ink);
    border-radius: 4px;
    background: #fff;
    color: var(--clp-ink) !important;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
}
.clp-guarantee {
    margin: 10px 0 0;
    text-align: center;
    color: var(--clp-muted);
    font-size: 12px;
    font-weight: 700;
}
.clp-includes { margin: 16px 0 0; padding: 0; list-style: none; }
.clp-includes li {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 8px;
    padding: 6px 0;
    border-top: 1px solid #eef1f4;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}
.clp-includes li:first-child { border-top: 0; }
.clp-includes i { color: var(--clp-brand); font-style: normal; font-weight: 900; }
.clp-demo-chip {
    margin-top: 14px;
    padding: 10px 12px;
    background: #f3f7fa;
    border: 1px dashed #b7d0de;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.55;
}
.clp-demo-chip a { color: var(--clp-brand); }
.clp-lang-versions { margin-top: 12px; }
.clp-lang-intro { margin: 0 0 6px; color: var(--clp-muted); font-size: 12px; font-weight: 700; }
.clp-lang-row { display: grid; grid-template-columns: 1fr; gap: 8px; }
.clp-lang-form { margin: 0; }
.clp-lang-btn {
    width: 100%;
    min-height: 48px;
    padding: 8px 12px;
    border: 1px solid var(--clp-ink);
    border-radius: 4px;
    background: #fff;
    color: var(--clp-ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
    white-space: normal;
    cursor: pointer;
}
.clp-lang-form:first-child .clp-lang-btn {
    background: var(--clp-cta);
    border-color: var(--clp-cta);
    color: #fff;
}
.clp-lang-btn:hover { filter: brightness(0.96); }

.clp-body { padding: 0 0 8px; }
.clp-layout { display: block; }
.clp-card {
    background: #fff;
    border: 1px solid var(--clp-line);
    padding: 22px 24px;
    margin-bottom: 18px;
}
.clp-card h2 {
    margin: 0;
    color: var(--clp-ink) !important;
    font-size: 24px;
    font-weight: 900;
}
.clp-kicker {
    display: block;
    margin-bottom: 6px;
    color: var(--clp-brand);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.clp-compare {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    overflow: hidden;
}
.clp-compare article { padding: 20px 22px; }
.clp-compare .is-old { background: #f3f4f6; color: #4b5563; }
.clp-compare .is-new { background: #ecfdf3; }
.clp-compare h3 { margin: 0 0 10px; font-size: 16px; font-weight: 900; }
.clp-compare ul { margin: 0; padding: 0; list-style: none; }
.clp-compare li {
    position: relative;
    padding: 7px 0 7px 22px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}
.clp-compare .is-old li:before { content: "×"; position: absolute; left: 0; color: #9ca3af; font-weight: 900; }
.clp-compare .is-new li:before { content: "✓"; position: absolute; left: 0; color: var(--clp-ok); font-weight: 900; }

.clp-why {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}
.clp-why article {
    padding: 16px;
    border: 1px solid var(--clp-line);
    background: #fff;
}
.clp-why b {
    display: block;
    color: var(--clp-cta);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    margin-bottom: 6px;
}
.clp-why h3 { margin: 0 0 6px; font-size: 16px; font-weight: 900; }
.clp-why p { margin: 0; color: #4b5563; font-size: 13px; line-height: 1.65; font-weight: 650; }

.clp-learn { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; margin: 14px 0 0; padding: 0; list-style: none; }
.clp-learn li {
    position: relative;
    padding-left: 26px;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 700;
}
.clp-learn li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--clp-ok);
    font-weight: 900;
}

.clp-content-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: end;
    flex-wrap: wrap;
}
.clp-content-meta { margin: 6px 0 0; color: var(--clp-muted); font-size: 13px; font-weight: 700; }
.clp-expand {
    background: none;
    border: 0;
    color: var(--clp-brand);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}
.clp-lesson {
    border: 1px solid var(--clp-line);
    border-top: 0;
    background: #fff;
}
.clp-lesson:first-of-type { border-top: 1px solid var(--clp-line); }
.clp-lesson > summary {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 14px 16px;
    background: #f7f9fa;
    cursor: pointer;
    list-style: none;
    font-weight: 800;
}
.clp-lesson > summary::-webkit-details-marker { display: none; }
.clp-caret { color: #6a6f73; font-style: normal; }
.clp-lesson[open] > summary .clp-caret { transform: rotate(90deg); }
.clp-lesson > summary h3 { margin: 0; font-size: 15px; font-weight: 900; }
.clp-lesson > summary small { display: block; margin-top: 3px; color: var(--clp-muted); font-size: 12px; font-weight: 700; }
.clp-lesson-count { color: var(--clp-muted); font-size: 12px; white-space: nowrap; }
.clp-lesson-body { padding: 0 0 8px; background: #fff; }
.clp-summary-box {
    margin: 0 16px 10px;
    padding: 14px 16px;
    background: #f0f9ff;
    border: 1px solid #cfe6f4;
}
.clp-summary-box span {
    display: block;
    color: var(--clp-brand);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .1em;
}
.clp-summary-box p { margin: 6px 0 0; font-size: 14px; line-height: 1.7; font-weight: 650; }
.clp-lecture {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: start;
    padding: 9px 16px;
    border-top: 1px solid #eef1f4;
    font-size: 13px;
}
.clp-lecture time {
    color: var(--clp-brand);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    white-space: nowrap;
}
.clp-lecture strong { display: block; font-weight: 800; }
.clp-lecture p { margin: 3px 0 0; color: #4b5563; font-size: 12px; line-height: 1.55; font-weight: 600; }
.clp-preview-tag {
    color: var(--clp-brand);
    font-size: 12px;
    font-weight: 800;
    text-decoration: underline;
}
.clp-quiz-box {
    margin: 4px 16px 14px;
    padding: 14px 16px 16px;
    border: 1px solid #e4d7fb;
    background: #fbf8ff;
}
.clp-quiz-box > span {
    display: block;
    color: #6d28d9;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .1em;
}
.clp-q { margin-top: 12px; padding-top: 12px; border-top: 1px solid #eee4ff; }
.clp-q:first-of-type { border-top: 0; margin-top: 8px; padding-top: 0; }
.clp-q strong { display: block; font-size: 14px; line-height: 1.5; }
.clp-opts { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; width: 100%; }
.clp-opts input {
    appearance: auto !important;
    opacity: 1 !important;
    position: static !important;
    width: 16px !important;
    height: 16px !important;
    margin: 3px 0 0 !important;
    flex: 0 0 16px;
    accent-color: #6d28d9;
}
.clp-opts label {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #ddd6fe;
    border-radius: 8px;
    background: #fff;
    color: #1c1d1f;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.55;
    cursor: pointer;
    writing-mode: horizontal-tb !important;
}
.clp-opts .clp-opt-key {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    background: #f3e8ff;
    color: #6d28d9;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
}
.clp-opts .clp-opt-text {
    flex: 1 1 auto;
    display: block !important;
    width: auto !important;
    min-width: 12rem !important;
    max-width: none !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    writing-mode: horizontal-tb !important;
}
.clp-opts label.is-correct-answer { border-color: #16a34a; background: #f0fdf4; }
.clp-opts label.is-selected-wrong { border-color: #dc2626; background: #fef2f2; }
.clp-q button {
    margin-top: 8px;
    min-height: 34px;
    padding: 0 12px;
    border: 0;
    background: #6d28d9;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}
.clp-q [data-sample-result] { margin-top: 8px; font-size: 12px; font-weight: 750; line-height: 1.55; }
.clp-q [data-sample-result].is-correct { color: #166534; }
.clp-q [data-sample-result].is-incorrect,
.clp-q [data-sample-result].is-warning { color: #b45309; }

.clp-player-map {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--clp-line);
    background: #fff;
}
.clp-player-map figure {
    margin: 0;
    min-height: 280px;
    background: #0f172a center / cover no-repeat;
    position: relative;
}
.clp-player-map figcaption {
    position: absolute;
    left: 16px;
    bottom: 16px;
    padding: 8px 10px;
    background: rgba(15,23,42,.82);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}
.clp-player-map ul { margin: 0; padding: 20px 22px; list-style: none; }
.clp-player-map li { padding: 8px 0; border-top: 1px solid #eef1f4; font-size: 14px; font-weight: 750; line-height: 1.5; }
.clp-player-map li:first-child { border-top: 0; padding-top: 0; }
.clp-player-map b { color: var(--clp-brand); }

.clp-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.clp-steps article {
    padding: 14px;
    border: 1px solid var(--clp-line);
    background: #fff;
}
.clp-steps em {
    display: block;
    color: var(--clp-cta);
    font-style: normal;
    font-size: 12px;
    font-weight: 900;
}
.clp-steps h3 { margin: 6px 0; font-size: 15px; font-weight: 900; }
.clp-steps p { margin: 0; color: #4b5563; font-size: 13px; line-height: 1.55; font-weight: 650; }

.clp-split-lists {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-top: 14px;
}
.clp-split-lists h3 { margin: 0 0 8px; font-size: 16px; font-weight: 900; }
.clp-split-lists ul,
.clp-audience { margin: 0; padding: 0; list-style: none; }
.clp-split-lists li,
.clp-audience li {
    position: relative;
    padding: 7px 0 7px 22px;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 700;
}
.clp-split-lists li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--clp-ok);
    font-weight: 900;
}
.clp-audience {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 14px;
}
.clp-audience li {
    padding: 14px;
    border: 1px solid var(--clp-line);
    background: #f8fafc;
}
.clp-audience li:before { content: none; }
.clp-audience small { display: block; color: var(--clp-brand); font-size: 11px; font-weight: 900; letter-spacing: .08em; margin-bottom: 4px; }
.clp-skills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}
.clp-skills span {
    padding: 8px 12px;
    border: 1px solid #cfe0ec;
    border-radius: 999px;
    background: #f4f9fc;
    font-size: 13px;
    font-weight: 800;
}
.clp-refs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}
.clp-refs a {
    display: block;
    overflow: hidden;
    border: 1px solid var(--clp-line);
    background: #fff;
    text-decoration: none;
}
.clp-refs img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.clp-refs strong { display: block; padding: 10px 12px 12px; font-size: 13px; }
.clp-instructor { display: grid; grid-template-columns: 88px 1fr; gap: 16px; margin-top: 14px; }
.clp-avatar {
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: linear-gradient(145deg, #0b6e99, #084d6c);
    color: #fff;
    font-size: 28px;
    font-weight: 900;
}
.clp-instructor p { margin: 8px 0 0; color: #374151; font-size: 14px; line-height: 1.7; font-weight: 650; }
.clp-cred {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}
.clp-cred span {
    padding: 5px 8px;
    border: 1px solid #e5e7eb;
    background: #fff;
    font-size: 12px;
    font-weight: 800;
}
.clp-exp { margin: 10px 0 0; padding: 0; list-style: none; }
.clp-exp li { padding: 5px 0 5px 16px; position: relative; font-size: 13px; line-height: 1.55; font-weight: 700; color: #374151; }
.clp-exp li:before { content: "·"; position: absolute; left: 2px; color: var(--clp-brand); font-weight: 900; }
.clp-clients { margin-top: 12px; padding: 16px; border: 1px solid var(--clp-line); background: #fff; }
.clp-clients img { width: 100%; height: auto; }

.clp-mini {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1200;
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 20px;
    background: #1c1d1f;
    color: #fff;
    box-shadow: 0 8px 20px rgba(0,0,0,.18);
}
.clp-mini.is-on { display: flex; }
.clp-mini strong { font-size: 14px; }
.clp-mini a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    background: var(--clp-cta);
    color: #fff !important;
    text-decoration: none;
    font-size: 13px;
    font-weight: 900;
}

@media (max-width: 980px) {
    .clp-main,
    .clp-compare,
    .clp-why,
    .clp-learn,
    .clp-player-map,
    .clp-steps,
    .clp-split-lists,
    .clp-audience,
    .clp-refs,
    .clp-instructor { grid-template-columns: 1fr; }
    .clp-dark-band { height: auto; min-height: 640px; }
    .clp-hero-nodes span:nth-child(3),
    .clp-hero-nodes span:nth-child(4) { display: none; }
    .clp-buy { order: -1; }
    .clp-buy-sticky {
        position: static;
        max-height: none;
        overflow: visible;
    }
    .clp-buy-sticky .clp-buy-body { overflow: visible; }
    .clp-lecture { grid-template-columns: 18px minmax(0, 1fr) auto; }
    .clp-lecture time { grid-column: 3; grid-row: 1; }
}