/* CRE free-lesson series + Black Friday sale blocks (inc/cre-lessons.php). Class prefix cjpt-cl-.
   Fonts: Josefin Sans headings, Open Sans body. Ink #222, muted #555, teal text #1E7F8C, button #56C6D6 / #141414, panel #F3F8F9. */

.cjpt-cl-nav, .cjpt-cl-eyebrow, .cjpt-cl-pn, .cjpt-cl-list, .cjpt-cl-grid-wrap, .cjpt-cl-course-wrap {
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
	color: #222;
	box-sizing: border-box;
}
.cjpt-cl-nav *, .cjpt-cl-pn *, .cjpt-cl-list *, .cjpt-cl-grid-wrap *, .cjpt-cl-course-wrap * * { box-sizing: border-box; }
[hidden].cjpt-cl-course { display: none !important; }

/* Button */
.cjpt-cl-btn.cjpt-cl-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 48px; padding: 12px 24px;
	background: #56C6D6; color: #141414 !important;
	font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 16px; line-height: 1; letter-spacing: 0.02em;
	text-decoration: none !important; border: 0; border-radius: 0;
	transition: background-color .15s ease;
}
.cjpt-cl-btn.cjpt-cl-btn:hover, .cjpt-cl-btn.cjpt-cl-btn:focus-visible { background: #7AD3DF; }
.cjpt-cl-btn.cjpt-cl-btn:focus-visible { outline: 2px solid #141414; outline-offset: 2px; }
.cjpt-cl-btn--sm { min-height: 44px; padding: 10px 18px; font-size: 15px; }

/* ---------------------------------------------------------------- Lesson breadcrumb */
.cjpt-cl-nav { display: block; max-width: 760px; margin: 24px auto 36px; padding: 0; text-align: left; font-size: 14px; }
@media (max-width: 767px) { .cjpt-cl-nav { margin: 12px auto 28px; } }
.cjpt-cl-nav__all.cjpt-cl-nav__all {
	display: inline-block; box-sizing: border-box; cursor: pointer;
	color: #1E7F8C; font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 600; line-height: 1.4; text-decoration: none;
}
.cjpt-cl-nav__all.cjpt-cl-nav__all:hover { text-decoration: underline; }

/* ---------------------------------------------------------------- Eyebrow */
.cjpt-cl-eyebrow {
	display: inline-block; color: #1E7F8C; font-weight: 700; font-size: 17px; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase;
}
@media (max-width: 767px) { .cjpt-cl-eyebrow { font-size: 14px; } }

/* ---------------------------------------------------------------- Prev / next */
.cjpt-cl-pn { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cjpt-cl-pn__card.cjpt-cl-pn__card {
	display: flex; flex-direction: column; gap: 6px; min-height: 44px;
	padding: 18px 20px; background: #FFFFFF; color: #222; text-decoration: none; box-sizing: border-box; cursor: pointer;
	border: 1px solid #CFDCDF;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.cjpt-cl-pn__card.cjpt-cl-pn__card:hover, .cjpt-cl-pn__card.cjpt-cl-pn__card:focus-visible { border-color: #56C6D6; box-shadow: inset 0 -3px 0 #56C6D6; }
.cjpt-cl-pn__card.cjpt-cl-pn__card.is-next { text-align: right; align-items: flex-end; }
.cjpt-cl-pn__kicker { color: #1E7F8C; font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; }
.cjpt-cl-pn__title { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 18px; line-height: 1.25; color: #222; }
.cjpt-cl-pn__card.cjpt-cl-pn__card.is-hub .cjpt-cl-pn__title { font-weight: 500; }
@media (max-width: 600px) {
	.cjpt-cl-pn { grid-template-columns: 1fr; gap: 10px; }
	.cjpt-cl-pn__card.cjpt-cl-pn__card.is-next { text-align: left; align-items: flex-start; }
}

/* ---------------------------------------------------------------- Lesson list */
.cjpt-cl-list { max-width: 760px; margin: 0 auto; }
.cjpt-cl-list__h { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 28px; line-height: 1.2; color: #222; letter-spacing: 0; margin: 0 0 20px; }
.cjpt-cl-list__rows { list-style: none; margin: 0; padding: 0; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 6px 20px rgba(0,0,0,.05); }
.cjpt-cl-list__row { margin: 0; padding: 0; border-top: 1px solid #EEF1F2; }
.cjpt-cl-list__row:first-child { border-top: 0; }
.cjpt-cl-list__link.cjpt-cl-list__link, .cjpt-cl-list__row.is-current { display: flex; align-items: center; gap: 18px; padding: 14px 18px; color: #222; text-decoration: none; background: #fff; transition: background .15s ease; }
.cjpt-cl-list__row.is-current { background: #E4F5F8; }
.cjpt-cl-list__link.cjpt-cl-list__link:hover, .cjpt-cl-list__link.cjpt-cl-list__link:focus-visible { background: #F5FAFB; }
.cjpt-cl-list__link.cjpt-cl-list__link:focus-visible { outline: 3px solid #56C6D6; outline-offset: -3px; }
.cjpt-cl-list__media { position: relative; display: block; flex: 0 0 136px; width: 136px; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #E3E8EA; }
.cjpt-cl-list__thumb { display: block; width: 100%; height: 100%; object-fit: cover; }
.cjpt-cl-list__play { position: absolute; top: 50%; left: 50%; width: 32px; height: 32px; margin: -16px 0 0 -16px; border-radius: 50%; background: #56C6D6; display: flex; align-items: center; justify-content: center; opacity: 0; box-shadow: 0 2px 8px rgba(0,0,0,.25); transition: opacity .15s ease; }
.cjpt-cl-list__play svg { display: block; margin-left: 2px; }
.cjpt-cl-list__link.cjpt-cl-list__link:hover .cjpt-cl-list__play, .cjpt-cl-list__link.cjpt-cl-list__link:focus-visible .cjpt-cl-list__play { opacity: 1; }
.cjpt-cl-list__time { position: absolute; right: 6px; bottom: 6px; padding: 2px 6px; border-radius: 4px; background: rgba(20,20,20,.75); color: #fff; font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 11px; font-weight: 600; line-height: 1.3; letter-spacing: 0; }
.cjpt-cl-list__text { display: flex; flex-direction: column; gap: 4px; flex: 1 1 auto; min-width: 0; }
.cjpt-cl-list__eyebrow { font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 600; line-height: 1.4; color: #1E7F8C; letter-spacing: 0; text-transform: none; }
.cjpt-cl-list__title { font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 16px; font-weight: 600; line-height: 1.35; color: #222; letter-spacing: 0; text-transform: none; transition: color .15s ease; }
.cjpt-cl-list__link.cjpt-cl-list__link:hover .cjpt-cl-list__title, .cjpt-cl-list__link.cjpt-cl-list__link:focus-visible .cjpt-cl-list__title { color: #1E7F8C; }
.cjpt-cl-list__tag { display: inline-block; align-self: flex-start; margin: 0 0 4px; font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1.3; white-space: nowrap; letter-spacing: 0; }
.cjpt-cl-list__tag--now { font-weight: 700; color: #fff; background: #006977; border-radius: 999px; padding: 3px 10px; }
.cjpt-cl-list__tag--next { font-weight: 700; color: #006977; background: #E4F5F8; border-radius: 999px; padding: 3px 10px; }
@media (max-width: 600px) {
	.cjpt-cl-list__h { font-size: 24px; }
	.cjpt-cl-list__link.cjpt-cl-list__link, .cjpt-cl-list__row.is-current { gap: 12px; padding: 12px 14px; }
	.cjpt-cl-list__media { flex-basis: 104px; width: 104px; }
	.cjpt-cl-list__text { flex: 1 1 0; }
	.cjpt-cl-list__title { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .cjpt-cl-list__play, .cjpt-cl-list__link, .cjpt-cl-list__title { transition: none !important; } }

/* ---------------------------------------------------------------- Card grid */
.cjpt-cl-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 36px 32px; }
.cjpt-cl-card { margin: 0; padding: 0; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 6px 20px rgba(0,0,0,.05); transition: transform .2s ease, box-shadow .2s ease; }
.cjpt-cl-card:hover, .cjpt-cl-card:focus-within { transform: translateY(-3px); box-shadow: 0 2px 6px rgba(0,0,0,.08), 0 12px 28px rgba(0,0,0,.10); }
.cjpt-cl-card__link.cjpt-cl-card__link { display: flex; flex-direction: column; height: 100%; color: #222; text-decoration: none; background: #fff; }
.cjpt-cl-card__link.cjpt-cl-card__link:focus-visible { outline: 3px solid #56C6D6; outline-offset: 3px; border-radius: 8px; }
.cjpt-cl-card__media { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #E3E8EA; }
.cjpt-cl-card__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.cjpt-cl-card__link.cjpt-cl-card__link:hover .cjpt-cl-card__img { transform: scale(1.03); }
.cjpt-cl-card__play { position: absolute; top: 50%; left: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: #56C6D6; display: flex; align-items: center; justify-content: center; opacity: .9; box-shadow: 0 2px 10px rgba(0,0,0,.25); transition: opacity .2s ease, transform .2s ease; }
.cjpt-cl-card__play svg { display: block; margin-left: 3px; }
.cjpt-cl-card__link.cjpt-cl-card__link:hover .cjpt-cl-card__play, .cjpt-cl-card__link.cjpt-cl-card__link:focus-visible .cjpt-cl-card__play { opacity: 1; transform: scale(1.06); }
.cjpt-cl-card__time { position: absolute; right: 10px; bottom: 10px; padding: 3px 7px; border-radius: 4px; background: rgba(20,20,20,.75); color: #fff; font-family: "Open Sans", Helvetica, Arial, sans-serif; letter-spacing: 0; text-transform: none; font-size: 12px; font-weight: 600; line-height: 1.2; }
.cjpt-cl-card__body { display: flex; flex-direction: column; gap: 8px; padding: 20px 22px 24px; }
.cjpt-cl-card__eyebrow { color: #1E7F8C; font-family: "Open Sans", Helvetica, Arial, sans-serif; letter-spacing: 0; text-transform: none; font-weight: 600; font-size: 13px; line-height: 1.4; }
.cjpt-cl-card__title { font-family: "Open Sans", Helvetica, Arial, sans-serif; letter-spacing: 0; text-transform: none; font-weight: 600; font-size: 17px; line-height: 1.4; color: #222; }
.cjpt-cl-card__link.cjpt-cl-card__link:hover .cjpt-cl-card__title { color: #1E7F8C; }
.cjpt-cl-card__line { font-family: "Open Sans", Helvetica, Arial, sans-serif; letter-spacing: 0; text-transform: none; font-size: 15px; line-height: 1.55; color: #555; }
@media (max-width: 400px) {
	.cjpt-cl-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .cjpt-cl-card, .cjpt-cl-card__img, .cjpt-cl-card__play { transition: none; } .cjpt-cl-card:hover, .cjpt-cl-card:focus-within { transform: none; } }

/* ---------------------------------------------------------------- Course block
   Matches the Clinical Running Essentials sales-page hero: #F4F4F4 band, #08C0D4 eyebrow, #006977 Josefin title, square #56C6D6 button.
   Centered 1140px container (.__in). Top row: text | laptop+phone image; reviews row below. */
.cjpt-cl-course { background: #F4F4F4; color: #222; }
.cjpt-cl-course__in { max-width: 1140px; margin: 0 auto; padding: 72px 24px; box-sizing: border-box; }
.cjpt-cl-course__top { display: flex; align-items: center; gap: 56px; }
.cjpt-cl-course__info { flex: 1 1 0; min-width: 0; }
.cjpt-cl-course__media { flex: 1 1 0; min-width: 0; }
.cjpt-cl-course__media img { display: block; width: 100%; max-width: 520px; height: auto; margin: 0 auto; }
.cjpt-cl-course__eyebrow { display: block; color: #08C0D4; font-size: 18px; line-height: 1.4; letter-spacing: 0.36px; margin: 0 0 8px; }
.cjpt-cl-course__h { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 44px; line-height: 1.1; letter-spacing: 0.32px; color: #006977; margin: 0 0 18px; padding: 0; }
.cjpt-cl-course__by { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; font-size: 16px; line-height: 24px; color: #666; }
.cjpt-cl-course__by img { width: 32px; height: 32px; border-radius: 50%; display: block; flex: 0 0 auto; }
.cjpt-cl-course__tag { margin: 0 0 26px; max-width: 520px; font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 20px; line-height: 1.35; letter-spacing: 0.2px; color: #333; }
.cjpt-cl-course__buy { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 18px; }
.cjpt-cl-course__note { font-size: 15px; line-height: 1.4; color: #666; }
.cjpt-cl-course .cjpt-cl-btn.cjpt-cl-btn { min-height: 50px; padding: 17px 28px; font-size: 14px; letter-spacing: 1.96px; text-transform: uppercase; color: #262626 !important; }
.cjpt-cl-course .cjpt-cl-btn.cjpt-cl-btn:hover, .cjpt-cl-course .cjpt-cl-btn.cjpt-cl-btn:focus-visible { background: #3FB4C5; }
.cjpt-cl-course__reviews { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 48px; }
.cjpt-cl-review { margin: 0; padding: 24px; border: 0; background: #fff; }
.cjpt-cl-review p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; color: #222; font-style: normal; }
.cjpt-cl-review__stars { display: flex; gap: 2px; margin: 0 0 10px; line-height: 0; }
.cjpt-cl-review footer { font-size: 13px; line-height: 1.4; color: #555; font-weight: 600; }
.cjpt-cl-review footer::before { content: "— "; }

@media (max-width: 899px) {
	.cjpt-cl-course__top { flex-direction: column; align-items: stretch; gap: 32px; }
	.cjpt-cl-course__media img { max-width: 440px; }
}
@media (max-width: 640px) {
	.cjpt-cl-course__in { padding: 56px 20px; }
	.cjpt-cl-course__h { font-size: 32px; }
	.cjpt-cl-course__tag { font-size: 18px; }
	.cjpt-cl-course__reviews { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; }
	.cjpt-cl-course__buy .cjpt-cl-btn.cjpt-cl-btn { width: 100%; }
}

/* Elementor V4 paragraphs reset every descendant link (.e-paragraph-base a { all: unset }, specificity 0,1,1): the anchor
   selectors above are doubled (.x.x = 0,2,0) to outrank it, and the box model those links lose is restored here. */
.cjpt-cl-btn.cjpt-cl-btn, .cjpt-cl-nav__all.cjpt-cl-nav__all, .cjpt-cl-nav__num.cjpt-cl-nav__num, .cjpt-cl-pn__card.cjpt-cl-pn__card, .cjpt-cl-list__link.cjpt-cl-list__link,
.cjpt-cl-card__link.cjpt-cl-card__link {
	box-sizing: border-box; cursor: pointer;
}
.cjpt-cl-nav__all.cjpt-cl-nav__all, .cjpt-cl-pn__card.cjpt-cl-pn__card, .cjpt-cl-list__link.cjpt-cl-list__link, .cjpt-cl-card__link.cjpt-cl-card__link { font-size: inherit; line-height: inherit; }

/* Theme / Elementor content rules underline every link; these blocks carry their own affordances. */
.cjpt-cl-nav a, .cjpt-cl-pn a, .cjpt-cl-list a, .cjpt-cl-grid-wrap a, .cjpt-cl-course-wrap a { text-decoration: none !important; }
.cjpt-cl-nav__all.cjpt-cl-nav__all:hover { text-decoration: underline !important; }

/* ================================================================================================================
   SALE KIT (Black Friday Cyber Monday), class prefix cjpt-sk-. Round 8: six placements, one design for the whole sale.
   Type hierarchy on the site's own scale (H1 50px / 1.1, H2 36px, Josefin Sans bold): TITLE "Black Friday Cyber Monday"
   (1.4 x H1) > H1 course name and "Sale ends in" > H2 price "$795 $650 ($145 off)" and the end line.
   Palette: black #141414, lime #C3E800 (tile labels and hairlines only; text on black is white), the teals (#006977, #56C6D6, #E4F5F8).
   Placements: the black SALE HEADER (.cjpt-sk-hero: home, sales page, excerpt pages, hub), the home CRE card (.cjpt-cl-hcard),
   the sales-page buy box (.cjpt-sk-pb), the course block on excerpt pages (.cjpt-sk-cblock), the cart / checkout line
   (.cjpt-sk-notice). THE countdown: tiles (s / m / l / xl), black with white numerals and lime labels on light grounds,
   white with black numerals in the black header.
   Every styled <a> uses a doubled class (.x.x) to outrank Elementor V4's ".e-paragraph-base a { all: unset }".
   ================================================================================================================ */
[data-cjpt-bfcm][hidden] { display: none !important; }

.cjpt-sk-hero, .cjpt-sk-pb, .cjpt-sk-cblock, .cjpt-sk-notice {
	font-family: "Open Sans", Helvetica, Arial, sans-serif; font-size: 16px; line-height: 1.5; font-weight: 400; letter-spacing: 0; text-transform: none; text-align: left;
	color: #333; box-sizing: border-box;
}
.cjpt-sk-hero *, .cjpt-sk-pb *, .cjpt-sk-cblock *, .cjpt-sk-notice * { box-sizing: border-box; }
.cjpt-sk-nb { white-space: nowrap; }

/* ---- the countdown tiles ---- */
.cjpt-sk-cd { display: inline-flex; align-items: stretch; gap: var(--g); vertical-align: middle; flex: none; line-height: 1; }
.cjpt-sk-cd__u { display: flex; flex-direction: column; align-items: center; justify-content: center; width: var(--w); padding: var(--pt) 0 var(--pb); background: #141414; border: 0; }
.cjpt-sk-cd__u[hidden] { display: none; }
.cjpt-sk-cd__u b { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--fs); line-height: 1; letter-spacing: 0; color: #fff; font-variant-numeric: tabular-nums; }
.cjpt-sk-cd__u i { font-style: normal; font-family: "Open Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--ls); line-height: 1; letter-spacing: .05em; text-indent: .05em; text-transform: uppercase; white-space: nowrap; color: #fff; margin-top: var(--lg); }
/* labels: Days / Hours / Minutes / Seconds as big as the tile allows; the small tiles (s) use Min / Sec */
.cjpt-sk-cd__ls { display: none; }
.cjpt-sk-cd--s .cjpt-sk-cd__lf { display: none; }
.cjpt-sk-cd--s .cjpt-sk-cd__ls { display: inline; }
.cjpt-sk-cd--s { --fs: 20px; --w: 48px; --ls: 10.5px; --pt: 8px; --pb: 7px; --lg: 3px; --g: 5px; }
.cjpt-sk-cd--m { --fs: 32px; --w: 78px; --ls: 12px; --pt: 14px; --pb: 11px; --lg: 5px; --g: 8px; }
.cjpt-sk-cd--l { --fs: 42px; --w: 96px; --ls: 14px; --pt: 17px; --pb: 14px; --lg: 6px; --g: 10px; }
.cjpt-sk-cd--xl { --fs: 64px; --w: 128px; --ls: 18px; --pt: 24px; --pb: 18px; --lg: 8px; --g: 12px; }

/* ---- shared parts: the type hierarchy. --t title, --h1, --h2 are set per placement. ---- */
.cjpt-sk-hero, .cjpt-sk-pb, .cjpt-sk-cblock { --t: 40px; --h1: 29px; --h2: 21px; }
.cjpt-sk-h.cjpt-sk-h { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--t); line-height: 1.08; letter-spacing: .3px; text-transform: none; color: #141414; margin: 0; padding: 0; }
.cjpt-sk-name { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--h1); line-height: 1.1; letter-spacing: .32px; color: #006977; margin: 0; padding: 0; }
.cjpt-sk-lead { display: block; text-align: center; font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 400; font-size: var(--h1); line-height: 1.1; letter-spacing: .32px; color: #141414; }
.cjpt-sk-deal { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--h2); line-height: 1.15; letter-spacing: .3px; color: #141414; margin: 0; padding: 0; }
.cjpt-sk-deal s, .cjpt-sk-pn s { text-decoration: line-through; text-decoration-thickness: .06em; color: #8a8a8a; font-weight: 500; }
.cjpt-sk-deal b, .cjpt-sk-pn b { font-weight: 700; color: #141414; }
.cjpt-sk-deal__off { font-weight: 700; color: #006977; }
.cjpt-sk-dead { display: block; font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: var(--h2); line-height: 1.15; letter-spacing: .3px; color: #141414; }
/* the clock block: "Sale ends in" centred over the tiles, the end line centred under them */
.cjpt-sk-clock { display: flex; flex-direction: column; align-items: center; text-align: center; gap: calc(var(--h2) * .55); max-width: 100%; }
.cjpt-sk-btn.cjpt-sk-btn {
	display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 17px 28px; background: #56C6D6; color: #262626 !important;
	font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 14px; line-height: 1; letter-spacing: 1.96px; text-transform: uppercase;
	border: 0; border-radius: 0; text-align: center; white-space: nowrap; text-decoration: none !important; flex: none; cursor: pointer; box-sizing: border-box; transition: background-color .15s ease;
}
.cjpt-sk-btn.cjpt-sk-btn:hover, .cjpt-sk-btn.cjpt-sk-btn:focus-visible { background: #3FB4C5; }
.cjpt-sk-btn.cjpt-sk-btn:focus-visible { outline: 2px solid #262626; outline-offset: 2px; }
/* the sale price inside an existing price note ("$795 $650") */
.cjpt-sk-pn b { font-weight: 700; }

/* ---- 1 THE SALE HEADER (home, sales page, excerpt pages, hub): one strong black block.
   Desktop: TITLE centred full width; below it course (H1) / price (H2) / button | "Sale ends in" (H1) / tiles / end line.
   Phones: four separate, centred blocks with the same generous gap and a hairline between them:
   title | course + price | Sale ends in + tiles + end line | button. ---- */
.cjpt-sk-hero { width: 100%; background: #141414; color: #fff; border-bottom: 4px solid #56C6D6; border-image: linear-gradient(90deg, #56C6D6 0%, #C3E800 100%) 1; --t: 70px; --h1: 50px; --h2: 36px; }
.cjpt-sk-hero__in { max-width: 1248px; margin: 0 auto; padding: 56px 24px 60px; }
.cjpt-sk-hero__h { text-align: center; margin-bottom: 48px; }
.cjpt-sk-hero__cols { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 64px; align-items: center; }
.cjpt-sk-hero__l, .cjpt-sk-hero__c { min-width: 0; }
.cjpt-sk-hero .cjpt-sk-h.cjpt-sk-h { color: #fff; line-height: 1.05; }
/* the title sits in a 3px teal-to-lime frame (the sale's signature) */
.cjpt-sk-hero .cjpt-sk-hero__h .cjpt-sk-h.cjpt-sk-h { display: inline-block; padding: .32em .6em .2em; border: 3px solid #56C6D6; border-image: linear-gradient(90deg, #56C6D6 0%, #C3E800 100%) 1; }
.cjpt-sk-hero .cjpt-sk-name { color: #fff; }
.cjpt-sk-hero .cjpt-sk-deal { color: #fff; margin-top: 18px; }
.cjpt-sk-hero .cjpt-sk-deal b { color: #fff; }
.cjpt-sk-hero .cjpt-sk-deal s { color: #9a9a9a; }
.cjpt-sk-hero .cjpt-sk-deal__off { color: #C3E800; }
.cjpt-sk-hero .cjpt-sk-lead { color: #fff; font-weight: 400; }
.cjpt-sk-hero .cjpt-sk-dead { color: #fff; font-weight: 400; font-size: calc(var(--h2) * .8); }
.cjpt-sk-hero__a { margin-top: 32px; }
.cjpt-sk-hero .cjpt-sk-cd__u { background: #fff; }
.cjpt-sk-hero .cjpt-sk-cd__u b { color: #141414; }
.cjpt-sk-hero .cjpt-sk-cd__u i { color: #141414; }
.cjpt-sk-hero .cjpt-sk-btn.cjpt-sk-btn { min-height: 58px; padding: 21px 44px; font-size: 16px; }
.cjpt-sk-hero .cjpt-sk-btn.cjpt-sk-btn:focus-visible { outline-color: #fff; }
@media (max-width: 1240px) {
	.cjpt-sk-hero { --t: 58px; --h1: 42px; --h2: 30px; }
	.cjpt-sk-cd--xl { --fs: 50px; --w: 104px; --ls: 14.5px; --pt: 20px; --pb: 15px; --g: 10px; }
	.cjpt-sk-hero__cols { column-gap: 40px; }
}
@media (max-width: 1000px) {
	.cjpt-sk-hero { --gap: 40px; }
	.cjpt-sk-hero__in { padding: var(--gap) 24px; }
	.cjpt-sk-hero__h { margin-bottom: 0; }
	.cjpt-sk-hero__cols { display: flex; flex-direction: column; align-items: stretch; text-align: center; }
	.cjpt-sk-hero__l { display: contents; }
	.cjpt-sk-hero__p, .cjpt-sk-hero__c, .cjpt-sk-hero__a { margin-top: var(--gap); padding-top: var(--gap); border-top: 2px solid #56C6D6; border-image: linear-gradient(90deg, #56C6D6 0%, #C3E800 100%) 1; }
	.cjpt-sk-hero .cjpt-sk-hero__h .cjpt-sk-h.cjpt-sk-h { display: block; padding: 0; border: 0; border-image: none; }
	.cjpt-sk-hero__p { order: 1; border-top: 0; position: relative; }
	.cjpt-sk-hero__c { order: 2; border-top: 0; position: relative; }
	.cjpt-sk-hero__p::before, .cjpt-sk-hero__c::before { content: ""; position: absolute; top: 0; left: 35%; width: 30%; height: 1px; background: linear-gradient(90deg, #56C6D6 0%, #C3E800 100%); }
	.cjpt-sk-hero__a { order: 3; border-top: 0; padding-top: 0; display: flex; justify-content: center; }
	.cjpt-sk-hero .cjpt-sk-deal { margin-top: 12px; }
}
@media (max-width: 640px) {
	.cjpt-sk-hero { --t: 46px; --h1: 33px; --h2: 24px; --gap: 34px; }
	.cjpt-sk-hero__in { padding: var(--gap) 20px; }
	.cjpt-sk-hero .cjpt-sk-deal { margin-top: 10px; }
	.cjpt-sk-hero .cjpt-sk-clock { align-items: stretch; gap: 14px; }
	.cjpt-sk-hero__c .cjpt-sk-cd { display: flex; }
	.cjpt-sk-hero__c .cjpt-sk-cd__u { flex: 1 1 0; width: auto; }
	.cjpt-sk-cd--xl { --fs: 44px; --ls: 12px; --pt: 16px; --pb: 12px; --lg: 6px; --g: 8px; }
	.cjpt-sk-hero__a .cjpt-sk-btn.cjpt-sk-btn { width: 100%; }
}
@media (max-width: 374px) { .cjpt-sk-hero { --t: 39px; --h1: 28px; --h2: 20.5px; } .cjpt-sk-cd--xl { --fs: 38px; --ls: 10.5px; } }

/* ---- 2 home, the "Clinical Running Essentials" card: its buy row in the course block's look ([cjpt_cre_card_buy]);
   during the sale "Sale ends in" + tiles above the button (.cjpt-sk-cblock) and the sale price beside it ---- */
.cjpt-cl-course.cjpt-cl-hcard { background: transparent; font-family: "Open Sans", Helvetica, Arial, sans-serif; color: #222; box-sizing: border-box; }
.cjpt-cl-hcard * { box-sizing: border-box; }
.cjpt-cl-hcard a { text-decoration: none !important; }

/* ---- 3 sales-page buy box (lower price card): "Sale ends in" + tiles + the sale price, above the page's own button ---- */
.cjpt-sk-pbwrap { display: block; width: 100%; text-align: center; }
.cjpt-sk-pb { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; width: 100%; margin: -36px auto 0; --h1: 30px; --h2: 34px; }
@media (max-width: 640px) {
	.cjpt-sk-pb { --h1: 26px; --h2: 28px; }
	.cjpt-sk-pb .cjpt-sk-clock { align-items: stretch; width: 100%; }
	.cjpt-sk-pb .cjpt-sk-cd { display: flex; width: 100%; }
	.cjpt-sk-pb .cjpt-sk-cd__u { flex: 1 1 0; width: auto; }
	.cjpt-sk-cd--l { --fs: 40px; --ls: 11.5px; --g: 8px; }
}

/* ---- 4 course block on excerpt pages: "Sale ends in" + tiles above its own "Learn more"; the sale price sits in the price note ---- */
.cjpt-sk-cblock { display: block; margin: 0 0 24px; --h1: 20px; }
.cjpt-sk-cblock .cjpt-sk-clock { display: inline-flex; align-items: center; text-align: center; gap: 10px; }
.cjpt-cl-course__note .cjpt-sk-pn { font-size: 18px; color: #333; }
@media (max-width: 640px) {
	.cjpt-sk-cblock .cjpt-sk-clock { display: flex; align-items: stretch; }
	.cjpt-sk-cblock .cjpt-sk-cd { display: flex; }
	.cjpt-sk-cblock .cjpt-sk-cd__u { flex: 1 1 0; width: auto; }
}

/* ---- 5 cart + checkout: a slim version of the sale header, no offer. Black, gradient line along the bottom.
   Desktop: one row, title left, "Sale ends in" centred over small white tiles right. Phones: centred, stacked. ---- */
.cjpt-sk-notice { background: #141414; color: #fff; border-bottom: 3px solid #56C6D6; border-image: linear-gradient(90deg, #56C6D6 0%, #C3E800 100%) 1; margin: 0; }
.cjpt-sk-notice__in { max-width: 1248px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 32px; padding: 16px 24px; }
.cjpt-sk-notice .cjpt-sk-notice__t { margin: 0; padding: 0; font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 28px; line-height: 1.1; letter-spacing: .3px; color: #fff; }
.cjpt-sk-notice__cd { display: flex; flex-direction: row; align-items: center; gap: 14px; flex: none; }
.cjpt-sk-notice .cjpt-sk-notice__l { font-size: 19px; }
.cjpt-sk-notice__l { font-family: "Josefin Sans", Helvetica, Arial, sans-serif; font-weight: 400; font-size: 16px; line-height: 1.1; color: #fff; white-space: nowrap; }
.cjpt-sk-notice .cjpt-sk-cd__u { background: #fff; }
.cjpt-sk-notice .cjpt-sk-cd__u b, .cjpt-sk-notice .cjpt-sk-cd__u i { color: #141414; }
@media (max-width: 640px) {
	.cjpt-sk-notice__in { flex-direction: column; align-items: stretch; text-align: center; gap: 12px; padding: 16px 16px 18px; }
	.cjpt-sk-notice .cjpt-sk-notice__t { font-size: 22px; }
	.cjpt-sk-notice__cd { flex-direction: column; align-items: stretch; gap: 7px; }
	.cjpt-sk-notice .cjpt-sk-notice__l { font-size: 16px; }
	.cjpt-sk-notice .cjpt-sk-cd { display: flex; width: 100%; }
	.cjpt-sk-notice .cjpt-sk-cd__u { flex: 1 1 0; width: auto; }
}