/* local_coursedetails — public course preview page (preview.php) — v4: light premium hero, no eyebrow, full-width title, full-width */
#page-local-coursedetails-preview #page-header,
#page-local-coursedetails-preview .page-context-header,
#page-local-coursedetails-preview .nice-page-context-header-container,
#page-local-coursedetails-preview .page-title-area,
#page-local-coursedetails-preview .nice-main > nav { display: none !important; }

/* Full-screen: break out of the theme's centred container card */
#page-local-coursedetails-preview { background: #fff !important; }
#page-local-coursedetails-preview #page.container,
#page-local-coursedetails-preview #page {
    max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important;
    border-radius: 0 !important; box-shadow: none !important; background: #fff !important;
}
#page-local-coursedetails-preview #page-content,
#page-local-coursedetails-preview #region-main-box,
#page-local-coursedetails-preview #region-main-box > .row,
#page-local-coursedetails-preview #region-main-box > .row > [class*="col-"] { margin: 0 !important; padding: 0 !important; max-width: 100% !important; width: 100% !important; }
#page-local-coursedetails-preview #region-main { padding: 0 !important; background: #fff !important; border-radius: 0 !important; box-shadow: none !important; }
#page-local-coursedetails-preview .nice-main { padding: 0 !important; }

.cp-page {
    --cp-navy: #0f3d6e; --cp-navy2: #1b5e9b; --cp-navy3: #12457a;
    --cp-gold: #e2ab25; --cp-gold2: #f7cb57; --cp-gold3: #bf8d2b;
    --cp-text: #1f2d3a; --cp-muted: #5b6b7a; --cp-border: #e3e9ee; --cp-surface: #f5f8fb;
    --cp-shadow: 0 1px 2px rgba(16,59,96,.05), 0 10px 28px rgba(16,59,96,.07);
    font-family: Cambria, Georgia, "Times New Roman", serif;
    font-size: 17px; line-height: 1.7; color: var(--cp-text);
    background: #fff;
}
.cp-page * { box-sizing: border-box; }
.cp-page strong, .cp-page b { color: var(--cp-navy3); }

/* ---------- hero (light, premium) ---------- */
.cp-hero { position: relative; background: linear-gradient(180deg, #f4f8fc 0%, #ffffff 100%); color: var(--cp-navy); border-radius: 0; border-bottom: 1px solid #e6edf4; }
.cp-hero-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.cp-hero-bg::before { content: ""; position: absolute; right: -160px; top: -200px; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(27,94,155,.10) 0%, rgba(27,94,155,0) 68%); }
.cp-hero-bg::after { content: ""; position: absolute; right: 18%; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(226,171,37,.16) 0%, rgba(226,171,37,0) 70%); }
.cp-hero-inner { position: relative; padding: 38px 5vw 0; }
.cp-crumb { font-size: 15px; color: var(--cp-muted); margin: 0 0 16px; }
.cp-crumb a { color: var(--cp-navy2); text-decoration: none; }
.cp-crumb span { color: #9aa8b8; margin: 0 8px; }
.cp-hero h1 { font-family: inherit; font-size: clamp(22px, 1.9vw, 30px); line-height: 1.35; margin: 0 0 10px; font-weight: 700; color: var(--cp-navy); max-width: none; letter-spacing: .1px; }
.cp-maxim { font-style: italic; color: var(--cp-muted); font-size: 17px; margin: 0 0 22px; }
.cp-hero-tab { display: inline-block; background: #fff; color: var(--cp-navy); font-weight: 700; font-size: 16px; padding: 12px 30px 10px; border-radius: 12px 12px 0 0; border: 1px solid #e6edf4; border-bottom: 0; box-shadow: inset 0 -3px 0 var(--cp-gold); margin-top: 8px; margin-bottom: -1px; }

/* ---------- grid (full width) ---------- */
.cp-grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 48px; padding: 34px 5vw 56px; align-items: start; background: #fff; }
@media (max-width: 960px) { .cp-grid { grid-template-columns: 1fr; padding: 28px 20px 40px; } .cp-hero-inner { padding: 24px 20px 0; } }

.cp-h2 { color: var(--cp-navy); font-size: 30px; margin: 0 0 22px; font-family: inherit; }
.cp-video { position: relative; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; margin-bottom: 28px; background: #0b1f3b; border: 1px solid #e3e9ee; box-shadow: 0 1px 2px rgba(13,50,88,.06), 0 10px 28px rgba(13,50,88,.07); }
.cp-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.cp-intro, .cp-tab-panel { text-align: justify; }
.cp-intro p, .cp-tab-panel p { font-size: 17.5px; line-height: 1.8; margin: 0 0 16px; }
.cp-tab-panel ul, .cp-tab-panel ol { margin: 0 0 12px; padding-left: 26px; }
.cp-tab-panel li { font-size: 17px; line-height: 1.75; margin-bottom: 10px; }
.cp-tab-panel h3, .cp-tab-panel h4 { font-family: inherit; color: var(--cp-navy3); }
.cp-tab-panel img { max-width: 100%; height: auto; }

/* ---------- tabs ---------- */
.cp-tabs { margin-top: 8px; }
.cp-tab-buttons { display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 3px solid var(--cp-navy2); }
.cp-tab-btn { border: 0; background: var(--cp-surface); color: var(--cp-navy); font-family: inherit; font-weight: 700; font-size: 17px; padding: 14px 26px; border-radius: 10px 10px 0 0; cursor: pointer; transition: background .15s, color .15s; }
.cp-tab-btn:hover { background: #fdf2d4; }
.cp-tab-btn.is-active { background: var(--cp-navy2); color: #fff; }
.cp-tab-panel { display: none; padding: 30px 4px 10px; }
.cp-tab-panel.is-active { display: block; }

/* ---------- sidebar ---------- */
.cp-side { position: sticky; top: 24px; }
@media (max-width: 960px) { .cp-side { position: static; } }
.cp-side-card { background: #fff; border-radius: 16px; box-shadow: var(--cp-shadow); overflow: hidden; border: 1px solid var(--cp-border); }
.cp-side-card > img { display: block; width: 100%; height: auto; }
.cp-side-body { padding: 24px 26px 26px; }
.cp-enroll { display: block; text-align: center; background: linear-gradient(180deg, #f7cb57 0%, var(--cp-gold) 60%, #c9961f 100%); color: #3f2a00 !important; font-weight: 700; font-size: 19px; padding: 16px 10px; border-radius: 12px; text-decoration: none !important; box-shadow: 0 6px 18px rgba(217,163,33,.28), inset 0 1px 0 rgba(255,255,255,.5); margin-bottom: 22px; transition: transform .15s, box-shadow .15s; }
.cp-enroll:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(217,163,33,.5), inset 0 1px 0 rgba(255,255,255,.6); }
.cp-facts div { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cp-border); font-size: 16px; }
.cp-facts div:last-child { border-bottom: 0; }
.cp-facts b { color: var(--cp-navy); }
.cp-facts span { text-align: right; }
.cp-brochure { display: block; text-align: center; margin-top: 18px; color: var(--cp-navy2); font-weight: 700; text-decoration: none; border: 1.5px solid var(--cp-navy2); border-radius: 10px; padding: 11px; }
.cp-brochure:hover { background: #eef5fb; }

/* ---------- courses page (courses.php) ---------- */
#page-local-coursedetails-courses #page-header,
#page-local-coursedetails-courses .page-title-area,
#page-local-coursedetails-courses .nice-main > nav { display: none !important; }
#page-local-coursedetails-courses #region-main { padding: 0 !important; }
.cp-courses { border-radius: 16px; overflow: hidden; }

/* ---------- About the Course tab ---------- */
.cp-about-intro { padding: 4px 0 10px; }
.cp-about-intro h2, .cp-about-intro h3 { font-family: inherit; color: var(--cp-navy); font-size: 26px; margin: 0 0 14px; }
.cp-about-intro p { font-size: 17.5px; line-height: 1.8; color: var(--cp-text); }
.cp-about-people { margin-top: 26px; padding-top: 26px; border-top: 1px solid var(--cp-border); text-align: left; }