/* Course detail page: long single-course page with full-width bands. Loaded only on course pages. */
.cp { --cp-blue: #1d4fbf; --cp-soft: #f3f8fd; --cp-band: #e8f3fb; --cp-line: #dbe6f3; --cp-ink: #1d2638; --cp-text: #4a5568; --cp-accent: #ffd447; }
.cp .cicon { flex: none; }
.cp-band { padding: 64px 0; background: #fff; }
.cp-tight { padding: 48px 0; }
.cp-soft { background: var(--cp-soft); }
.cp-blue { background: var(--cp-band); }
.cp-h2 { font-size: var(--fs-h2); line-height: var(--lh-heading); margin: 0 0 22px; color: var(--cp-ink); letter-spacing: var(--ls-tight); }
.cp-h3 { font-size: var(--fs-h3); margin: 22px 0 10px; color: var(--cp-ink); }
.cp-lead { margin: -10px 0 24px; color: var(--cp-text); }
.cp-empty { padding: 20px; margin: 0; color: var(--muted); }

/* Hero */
.cp-hero { position: relative; color: #fff; background: linear-gradient(118deg, #1a3f9c 0%, #2457c5 46%, #2f6fdc 100%); overflow: hidden; }
.cp-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 85% 20%, rgba(255, 255, 255, .14), transparent 42%), repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 64px); pointer-events: none; }
.cp-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 40px; align-items: start; padding-top: 36px; padding-bottom: 48px; }
.cp-crumbs { display: flex; gap: 8px; font-size: var(--fs-nav); color: #cfe0ff; }
.cp-crumbs a { color: #e8f0ff; }
.cp-crumbs a:hover { color: #fff; }
.cp-hero h1 { margin: 14px 0 16px; font-size: var(--fs-h1); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); color: #fff; }
.cp-hero h1 .accent { color: var(--cp-accent); }
.cp-hero-points { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.cp-hero-points li { display: flex; gap: 12px; align-items: flex-start; font-size: var(--fs-base); line-height: var(--lh-body); color: #f2f6ff; }
.cp-hero-points .cicon { margin-top: 1px; color: #fff; }
.cp-hero-summary { margin: 0 0 14px; font-size: var(--fs-base); color: #e9f0ff; max-width: 720px; }
.cp-hero-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; font-size: var(--fs-base); color: #dbe7ff; margin-bottom: 22px; }
.cp-hero-meta > span { display: inline-flex; align-items: center; gap: 6px; }
.cp-rating .star, .cp-score .star { color: #ffb020; }
.cp-chip { background: rgba(255, 255, 255, .16); border-radius: 999px; padding: 3px 10px; font-weight: var(--fw-semibold); font-size: var(--fs-sm); }
.cp-hero-card { background: #fff; color: var(--cp-ink); border-radius: 16px; padding: 22px 24px; box-shadow: 0 12px 32px rgba(10, 30, 80, .22); max-width: 800px; }
.cp-facts { margin: 0 0 18px; display: grid; gap: 12px; }
.cp-facts > div { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 12px; align-items: center; }
.cp-facts dt { display: flex; align-items: center; gap: 10px; color: var(--cp-text); font-size: var(--fs-base); }
.cp-facts dd { margin: 0; font-weight: var(--fw-semibold); }
.cp-included { border: 1px solid #ecdcae; border-radius: 12px; overflow: hidden; }
.cp-included-tag { display: inline-block; background: #fdf1c9; color: #6b4d00; font-weight: var(--fw-semibold); font-size: var(--fs-base); padding: 5px 12px; border-bottom-right-radius: 10px; }
.cp-included-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cp-included-items > div { display: flex; gap: 12px; align-items: center; padding: 12px 16px 16px; font-size: var(--fs-base); }
.cp-included-items > div + div { border-left: 1px solid var(--cp-line); }
.cp-inc-ico { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); flex: none; }

/* Enroll card */
.cp-enroll { background: #fff; color: var(--cp-ink); border-radius: 16px; padding: 20px; box-shadow: 0 16px 40px rgba(10, 30, 80, .28); }
.cp-enroll-cover { margin: -4px -4px 16px; border-radius: 12px; }
.cp-label { display: block; font-weight: var(--fw-semibold); font-size: var(--fs-label); margin: 0 0 6px; }
.cp-batch { position: relative; }
.cp-batch .input { padding-right: 120px; }
.cp-batch-status { display: inline-block; background: #fff1ec; color: #b2370f; border: 1px solid #f7c6b4; border-radius: 999px; font-size: var(--fs-xs); font-weight: var(--fw-semibold); padding: 2px 10px; }
.cp-batch .cp-batch-status { position: absolute; right: 34px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.cp-batch-next { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 6px; }
.cp-batch-closed { background: var(--warn-soft); color: var(--warn); border-radius: 8px; padding: 10px 12px; font-size: var(--fs-base); margin: 0 0 8px; }
.cp-price-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 16px 0 14px; }
.cp-price-row .price.lg .now { color: #e2531c; }
.cp-valid { background: #fff3d6; color: #7a5200; border-radius: 999px; font-size: var(--fs-sm); font-weight: var(--fw-semibold); padding: 3px 10px; }
.cp-cta { font-size: var(--fs-button); padding-top: 12px; padding-bottom: 12px; }
.cp-enrolled { margin: 0 0 10px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cp-note { margin: 10px 0 0; }
.cp-enroll-list { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--line); display: grid; gap: 8px; font-size: var(--fs-base); color: var(--cp-text); }
.cp-enroll-list li { display: flex; gap: 8px; align-items: center; }

/* Reviews and carousels */
.cp-score { display: inline-flex; align-items: baseline; gap: 6px; margin: -6px 0 26px; padding: 8px 18px; border: 1px solid var(--cp-line); border-radius: 999px; background: #fff; font-size: var(--fs-base); color: var(--cp-text); }
.cp-score strong { font-size: var(--fs-h1); color: var(--cp-ink); }
.cp-score-count { font-size: var(--fs-base); color: var(--muted); margin-left: 6px; }
.cp-carousel { position: relative; }
.cp-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 22px) / 3); gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 10px; scrollbar-width: none; }
.cp-track::-webkit-scrollbar { display: none; }
.cp-track > * { scroll-snap-align: start; }
.cp-track:focus-visible { outline: 3px solid #9cc0fa; outline-offset: 4px; border-radius: 12px; }
.cp-picks { grid-auto-columns: calc((100% - 3 * 22px) / 4); }
.cp-review { margin: 0; background: #fff; border: 1px solid var(--cp-line); border-radius: 16px; padding: 24px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 4px 18px rgba(20, 50, 100, .05); }
.cp-stars { color: #ffb020; letter-spacing: 2px; }
.cp-stars .off { color: #dfe5ee; }
.cp-review blockquote { margin: 0; color: var(--cp-text); line-height: var(--lh-body); flex: 1; }
.cp-review figcaption { display: flex; gap: 12px; align-items: center; border-top: 1px solid var(--line); padding-top: 14px; }
.cp-review figcaption b { display: block; color: var(--cp-ink); }
.cp-review figcaption small { display: block; color: var(--muted); font-size: var(--fs-sm); }
.cp-avatar { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; flex: none; background: linear-gradient(135deg, #dbe9ff, #b9d2fb); color: var(--brand-dark); font-weight: var(--fw-bold); }
.cp-avatar.lg { width: 64px; height: 64px; font-size: 1.4rem; }
.cp-nav { display: inline-flex; align-items: center; gap: 14px; margin-top: 18px; padding: 8px 14px; background: #fff; border: 1px solid var(--cp-line); border-radius: 999px; }
.cp-nav-btn { border: 0; background: transparent; color: var(--cp-ink); width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; }
.cp-nav-btn:hover:not(:disabled) { background: var(--brand-soft); color: var(--brand); }
.cp-nav-btn:disabled { color: #b9c2d0; cursor: default; }
.cp-nav-btn:focus-visible { outline: 3px solid #9cc0fa; outline-offset: 1px; }
.cp-dots { display: inline-flex; gap: 8px; }
.cp-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #cfd8e5; cursor: pointer; }
.cp-dots button[aria-current="true"] { background: var(--brand); }
.cp-review-form { margin-top: 26px; background: #fff; border: 1px solid var(--cp-line); border-radius: 14px; padding: 4px 18px; max-width: 640px; }
.cp-review-form summary { cursor: pointer; font-weight: var(--fw-semibold); color: var(--brand); padding: 12px 0; }
.cp-review-form form { padding-bottom: 16px; }

/* Certificate preview */
.cp-cert { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.cp-cert p { color: var(--cp-text); }
.cp-cert .cp-h3 { margin-top: 0; }
.cp-cert-thumb { position: relative; display: block; width: 100%; padding: 0; border: 1px solid var(--cp-line); border-radius: 12px; background: #fff; cursor: zoom-in; box-shadow: 0 8px 24px rgba(20, 50, 100, .08); text-align: left; }
.cp-cert-thumb:focus-visible { outline: 3px solid #9cc0fa; outline-offset: 3px; }
.cp-cert-thumb .cert { font-size: 9px; }
.cp-zoom { position: absolute; right: 14px; bottom: 14px; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--brand); display: grid; place-items: center; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
.cp-dialog { border: 0; border-radius: 16px; padding: 28px; width: min(860px, calc(100vw - 32px)); max-height: calc(100vh - 32px); box-shadow: 0 25px 70px rgba(10, 25, 60, .4); }
.cp-dialog::backdrop { background: rgba(12, 22, 44, .62); }
.cp-dialog .cert { font-size: var(--fs-base); }
.cp-dialog-close { position: absolute; right: 10px; top: 6px; border: 0; background: transparent; font-size: 1.8rem; line-height: ; cursor: pointer; color: var(--cp-text); padding: 4px 8px; }

/* Certificate (shared by the sample and the real certificate) */
.cert { font-size: var(--fs-base); background: linear-gradient(135deg, #f8fbff, #fff 40%, #f3f8ff); border-radius: 10px; padding: 1.4em; position: relative; overflow: hidden; color: #1c2434; }
.cert-inner { border: .2em solid #1463d8; outline: .1em solid #c7dafb; outline-offset: -.6em; border-radius: .6em; padding: 2.2em 2.4em 1.6em; text-align: center; }
.cert-brand { display: inline-flex; align-items: center; gap: .5em; font-weight: var(--fw-bold); font-size: 1.1em; color: #1463d8; }
.cert-brand .logo-mark { width: 1.9em; height: 1.9em; font-size: .8em; }
.cert-kicker { margin: .9em 0 .2em; font-size: 2.1em; font-weight: var(--fw-bold); color: #0d4aa6; letter-spacing: .02em; }
.cert-small { margin: .7em 0 0; color: #5b6578; font-size: .95em; }
.cert-name { margin: .2em 0 0; font-size: 2em; font-weight: var(--fw-bold); font-family: Georgia, "Times New Roman", serif; border-bottom: .06em solid #c9d5e8; display: inline-block; padding: 0 1.2em .1em; }
.cert-course { margin: .3em 0 0; font-size: 1.35em; font-weight: var(--fw-bold); color: #1d2638; }
.cert-foot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2em; margin-top: 2em; }
.cert-foot > div { display: grid; gap: .25em; }
.cert-line { border-bottom: .06em solid #9aa8bf; padding-bottom: .2em; font-weight: var(--fw-semibold); font-size: .95em; overflow-wrap: anywhere; }
.cert-foot small { color: #6a7487; font-size: .8em; }
.cert-verify { margin: 1.4em 0 0; font-size: .8em; color: #6a7487; overflow-wrap: anywhere; }
.cert-sample::after { content: "SAMPLE"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 6em; font-weight: var(--fw-bold); color: rgba(20, 99, 216, .08); transform: rotate(-18deg); pointer-events: none; letter-spacing: .1em; }
.cert-page { max-width: 980px; }
.cert-page .cert { margin-top: 18px; box-shadow: var(--shadow); }

/* Two-column text + art sections */
.cp-split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 48px; align-items: center; }
.cp-split-rev { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.cp-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.cp-points li { display: flex; gap: 14px; align-items: flex-start; }
.cp-points .cicon { color: var(--brand); margin-top: 2px; }
.cp-points b { font-size: var(--fs-h3); color: var(--cp-ink); }
.cp-points p { margin: 6px 0 0; color: var(--cp-text); line-height: var(--lh-body); }
.cp-art { display: grid; place-items: center; }
.cp-art .course-cover { width: 100%; max-width: 440px; border-radius: 28px; box-shadow: 0 18px 44px rgba(20, 60, 140, .2); }
.cp-art-icon { aspect-ratio: 1; max-width: 300px; width: 100%; margin: 0 auto; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0, #dcecff 55%, #c3dcfb 100%); color: var(--brand); }

/* Tools + approach */
.cp-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.cp-card { background: #fff; border: 1px solid var(--cp-line); border-radius: 16px; padding: 24px; }
.cp-card h3 { margin: 14px 0 8px; font-size: var(--fs-h3); }
.cp-card p { margin: 0; color: var(--cp-text); line-height: var(--lh-body); }
.cp-mono { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: #1d2638; color: #fff; font-weight: var(--fw-bold); font-size: var(--fs-h3); }
.cp-approach { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--cp-line); border-radius: 16px; overflow: hidden; background: #f8fbfe; }
.cp-approach > div { padding: 30px 32px; border-right: 1px solid var(--cp-line); border-bottom: 1px solid var(--cp-line); }
.cp-approach > div:nth-child(3n) { border-right: 0; }
.cp-approach > div { margin-bottom: -1px; } /* the last row's bottom border sits under the box border */
@media (min-width: 1001px) {
    .cp-approach-1 { grid-template-columns: minmax(0, 1fr); }
    .cp-approach-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cp-approach-2 > div:nth-child(3n) { border-right: 1px solid var(--cp-line); }
    .cp-approach-1 > div, .cp-approach-2 > div:nth-child(2n), .cp-approach > div:last-child { border-right: 0; }
    .cp-approach .cp-span-2 { grid-column: span 2; }
    .cp-approach .cp-span-3 { grid-column: span 3; }
}
@media (min-width: 721px) and (max-width: 1000px) {
    .cp-approach > div:last-child:nth-child(odd) { grid-column: span 2; border-right: 0; }
}
.cp-approach-ico { color: var(--brand); display: inline-flex; }
.cp-approach h3 { margin: 16px 0 8px; font-size: var(--fs-h3); }
.cp-approach p { margin: 0; color: var(--cp-text); line-height: var(--lh-body); }

/* Curriculum */
.cp-curriculum { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .7fr); gap: 40px; align-items: start; }
.cp-modules { background: #fff; border: 1px solid var(--cp-line); border-radius: 16px; overflow: hidden; }
.cp-module + .cp-module { border-top: 1px solid var(--cp-line); }
.cp-module summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; padding: 22px 28px; }
.cp-module summary::-webkit-details-marker { display: none; }
.cp-module summary:focus-visible { outline: 3px solid #9cc0fa; outline-offset: -3px; }
.cp-module-title { font-weight: var(--fw-semibold); font-size: var(--fs-h3); color: var(--cp-ink); }
.cp-chev { grid-column: 2; grid-row: 1; color: var(--brand); transition: transform .15s; }
.cp-module[open] .cp-chev { transform: rotate(180deg); }
.cp-module-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 22px; color: var(--cp-text); font-size: var(--fs-base); }
.cp-module-meta > span { display: inline-flex; gap: 6px; align-items: center; }
.cp-preview-tag { color: var(--brand); }
.cp-play-ring { width: 22px; height: 22px; border: 2px solid currentColor; border-radius: 50%; display: inline-grid; place-items: center; flex: none; }
.cp-lessons { list-style: none; margin: 0; padding: 18px 28px 22px; border-top: 1px solid var(--cp-line); display: grid; gap: 12px; }
.cp-lessons li { display: flex; align-items: center; gap: 10px; color: var(--cp-text); font-size: var(--fs-base); }
.cp-lessons li > a, .cp-lessons li > span:first-child { display: inline-flex; gap: 10px; align-items: center; flex: 1; min-width: 0; }
.cp-lessons a { color: inherit; }
.cp-lessons a:hover { color: var(--brand); text-decoration: underline; }
.cp-bullet { width: 6px; height: 6px; border-radius: 50%; background: #3d4a60; margin: 0 6px; flex: none; }
.cp-free { display: inline-flex; gap: 4px; align-items: center; background: var(--brand-soft); color: var(--brand); font-size: var(--fs-xs); font-weight: var(--fw-semibold); padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.cp-done { color: var(--ok); font-weight: var(--fw-bold); }
.cp-lessons li.done > a { color: var(--ok); }
.cp-more-modules { display: flex; gap: 8px; align-items: center; width: 100%; padding: 20px 28px; border: 0; border-top: 1px solid var(--cp-line); background: #fff; color: var(--brand); font-weight: var(--fw-semibold); font-size: var(--fs-md); cursor: pointer; text-align: left; }
.cp-more-modules:hover { background: #f7fbff; }
.cp-highlights { background: #fff; border-radius: 16px; padding: 28px 32px; border: 1px solid var(--cp-line); position: sticky; top: 84px; }
.cp-highlights h3 { margin: 0 0 18px; font-size: var(--fs-h3); }
.cp-highlights ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.cp-highlights li { display: flex; gap: 10px; align-items: center; color: var(--cp-text); }

/* Projects + instructors */
.cp-projects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.cp-project { border: 1px solid var(--cp-line); border-radius: 16px; padding: 24px 28px; background: #fff; }
.cp-project.capstone { background: #fdf9f0; border-color: #f2dfae; }
.cp-project-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.cp-project h3 { margin: 0; font-size: var(--fs-h3); }
.cp-project p { margin: 12px 0 0; color: var(--cp-text); line-height: var(--lh-body); }
.cp-capstone { display: inline-flex; align-items: center; gap: 6px; background: #e3a72f; color: #fff; font-weight: var(--fw-semibold); font-size: var(--fs-base); padding: 4px 12px; border-radius: 999px; white-space: nowrap; }
.cp-instructors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.cp-instructor { background: #f8fbfe; border: 1px solid var(--cp-line); border-radius: 16px; padding: 24px 28px; }
.cp-instructor-head { display: flex; gap: 18px; align-items: center; padding-bottom: 16px; }
.cp-instructor-head b { display: block; font-size: var(--fs-h3); color: var(--cp-ink); }
.cp-instructor-head span:not(.cp-avatar) { color: var(--cp-text); }
.cp-instructor p { margin: 0; padding-top: 16px; border-top: 1px solid var(--cp-line); color: var(--cp-text); line-height: var(--lh-body); }

/* Benefits table */
.cp-table-wrap { border: 1px solid var(--cp-line); border-radius: 16px; overflow: hidden; }
.cp-benefits { width: 100%; border-collapse: collapse; }
.cp-benefits th, .cp-benefits td { padding: 18px 28px; text-align: left; border-bottom: 1px solid var(--cp-line); }
.cp-benefits tr:last-child td { border-bottom: 0; }
.cp-benefits th { font-size: var(--fs-th); background: #f8fbfe; }
.cp-benefits th:last-child, .cp-benefits td:last-child { width: 32%; text-align: center; background: #2f86b9; color: #fff; border-bottom-color: rgba(255, 255, 255, .18); }
.cp-benefits td:first-child { background: #f8fbfe; color: var(--cp-text); }
.cp-benefits .no { color: rgba(255, 255, 255, .6); }

/* Overview + FAQs */
.cp-overview-body { color: var(--cp-text); line-height: var(--lh-body); }
.cp-overview.clamped .cp-overview-body { max-height: 12.5em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
.cp-readmore { display: inline-flex; gap: 6px; align-items: center; margin-top: 12px; border: 0; background: none; padding: 0; color: var(--brand); font-weight: var(--fw-semibold); font-size: var(--fs-button); cursor: pointer; }
.cp-readmore[aria-expanded="true"] .cicon { transform: rotate(180deg); }
.cp-tabs { display: flex; gap: 6px 34px; border-bottom: 1px solid var(--cp-line); overflow-x: auto; margin-bottom: 6px; scrollbar-width: thin; }
.cp-tabs button { border: 0; background: none; padding: 12px 0; font-weight: var(--fw-semibold); font-size: var(--fs-button); color: var(--cp-ink); cursor: pointer; white-space: nowrap; border-bottom: 2px solid transparent; }
.cp-tabs button.active { color: var(--brand); border-bottom-color: var(--brand); }
.cp-tabs button:focus-visible { outline: 3px solid #9cc0fa; outline-offset: 2px; }
.cp-faq details { border-bottom: 1px solid var(--cp-line); }
.cp-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 20px 0; color: var(--cp-ink); }
.cp-faq summary::-webkit-details-marker { display: none; }
.cp-faq summary:focus-visible { outline: 3px solid #9cc0fa; outline-offset: 2px; }
.cp-plus { color: var(--brand); transition: transform .15s; }
.cp-faq details[open] .cp-plus { transform: rotate(45deg); }
.cp-faq details p { margin: 0 0 20px; color: var(--cp-text); line-height: var(--lh-body); }

/* Responsive */
@media (max-width: 1100px) {
    .cp-picks { grid-auto-columns: calc((100% - 2 * 22px) / 3); }
}
@media (max-width: 1000px) {
    .cp-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .cp-enroll { max-width: 560px; width: 100%; }
    .cp-enroll-cover { display: none; }
    .cp-curriculum { grid-template-columns: minmax(0, 1fr); }
    .cp-highlights { position: static; order: -1; }
    .cp-split, .cp-split-rev, .cp-cert { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .cp-split-rev .cp-art { order: 2; }
    .cp-art .course-cover { max-width: 360px; }
    .cp-art-icon { max-width: 200px; }
    .cp-cards, .cp-approach { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cp-approach > div:nth-child(3n) { border-right: 1px solid var(--cp-line); }
    .cp-approach > div:nth-child(2n) { border-right: 0; }
    .cp-track { grid-auto-columns: calc((100% - 22px) / 2); }
    .cp-picks { grid-auto-columns: calc((100% - 2 * 22px) / 3); }
}
@media (max-width: 720px) {
    .cp-band { padding: 44px 0; }
    .cp-tight { padding: 36px 0; }
    .cp-hero-grid { padding-top: 22px; padding-bottom: 32px; }
    .cp-hero-card { padding: 18px; }
    .cp-facts > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .cp-included-items { grid-template-columns: minmax(0, 1fr); }
    .cp-included-items > div + div { border-left: 0; border-top: 1px solid var(--cp-line); padding-top: 12px; }
    .cp-cards, .cp-approach, .cp-projects, .cp-instructors { grid-template-columns: minmax(0, 1fr); }
    .cp-approach > div, .cp-approach > div:nth-child(3n) { border-right: 0; padding: 22px 20px; }
    .cp-track { grid-auto-columns: 86%; gap: 14px; }
    .cp-picks { grid-auto-columns: 78%; }
    .cp-module summary { padding: 18px 18px; }
    .cp-lessons { padding: 14px 18px 18px; }
    .cp-more-modules { padding: 18px; }
    .cp-highlights { padding: 22px 20px; }
    .cp-highlights ul { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .cp-benefits th, .cp-benefits td { padding: 14px 14px; }
    .cp-benefits th:last-child, .cp-benefits td:last-child { width: 30%; }
    .cp-project, .cp-instructor, .cp-review { padding: 20px; }
    .cp-tabs { gap: 4px 22px; }
    .cert-foot { grid-template-columns: minmax(0, 1fr); gap: .8em; }
    .cert-inner { padding: 1.6em 1.2em 1.2em; }
}

@media print {
    .site-header, .site-footer, footer, .cert-actions, .nav-toggle, .mm-overlay, .alert { display: none !important; }
    body { background: #fff; }
    .cert-page { padding: 0; max-width: none; }
    .cert-page .cert { box-shadow: none; margin: 0; }
}

/* Admin-managed sections: offer strip, banner, subtitle, tools, assignments, projects, instructors, comparison */
.cp-offer { background: #fff4d6; color: #5b4300; font-size: var(--fs-base); text-align: center; padding: 10px 0; border-bottom: 1px solid #f2dfae; }
.cp-offer .container { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
.cp-coupon b { background: #fff; border: 1px dashed #d7a93a; border-radius: 6px; padding: 1px 8px; letter-spacing: .04em; }
.cp-banner { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .22; pointer-events: none; }
.cp-hero > .container { position: relative; }
.cp-subtitle { margin: -6px 0 16px; font-size: var(--fs-base); color: #e9f0ff; max-width: 720px; }
.cp-text { white-space: pre-line; line-height: var(--lh-body); }
.cp-lead.cp-text { margin: -10px 0 24px; max-width: 860px; }
.cp-logo { width: 48px; height: 48px; object-fit: contain; border-radius: 12px; background: #fff; border: 1px solid var(--cp-line); }
.cp-module-desc { margin: 0; padding: 0 28px 16px; color: var(--cp-text); line-height: var(--lh-body); }
.cp-curriculum-full { grid-template-columns: minmax(0, 1fr); }
.cp-feature-list { list-style: none; margin: 18px 0 0; padding: 18px 0 0; border-top: 1px solid var(--cp-line); display: grid; gap: 10px; }
.cp-highlights .cp-feature-list { grid-template-columns: minmax(0, 1fr); }
.cp-feature-list.cp-feature-first { margin-top: 0; padding-top: 0; border-top: 0; }
.cp-band > .container > .cp-highlights { position: static; max-width: 760px; }
.cp-feature-list li { align-items: flex-start; }
.cp-feature-list b { display: block; color: var(--cp-ink); }
.cp-mobile { display: flex; gap: 8px; align-items: flex-start; margin: 16px 0 0; color: var(--cp-text); font-size: var(--fs-base); }
.cp-more { margin-top: 12px; }
.cp-more summary { cursor: pointer; font-weight: var(--fw-semibold); color: var(--brand); }
.cp-more .cp-text { margin-top: 8px; color: var(--cp-text); }
.cp-project-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px; margin-bottom: 14px; background: #f3f6fa; }
.cp-photo { object-fit: cover; padding: 0; }
.cp-skills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.cp-compare th:nth-child(2), .cp-compare td:nth-child(2) { width: 26%; text-align: center; }
.cp-compare td:nth-child(2) .no { color: #a0aec0; }
@media (max-width: 720px) {
    .cp-module-desc { padding: 0 18px 14px; }
    .cp-compare th, .cp-compare td { padding: 12px 14px; }
}
