.course-product {
    --course-blue:#124e6f;
    --course-ink:#0f172a;
    --course-muted:#475569;
    --course-line:#e2e8f0;
    --course-surface:#f8fafc;
    --course-sale:#b91c1c;
    background:#fff;
    color:var(--course-ink);
    padding-bottom:48px;
}
.course-product * { box-sizing:border-box; }
.course-product [id] { scroll-margin-top:144px; }
.course-product a { text-underline-offset:4px; }
.course-product :is(a,button,summary):focus-visible { outline:2px solid var(--course-blue); outline-offset:4px; }
.course-container { max-width:1248px; margin:0 auto; padding:0 32px; }
.course-hero { padding-top:28px; }
.course-breadcrumb { display:flex; gap:12px; align-items:center; color:var(--course-muted); font-size:13px; margin-bottom:32px; }
.course-breadcrumb a:hover { color:var(--course-blue); text-decoration:underline; }
.course-hero-grid { display:grid; grid-template-columns:1.12fr 1fr; align-items:center; gap:56px; }
.course-hero-copy { min-width:0; padding:12px 0; }
.course-eyebrow { display:flex; align-items:center; flex-wrap:wrap; gap:12px; color:var(--course-blue); font-size:13px; font-weight:600; margin:0 0 16px; }
.course-eyebrow > span { color:#cbd5e1; }
.course-hero h1 { font-size:clamp(32px,3.5vw,46px); font-weight:700; letter-spacing:-.035em; line-height:1.16; text-wrap:balance; overflow-wrap:anywhere; margin:0 0 20px; }
.course-intro.rich-content { max-width:540px; font-size:16px; line-height:1.8; color:var(--course-muted); margin-bottom:28px; }
.course-intro.rich-content ul { padding-left:20px !important; }
.course-intro small { font-size:12px; }
.course-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px; }
.course-primary-link { display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:13px 18px; background:var(--course-blue); color:white; border-radius:8px; font-size:14px; font-weight:600; transition:background .15s; }
.course-primary-link:hover { background:#0d3a52; }
.course-primary-link:active { transform:translateY(1px); }
.course-primary-link > span { font-size:18px; }
.course-text-link { display:inline-flex; gap:10px; align-items:center; color:var(--course-blue); font-size:14px; font-weight:500; }
.course-text-link:hover { text-decoration:underline; }
.course-cover { margin:0; overflow:hidden; border:1px solid var(--course-line); border-radius:12px; background:var(--course-surface); }
.course-cover > img { display:block; width:100%; height:auto; }
.course-cover figcaption { display:flex; align-items:center; gap:12px; padding:16px 20px; color:var(--course-muted); font-size:12px; line-height:1.6; }
.course-cover figcaption > svg { width:20px; height:20px; color:var(--course-blue); flex-shrink:0; }
.course-cover figcaption strong { display:block; font-size:14px; font-weight:600; color:var(--course-ink); margin-top:2px; }
.course-cover-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; aspect-ratio:1.5; padding:32px; color:var(--course-blue); font-size:22px; text-align:center; }
.course-cover-empty svg { width:48px; height:48px; }
.course-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; border-top:1px solid var(--course-line); margin-top:36px; padding:28px 0; }
.course-facts > div { display:flex; align-items:flex-start; gap:12px; min-width:0; }
.course-facts svg { color:var(--course-blue); width:21px; height:21px; stroke-width:1.5; flex-shrink:0; margin-top:2px; }
.course-facts strong { display:block; font-size:13px; font-weight:600; line-height:1.5; }
.course-facts small { display:block; color:var(--course-muted); font-size:12px; line-height:1.6; margin-top:4px; }
.course-content-nav { position:sticky; top:64px; z-index:20; background:white; border-bottom:1px solid var(--course-line); }
.course-content-nav nav { display:flex; gap:32px; overflow-x:auto; }
.course-content-nav a { flex-shrink:0; padding:18px 0 16px; border-bottom:2px solid transparent; color:var(--course-muted); font-size:14px; font-weight:500; }
.course-content-nav a:hover { color:var(--course-blue); border-color:var(--course-blue); }
.course-body-grid { display:grid; grid-template-columns:minmax(0,1fr) 344px; gap:64px; align-items:start; padding-top:40px; }
.course-main { min-width:0; grid-column:1; grid-row:1; }
.course-enrollment-column { min-width:0; grid-column:2; grid-row:1; position:static; }
.course-body-owned { grid-template-columns:minmax(0,1fr); }
.course-body-owned .course-main { width:100%; max-width:880px; }
.course-section { padding:0 0 36px; margin:0 0 36px; border-bottom:1px solid var(--course-line); }
.course-section h2 { margin:0 0 18px; font-size:26px; font-weight:650; letter-spacing:-.025em; line-height:1.3; }
.course-section h2 > svg { display:none; }
.course-section .rich-content { font-size:15px; line-height:1.85; color:var(--course-muted); }
.course-outcomes .rich-content :is(ul,ol) { columns:2; column-gap:32px; padding-left:20px !important; }
.course-outcomes .rich-content li { break-inside:avoid; padding:0 8px 8px 2px; }
.course-outcomes .rich-content li::marker { color:var(--course-blue); }
.course-chapter { border:1px solid var(--course-line); border-radius:12px; background:#fff; }
.course-chapter + .course-chapter { margin-top:12px; }
.course-chapter[open] { border-color:#cbd5e1; }
.course-chapter summary { display:flex; align-items:center; gap:16px; cursor:pointer; list-style:none; padding:22px 24px; }
.course-chapter summary::-webkit-details-marker { display:none; }
.course-chapter[open] > summary { background:var(--course-surface); border-radius:12px 12px 0 0; border-bottom:1px solid var(--course-line); }
.course-chapter-heading { display:block; flex:1; min-width:0; }
.course-chapter-heading small { display:block; font-size:12px; line-height:1.7; color:var(--course-muted); }
.course-chapter-title { display:block; font-size:17px; font-weight:600; line-height:1.5; margin:6px 0 0; overflow-wrap:anywhere; }
.course-chapter summary:hover .course-chapter-title { color:var(--course-blue); }
.course-expand { font-size:24px; font-weight:300; color:var(--course-muted); flex-shrink:0; transition:transform .15s; }
.course-chapter[open] .course-expand { transform:rotate(45deg); }
.course-chapter-content { padding:8px 0; }
.course-chapter-content .flex-1 { min-width:0; overflow-wrap:anywhere; }
.course-chapter-content > :is(a,div):not(.modal) { padding-top:13px; padding-bottom:13px; }
.course-enrollment { border:1px solid var(--course-line); border-radius:12px; padding:24px; box-shadow:none; }
.course-price-caption { font-size:13px; color:var(--course-muted); margin:0 0 14px; }
.course-price-block .text-center { text-align:left; }
.course-price-block .justify-center { justify-content:flex-start; flex-wrap:wrap; }
.course-price-block .text-3xl { color:var(--course-blue); font-size:38px; font-weight:700; letter-spacing:-.035em; line-height:1.2; }
.course-enrollment [data-main-add-to-cart-trigger] { display:block; font-size:13px; line-height:1.6; font-weight:600; padding:14px 12px; border-radius:8px; box-shadow:none; }
.course-enrollment :is(a,button).w-full { font-size:13px; border-radius:8px; box-shadow:none; padding-left:12px; padding-right:12px; }
.course-enrollment a[href*="wa.me"] { background:var(--course-surface); color:var(--course-blue); border:1px solid var(--course-line); font-size:12px; }
.course-enrollment a[href*="wa.me"]:hover { background:#eef2f6; }
.course-enrollment button[data-bs-target="#installmentModal"] { background:var(--course-surface); color:var(--course-blue); border:1px solid var(--course-line); }
.course-trust { display:grid; gap:16px; border-top:1px solid var(--course-line); padding-top:20px; margin-top:24px; }
.course-trust > div { border:0; background:none; padding:0; }
.course-trust svg { color:var(--course-blue); }
.course-trust p:last-child { font-size:12px; color:var(--course-muted); line-height:1.75; margin-top:4px; }
.course-package-promo { padding:24px; border-radius:12px; background:var(--course-surface); color:var(--course-ink); }
.course-package-promo svg { color:var(--course-blue); }
.course-package-promo a { background:var(--course-blue); color:white; border-radius:8px; font-size:13px; }
.course-package-promo a svg { color:inherit; }
.course-package-promo a:hover { background:#0d3a52; }
.course-help { background:var(--course-surface); border:1px solid var(--course-line); border-radius:12px; }
.course-help a { color:var(--course-blue); background:#eaf0f4; }
.course-help p { color:var(--course-muted); line-height:1.75; }
.course-help p:first-child { color:var(--course-ink); }
.course-continue { background:var(--course-surface); border:1px solid var(--course-line); }
.course-continue > a { background:var(--course-blue); color:#fff; border-radius:8px; }
.course-product-sale .course-enrollment { border-color:#fca5a5; }
.course-product-sale .course-price-block .text-3xl { color:var(--course-sale); }
.course-product-sale .course-enrollment [data-main-add-to-cart-trigger] { background:var(--course-sale); }
.course-product-sale .course-enrollment [data-main-add-to-cart-trigger]:hover { background:#991b1b; }
.course-product :is(.offer-detail-banner,.offer-price-box,.offer-savings-badge,.urgency-message,.scarcity-indicator) { animation:none; box-shadow:none; text-shadow:none; }
.course-product .offer-detail-banner { padding:16px 20px; border-radius:10px; background:var(--course-sale); color:#fff; }
.course-product .offer-detail-header { color:inherit; font-size:15px; font-weight:700; letter-spacing:0; text-shadow:none; }
.course-product .offer-countdown-detail { color:var(--course-muted); background:var(--course-surface); font-size:13px !important; line-height:1.7; border-radius:8px; }
.course-product .offer-price-box { border:0; background:none; margin:0; padding:0; }
.course-product .offer-special-header { color:var(--course-sale); font-size:12px; letter-spacing:0; text-align:left; }
.course-product .offer-price-large { color:var(--course-sale) !important; font-size:38px !important; text-shadow:none; }
.course-product .offer-original-price { font-size:14px; color:var(--course-muted); }
.course-product .offer-savings-badge { background:#fff1f2; color:var(--course-sale); border:1px solid #fca5a5; border-radius:8px; font-size:13px; text-align:left; padding:12px; }
.course-product .urgency-message { border:0; border-radius:8px; background:#fff1f2; padding:12px; }
.course-product .urgency-text { color:var(--course-sale); font-size:12px; font-weight:600; }
.course-product .scarcity-indicator { background:#fff1f2; color:var(--course-sale); border:1px solid #fca5a5; font-size:12px; border-radius:8px; }
.course-mobile-cta { padding-bottom:calc(12px + env(safe-area-inset-bottom)); box-shadow:none; }
.course-mobile-cta :is(a,button) { border-radius:8px; font-size:13px; }
@media (max-width:1100px) {
    .course-hero-grid { gap:32px; }
    .course-body-grid { gap:32px; grid-template-columns:minmax(0,1fr) 320px; }
    .course-body-owned { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:850px) {
    .course-container { padding-left:24px; padding-right:24px; }
    .course-hero-grid { gap:24px; }
    .course-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .course-body-grid { grid-template-columns:minmax(0,1fr); }
    .course-enrollment-column { grid-column:1; grid-row:1; }
    .course-main { grid-column:1; grid-row:2; }
    .course-body-owned .course-main { grid-row:1; }
    .course-enrollment { padding:24px; }
}
@media (max-width:600px) {
    .course-container { padding-left:20px; padding-right:20px; }
    .course-hero { padding-top:20px; }
    .course-breadcrumb { margin-bottom:24px; font-size:12px; }
    .course-hero-grid { grid-template-columns:minmax(0,1fr); gap:28px; }
    .course-hero-copy { padding:0; }
    .course-hero h1 { font-size:36px; }
    .course-cover figcaption { padding:14px 16px; }
    .course-facts { margin-top:28px; padding:24px 0; gap:22px 16px; }
    .course-facts > div { gap:8px; }
    .course-facts strong { font-size:12px; }
    .course-facts svg { width:18px; height:18px; }
    .course-content-nav nav { gap:24px; }
    .course-content-nav a { font-size:13px; padding:16px 0; }
    .course-body-grid { padding-top:28px; gap:28px; }
    .course-section { padding-bottom:28px; margin-bottom:28px; }
    .course-section h2 { font-size:24px; }
    .course-outcomes .rich-content :is(ul,ol) { columns:1; }
    .course-chapter summary { padding:18px 16px; }
    .course-chapter-title { font-size:16px; }
    .course-enrollment { padding:22px; }
}
@media (prefers-reduced-motion:reduce) {
    .course-product *, .course-mobile-cta { transition:none !important; scroll-behavior:auto !important; }
}