/* Courses & Prices page — PDF-aligned presentation, scoped to this page only. */
body.courses-prices-redesign {
    background: #fffaf8;
}

.courses-prices-redesign .cp-main {
    --cp-navy: #04164d;
    --cp-pink: #f5005d;
    --cp-blue: #0784f8;
    --cp-cyan: #28c4cd;
    --cp-orange: #ff8316;
    --cp-yellow: #ffc800;
    --cp-green: #37b82f;
    --cp-purple: #9226bd;
    --cp-text: #071946;
    --cp-muted: #4c5773;
    --cp-line: #e2e3e8;
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(255, 236, 230, .66), transparent 28%),
        linear-gradient(315deg, rgba(239, 255, 224, .55), transparent 24%),
        #fffdfb;
    color: var(--cp-text);
    font-family: 'Figtree', sans-serif;
}

.courses-prices-redesign .cp-main *,
.courses-prices-redesign .cp-main *::before,
.courses-prices-redesign .cp-main *::after {
    box-sizing: border-box;
}

.courses-prices-redesign .cp-main .container {
    position: relative;
    z-index: 2;
    width: min(100% - 48px, 1320px);
    max-width: 1320px;
    margin-inline: auto;
    padding-inline: 0;
}

.courses-prices-redesign .cp-section {
    position: relative;
    margin: 0;
    padding: 76px 0;
    background: transparent;
}

.courses-prices-redesign .cp-section::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: .64;
    background:
        linear-gradient(135deg, transparent 0 13%, rgba(255, 164, 137, .10) 13% 15%, transparent 15% 31%, rgba(42, 197, 207, .09) 31% 33%, transparent 33% 63%, rgba(255, 203, 44, .08) 63% 65%, transparent 65%),
        linear-gradient(315deg, transparent 0 22%, rgba(110, 205, 76, .08) 22% 24%, transparent 24% 74%, rgba(0, 132, 248, .07) 74% 76%, transparent 76%);
}

.courses-prices-redesign .cp-main h1,
.courses-prices-redesign .cp-main h2,
.courses-prices-redesign .cp-main h3,
.courses-prices-redesign .cp-main h4,
.courses-prices-redesign .cp-main p {
    color: var(--cp-text);
    font-family: inherit;
}

.courses-prices-redesign .cp-main h1,
.courses-prices-redesign .cp-main h2,
.courses-prices-redesign .cp-main h3 {
    letter-spacing: -.025em;
}

.courses-prices-redesign .cp-main p {
    margin: 0 0 13px;
    font-size: 16px;
    line-height: 1.62;
}

.courses-prices-redesign .cp-main a:focus-visible,
.courses-prices-redesign .cp-main button:focus-visible {
    outline: 3px solid rgba(7, 132, 248, .3);
    outline-offset: 3px;
}

.courses-prices-redesign .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.courses-prices-redesign .cp-multicolour-rule {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 130px;
    height: 4px;
    margin: 12px 0 20px;
}

.courses-prices-redesign .cp-multicolour-rule i {
    display: block;
    width: 28px;
    height: 3px;
    border-radius: 10px;
    background: var(--cp-orange);
}

.courses-prices-redesign .cp-multicolour-rule i:nth-child(2) { background: var(--cp-cyan); }
.courses-prices-redesign .cp-multicolour-rule i:nth-child(3) { background: var(--cp-yellow); }
.courses-prices-redesign .cp-multicolour-rule i:nth-child(4) { background: var(--cp-green); }
.courses-prices-redesign .cp-multicolour-rule i:nth-child(5) { background: #f458a2; }

.courses-prices-redesign .cp-section-heading h2 {
    margin: 0;
    font-size: clamp(30px, 3.3vw, 44px);
    font-weight: 800;
    line-height: 1.12;
}

.courses-prices-redesign .cp-section-heading-centred { text-align: center; }
.courses-prices-redesign .cp-section-heading-centred .cp-multicolour-rule {
    justify-content: center;
    margin-inline: auto;
}
.courses-prices-redesign .cp-section-heading-centred p {
    max-width: 620px;
    margin: 0 auto;
    color: var(--cp-muted);
    font-size: 16px;
}

.courses-prices-redesign .cp-card-rule {
    display: block;
    width: 44px;
    height: 3px;
    margin: 12px 0 15px;
    border-radius: 5px;
    background: var(--cp-accent, var(--cp-pink));
}

/* Buttons and links */
.courses-prices-redesign .cp-button {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 18px;
    padding: 11px 22px;
    border: 2px solid transparent;
    border-radius: 6px;
    background: var(--cp-navy);
    box-shadow: 0 7px 16px rgba(4, 22, 77, .15);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

.courses-prices-redesign .cp-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(4, 22, 77, .22);
    color: #fff;
}

.courses-prices-redesign .cp-button-outline {
    background: transparent;
    box-shadow: none;
    border-color: var(--cp-pink);
    color: var(--cp-pink);
}

.courses-prices-redesign .cp-button-outline:hover {
    background: var(--cp-pink);
    color: #fff;
}

.courses-prices-redesign .cp-button-green.cp-button-outline {
    border-color: var(--cp-green);
    color: var(--cp-green);
}

.courses-prices-redesign .cp-button-green.cp-button-outline:hover {
    background: var(--cp-green);
    color: #fff;
}

.courses-prices-redesign .cp-button-small {
    min-height: 38px;
    margin-top: 0;
    padding: 8px 16px;
    font-size: 13px;
}

.courses-prices-redesign .cp-package-featured .cp-button {
    background: var(--cp-pink);
    border-color: var(--cp-pink);
    color: #fff;
}

.courses-prices-redesign .cp-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    color: var(--cp-purple);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.courses-prices-redesign .cp-link i { font-size: 11px; transition: transform .2s ease; }
.courses-prices-redesign .cp-link:hover { color: var(--cp-navy); }
.courses-prices-redesign .cp-link:hover i { transform: translateX(3px); }

/* Accent palette used across grids */
.courses-prices-redesign .cp-accent-1 { --cp-accent: var(--cp-pink); --cp-soft: #fff0f5; }
.courses-prices-redesign .cp-accent-2 { --cp-accent: var(--cp-orange); --cp-soft: #fff6ef; }
.courses-prices-redesign .cp-accent-3 { --cp-accent: var(--cp-blue); --cp-soft: #f0f6ff; }
.courses-prices-redesign .cp-accent-4 { --cp-accent: var(--cp-green); --cp-soft: #f0faef; }
.courses-prices-redesign .cp-accent-5 { --cp-accent: var(--cp-purple); --cp-soft: #f8effb; }

/* Hero */
.courses-prices-redesign .cp-hero {
    position: relative;
    overflow: hidden;
    padding: 44px 0 48px;
    background:
        linear-gradient(112deg, rgba(255, 238, 232, .84), rgba(255, 255, 255, .72) 47%, rgba(239, 255, 224, .76)),
        #fff;
}

.courses-prices-redesign .cp-hero::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: .8;
    background:
        linear-gradient(133deg, transparent 0 10%, rgba(255, 151, 118, .14) 10% 13%, transparent 13% 29%, rgba(37, 196, 205, .14) 29% 32%, transparent 32% 56%, rgba(255, 204, 60, .12) 56% 60%, transparent 60% 79%, rgba(81, 197, 64, .11) 79% 82%, transparent 82%);
}

.courses-prices-redesign .cp-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(480px, 1.15fr);
    align-items: center;
    gap: 36px;
    padding-bottom: 20px;
}

.courses-prices-redesign .cp-hero-copy { max-width: 560px; }

.courses-prices-redesign .cp-hero h1 {
    margin: 0 0 18px;
    font-size: clamp(38px, 4vw, 54px);
    font-weight: 800;
    line-height: 1.08;
    text-transform: uppercase;
}

.courses-prices-redesign .cp-hero-line { display: block; }
.courses-prices-redesign .cp-hero-line-solid { color: var(--cp-navy); }

.courses-prices-redesign .cp-hero-line-outline {
    -webkit-text-stroke: 1.5px currentColor;
    -webkit-text-fill-color: transparent;
    color: currentColor;
}

.courses-prices-redesign .cp-hero-line-pink { color: var(--cp-pink); }
.courses-prices-redesign .cp-hero-line-orange { color: var(--cp-orange); }

.courses-prices-redesign .cp-hero-description {
    max-width: 480px;
    margin: 0;
    color: var(--cp-text);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
}

.courses-prices-redesign .cp-hero-visual {
    position: relative;
    min-width: 0;
    isolation: isolate;
}

.courses-prices-redesign .cp-hero-visual::after {
    position: absolute;
    z-index: -1;
    right: 4%;
    bottom: 4%;
    width: 72%;
    height: 28%;
    border-radius: 50%;
    content: "";
    background: rgba(13, 26, 59, .2);
    filter: blur(24px);
}

.courses-prices-redesign .cp-hero-visual img {
    display: block;
    width: 100%;
    max-height: 400px;
    object-fit: contain;
}

.courses-prices-redesign .cp-learner-plate {
    position: absolute;
    z-index: 3;
    top: -4px;
    right: 22%;
    display: none;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(4, 22, 77, .15);
    color: #e70012;
    font-size: 34px;
    font-weight: 900;
    transform: rotate(4deg);
}

/* Search bar — sized to match the compact hero search used on the Home page */
.courses-prices-redesign .cp-instructor-search {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(150px, .8fr) auto;
    align-items: center;
    width: min(100%, 760px);
    margin: 30px auto 0;
    padding: 8px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(4, 22, 77, .16);
}

.courses-prices-redesign .cp-search-field {
    position: relative;
    display: block;
    margin: 0;
    border-right: 1px solid var(--cp-line);
}

.courses-prices-redesign .cp-search-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 14px;
    display: flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
}

.courses-prices-redesign .cp-search-icon img { width: 18px; height: 18px; object-fit: contain; }

.courses-prices-redesign .cp-postcode-field .cp-search-icon {
    width: 28px;
    height: 28px;
}

.courses-prices-redesign .cp-postcode-field .cp-search-icon img { width: 28px; height: 28px; }

.courses-prices-redesign .cp-postcode-field input { padding-left: 52px; }

.courses-prices-redesign .cp-search-field input,
.courses-prices-redesign .cp-search-field select {
    width: 100%;
    height: 50px;
    padding: 0 14px 0 42px;
    border: 0;
    border-radius: 10px;
    outline: 0;
    background-color: #fff;
    color: var(--cp-navy);
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
}

.courses-prices-redesign .cp-transmission-field select {
    padding-right: 30px;
    background-image: url('../images/down-arrow.svg');
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
    background-size: 11px;
    appearance: none;
}

.courses-prices-redesign .cp-search-field input[aria-invalid="true"] {
    box-shadow: inset 0 0 0 2px var(--cp-pink);
}

.courses-prices-redesign .cp-search-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 50px;
    padding: 0 22px;
    border: 0;
    background: transparent;
    color: var(--cp-navy);
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: color .2s ease;
}

.courses-prices-redesign .cp-search-submit i { color: var(--cp-pink); font-size: 15px; }
.courses-prices-redesign .cp-search-submit:hover { color: var(--cp-pink); }

.courses-prices-redesign .cp-search-error {
    position: absolute;
    top: 100%;
    left: 12px;
    margin-top: 6px;
    color: var(--cp-pink);
    font-size: 12px;
    font-weight: 700;
}

/* Hourly courses grid */
.courses-prices-redesign .cp-packages { padding-top: 92px; }

.courses-prices-redesign .cp-package-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px;
    margin-top: 46px;
}

.courses-prices-redesign .cp-package-card {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    padding: 36px 24px 28px;
    border: 1px solid #e6e7ec;
    border-radius: 16px;
    background: #fff;
    text-align: center;
    box-shadow: 0 10px 24px rgba(4, 22, 77, .045);
}

.courses-prices-redesign .cp-package-featured {
    border: 2px solid var(--cp-blue);
    box-shadow: 0 16px 34px rgba(7, 132, 248, .16);
}

.courses-prices-redesign .cp-package-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    padding: 6px 16px;
    border-radius: 20px;
    background: var(--cp-blue);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    transform: translateX(-50%);
    white-space: nowrap;
}

.courses-prices-redesign .cp-package-icon {
    display: flex;
    width: 56px;
    height: 56px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--cp-accent) 14%, white);
    color: var(--cp-accent);
    font-size: 23px;
}

.courses-prices-redesign .cp-package-card h3 {
    margin: 0;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.25;
}

.courses-prices-redesign .cp-package-desc {
    max-width: 220px;
    margin: 8px 0 0;
    color: var(--cp-muted);
    font-size: 13px;
    line-height: 1.5;
}

.courses-prices-redesign .cp-package-card .cp-card-rule {
    width: 40px;
    margin-inline: auto;
    margin-top: 18px;
}

.courses-prices-redesign .cp-package-hours {
    margin: 16px 0 8px;
    color: var(--cp-navy);
    font-size: 15px;
    font-weight: 800;
}

.courses-prices-redesign .cp-package-compare {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0 0 8px;
}

.courses-prices-redesign .cp-package-was {
    color: var(--cp-muted);
    font-size: 15px;
    text-decoration: line-through;
    text-decoration-color: var(--cp-muted);
}

.courses-prices-redesign .cp-package-offer {
    display: inline-block;
    margin: 0 0 8px;
    padding: 3px 12px;
    border-radius: 20px;
    background: #eafbe9;
    color: var(--cp-green);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.courses-prices-redesign .cp-package-compare .cp-package-offer { margin: 0; }

.courses-prices-redesign .cp-package-price {
    margin: 4px 0 0;
    color: var(--cp-pink);
    font-size: 32px;
    font-weight: 800;
    line-height: 1.1;
}

.courses-prices-redesign .cp-package-price-muted {
    color: var(--cp-muted);
    font-size: 18px;
}

.courses-prices-redesign .cp-package-per-hour {
    margin: 4px 0 0;
    color: var(--cp-muted);
    font-size: 13px;
    font-weight: 600;
}

.courses-prices-redesign .cp-package-card .cp-button {
    align-self: stretch;
    width: 100%;
    margin-top: 20px;
    padding: 11px 20px;
}

/* Student reviews */
.courses-prices-redesign .cp-review-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: 46px;
}

.courses-prices-redesign .cp-review-card {
    padding: 34px 30px 30px;
    border: 1px solid var(--cp-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(4, 22, 77, .05);
}

.courses-prices-redesign .cp-review-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.courses-prices-redesign .cp-review-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px var(--cp-line);
}

.courses-prices-redesign .cp-review-stars { display: inline-flex; gap: 3px; color: var(--cp-accent); font-size: 16px; }
.courses-prices-redesign .cp-review-stars .is-empty { color: #e2e3e8; }

.courses-prices-redesign .cp-review-card blockquote {
    margin: 0 0 20px;
    color: var(--cp-text);
    font-size: 15px;
    font-style: italic;
    line-height: 1.65;
}

.courses-prices-redesign .cp-review-author {
    padding-top: 16px;
    border-top: 1px solid var(--cp-line);
    margin: 0;
    color: var(--cp-navy);
    font-size: 15px;
    font-weight: 800;
}

/* Why learn grid */
.courses-prices-redesign .cp-why-learn { padding-top: 30px; }

.courses-prices-redesign .cp-why-learn-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 24px;
    margin-top: 40px;
}

.courses-prices-redesign .cp-why-learn-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    padding: 32px 22px 28px;
    border: 1px solid var(--cp-line);
    border-radius: 16px;
    background: #fff;
    text-align: center;
    box-shadow: 0 10px 24px rgba(4, 22, 77, .045);
    transition: transform .2s ease, box-shadow .2s ease;
}

.courses-prices-redesign .cp-why-learn-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(4, 22, 77, .09);
}

.courses-prices-redesign .cp-why-learn-icon {
    display: flex;
    width: 68px;
    height: 68px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--cp-accent) 13%, white);
    color: var(--cp-accent);
    font-size: 26px;
}

.courses-prices-redesign .cp-why-learn-card h3 {
    display: flex;
    align-items: center;
    min-height: 42px;
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
}

.courses-prices-redesign .cp-why-learn-card .cp-card-rule { margin-inline: auto; }

.courses-prices-redesign .cp-why-learn-card p {
    margin: 0;
    color: var(--cp-muted);
    font-size: 13px;
    line-height: 1.55;
}

/* Instructors */
.courses-prices-redesign .cp-instructors-panel {
    padding: 30px;
    border: 1px solid var(--cp-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(4, 22, 77, .055);
}

.courses-prices-redesign .cp-instructors-heading h2 { font-size: 26px; }
.courses-prices-redesign .cp-instructors-heading .cp-card-rule { --cp-accent: var(--cp-pink); }

.courses-prices-redesign .cp-instructor-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-top: 20px;
}

.courses-prices-redesign .cp-instructor-card {
    --cp-grad-start: #2b2f7e;
    --cp-grad-end: #7c3aed;
    position: relative;
    display: flex;
    width: 100%;
    min-width: 0;
    gap: 16px;
    padding: 22px;
    border: 1px solid var(--cp-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(4, 22, 77, .05);
}

.courses-prices-redesign .cp-instructor-card.cp-accent-2 { --cp-grad-start: #ef4444; --cp-grad-end: #fb923c; }
.courses-prices-redesign .cp-instructor-card.cp-accent-3 { --cp-grad-start: #14b8a6; --cp-grad-end: #22c55e; }

.courses-prices-redesign .cp-instructor-avatar {
    width: 84px;
    height: 84px;
    flex: 0 0 auto;
    border-radius: 50%;
    overflow: hidden;
    background: #eef0f4;
}

.courses-prices-redesign .cp-instructor-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.courses-prices-redesign .cp-instructor-body { min-width: 0; flex: 1 1 auto; }

.courses-prices-redesign .cp-instructor-body h3 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    color: var(--cp-navy);
    font-size: 17px;
    font-weight: 800;
}

.courses-prices-redesign .cp-instructor-tag {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 20px;
    background: #e8f0ff;
    color: #2f6fed;
    font-size: 11px;
    font-weight: 700;
}

.courses-prices-redesign .cp-instructor-meta {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 8px;
    color: var(--cp-muted);
    font-size: 13px;
}

.courses-prices-redesign .cp-instructor-meta i { width: 14px; color: var(--cp-muted); text-align: center; }

.courses-prices-redesign .cp-instructor-footer {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.courses-prices-redesign .cp-instructor-rating {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 5px;
    padding: 8px 14px;
    border-radius: 20px;
    background: linear-gradient(90deg, var(--cp-grad-start), var(--cp-grad-end));
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.courses-prices-redesign .cp-instructor-rating i { color: var(--cp-yellow); }

.courses-prices-redesign .cp-instructor-book {
    display: inline-flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 0;
    margin: 0;
    padding: 9px 16px;
    border-radius: 20px;
    background: linear-gradient(90deg, var(--cp-grad-start), var(--cp-grad-end));
    box-shadow: none;
    font-size: 13px;
    white-space: nowrap;
}

/* Add-ons + why choose panel */
.courses-prices-redesign .cp-extras { padding-bottom: 34px; }

.courses-prices-redesign .cp-extras-panel {
    padding: 34px;
    border: 1px solid var(--cp-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(4, 22, 77, .05);
}

.courses-prices-redesign .cp-panel-label {
    margin: 0 0 22px;
    color: var(--cp-navy);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.courses-prices-redesign .cp-panel-label-centred {
    text-align: center;
}

.courses-prices-redesign .cp-addons-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
}

.courses-prices-redesign .cp-addon-card {
    padding: 4px 22px;
    border-right: 1px solid var(--cp-line);
    text-align: left;
}

.courses-prices-redesign .cp-addon-card:first-child { padding-left: 2px; }
.courses-prices-redesign .cp-addon-card:last-child { padding-right: 2px; border-right: 0; }

.courses-prices-redesign .cp-addon-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    border-radius: 50%;
    background: #f4e9fc;
    color: var(--cp-purple);
    font-size: 21px;
}

.courses-prices-redesign .cp-addon-card h3 {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.courses-prices-redesign .cp-addon-card p {
    margin: 0 0 6px;
    color: var(--cp-muted);
    font-size: 13px;
    line-height: 1.5;
}

.courses-prices-redesign .cp-panel-divider {
    display: block;
    margin: 30px 0;
    border-top: 1px solid var(--cp-line);
}

.courses-prices-redesign .cp-why-choose-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 20px 16px;
    margin-top: 24px;
}

.courses-prices-redesign .cp-why-choose-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.courses-prices-redesign .cp-why-choose-icon {
    display: flex;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--cp-accent) 13%, white);
    color: var(--cp-accent);
    font-size: 16px;
}

.courses-prices-redesign .cp-why-choose-card h3 {
    margin: 0;
    color: var(--cp-navy);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .01em;
    line-height: 1.3;
    text-transform: uppercase;
}

.courses-prices-redesign .cp-why-choose-card p {
    margin: 0;
    color: var(--cp-muted);
    font-size: 12px;
    line-height: 1.5;
}

/* Guarantee banner */
.courses-prices-redesign .cp-guarantee {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 30px;
    padding: 28px 32px;
    border: 1px solid #d6efd4;
    border-radius: 18px;
    background: #f2fbf1;
}

.courses-prices-redesign .cp-guarantee-icon {
    display: flex;
    flex: 0 0 auto;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff;
    color: var(--cp-green);
    font-size: 26px;
}

.courses-prices-redesign .cp-guarantee-copy { flex: 1 1 auto; min-width: 0; }

.courses-prices-redesign .cp-guarantee-copy h3 {
    margin: 0 0 6px;
    color: var(--cp-green);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.courses-prices-redesign .cp-guarantee-copy p {
    margin: 0;
    color: var(--cp-text);
    font-size: 14px;
    line-height: 1.5;
}

.courses-prices-redesign .cp-guarantee .cp-button { flex: 0 0 auto; margin-top: 0; }

/* FAQ — identical presentation to the Beginner Course page's FAQ accordion */
.courses-prices-redesign .cp-faqs {
    padding: 86px 0 94px;
    background: rgba(255, 249, 246, .56);
}

.courses-prices-redesign .cp-faq-list {
    width: min(100%, 1160px);
    margin: 34px auto 0;
}

.courses-prices-redesign .cp-faq-item {
    --cp-faq-accent: var(--cp-orange);
    position: relative;
    margin-bottom: 14px;
    overflow: hidden;
    border: 1px solid #e4e4e8;
    border-radius: 11px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 8px 22px rgba(4, 22, 77, .05);
}

.courses-prices-redesign .cp-faq-accent-1 { --cp-faq-accent: var(--cp-pink); }
.courses-prices-redesign .cp-faq-accent-2 { --cp-faq-accent: var(--cp-cyan); }
.courses-prices-redesign .cp-faq-accent-3 { --cp-faq-accent: var(--cp-yellow); }
.courses-prices-redesign .cp-faq-accent-4 { --cp-faq-accent: #66ce44; }
.courses-prices-redesign .cp-faq-accent-5 { --cp-faq-accent: #f458a2; }

.courses-prices-redesign .cp-faq-item::before {
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 26px;
    width: 6px;
    border-radius: 8px;
    content: "";
    background: var(--cp-faq-accent);
}

.courses-prices-redesign .cp-faq-item h3 { margin: 0; }

.courses-prices-redesign .cp-faq-question {
    display: flex;
    width: 100%;
    min-height: 88px;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 20px 34px 20px 72px;
    border: 0;
    background: transparent;
    color: var(--cp-text);
    font-family: inherit;
    font-size: 20px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.courses-prices-redesign .cp-faq-question i { flex: 0 0 auto; transition: transform .2s ease; }
.courses-prices-redesign .cp-faq-question[aria-expanded="true"] i { transform: rotate(180deg); }

.courses-prices-redesign .cp-faq-answer {
    padding: 0 72px 25px;
    color: var(--cp-muted);
}

.courses-prices-redesign .cp-faq-answer p:last-child { margin-bottom: 0; }

/* Responsive */
@media (max-width: 1180px) {
    .courses-prices-redesign .cp-hero-grid { grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr); }
    .courses-prices-redesign .cp-package-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .courses-prices-redesign .cp-why-learn-grid,
    .courses-prices-redesign .cp-why-choose-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .courses-prices-redesign .cp-addons-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .courses-prices-redesign .cp-addon-card:nth-child(2n) { border-right: 0; }
    .courses-prices-redesign .cp-addon-card:nth-child(-n+2) { padding-bottom: 20px; border-bottom: 1px solid var(--cp-line); }
    .courses-prices-redesign .cp-addon-card:nth-child(n+3) { padding-top: 20px; }
    .courses-prices-redesign .cp-instructor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .courses-prices-redesign .cp-review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
    .courses-prices-redesign .cp-main .container { width: min(100% - 40px, 900px); }
    .courses-prices-redesign .cp-section { padding: 62px 0; }
    .courses-prices-redesign .cp-packages { padding-top: 76px; }

    .courses-prices-redesign .cp-hero-grid { grid-template-columns: 1fr; gap: 32px; padding-bottom: 60px; }
    .courses-prices-redesign .cp-hero-copy { max-width: 640px; }
    .courses-prices-redesign .cp-hero-visual { width: min(100%, 640px); margin-inline: auto; }

    .courses-prices-redesign .cp-instructor-grid,
    .courses-prices-redesign .cp-review-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .courses-prices-redesign .cp-main .container { width: min(100% - 30px, 660px); }
    .courses-prices-redesign .cp-section { padding: 50px 0; }
    .courses-prices-redesign .cp-packages { padding-top: 60px; }

    .courses-prices-redesign .cp-hero { padding-top: 32px; }
    .courses-prices-redesign .cp-hero h1 { font-size: clamp(32px, 10vw, 44px); }
    .courses-prices-redesign .cp-hero-line-outline { -webkit-text-stroke-width: 1px; }

    .courses-prices-redesign .cp-instructor-search {
        grid-template-columns: 1fr;
        border-radius: 16px;
    }
    .courses-prices-redesign .cp-search-field { border-right: 0; border-bottom: 1px solid var(--cp-line); }
    .courses-prices-redesign .cp-search-submit { margin-top: 4px; }

    .courses-prices-redesign .cp-package-grid { grid-template-columns: 1fr; }
    .courses-prices-redesign .cp-why-learn-grid,
    .courses-prices-redesign .cp-why-choose-grid,
    .courses-prices-redesign .cp-addons-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .courses-prices-redesign .cp-addon-card:nth-child(2n) { border-right: 0; }
    .courses-prices-redesign .cp-addon-card:nth-child(-n+2) { padding-bottom: 20px; border-bottom: 1px solid var(--cp-line); }
    .courses-prices-redesign .cp-addon-card:nth-child(n+3) { padding-top: 20px; }

    .courses-prices-redesign .cp-instructors-panel,
    .courses-prices-redesign .cp-extras-panel { padding: 22px; border-radius: 16px; }

    .courses-prices-redesign .cp-guarantee { flex-direction: column; text-align: center; padding: 26px; }
    .courses-prices-redesign .cp-guarantee .cp-button { width: 100%; }

    .courses-prices-redesign .cp-faq-question {
        min-height: 72px;
        padding: 16px 20px 16px 50px;
        font-size: 16px;
    }
    .courses-prices-redesign .cp-faq-item::before { left: 16px; }
    .courses-prices-redesign .cp-faq-answer { padding: 0 20px 22px 50px; }
}

@media (max-width: 480px) {
    .courses-prices-redesign .cp-why-learn-grid,
    .courses-prices-redesign .cp-why-choose-grid,
    .courses-prices-redesign .cp-addons-grid { grid-template-columns: 1fr; }
    .courses-prices-redesign .cp-addon-card {
        padding: 20px 4px;
        border-right: 0;
        border-bottom: 1px solid var(--cp-line);
    }
    .courses-prices-redesign .cp-addon-card:first-child { padding-top: 0; }
    .courses-prices-redesign .cp-addon-card:last-child { padding-bottom: 0; border-bottom: 0; }
    .courses-prices-redesign .cp-instructors-panel { padding: 14px; }
    .courses-prices-redesign .cp-instructor-card { gap: 12px; padding: 14px; }
    .courses-prices-redesign .cp-instructor-avatar { width: 58px; height: 58px; }
    .courses-prices-redesign .cp-instructor-body h3 { gap: 5px; font-size: 15px; }
    .courses-prices-redesign .cp-instructor-meta { overflow-wrap: anywhere; font-size: 12px; }
    .courses-prices-redesign .cp-instructor-footer { flex-direction: column; align-items: stretch; }
    .courses-prices-redesign .cp-instructor-rating { justify-content: center; }
    .courses-prices-redesign .cp-instructor-book {
        width: 100%;
        padding-inline: 8px;
        font-size: 12px;
        white-space: normal;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .courses-prices-redesign .cp-main *,
    .courses-prices-redesign .cp-main *::before,
    .courses-prices-redesign .cp-main *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}