/* ==================================================================
   PASS THE MSRA — UPGRADED COURSE PAGE
   Self-contained styles for the [ptm_course_intro] sections (.ptmc-*)
   plus a defensive restyle of LearnDash's own course-content output.

   SCOPE: every LearnDash rule is prefixed with body.ptm-course-page,
   a class added only on singular upgraded courses (inc/ptm-course.php).
   It therefore cannot affect lessons, topics, quizzes, mock papers,
   dashboards, focus mode or anything else.

   Fonts + brand colours come from tokens.css. Dark mode keys off the
   site-wide html[data-ptm-theme="dark"] attribute. No @import, no
   external fonts.
   ================================================================== */

.ptm-course,
body.ptm-course-page {
	--c-navy:        var(--ptm-navy, #0B1F3A);
	--c-navy-light:  var(--ptm-navy-light, #16335C);
	--c-teal:        var(--ptm-teal, #00A896);
	--c-teal-dark:   var(--ptm-teal-dark, #02897A);
	--c-amber:       #E8A33D;
	--c-page:        #FBFCFE;
	--c-surface:     #FFFFFF;
	--c-surface-alt: #F6F8FB;
	--c-text:        #1A2433;
	--c-heading:     #0B1F3A;
	--c-muted:       #5B6675;
	--c-line:        #E3E8EF;
	--c-fh: var(--ptm-font-heading, "Playfair Display", Georgia, serif);
	--c-fb: var(--ptm-font-body, "DM Sans", system-ui, sans-serif);
	--c-r:  var(--ptm-radius, 12px);
	--c-rs: var(--ptm-radius-sm, 8px);
	--c-sh-sm: var(--ptm-shadow-sm, 0 1px 3px rgba(11,31,58,.08));
	--c-sh-md: var(--ptm-shadow-md, 0 8px 24px rgba(11,31,58,.10));
}
html[data-ptm-theme="dark"] .ptm-course,
html[data-ptm-theme="dark"] body.ptm-course-page {
	--c-page:        #0C1826;
	--c-surface:     #132437;
	--c-surface-alt: #0F1E2E;
	--c-text:        #D6E0EC;
	--c-heading:     #E7EEF6;
	--c-muted:       #9FB2C6;
	--c-line:        rgba(148,170,192,.22);
	--c-teal-dark:   #3FD0C0;
}

/* ---- base ---- */
.ptm-course{font-family:var(--c-fb);color:var(--c-text);line-height:1.6;}
.ptm-course *{box-sizing:border-box;}
.ptm-course h1,.ptm-course h2,.ptm-course h3{font-family:var(--c-fh);color:var(--c-heading);line-height:1.14;margin:0;letter-spacing:-.01em;}
.ptm-course a{color:var(--c-teal-dark);}
.ptm-course .ptmc-blk{padding:30px 0;}
.ptm-course .ptmc-head{display:flex;align-items:baseline;gap:12px;margin-bottom:18px;flex-wrap:wrap;}
.ptm-course .ptmc-head h2{font-size:clamp(1.5rem,2.7vw,2rem);font-weight:700;}
.ptmc-kicker{font-size:.72rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--c-teal-dark);}

/* ---- buttons (small) ---- */
.ptmc-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--c-fb);font-weight:600;text-decoration:none;padding:.65rem 1.15rem;font-size:.95rem;border-radius:var(--c-rs);border:1.5px solid transparent;transition:background .15s,color .15s,border-color .15s;cursor:pointer;}
.ptmc-btn--primary{background:var(--c-teal);color:#fff;}
.ptmc-btn--primary:hover{background:var(--c-teal-dark);color:#fff;}
.ptmc-tlink{font-weight:600;font-size:.92rem;text-decoration:none;color:var(--c-teal-dark);}
.ptmc-tlink:hover{text-decoration:underline;}

/* ---- HERO ---- */
.ptmc-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;padding:8px 0 4px;}
.ptmc-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--c-teal-dark);margin-bottom:13px;}
.ptmc-eyebrow svg{width:14px;height:14px;}
.ptmc-title{font-size:clamp(2.25rem,4vw,3.4rem);font-weight:800;margin-bottom:10px;}
.ptmc-sub{font-size:1.05rem;color:var(--c-muted);font-weight:500;margin:0 0 18px;max-width:48ch;}
.ptmc-hero__media{border-radius:var(--c-r);overflow:hidden;box-shadow:var(--c-sh-md);border:1px solid var(--c-line);background:var(--c-surface);aspect-ratio:16/9;}
.ptmc-hero__img{display:block;width:100%;height:100%;object-fit:cover;}
.ptmc-hero__fallback{display:grid;place-items:center;width:100%;height:100%;min-height:200px;background:linear-gradient(135deg,var(--c-navy),var(--c-navy-light));}
.ptmc-hero__fallback span{font-family:var(--c-fh);font-weight:800;color:#fff;font-size:1.4rem;padding:0 18px;text-align:center;}

/* ---- STATUS card (access-aware) ---- */
.ptmc-status{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--c-r);box-shadow:var(--c-sh-sm);padding:15px 18px;max-width:30rem;}
.ptmc-status__row{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:10px;}
.ptmc-lbl{font-size:.9rem;color:var(--c-muted);}
.ptmc-lbl b{color:var(--c-heading);}
.ptmc-pct{font-family:var(--c-fh);font-weight:800;font-size:1.5rem;color:var(--c-heading);line-height:1;}
.ptmc-next{font-size:.88rem;color:var(--c-muted);}
.ptmc-next b{color:var(--c-heading);font-weight:600;}
.ptmc-pbar{height:7px;border-radius:99px;background:var(--c-line);overflow:hidden;margin:0 0 12px;}
.ptmc-pbar span{display:block;height:100%;background:var(--c-teal);border-radius:99px;}
.ptmc-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.ptmc-badge{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;font-weight:600;color:var(--c-teal-dark);background:rgba(0,168,150,.08);border:1px solid rgba(0,168,150,.2);border-radius:99px;padding:4px 11px;}
.ptmc-badge svg{width:14px;height:14px;}

/* ---- FACTS ---- */
.ptmc-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--c-line);border:1px solid var(--c-line);border-radius:var(--c-r);overflow:hidden;margin-top:26px;}
.ptmc-fact{background:var(--c-surface);padding:17px 14px;text-align:center;}
.ptmc-fact b{display:block;font-family:var(--c-fh);font-weight:800;font-size:1.55rem;color:var(--c-heading);line-height:1;}
.ptmc-fact span{display:block;margin-top:6px;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--c-muted);}

/* ---- ROADMAP ---- */
.ptmc-road{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.ptmc-step{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--c-r);padding:18px 20px;}
.ptmc-n{font-family:var(--c-fh);font-weight:800;font-size:.9rem;color:var(--c-teal-dark);letter-spacing:.05em;}
.ptmc-step h3{font-family:var(--c-fb);font-size:1.08rem;font-weight:700;margin:5px 0 4px;color:var(--c-heading);}
.ptmc-step p{margin:0;font-size:.92rem;color:var(--c-muted);}

/* ---- LEARNING FORMATS row ---- */
.ptmc-formats{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;}
.ptmc-formats li{display:inline-flex;align-items:center;gap:9px;background:var(--c-surface);border:1px solid var(--c-line);border-radius:99px;padding:9px 15px;font-size:.92rem;font-weight:600;color:var(--c-text);box-shadow:var(--c-sh-sm);}
.ptmc-formats li svg{width:18px;height:18px;color:var(--c-teal-dark);}
.ptmc-formats__hl{background:linear-gradient(135deg,rgba(0,168,150,.10),rgba(0,168,150,.02));border-color:rgba(0,168,150,.28);}
.ptmc-formats__hl svg{color:var(--c-teal);}

/* ---- FOCUS callout ---- */
.ptmc-focus{background:linear-gradient(135deg,var(--c-navy) 0%,var(--c-navy-light) 100%);color:#fff;border-radius:var(--c-r);padding:24px 28px;}
.ptmc-focus h3{color:#fff;font-family:var(--c-fb);font-size:1.12rem;font-weight:700;margin:0 0 7px;}
.ptmc-focus p{color:#cfe4f5;font-size:1rem;margin:0 0 15px;max-width:72ch;}
.ptmc-tags{display:flex;flex-wrap:wrap;gap:8px;}
.ptmc-tag{font-size:.82rem;font-weight:600;color:#cfe4f5;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:99px;padding:5px 13px;}

/* ---- curriculum heading (LearnDash content renders below this) ---- */
.ptmc-curhead{padding-top:30px;border-top:1px solid var(--c-line);margin-bottom:4px;scroll-margin-top:90px;}
.ptmc-curhead h2{font-size:clamp(1.5rem,2.7vw,2rem);font-weight:700;margin:6px 0 4px;}
.ptmc-curhead__sub{color:var(--c-muted);font-size:1rem;margin:0;max-width:64ch;}

/* ---- RELATED + RESOURCES (after LearnDash content) ---- */
.ptm-course--after{margin-top:8px;}
.ptmc-rels{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.ptmc-rel{display:block;text-decoration:none;background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--c-r);padding:18px 20px;box-shadow:var(--c-sh-sm);transition:box-shadow .15s,transform .15s,border-color .15s;}
.ptmc-rel:hover{box-shadow:var(--c-sh-md);transform:translateY(-2px);border-color:var(--c-teal);}
.ptmc-rel__eb{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c-muted);}
.ptmc-rel h3{font-family:var(--c-fb);font-size:1.05rem;font-weight:700;color:var(--c-heading);margin:5px 0 8px;}
.ptmc-rel__go{font-size:.88rem;font-weight:600;color:var(--c-teal-dark);}
.ptmc-res{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--c-surface-alt);border:1px solid var(--c-line);border-radius:var(--c-r);padding:15px 18px;}
.ptmc-res__lbl{font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c-muted);margin-right:4px;}
.ptmc-res a{display:inline-flex;gap:7px;align-items:center;text-decoration:none;padding:7px 12px;border:1px solid var(--c-line);border-radius:99px;background:var(--c-surface);color:var(--c-text);font-weight:500;font-size:.88rem;}
.ptmc-res a:hover{border-color:var(--c-teal);color:var(--c-teal-dark);}
.ptmc-res a svg{width:15px;height:15px;color:var(--c-teal);}

/* ---- injected curriculum search (assets/js/ptm-course.js) ---- */
.ptmc-search{margin:14px 0 16px;position:relative;}
.ptmc-search input{width:100%;max-width:26rem;font-family:var(--c-fb);font-size:.95rem;color:var(--c-text);background:var(--c-surface);border:1.5px solid var(--c-line);border-radius:var(--c-rs);padding:.6rem .9rem .6rem 2.2rem;}
.ptmc-search input:focus{outline:none;border-color:var(--c-teal);}
.ptmc-search svg{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--c-muted);pointer-events:none;}
.ptmc-search__count{margin-left:10px;font-size:.85rem;color:var(--c-muted);}
.ptmc-search input:not([value=""]) ~ .ptmc-search__count{}

/* ==================================================================
   LEARNDASH course-content restyle — scoped to upgraded course page.
   Defensive: spacing / borders / typography / accent only. LearnDash
   ships some inline !important brand colour (#00a2e8); a full recolour
   should be validated on staging before adding !important overrides.
   ================================================================== */
body.ptm-course-page .learndash-wrapper{font-family:var(--c-fb);}
body.ptm-course-page .learndash-wrapper .ld-item-list-item{
	border:1px solid var(--c-line);border-radius:var(--c-rs);background:var(--c-surface);
	margin-bottom:8px;overflow:hidden;box-shadow:none;
}
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-item-list-item-preview{
	padding:.8rem 1rem;
}
body.ptm-course-page .learndash-wrapper .ld-item-title,
body.ptm-course-page .learndash-wrapper .ld-item-name{
	font-family:var(--c-fb);font-weight:600;color:var(--c-heading);
}
body.ptm-course-page .learndash-wrapper .ld-lesson-item-preview-heading{color:var(--c-heading);}
body.ptm-course-page .learndash-wrapper .ld-item-details,
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-item-components{color:var(--c-muted);}
/* section headings between lesson groups */
body.ptm-course-page .learndash-wrapper .ld-lesson-section-heading{
	font-family:var(--c-fb);font-size:.72rem;font-weight:700;letter-spacing:.12em;
	text-transform:uppercase;color:var(--c-muted);margin:22px 0 9px;
}
/* progress + complete accents → teal (may need !important on some LD builds) */
body.ptm-course-page .learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage{background-color:var(--c-teal);}
body.ptm-course-page .learndash-wrapper .ld-status-complete,
body.ptm-course-page .learndash-wrapper .ld-status-icon.ld-status-complete{background-color:var(--c-teal);border-color:var(--c-teal);}
body.ptm-course-page .learndash-wrapper .ld-primary-color,
body.ptm-course-page .learndash-wrapper a.ld-primary-color{color:var(--c-teal-dark);}
/* dark-mode surfaces for LD rows */
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-list-item{background:var(--c-surface);}
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-table-list,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-list-item-expanded{background:var(--c-surface-alt);}

/* ==================================================================
   Shell + heading-colour overrides.
   The dedicated template wraps everything in .ptm-page (base tokens) and
   .ptm-container (width). These rules give the intro breathing room and
   ensure Astra/LearnDash global heading colours don't win. Scoped to the
   upgraded course page; the navy focus box keeps its own white heading.
   ================================================================== */
body.ptm-course-page .ptm-course-shell__inner{padding-top:14px;padding-bottom:40px;}
body.ptm-course-page .ptm-course--intro,
body.ptm-course-page .ptm-course--curriculum,
body.ptm-course-page .ptm-course--after{max-width:100%;}

body.ptm-course-page .ptm-course .ptmc-title,
body.ptm-course-page .ptm-course .ptmc-head h2,
body.ptm-course-page .ptm-course .ptmc-curhead h2,
body.ptm-course-page .ptm-course .ptmc-step h3,
body.ptm-course-page .ptm-course .ptmc-rel h3{color:var(--c-heading);}
body.ptm-course-page .ptm-course .ptmc-sub{color:var(--c-muted);}
/* focus box heading stays white on navy regardless of global rules */
body.ptm-course-page .ptm-course .ptmc-focus h3{color:#fff;}

/* ---- responsive ---- */
@media (max-width:840px){
	.ptmc-hero{grid-template-columns:1fr;gap:20px;}
	.ptmc-facts,.ptmc-road,.ptmc-rels{grid-template-columns:1fr;}
}
@media (min-width:560px) and (max-width:840px){
	.ptmc-facts{grid-template-columns:repeat(3,1fr);}
}
@media (prefers-reduced-motion:reduce){.ptm-course *{transition:none !important;}}
.ptm-course :focus-visible{outline:2px solid var(--c-teal);outline-offset:2px;border-radius:4px;}

/* ---- print ---- */
@media print{
	.ptmc-status .ptmc-cta,.ptmc-res,.ptmc-search{display:none;}
	.ptmc-focus{background:none;color:#000;border:1px solid #999;}
	.ptmc-focus h3,.ptmc-focus p{color:#000;}
	.ptmc-hero__media{box-shadow:none;}
}

/* ==================================================================
   v2.1 — theme-integration + readability
   Fixes the half-applied dark mode: the shared ptm-dark.css only darkens
   specific page classes (.ptm-pricing-page etc.), never the generic
   .ptm-page shell, so the course page kept a white background while its
   heading VARIABLES flipped to pale — pale text on white. We paint the
   shell in BOTH modes here, and normalise the H1 against the inherited
   .ptm-page h1 sizing from ptm-pages.css. All scoped to the course page.
   ================================================================== */

/* Shell background — light + dark. */
body.ptm-course-page.ptm-custom-shell{background:var(--c-page);}
body.ptm-course-page .ptm-course-shell{background:var(--c-page);color:var(--c-text);}
html[data-ptm-theme="dark"] body.ptm-course-page.ptm-custom-shell,
html[data-ptm-theme="dark"] body.ptm-course-page .ptm-course-shell{color-scheme:dark;}

/* Slightly wider content column (matches the light footer container). */
body.ptm-course-page .ptm-course-shell__inner{
	width:min(100% - 40px, 1180px);margin-inline:auto;padding-top:18px;padding-bottom:46px;
}

/* H1: override inherited .ptm-page h1 (max-width:760px; margin:auto; up to 4.6rem). */
body.ptm-course-page .ptm-course .ptmc-title{
	max-width:none;margin:0 0 10px;text-align:left;
	font-size:clamp(2.05rem,3.4vw,3rem);line-height:1.12;letter-spacing:-.015em;
	color:var(--c-heading);
}

/* Section headings: pin size + colour above inherited .ptm-page h2/h3. */
body.ptm-course-page .ptm-course .ptmc-head h2,
body.ptm-course-page .ptm-course .ptmc-curhead h2{
	font-size:clamp(1.45rem,2.4vw,1.9rem);line-height:1.16;letter-spacing:-.01em;color:var(--c-heading);
}
body.ptm-course-page .ptm-course .ptmc-step h3,
body.ptm-course-page .ptm-course .ptmc-rel h3{font-size:1.08rem;color:var(--c-heading);}

/* Descriptive text: a little more contrast than plain muted. */
body.ptm-course-page .ptm-course .ptmc-sub,
body.ptm-course-page .ptm-course .ptmc-curhead__sub,
body.ptm-course-page .ptm-course .ptmc-step p{color:var(--c-text);opacity:.92;}

/* Separation before the curriculum + wrap it in a pale card so it doesn't
   sit directly on the page background. */
body.ptm-course-page .ptmc-curhead{margin-top:34px;}
body.ptm-course-page .ptm-course--curriculum{
	background:var(--c-surface-alt);border:1px solid var(--c-line);
	border-radius:var(--c-r);padding:16px;margin-top:14px;
}

/* Search field: wider + clearer. */
body.ptm-course-page .ptmc-search{margin-bottom:14px;}
body.ptm-course-page .ptmc-search input{max-width:34rem;border-width:1.5px;}
body.ptm-course-page .ptmc-search input::placeholder{color:var(--c-muted);}

/* Tighter curriculum rows. */
body.ptm-course-page .learndash-wrapper .ld-item-list-item{margin-bottom:6px;}

/* Mobile: keep LearnDash row meta from crowding long condition names. */
@media (max-width:600px){
	body.ptm-course-page .learndash-wrapper .ld-item-details{font-size:.78rem;}
	body.ptm-course-page .ptm-course--curriculum{padding:10px;}
}

/* ==================================================================
   v2.2 — density, hierarchy & LearnDash absorption
   ================================================================== */

/* --- 1. Primary button text: beat the generic ".ptm-course a" colour --- */
.ptm-course a.ptmc-btn--primary,
.ptm-course a.ptmc-btn--primary:visited,
.ptm-course a.ptmc-btn--primary:hover,
.ptm-course a.ptmc-btn--primary:focus-visible{color:#fff;}
.ptm-course a.ptmc-btn--primary:hover{background:var(--c-teal-dark);}

/* --- 2. Tighter section rhythm --- */
.ptm-course .ptmc-blk{padding:22px 0;}

/* --- 3. Compact Learn -> Recall -> Apply --- */
body.ptm-course-page .ptm-course .ptmc-road{position:relative;}
body.ptm-course-page .ptm-course .ptmc-step{position:relative;padding:13px 16px;}
body.ptm-course-page .ptm-course .ptmc-step h3{font-size:.98rem;margin:3px 0 3px;}
body.ptm-course-page .ptm-course .ptmc-step p{font-size:.85rem;}
body.ptm-course-page .ptm-course .ptmc-n{font-size:.82rem;}
body.ptm-course-page .ptm-course .ptmc-road .ptmc-step:not(:last-child)::after{
	content:"\2192";position:absolute;right:-12px;top:50%;transform:translateY(-50%);
	color:var(--c-muted);font-weight:700;z-index:2;
}

/* --- 4. Smaller learning-formats heading + lead --- */
body.ptm-course-page .ptm-course .ptmc-head--sm{margin-bottom:8px;}
body.ptm-course-page .ptm-course .ptmc-head--sm h2{font-size:clamp(1.2rem,2vw,1.4rem);}
body.ptm-course-page .ptm-course .ptmc-formats__lead{margin:0 0 13px;color:var(--c-text);opacity:.9;font-size:.95rem;}

/* --- 5. Facts strip: compact, sans-serif numbers, consistent cells --- */
body.ptm-course-page .ptm-course .ptmc-fact{padding:13px 14px;}
body.ptm-course-page .ptm-course .ptmc-fact b{font-family:var(--c-fb);font-size:1.5rem;letter-spacing:-.01em;}

/* --- 6. Hero: lighter image shadow --- */
body.ptm-course-page .ptm-course .ptmc-hero__media{box-shadow:var(--c-sh-sm);}

/* --- 7. Curriculum heading row: search aligned right on desktop --- */
body.ptm-course-page .ptmc-curhead__row{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;flex-wrap:wrap;}
body.ptm-course-page .ptmc-curhead__copy{min-width:0;}
body.ptm-course-page .ptmc-curhead__tools{flex:0 0 auto;}
body.ptm-course-page .ptmc-curhead__tools .ptmc-search{margin:0;}
body.ptm-course-page .ptmc-curhead__tools .ptmc-search input{width:320px;max-width:100%;}

/* --- 8. Related cards: more padding + title contrast --- */
body.ptm-course-page .ptm-course .ptmc-rel{padding:20px 22px;}
body.ptm-course-page .ptm-course .ptmc-rel h3{color:var(--c-heading);}
body.ptm-course-page .ptm-course .ptmc-rel__eb{opacity:.85;}

/* ==================================================================
   LEARNDASH — full navy/teal absorption (LD30 standard classes).
   Confirm exact selectors on staging; targeted !important is used only
   where LearnDash ships inline brand colour (#00a2e8). Scoped to the
   upgraded course page, so lessons/quizzes/dashboards are untouched.
   ================================================================== */

/* Title hierarchy (LD default sizing is too large) */
body.ptm-course-page .learndash-wrapper .ld-item-list-item-preview .ld-item-name,
body.ptm-course-page .learndash-wrapper .ld-item-list-item-preview .ld-item-title{
	font-size:.92rem;line-height:1.3;font-weight:600;
}
body.ptm-course-page .learndash-wrapper .ld-table-list-item .ld-topic-title,
body.ptm-course-page .learndash-wrapper .ld-table-list-item .ld-quiz-title,
body.ptm-course-page .learndash-wrapper .ld-table-list-item-preview{
	font-size:.85rem;line-height:1.35;font-weight:500;
}
body.ptm-course-page .learndash-wrapper .ld-item-components,
body.ptm-course-page .learndash-wrapper .ld-item-details{font-size:.74rem;}

/* Row density */
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-item-list-item-preview{padding:.68rem .85rem;}
body.ptm-course-page .learndash-wrapper .ld-table-list-item-preview{padding:.5rem .8rem;}

/* Replace the bright LearnDash blue — expanded headers -> navy, controls -> teal */
body.ptm-course-page .learndash-wrapper .ld-primary-background{background-color:var(--c-navy) !important;}
body.ptm-course-page .learndash-wrapper .ld-lesson-item-preview-heading,
body.ptm-course-page .learndash-wrapper .ld-table-list-header{background:var(--c-navy) !important;color:#fff !important;}
body.ptm-course-page .learndash-wrapper .ld-lesson-item-preview-heading *,
body.ptm-course-page .learndash-wrapper .ld-table-list-header *{color:#fff !important;}
body.ptm-course-page .learndash-wrapper .ld-expand-button{background-color:var(--c-teal) !important;border-color:var(--c-teal) !important;color:#fff !important;}
body.ptm-course-page .learndash-wrapper .ld-expand-button .ld-icon,
body.ptm-course-page .learndash-wrapper .ld-icon-arrow-down{color:#fff !important;}
/* completion + progress -> teal */
body.ptm-course-page .learndash-wrapper .ld-status-complete{background-color:var(--c-teal) !important;border-color:var(--c-teal) !important;color:#fff !important;}
body.ptm-course-page .learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage{background-color:var(--c-teal) !important;}
/* nested topic surface */
body.ptm-course-page .learndash-wrapper .ld-table-list{background:var(--c-surface-alt);}

/* --- Responsive: curriculum search stacks full width on mobile --- */
@media (max-width:680px){
	body.ptm-course-page .ptmc-curhead__row{align-items:stretch;}
	body.ptm-course-page .ptmc-curhead__tools{width:100%;}
	body.ptm-course-page .ptmc-curhead__tools .ptmc-search input{width:100%;}
	body.ptm-course-page .ptm-course .ptmc-road .ptmc-step:not(:last-child)::after{display:none;}
}

/* ==================================================================
   v2.3 — one typography scale, breadcrumb, calmer rhythm, quieter
   curriculum controls. Scoped to the upgraded course page.
   ================================================================== */

/* --- Typography scale tokens --- */
.ptm-course,
body.ptm-course-page{
	--course-h1:      clamp(2.2rem,3.6vw,3rem);
	--course-h2:      clamp(1.5rem,2.2vw,1.85rem);
	--course-h2-sm:   1.32rem;
	--course-h3:      1rem;
	--course-kicker:  .72rem;
	--course-meta:    .74rem;
}
body.ptm-course-page .ptm-course .ptmc-title{font-size:var(--course-h1);}
body.ptm-course-page .ptm-course .ptmc-head:not(.ptmc-head--sm) h2,
body.ptm-course-page .ptm-course .ptmc-curhead h2{font-size:var(--course-h2);}
body.ptm-course-page .ptm-course .ptmc-head--sm h2{font-size:var(--course-h2-sm);}
body.ptm-course-page .ptm-course .ptmc-step h3,
body.ptm-course-page .ptm-course .ptmc-rel h3{font-size:var(--course-h3);}
body.ptm-course-page .ptm-course .ptmc-kicker{font-size:var(--course-kicker);}

/* --- Breadcrumb --- */
.ptm-course .ptmc-breadcrumb{margin:2px 0 16px;}
.ptm-course .ptmc-breadcrumb ol{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:0;padding:0;list-style:none;font-size:.82rem;color:var(--c-muted);}
.ptm-course .ptmc-breadcrumb li{display:inline-flex;align-items:center;gap:7px;}
.ptm-course .ptmc-breadcrumb li:not(:last-child)::after{content:"\203A";color:var(--c-muted);opacity:.55;}
.ptm-course .ptmc-breadcrumb a{color:var(--c-muted);text-decoration:none;}
.ptm-course .ptmc-breadcrumb a:hover{color:var(--c-teal-dark);}
.ptm-course .ptmc-breadcrumb [aria-current="page"]{color:var(--c-heading);font-weight:600;}

/* --- Compact roadmap: small sans step labels (not big serif numerals) --- */
body.ptm-course-page .ptm-course .ptmc-n{
	font-family:var(--c-fb);font-size:.7rem;font-weight:700;letter-spacing:.09em;
	text-transform:uppercase;color:var(--c-teal-dark);
}

/* --- Learning formats: compact card grid with mini-descriptions --- */
body.ptm-course-page .ptm-course .ptmc-formats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
body.ptm-course-page .ptm-course .ptmc-formats li{
	display:flex;flex-direction:column;align-items:flex-start;gap:2px;
	padding:13px 14px;border-radius:var(--c-rs);border:1px solid var(--c-line);
	background:var(--c-surface);box-shadow:none;font-weight:400;
}
body.ptm-course-page .ptm-course .ptmc-formats li svg{width:20px;height:20px;margin-bottom:5px;color:var(--c-teal-dark);}
body.ptm-course-page .ptm-course .ptmc-formats__t{font-weight:600;font-size:.9rem;color:var(--c-heading);}
body.ptm-course-page .ptm-course .ptmc-formats__d{font-size:.78rem;color:var(--c-muted);}
body.ptm-course-page .ptm-course .ptmc-formats__hl svg{color:var(--c-teal);}

/* --- Course content heading row: aligned two-column grid --- */
body.ptm-course-page .ptmc-curhead__row{
	display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:24px;align-items:end;
}

/* --- Dividers only before major areas --- */
body.ptm-course-page .ptm-course--after{border-top:1px solid var(--c-line);margin-top:24px;padding-top:6px;}

/* --- Curriculum outer card: lighter padding --- */
body.ptm-course-page .ptm-course--curriculum{padding:12px;}

/* --- Quieter expand control: compact chevron, not a wide pill --- */
body.ptm-course-page .learndash-wrapper .ld-expand-button{
	background:transparent !important;border:none !important;box-shadow:none !important;
	width:34px;min-width:34px;height:34px;padding:0 !important;border-radius:50%;
	color:var(--c-teal-dark) !important;font-size:0 !important;
	display:inline-flex;align-items:center;justify-content:center;
}
body.ptm-course-page .learndash-wrapper .ld-expand-button .ld-icon,
body.ptm-course-page .learndash-wrapper .ld-expand-button .ld-icon-arrow-down{font-size:1.05rem !important;color:var(--c-teal-dark) !important;}
body.ptm-course-page .learndash-wrapper .ld-expand-button:hover{background:rgba(0,168,150,.10) !important;}
body.ptm-course-page .learndash-wrapper .ld-expand-button:focus-visible{outline:2px solid var(--c-teal);outline-offset:2px;}

/* --- Next incomplete lesson emphasis (added by JS in progress state) --- */
body.ptm-course-page .learndash-wrapper .ld-item-list-item.ptmc-is-next{
	border-left:3px solid var(--c-teal);background:rgba(0,168,150,.05);
}
.ptmc-continue-chip{
	display:inline-block;margin-left:10px;padding:2px 9px;border-radius:99px;
	background:var(--c-teal);color:#fff;font-size:.66rem;font-weight:700;
	letter-spacing:.04em;text-transform:uppercase;vertical-align:middle;
}

/* --- Responsive --- */
@media (max-width:860px){
	body.ptm-course-page .ptm-course .ptmc-formats{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:680px){
	body.ptm-course-page .ptmc-curhead__row{grid-template-columns:1fr;align-items:stretch;}
	body.ptm-course-page .ptm-course--curriculum{padding:8px;border:0;background:transparent;}
}
@media (max-width:460px){
	body.ptm-course-page .ptm-course .ptmc-formats{grid-template-columns:1fr;}
}

/* ==================================================================
   v2.4 — dividers back, smaller focus box, search inline with title,
   clearer expand-all, and blue-circle cleanup on curriculum controls.
   ================================================================== */

/* --- 1. Subtle dividers between intro sections (owner prefers separation) --- */
body.ptm-course-page .ptm-course--intro .ptmc-blk{border-top:1px solid var(--c-line);}

/* --- 2. Smaller "What to focus on" callout --- */
body.ptm-course-page .ptm-course .ptmc-focus{padding:18px 22px;}
body.ptm-course-page .ptm-course .ptmc-focus h3{font-size:1rem;margin-bottom:5px;}
body.ptm-course-page .ptm-course .ptmc-focus p{font-size:.92rem;margin-bottom:12px;max-width:78ch;}
body.ptm-course-page .ptm-course .ptmc-tag{font-size:.78rem;padding:4px 11px;}

/* --- 3. Course-content header: search on the same line as the title --- */
body.ptm-course-page .ptmc-curhead .ptmc-kicker{display:block;margin-bottom:6px;}
body.ptm-course-page .ptmc-curhead__row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
body.ptm-course-page .ptmc-curhead__row h2{margin:0;}
body.ptm-course-page .ptmc-curhead__sub{margin:8px 0 0;}
body.ptm-course-page .ptmc-curhead__tools{flex:0 0 auto;}
body.ptm-course-page .ptmc-curhead__tools .ptmc-search{margin:0;}
body.ptm-course-page .ptmc-curhead__tools .ptmc-search input{width:320px;max-width:100%;}
@media (max-width:680px){
	body.ptm-course-page .ptmc-curhead__row{gap:12px;}
	body.ptm-course-page .ptmc-curhead__tools{width:100%;}
	body.ptm-course-page .ptmc-curhead__tools .ptmc-search input{width:100%;}
}

/* ==================================================================
   Curriculum controls — LearnDash (scoped to course page).
   The bright blue is LearnDash's accent colour. The reliable global fix
   is LearnDash LMS → Settings → set the accent to #00A896; the rules
   below override it on the course page and strip the blue circle behind
   the expand arrow. If LearnDash injects the colour inline with
   !important, the settings change is the definitive fix.
   ================================================================== */

/* Master expand/collapse-all (course-content header): keep it a clear,
   labelled pill, not a lone chevron. */
body.ptm-course-page .learndash-wrapper .ld-expand-button{
	background:transparent !important;background-color:transparent !important;
	border:1px solid var(--c-line) !important;box-shadow:none !important;
	color:var(--c-teal-dark) !important;border-radius:99px;
	width:auto;min-width:0;height:auto;padding:6px 14px !important;
	font-size:.8rem !important;font-weight:600;
	display:inline-flex;align-items:center;gap:6px;
}
body.ptm-course-page .learndash-wrapper .ld-expand-button:hover{
	background:rgba(0,168,150,.08) !important;border-color:var(--c-teal) !important;
}
body.ptm-course-page .learndash-wrapper .ld-expand-button .ld-icon,
body.ptm-course-page .learndash-wrapper .ld-expand-button .ld-icon-arrow-down{
	background:transparent !important;background-color:transparent !important;
	color:var(--c-teal-dark) !important;font-size:.85rem !important;
}

/* Per-lesson / per-topic expand: compact chevron with NO blue circle. */
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button{
	border:0 !important;border-radius:50%;padding:0 !important;
	width:34px;min-width:34px;height:34px;font-size:0 !important;
	background:transparent !important;background-color:transparent !important;
}
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button *{
	background:transparent !important;background-color:transparent !important;
	box-shadow:none !important;border:0 !important;
}
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon,
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon-arrow-down{
	font-size:1.05rem !important;color:var(--c-teal-dark) !important;
}

/* Completion icon: solid teal circle with a white tick (no blue ring). */
html body.ptm-course-page .learndash-wrapper .ld-status-complete,
html body.ptm-course-page .learndash-wrapper .ld-status-icon.ld-status-complete{
	background-color:var(--c-teal) !important;border-color:var(--c-teal) !important;color:#fff !important;
}
html body.ptm-course-page .learndash-wrapper .ld-status-complete::before,
html body.ptm-course-page .learndash-wrapper .ld-status-complete .ld-icon{color:#fff !important;}

/* ==================================================================
   v2.5 — last activity, per-lesson progress badge, dark-mode contrast.
   ================================================================== */

/* Last-activity line in the hero status card */
.ptm-course .ptmc-lastact{margin:2px 0 12px;font-size:.82rem;color:var(--c-muted);}

/* Per-lesson progress badge (added by JS to each collapsed lesson row) */
.ptmc-lp{display:inline-flex;align-items:center;gap:7px;margin-left:12px;vertical-align:middle;font-size:.72rem;font-weight:600;color:var(--c-muted);}
.ptmc-lp__bar{width:46px;height:5px;border-radius:99px;background:var(--c-line);overflow:hidden;flex:0 0 auto;}
.ptmc-lp__bar>span{display:block;height:100%;background:var(--c-teal);border-radius:99px;}
.ptmc-lp.is-done{color:var(--c-teal-dark);}

/* --- DARK MODE: make the LearnDash curriculum text readable --- */
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-list-item-preview,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-name,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-title,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-table-list-item,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-topic-title,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-quiz-title,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-table-list-item a,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-list-item a{color:var(--c-text) !important;}
/* topic / quiz count meta under each lesson title */
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-details,
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-components{color:var(--c-muted) !important;}
/* keep the navy "Lesson Content" bar text white (already set) — unaffected */

/* ==================================================================
   v2.6 — curriculum controls: clean per-lesson chevron, tertiary
   master control, tighter expanded header. High specificity so it
   beats the LearnDash Customizer's generated colours. Course page only.
   ================================================================== */

/* Per-lesson expand: strict fixed-size, centred chevron, NO coloured circle */
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button{
	width:28px !important;min-width:28px !important;height:28px !important;padding:0 !important;
	display:inline-grid !important;place-items:center !important;
	border:0 !important;border-radius:50% !important;line-height:1 !important;
	background:transparent !important;background-color:transparent !important;box-shadow:none !important;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button *{
	background:transparent !important;background-color:transparent !important;box-shadow:none !important;border:0 !important;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-text{
	position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon-arrow-down{
	position:static !important;display:block !important;width:14px !important;height:14px !important;
	margin:0 !important;padding:0 !important;line-height:14px !important;font-size:14px !important;
	color:var(--c-teal-dark) !important;transform-origin:50% 50%;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button:hover{background:rgba(0,168,150,.10) !important;}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button:focus-visible{outline:2px solid var(--c-teal);outline-offset:2px;}

/* Master expand/collapse-all: small tertiary control (not a primary CTA) */
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand{
	display:inline-flex !important;align-items:center;gap:6px;width:auto;min-width:0;height:auto;min-height:34px;
	padding:6px 12px !important;border:1px solid var(--c-line) !important;border-radius:8px !important;
	background:transparent !important;background-color:transparent !important;box-shadow:none !important;
	color:var(--c-muted) !important;font-size:.8rem !important;font-weight:600;
}
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand:hover{
	border-color:var(--c-teal) !important;color:var(--c-teal-dark) !important;background:transparent !important;
}
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand .ld-icon,
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand .ld-icon-arrow-down{color:inherit !important;background:transparent !important;}

/* Tighter expanded "Lesson Content" navy header */
body.ptm-course-page .learndash-wrapper .ld-lesson-item-preview-heading{padding:12px 16px !important;font-size:.95rem;}
body.ptm-course-page .learndash-wrapper .ld-lesson-item-preview-heading .ld-status{font-size:.75rem;}

/* Progress badge: sits just before the chevron, right-aligned in the row */
body.ptm-course-page .learndash-wrapper .ld-item-list-item .ptmc-lp{margin-left:auto;margin-right:10px;}
body.ptm-course-page .ptmc-lp.is-done .ptmc-lp__txt{color:var(--c-teal-dark);}

/* ==================================================================
   v2.7 — expand controls painted over LearnDash's inline background,
   readable master, linked "Next" step. Course page only.
   The inset box-shadow fills the button surface regardless of the
   Customizer's inline background-colour, so the teal fill no longer
   hides the arrow / weakens the master text.
   ================================================================== */

/* "Next: <step>" is now a link */
body.ptm-course-page .ptm-course .ptmc-next a{color:var(--c-teal-dark);font-weight:600;text-decoration:none;}
body.ptm-course-page .ptm-course .ptmc-next a:hover{text-decoration:underline;}

/* Per-lesson expand: outline circle (white/dark fill over the inline bg) + teal chevron */
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button{
	box-shadow:inset 0 0 0 9999px var(--c-surface) !important;
	border:1.5px solid var(--c-line) !important;border-radius:50% !important;
	width:30px !important;min-width:30px !important;height:30px !important;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button:hover{
	box-shadow:inset 0 0 0 9999px rgba(0,168,150,.10) !important;border-color:var(--c-teal) !important;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon-arrow-down{
	color:var(--c-teal-dark) !important;font-size:12px !important;width:12px !important;height:12px !important;
	line-height:12px !important;display:block !important;margin:0 !important;padding:0 !important;position:static !important;
}

/* Master expand: tertiary pill (white/dark fill), teal text + chevron */
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand{
	box-shadow:inset 0 0 0 9999px var(--c-surface) !important;
	border:1px solid var(--c-line) !important;border-radius:8px !important;
	color:var(--c-teal-dark) !important;font-weight:600;padding:7px 14px !important;font-size:.82rem !important;
}
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand:hover{
	box-shadow:inset 0 0 0 9999px rgba(0,168,150,.08) !important;border-color:var(--c-teal) !important;
}
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand .ld-icon,
html body.ptm-course-page .learndash-wrapper .ld-expand-button.ptmc-master-expand .ld-icon-arrow-down{
	color:var(--c-teal-dark) !important;background:transparent !important;
}

/* ==================================================================
   v2.8 — replace LearnDash's per-lesson expand icon (which renders as a
   filled teal "blob") with a clean CSS chevron inside the outline circle.
   ================================================================== */

/* Hide LearnDash's icon/graphic inside the per-lesson expand control */
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button .ld-icon-arrow-down,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button svg,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button img,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button i{
	display:none !important;
}

/* Draw our own chevron */
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button{
	position:relative !important;
}
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button::after{
	content:"" !important;position:absolute !important;top:50% !important;left:50% !important;
	width:7px !important;height:7px !important;
	border:0 !important;border-right:2px solid var(--c-teal-dark) !important;border-bottom:2px solid var(--c-teal-dark) !important;
	background:none !important;box-shadow:none !important;border-radius:0 !important;
	transform:translate(-50%,-68%) rotate(45deg) !important;pointer-events:none !important;
	transition:transform .15s ease;
}
/* Point the chevron up when the lesson is expanded (best-effort state hooks) */
html body.ptm-course-page .learndash-wrapper .ld-item-list-item.ld-expanded .ld-expand-button::after,
html body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button[aria-expanded="true"]::after{
	transform:translate(-50%,-32%) rotate(-135deg) !important;
}
/* Dark mode: brighter teal chevron */
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-item-list-item .ld-expand-button::after{
	border-right-color:var(--c-teal) !important;border-bottom-color:var(--c-teal) !important;
}

/* ==================================================================
   v2.9 — refine "not started" status circles in dark mode.
   LearnDash renders incomplete status as a solid light circle, which
   reads as a bright blob on the dark curriculum. Make it a subtle
   hollow ring instead. Completed (teal + white tick) is untouched.
   ================================================================== */
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-status-incomplete{
	background-color:transparent !important;background-image:none !important;
	border:2px solid rgba(255,255,255,.28) !important;box-shadow:none !important;
}
html[data-ptm-theme="dark"] body.ptm-course-page .learndash-wrapper .ld-status-incomplete *{
	background:transparent !important;box-shadow:none !important;
}
/* Light mode: keep incomplete as a soft outline too, for consistency */
body.ptm-course-page .learndash-wrapper .ld-status-incomplete{
	background-color:transparent !important;border:2px solid var(--c-line) !important;box-shadow:none !important;
}

/* ==================================================================
   v3.0 — support non-clinical course shapes (mock papers, SJT,
   textbook) whose facts/formats carry longer text values.
   ================================================================== */
body.ptm-course-page .ptm-course .ptmc-fact b{
	font-size:clamp(1.05rem,1.6vw,1.5rem);line-height:1.15;word-break:break-word;
}
body.ptm-course-page .ptm-course .ptmc-fact span{line-height:1.3;}
@media (max-width:720px){
	body.ptm-course-page .ptm-course .ptmc-facts{grid-template-columns:1fr !important;}
}

/* ==================================================================
   v3.1 — never crop the hero image.
   The base rules force a 16:9 box with object-fit:cover, which cut the
   top off artwork that isn't exactly 16:9 (the SJT/mock covers have
   their title at the very top edge). The image now defines its own
   height and is contained, so the whole artwork is always visible.
   ================================================================== */
body.ptm-course-page .ptm-course .ptmc-hero__media{
	aspect-ratio:auto;height:auto;align-self:center;
	display:flex;align-items:center;justify-content:center;
	background:var(--c-surface);
}
body.ptm-course-page .ptm-course .ptmc-hero__img{
	width:100%;height:auto;max-height:420px;object-fit:contain;
}
/* Fallback tile keeps a sensible shape when a course has no image. */
body.ptm-course-page .ptm-course .ptmc-hero__fallback{aspect-ratio:16/9;height:auto;}
@media (max-width:860px){
	body.ptm-course-page .ptm-course .ptmc-hero__img{max-height:320px;}
}
