/**
 * Theme Name: Code with Mehedi
 * Theme URI: https://codewithmehedi.com
 * Author: Mehedi Hasan
 * Author URI: https://codewithmehedi.com
 * Description: A premium LMS theme for LearnPress and WooCommerce. Built for Code with Mehedi - Learn coding with clarity, confidence, and real-world practice. Features clean design with black typography, orange accents, and developer-focused layouts.
 * Version: 1.0.0
 * Requires at least: 5.8
 * Requires PHP: 7.4
 * License: GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: codewithmehedi
 * Domain Path: /languages
 * Tags: custom-menu, custom-logo, e-commerce, education, lms, learnpress, woocommerce, one-column, two-columns, left-sidebar, right-sidebar, custom-colors, editor-style, featured-images, full-width-template, responsive-layout, sticky-post, theme-options, threaded-comments, translation-ready, blog
 *
 * Code with Mehedi WordPress Theme, Copyright 2025 Mehedi Hasan
 * Code with Mehedi is distributed under the terms of the GNU GPL.
 */

:root {
    /* Fonts */
    --font-heading: 'Poppins', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-code: 'JetBrains Mono', monospace;

    /* Font weights */
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-extrabold: 800;

    /* Desktop Font sizes */
    --fs-hero: 52px;
    --fs-page-title: 44px;
    --fs-section-title: 36px;
    --fs-subsection: 28px;
    --fs-card-title: 22px;
    --fs-card-small: 18px;
    --fs-lead: 18px;
    --fs-body: 16px;
    --fs-small: 14px;
    --fs-meta: 13px;
    --fs-button: 15px;
    --fs-nav: 14px;
    --fs-badge: 12px;

    /* Line heights */
    --lh-hero: 1.08;
    --lh-page: 1.12;
    --lh-section: 1.18;
    --lh-subsection: 1.22;
    --lh-card: 1.35;
    --lh-body: 1.75;
    --lh-lead: 1.7;
    --lh-small: 1.65;

    /* Spacing System (8px scale) */
    --space-4: 4px;
    --space-8: 8px;
    --space-12: 12px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-32: 32px;
    --space-40: 40px;
    --space-48: 48px;
    --space-56: 56px;
    --space-64: 64px;
    --space-80: 80px;
    --space-96: 96px;
    --space-120: 120px;

    /* Layout */
    --container: 1200px;
    --container-narrow: 760px;

    /* Section Spacing */
    --section-pad: var(--space-80);
    --section-pad-mobile: var(--space-48);

    /* Radius */
    --radius-pill: 999px;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-thumb: 14px;

    /* Shadows */
    --shadow-soft: 0 8px 30px rgba(16, 24, 40, 0.05);
    --shadow-hover: 0 12px 40px rgba(16, 24, 40, 0.08);

    /* Brand Colors */
    --cwm-black: #222222;
    --cwm-muted: #666666;
    --cwm-muted-light: #8A8A8A;
    --cwm-orange: #FF7200;
    --cwm-orange-hover: #E96500;
    --cwm-orange-light: #FFF1E6;
    --cwm-white: #FFFFFF;
    --cwm-warm-bg: #FFF9F2;
    --cwm-border: #EEEEEE;
    --cwm-dark-bg: #111111;
    --shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.04);
    --shadow-premium: 0 10px 40px rgba(0, 0, 0, 0.06);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    
    /* Transitions */
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}


/* ============================================
   RESET & BASE STYLES
   ============================================ */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--cwm-text);
    background-color: var(--cwm-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--cwm-black);
    line-height: 1.2;
    margin-bottom: var(--sp-16);
}

h1 { font-size: var(--fs-page); font-weight: var(--fw-bold); }
h2 { font-size: var(--fs-section); font-weight: var(--fw-bold); }
h3 { font-size: var(--fs-subsection); font-weight: var(--fw-bold); }
h4 { font-size: var(--fs-card); font-weight: var(--fw-semibold); }
h5 { font-size: 1.125rem; font-weight: var(--fw-semibold); }
h6 { font-size: 1rem; font-weight: var(--fw-semibold); }

@media (max-width: 768px) {
    h1 { font-size: 30px; }
    h2 { font-size: 26px; }
    h4 { font-size: 18px; }
}

p {
    margin-bottom: var(--sp-16);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--cwm-orange);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--cwm-orange-hover);
}

ul, ol {
    margin-bottom: var(--sp-16);
    padding-left: 1.5rem;
}

/* Typography Helpers */
.hero-title {
    font-size: var(--fs-hero);
    font-weight: var(--fw-black);
    line-height: var(--lh-hero);
    margin-bottom: var(--sp-24);
}

@media (max-width: 768px) {
    .hero-title { font-size: 34px; }
}

.section-title {
    font-size: var(--fs-section);
    font-weight: var(--fw-bold);
    margin-bottom: var(--sp-16);
}

.card-title {
    font-size: var(--fs-card);
    font-weight: var(--fw-semibold);
    margin-bottom: var(--sp-12);
}

.text-lead {
    font-size: var(--fs-lead);
    font-weight: var(--fw-regular);
    margin-bottom: var(--sp-24);
}

.text-small {
    font-size: var(--fs-small);
    font-weight: var(--fw-regular);
}

.text-meta {
    font-size: var(--fs-meta);
    font-weight: var(--fw-medium);
}

.text-badge {
    font-size: var(--fs-badge);
    font-weight: var(--fw-semibold);
}


/* ============================================
   HEADER
   ============================================ */
.site-header {
    background-color: var(--cwm-white);
    border-bottom: 1px solid var(--cwm-border);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--header-height);
}

/* ============================================
   BUTTONS
   ============================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-8);
    padding: 14px 24px;
    font-family: var(--font-body);
    font-size: var(--fs-button);
    font-weight: var(--fw-semibold);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    line-height: 1.2;
    border: 1px solid transparent;
}

.btn-primary {
    background-color: var(--cwm-orange);
    color: var(--cwm-white) !important;
}

.btn-primary:hover {
    background-color: var(--cwm-orange-hover);
    transform: translateY(-2px);
}

.btn-secondary {
    background-color: var(--cwm-white);
    color: var(--cwm-black) !important;
    border: 1px solid #E8E8E8;
}

.btn-secondary:hover {
    background-color: #f9fafb;
    border-color: #d1d5db;
    transform: translateY(-2px);
}

.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

@media (max-width: 768px) {
    .container { padding: 0 var(--container-padding-mobile); }
}

.section {
    padding: var(--section-v-pad) 0;
}

.section-lg {
    padding: var(--section-v-pad-lg) 0;
}

@media (max-width: 768px) {
    .section { padding: var(--section-v-pad-mobile) 0; }
    .section-lg { padding: var(--section-v-pad-lg-mobile) 0; }
}

.section-warm {
    background-color: var(--cwm-warm-bg);
}


.section-dark {
    background-color: var(--cwm-dark-bg);
    color: var(--cwm-white);
}

.section-dark h1,
.section-dark h2,
.section-dark h3,
.section-dark h4,
.section-dark h5,
.section-dark h6 {
    color: var(--cwm-white);
}

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.highlight {
    color: var(--cwm-orange);
}

/* Screen reader only */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Skip link */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--cwm-black);
    color: var(--cwm-white);
    padding: 8px 16px;
    z-index: 100000;
    transition: top 0.3s;
}

.skip-link:focus {
    top: 0;
}

/* ============================================
   ANNOUNCEMENT BAR
   ============================================ */
.announcement-bar {
    background-color: var(--cwm-black);
    color: var(--cwm-white);
    padding: 12px 0;
    font-size: 14px;
    text-align: center;
}

.announcement-bar a {
    color: var(--cwm-orange);
    font-weight: 600;
    margin-left: 8px;
}

.announcement-bar a:hover {
    color: var(--cwm-white);
}

/* ============================================
   HEADER
   ============================================ */
.site-header {
    background-color: var(--cwm-white);
    border-bottom: 1px solid var(--cwm-border);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

.site-branding {
    display: flex;
    align-items: center;
}

.site-logo {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 800;
    color: var(--cwm-black);
    display: flex;
    align-items: center;
    gap: 8px;
}

.site-logo span {
    color: var(--cwm-orange);
}

.site-logo img,
.custom-logo,
.site-branding img {
    max-height: 70px;
    width: auto;
    display: block;
}

/* Navigation */
.main-navigation {
    display: flex;
    align-items: center;
}

.main-navigation ul {
    display: flex;
    list-style: none;
    gap: 32px;
    margin: 0;
    padding: 0;
}

.main-navigation a {
    color: var(--cwm-text);
    font-weight: 500;
    font-size: 15px;
    transition: color var(--transition-fast);
}

.main-navigation a:hover {
    color: var(--cwm-orange);
}

/* Mobile Menu */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    z-index: 1001;
    position: relative;
    width: 32px;
    height: 32px;
}

.menu-toggle span {
    display: block;
    width: 20px;
    height: 2px;
    background-color: var(--cwm-black);
    margin: 4px 0;
    transition: var(--transition-base);
}

@media (max-width: 768px) {
    .menu-toggle {
        display: block;
    }

    .main-navigation {
        position: fixed;
        top: 0;
        right: -100%;
        width: 80%;
        max-width: 300px;
        height: 100vh;
        background: var(--cwm-white);
        box-shadow: -10px 0 30px rgba(0,0,0,0.1);
        z-index: 1000;
        transition: right var(--transition-base);
        padding: 100px 32px;
        flex-direction: column;
        align-items: flex-start;
    }

    .main-navigation.toggled {
        right: 0;
    }

    .main-navigation ul {
        flex-direction: column;
        gap: 24px;
        width: 100%;
    }

    .main-navigation a {
        font-size: 18px;
        width: 100%;
        display: block;
    }

    /* Burger animation */
    .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
    .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
    .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

    .header-buttons {
        display: none;
    }
}

/* Header Buttons */
.header-buttons {
    display: flex;
    align-items: center;
    gap: 16px;
}

.mobile-account-actions,
.mobile-menu-overlay {
    display: none;
}

/* Scroll Top Button */
.scroll-top {
    position: fixed;
    bottom: 32px;
    right: 32px;
    width: 48px;
    height: 48px;
    background: var(--cwm-orange);
    color: var(--cwm-white);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-base);
    z-index: 999;
    box-shadow: var(--shadow-md);
    border: none;
}

.scroll-top.visible {
    opacity: 1;
    visibility: visible;
}

.scroll-top:hover {
    background: var(--cwm-orange);
    transform: translateY(-4px);
}


/* ============================================
   BUTTONS
   ============================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 28px;
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 600;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all var(--transition-base);
    border: 2px solid transparent;
    text-decoration: none;
}

.btn-primary {
    background-color: var(--cwm-orange);
    color: var(--cwm-white);
    border-color: var(--cwm-orange);
}

.btn-primary:hover {
    background-color: var(--cwm-orange-hover);
    border-color: var(--cwm-orange-hover);
    color: var(--cwm-white);
}

.btn-secondary {
    background-color: var(--cwm-white);
    color: var(--cwm-black);
    border-color: var(--cwm-border);
}

.btn-secondary:hover {
    background-color: var(--cwm-orange-light);
    border-color: var(--cwm-orange);
    color: var(--cwm-orange);
}

.btn-dark {
    background-color: var(--cwm-black);
    color: var(--cwm-white);
    border-color: var(--cwm-black);
}

.btn-dark:hover {
    background-color: var(--cwm-text);
    border-color: var(--cwm-text);
    color: var(--cwm-white);
}

.btn-outline {
    background-color: transparent;
    color: var(--cwm-black);
    border-color: var(--cwm-black);
}

.btn-outline:hover {
    background-color: var(--cwm-black);
    color: var(--cwm-white);
}

.btn-white {
    background-color: var(--cwm-white);
    color: var(--cwm-black);
    border-color: var(--cwm-white);
    font-weight: 700;
}

.btn-white:hover {
    background-color: var(--cwm-black);
    color: var(--cwm-white);
    border-color: var(--cwm-black);
}

.btn-sm {
    padding: 10px 20px;
    font-size: 14px;
}

.btn-lg {
    padding: 18px 36px;
    font-size: 16px;
}

/* ============================================
   HERO SECTION
   ============================================ */
.code-editor-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.code-editor-dot.red { background-color: #FF5F56; }
.code-editor-dot.yellow { background-color: #FFBD2E; }
.code-editor-dot.green { background-color: #27C93F; }

.code-editor-content {
    font-family: var(--font-code);
    font-size: 14px;
    line-height: 1.8;
    color: var(--cwm-white);
}

.code-editor-content .comment { color: #6A9955; }
.code-editor-content .keyword { color: #569CD6; }
.code-editor-content .string { color: #CE9178; }
.code-editor-content .function { color: #DCDCAA; }
.code-editor-content .tag { color: var(--cwm-orange); }

/* Floating badges */
.floating-badges {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.floating-badges.top-right {
    top: -20px;
    right: -20px;
}

.floating-badges.bottom-left {
    bottom: -20px;
    left: -20px;
}

.badge-float {
    background-color: var(--cwm-white);
    padding: 8px 16px;
    border-radius: var(--radius-full);
    font-size: 13px;
    font-weight: 600;
    box-shadow: var(--shadow-md);
}

/* ============================================
   FEATURE PILLS
   ============================================ */
.feature-pill-icon {
    margin-bottom: 8px;
}

.feature-pill-text {
    font-size: 14px;
    color: var(--cwm-muted);
    line-height: 1.5;
}

/* ============================================
   SECTION HEADERS
   ============================================ */
.section-header {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 64px;
}

.section-label {
    display: inline-block;
    color: var(--cwm-orange);
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 16px;
}

.section-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 16px;
}

.section-description {
    font-size: 1.125rem;
    color: var(--cwm-muted);
}
/* ============================================
   COURSE SECTION HEADER
   ============================================ */
.courses-section-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 48px;
}

.courses-section-label {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.courses-section-label .label-number {
    font-size: 14px;
    font-weight: 700;
    color: var(--cwm-orange);
}

.courses-section-label .label-line {
    width: 40px;
    height: 2px;
    background: var(--cwm-black);
}

.courses-section-label .label-text {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--cwm-orange);
}

.courses-section-title {
    font-size: 2.5rem;
    font-weight: 700;
    flex: 1;
    margin: 0;
}

.courses-view-all {
    flex-shrink: 0;
    margin-left: auto;
}

/* Discount Badge */
.discount-badge {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: var(--cwm-orange);
    color: var(--cwm-white);
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 6px;
}

.course-thumbnail {
    position: relative;
}

/* ============================================
   COURSE CARDS
   ============================================ */
.courses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 32px;
}

.course-card {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-card);
    overflow: hidden;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
    position: relative;
    display: flex;
    flex-direction: column;
}

.course-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-premium);
}

.course-card-header {
    padding: var(--sp-12) var(--sp-16);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.course-instructor-meta {
    display: flex;
    align-items: center;
    gap: var(--sp-8);
}

.course-instructor-meta img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.course-instructor-meta span {
    font-size: var(--fs-small);
    font-weight: 500;
    color: var(--cwm-muted);
}

.batch-badge {
    background: linear-gradient(90deg, #E91E63 0%, #C2185B 100%);
    color: var(--cwm-white);
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 4px;
    text-transform: uppercase;
}

.course-thumbnail {
    margin: 0 var(--sp-12);
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16/9;
}

.course-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-content {
    padding: var(--sp-24);
    flex-grow: 1;
}

.course-meta-top {
    display: flex;
    gap: var(--sp-16);
    margin-bottom: var(--sp-12);
    font-size: var(--fs-meta);
    color: var(--cwm-muted);
}

.course-meta-top span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.course-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: var(--sp-24);
    color: var(--cwm-black);
}

.course-card-footer {
    padding: var(--sp-16) var(--sp-24);
    border-top: 1px solid var(--cwm-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.course-rating {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #FFB800;
    font-size: 13px;
    font-weight: 600;
}

.course-status {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #111;
}

.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #E91E63;
}

.course-price-wrap {
    text-align: right;
}

.course-price-original {
    font-size: 12px;
    color: var(--cwm-muted);
    text-decoration: line-through;
    display: block;
}

.course-price-current {
    font-size: 18px;
    font-weight: 700;
    color: #3b82f6; /* Modern Blue */
}


/* ============================================
   FEATURE CARDS (Insights & Guidance)
   ============================================ */
.features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.feature-card {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 32px;
    transition: all var(--transition-base);
}

.feature-card:hover {
    border-color: var(--cwm-orange);
    box-shadow: var(--shadow-lg);
}

.feature-card-icon {
    width: 64px;
    height: 64px;
    background-color: var(--cwm-orange-light);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    color: var(--cwm-orange);
    font-size: 28px;
}

.feature-card-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 12px;
}

.feature-card-text {
    font-size: 15px;
    color: var(--cwm-muted);
    line-height: 1.7;
}

/* ============================================
   INSTRUCTOR SECTION
   ============================================ */
.instructor-section {
    background-color: var(--cwm-warm-bg);
}

.instructor-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

.instructor-image {
    position: relative;
}

.instructor-image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

.instructor-content {
    max-width: 560px;
}

.instructor-quote {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 32px;
    padding-left: 24px;
    border-left: 4px solid var(--cwm-orange);
}

.instructor-signature {
    margin-bottom: 24px;
}

.instructor-name {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.instructor-title {
    font-size: 14px;
    color: var(--cwm-muted);
}

/* ============================================
   TESTIMONIALS
   ============================================ */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.testimonial-card {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 32px;
}

.testimonial-rating {
    display: flex;
    gap: 4px;
    color: #FFB800;
    margin-bottom: 16px;
}

.testimonial-text {
    font-size: 15px;
    line-height: 1.7;
    margin-bottom: 24px;
    color: var(--cwm-text);
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 16px;
}

.testimonial-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.testimonial-name {
    font-weight: 600;
    margin-bottom: 2px;
}

.testimonial-role {
    font-size: 13px;
    color: var(--cwm-muted);
}/* ============================================
   COURSES PAGE
   ============================================ */
.courses-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
    flex-wrap: wrap;
    gap: 16px;
}

.courses-page-title {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0;
}

.course-sort-select {
    padding: 10px 36px 10px 16px;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: var(--font-body);
    background: var(--cwm-white);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}

.course-sort-select:focus {
    outline: none;
    border-color: var(--cwm-orange);
}

/* ============================================
   ABOUT PAGE
   ============================================ */
.about-hero {
    background: linear-gradient(135deg, #f8f0ff 0%, #e8f4ff 50%, #fff0f8 100%);
    padding: 80px 0 60px;
    text-align: center;
}

.about-hero-badge {
    display: inline-block;
    font-size: 14px;
    color: var(--cwm-muted);
    margin-bottom: 16px;
}

.about-hero-title {
    font-size: 2.75rem;
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 1.2;
}

.about-hero-title .highlight {
    color: var(--cwm-orange);
}

.about-hero-description {
    font-size: 1rem;
    color: var(--cwm-muted);
    max-width: 550px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Stats */
.about-stats {
    padding: 48px 0;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.stat-card {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 32px;
    text-align: center;
    transition: all var(--transition-base);
}

.stat-card:hover {
    box-shadow: var(--shadow-premium);
    transform: translateY(-4px);
}

.stat-label {
    display: block;
    font-size: 14px;
    color: var(--cwm-muted);
    margin-bottom: 8px;
}

.stat-number {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--cwm-black);
    font-family: var(--font-heading);
}

/* Founder */
.founder-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 64px;
    align-items: center;
}

.founder-image img {
    width: 100%;
    border-radius: 20px;
    object-fit: cover;
}

.founder-placeholder {
    background: linear-gradient(135deg, #FF7200 0%, #E96500 100%);
    border-radius: 20px;
    width: 100%;
    aspect-ratio: 3/4;
    display: flex;
    align-items: center;
    justify-content: center;
}

.founder-placeholder span {
    font-size: 120px;
    color: #FFF;
    font-weight: 700;
    font-family: var(--font-heading);
}

.founder-label,
.offers-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.founder-label .label-number,
.offers-label .label-number {
    font-size: 14px;
    font-weight: 700;
    color: var(--cwm-orange);
}

.founder-label .label-line,
.offers-label .label-line {
    width: 40px;
    height: 2px;
    background: var(--cwm-black);
}

.founder-label .label-text,
.offers-label .label-text {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--cwm-orange);
}

.founder-title {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 24px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: -0.5px;
}

.founder-bio {
    margin-bottom: 24px;
    color: var(--cwm-muted);
    line-height: 1.8;
}

.founder-bio p {
    margin-bottom: 16px;
}

.founder-channel {
    margin-bottom: 24px;
    font-size: 14px;
}

.founder-channel strong {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    letter-spacing: 1px;
    color: var(--cwm-black);
}

.founder-channel a {
    color: var(--cwm-orange);
    word-break: break-all;
}

/* What We Offer */
.offers-title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 40px;
}

.offers-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.offer-card {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 32px;
    transition: all var(--transition-base);
}

.offer-card:hover {
    box-shadow: var(--shadow-premium);
    transform: translateY(-4px);
}

.offer-icon {
    width: 56px;
    height: 56px;
    background: var(--cwm-orange-light);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    margin-bottom: 16px;
}

.offer-card-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
}

.offer-card-text {
    font-size: 14px;
    color: var(--cwm-muted);
    line-height: 1.6;
}

@media (max-width: 768px) {
    .stats-grid,
    .offers-grid {
        grid-template-columns: 1fr;
    }
    
    .founder-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    
    .about-hero-title {
        font-size: 2rem;
    }
}

/* ============================================
   CTA BANNER
   ============================================ */
.cta-banner {
    background-color: var(--cwm-orange-light);
    padding: 80px 0;
    text-align: center;
}

.cta-banner-title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 16px;
}

.cta-banner-text {
    font-size: 1.125rem;
    color: var(--cwm-muted);
    margin-bottom: 32px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* ============================================
   STATS SECTION
   ============================================ */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}

.stat-card {
    text-align: center;
    padding: 32px;
}

.stat-number {
    font-size: 3rem;
    font-weight: 800;
    color: var(--cwm-orange);
    margin-bottom: 8px;
}

.stat-label {
    font-size: 14px;
    color: var(--cwm-muted);
    font-weight: 500;
}

/* ============================================
   FOOTER
   ============================================ */
.site-footer {
    background-color: var(--cwm-dark-bg);
    color: var(--cwm-white);
    padding: 80px 0 0;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 48px;
    margin-bottom: 64px;
}

.footer-brand {
    max-width: 300px;
}

.footer-logo {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 800;
    color: var(--cwm-white);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer-logo span {
    color: var(--cwm-orange);
}

.footer-description {
    font-size: 14px;
    color: #999;
    line-height: 1.7;
    margin-bottom: 24px;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social a {
    width: 40px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cwm-white);
    transition: all var(--transition-fast);
}

.footer-social a:hover {
    background-color: var(--cwm-orange);
    color: var(--cwm-white);
}

.footer-column h4 {
    color: var(--cwm-white);
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 24px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 12px;
}

.footer-links a {
    color: #999;
    font-size: 14px;
    transition: color var(--transition-fast);
}

.footer-links a:hover {
    color: var(--cwm-orange);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #999;
}

/* Footer Contact Items */
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    color: #ccc;
    font-size: 14px;
}

.footer-contact-item svg {
    flex-shrink: 0;
}

.footer-contact-item a {
    color: var(--cwm-orange);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.footer-contact-item a:hover {
    color: var(--cwm-white);
}

/* Footer Payment */
.footer-payment {
    display: flex;
    align-items: center;
    gap: 16px;
}

.pay-with-label {
    font-style: italic;
    color: #ffffff !important;
    font-size: 14px;
    white-space: nowrap;
}

.footer-payment img {
    max-height: 32px;
    width: auto;
}

/* ============================================
   CONTACT PAGE
   ============================================ */
.contact-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-bottom: 64px;
}

.contact-card {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 32px;
    text-align: center;
    transition: all var(--transition-base);
}

.contact-card:hover {
    border-color: var(--cwm-orange);
    box-shadow: var(--shadow-lg);
}

.contact-card-icon {
    width: 64px;
    height: 64px;
    background-color: var(--cwm-orange-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: var(--cwm-orange);
    font-size: 24px;
}

.contact-card-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.contact-card-text {
    font-size: 14px;
    color: var(--cwm-muted);
    margin-bottom: 8px;
}

.contact-card-value {
    font-size: 16px;
    font-weight: 600;
    color: var(--cwm-black);
    margin-bottom: 16px;
}

.contact-form-section {
    background-color: var(--cwm-warm-bg);
    padding: 64px;
    border-radius: var(--radius-lg);
}

/* ============================================
   FORMS
   ============================================ */
.form-group {
    margin-bottom: 24px;
}

.form-label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
    color: var(--cwm-text);
}

.form-input,
.form-textarea {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 15px;
    transition: border-color var(--transition-fast);
    background-color: var(--cwm-white);
}

.form-input:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--cwm-orange);
}

.form-textarea {
    min-height: 150px;
    resize: vertical;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* ============================================
   FAQ SECTION
   ============================================ */

/* ============================================
   PAGE CONTENT
   ============================================ */
.page-header {
    background-color: var(--cwm-warm-bg);
    padding: 80px 0;
    text-align: center;
}

.page-title {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 16px;
}

.page-content {
    padding: 64px 0;
}

.content-area {
    max-width: 800px;
    margin: 0 auto;
}

.content-area h2 {
    margin-top: 48px;
}

.content-area p {
    font-size: 1.0625rem;
    line-height: 1.8;
}

/* ============================================
   SIDEBAR
   ============================================ */
.sidebar {
    padding: 32px;
    background-color: var(--cwm-soft-gray);
    border-radius: var(--radius-lg);
}

.widget {
    margin-bottom: 32px;
}

.widget-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--cwm-border);
}

/* ============================================
   LEARNPRESS INTEGRATION
   ============================================ */
.learnpress-content {
    padding: 64px 0;
}

.lp-course-buttons {
    margin-top: 24px;
}

.lp-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    background-color: var(--cwm-orange);
    color: var(--cwm-white);
    border: none;
    border-radius: var(--radius-sm);
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.lp-button:hover {
    background-color: var(--cwm-orange-hover);
}

/* ============================================
   WOOCOMMERCE INTEGRATION
   ============================================ */
.woocommerce .products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 32px;
}

.woocommerce .product {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.woocommerce .product:hover {
    box-shadow: var(--shadow-lg);
}

.woocommerce .product img {
    width: 100%;
    height: auto;
}

.woocommerce .product .button {
    background-color: var(--cwm-orange);
    color: var(--cwm-white);
    border-radius: var(--radius-sm);
}

.woocommerce .product .button:hover {
    background-color: var(--cwm-orange-hover);
}

/* ============================================
   RESPONSIVE STYLES
   ============================================ */
@media (max-width: 1024px) {
    .hero-inner {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .hero-content {
        max-width: 100%;
    }
    
    .hero-buttons {
        justify-content: center;
    }
    
    .hero-visual {
        order: -1;
    }
    
    .feature-pills-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .features-grid,
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .instructor-grid {
        grid-template-columns: 1fr;
    }
    
    .instructor-image {
        order: -1;
    }
    
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    :root {
        --section-padding: 60px;
    }
    
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
    
    .hero {
        padding: 80px 0;
    }
    
    .hero-title {
        font-size: 2.25rem;
    }
    
    .main-navigation {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--cwm-white);
        flex-direction: column;
        padding: 24px;
        border-bottom: 1px solid var(--cwm-border);
        box-shadow: var(--shadow-lg);
    }
    
    .main-navigation.toggled {
        display: flex;
    }
    
    .main-navigation ul {
        flex-direction: column;
        gap: 16px;
    }
    
    .menu-toggle {
        display: block;
    }
    
    .header-buttons {
        display: none;
    }
    
    .feature-pills-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .features-grid,
    .testimonials-grid,
    .courses-grid {
        grid-template-columns: 1fr;
    }
    
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    
    .footer-bottom {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .contact-grid {
        grid-template-columns: 1fr;
    }
    
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .contact-form-section {
        padding: 32px;
    }
}

@media (max-width: 480px) {
    .hero-title {
        font-size: 1.75rem;
    }
    
    .hero-buttons {
        flex-direction: column;
    }
    
    .btn {
        width: 100%;
    }
    
    .feature-pills-grid {
        grid-template-columns: 1fr;
    }
}

/* Footer Pay With Section */
.footer-pay-with {
    padding: var(--sp-24) 0;
    border-top: 1px solid var(--cwm-border);
    margin-top: var(--sp-48);
}

.pay-with-inner {
    display: flex;
    align-items: center;
    gap: var(--sp-24);
}

.pay-with-label {
    font-size: 18px;
    font-weight: 600;
    color: #1a237e; /* Dark Blue from screenshot */
    white-space: nowrap;
}

.pay-with-divider {
    width: 1px;
    height: 32px;
    background-color: var(--cwm-border);
}

.pay-with-icons {
    display: flex;
    align-items: center;
    gap: var(--sp-12);
    flex-wrap: wrap;
}

.pay-icon {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: 8px;
    padding: 6px 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
}

.pay-icon img {
    max-height: 24px;
    width: auto;
}

@media (max-width: 768px) {
    .pay-with-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--sp-16);
    }
    .pay-with-divider {
        display: none;
    }
}

/* ============================================
   SINGLE COURSE PAGE
   ============================================ */
.course-header {
    padding: var(--sp-64) 0;
    border-bottom: 1px solid var(--cwm-border);
}

.course-breadcrumb {
    margin-bottom: var(--sp-24);
    font-size: 14px;
    font-weight: 500;
    color: var(--cwm-muted);
}

.course-breadcrumb a {
    color: var(--cwm-orange);
}

.course-breadcrumb .divider {
    margin: 0 8px;
}

.course-single-title {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: var(--sp-24);
    max-width: 800px;
}

.course-excerpt {
    font-size: 18px;
    color: var(--cwm-text);
    margin-bottom: var(--sp-32);
    max-width: 800px;
    line-height: 1.6;
}

.course-meta-header {
    display: flex;
    align-items: center;
    gap: var(--sp-32);
    flex-wrap: wrap;
}

.course-meta-header .instructor {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
}

.course-meta-header .instructor img {
    border-radius: 50%;
}

.course-meta-header .meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: var(--cwm-text);
}

.course-layout-grid {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 48px;
}

.course-main-content {
    min-width: 0;
}

.course-video-preview {
    margin-bottom: var(--sp-48);
}

.course-video-preview img {
    width: 100%;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
}

/* Tabs */
.course-tabs {
    margin-top: var(--sp-48);
}

.course-tab-nav {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 0 var(--sp-32) 0;
    border-bottom: 1px solid var(--cwm-border);
    gap: 40px;
}

.course-tab-nav li {
    padding: 16px 0;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    color: var(--cwm-muted);
    transition: color var(--transition-base);
}

.course-tab-nav li:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 0;
    height: 3px;
    background-color: var(--cwm-orange);
    transition: width var(--transition-base);
}

.course-tab-nav li.active {
    color: var(--cwm-black);
}

.course-tab-nav li.active:after {
    width: 100%;
}

.course-tab-content {
    display: none;
    line-height: 1.8;
}

.course-tab-content.active {
    display: block;
}

/* Sidebar */
.course-purchase-card {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-card);
    padding: var(--sp-32);
    position: sticky;
    top: 100px;
    box-shadow: var(--shadow-md);
}

.price-box {
    margin-bottom: var(--sp-24);
}

.price-box .current-price {
    font-size: 32px;
    font-weight: 800;
    color: var(--cwm-black);
}

.price-box .old-price {
    font-size: 18px;
    color: var(--cwm-muted);
    text-decoration: line-through;
    margin-left: 12px;
}

.purchase-actions .lp-button {
    width: 100%;
    margin-bottom: 12px;
    padding: 16px;
    border-radius: var(--radius-btn);
    font-weight: 700;
    text-transform: none;
}

.course-features-list {
    margin-top: var(--sp-32);
}

.course-features-list h4 {
    font-size: 16px;
    margin-bottom: 16px;
}

.course-features-list ul {
    list-style: none;
    padding: 0;
}

.course-features-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    font-size: 15px;
    color: var(--cwm-text);
}

.course-features-list li svg {
    color: var(--cwm-orange);
}

/* LearnPress Curriculum Overrides */
.curriculum-sections {
    list-style: none;
    padding: 0;
}

.curriculum-sections .section-header {
    background: #f8f9fa;
    padding: 16px 24px;
    border: 1px solid var(--cwm-border);
    border-radius: 8px;
    margin-bottom: 8px;
    font-weight: 700;
    display: flex;
    justify-content: space-between;
}

.section-content {
    list-style: none;
    padding: 0 0 16px 0;
}

.course-item {
    display: flex;
    align-items: center;
    padding: 12px 24px;
    border-bottom: 1px solid #f0f0f0;
    gap: 16px;
}

.course-item:hover {
    background: #fffcf9;
}

@media (max-width: 992px) {
    .course-layout-grid {
        grid-template-columns: 1fr;
    }
    .course-sidebar {
        order: -1;
    }
    .course-purchase-card {
        position: static;
    }
}

/* Additional LearnPress Refinements */
.lp-course-buttons .lp-button {
    background: var(--cwm-orange) !important;
    color: var(--cwm-white) !important;
    border: none !important;
    transition: all var(--transition-base) !important;
}

.lp-course-buttons .lp-button:hover {
    background: var(--cwm-black) !important;
    transform: translateY(-2px);
}

.course-item .item-name {
    font-weight: 500;
    color: var(--cwm-black);
}

.course-item .item-meta {
    margin-left: auto;
    font-size: 13px;
    color: var(--cwm-muted);
}

.curriculum-sections .section-header .section-title {
    font-size: 18px;
    margin: 0;
}

/* Ensure logo doesn't overflow */
.site-branding a {
    display: inline-block;
    line-height: 0;
}

.site-branding .custom-logo-link {
    display: flex;
    align-items: center;
}

/* Hero Content Centering */
.hero-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 80px 0;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.text-center {
    text-align: center;
}

.hero-badge {
    display: inline-flex !important;
    align-self: center;
}

/* FAQ Accordion Styling */
.faq-accordion {
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    background: var(--cwm-white);
    overflow: hidden;
}

.faq-item {
    border-bottom: 1px solid var(--cwm-border);
}

.faq-item:last-child {
    border-bottom: none;
}

.faq-question {
    padding: 16px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-weight: 600;
    font-size: 18px;
    list-style: none;
    user-select: none;
    transition: background var(--transition-base);
}

.faq-question::-webkit-details-marker {
    display: none;
}

.faq-question:hover {
    background-color: var(--cwm-orange-light);
}

.faq-question svg {
    transition: transform var(--transition-base);
    color: var(--cwm-orange);
}

.faq-item[open] .faq-question {
    background-color: var(--cwm-orange-light);
}

.faq-item[open] .faq-question svg {
    transform: rotate(180deg);
}

.faq-answer {
    padding: 0 24px 16px;
    color: var(--cwm-text);
    line-height: 1.7;
}

/* Contact Form 7 Global Styling */
.wpcf7-form {
    display: grid;
    gap: 20px;
}

.wpcf7-form-control-wrap {
    display: block;
    margin-bottom: 5px;
}

.wpcf7-text,
.wpcf7-email,
.wpcf7-textarea,
.wpcf7-select {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid var(--cwm-border) !important;
    border-radius: var(--radius-sm) !important;
    font-family: var(--font-body) !important;
    font-size: 15px !important;
    background: #fff !important;
    transition: border-color var(--transition-base) !important;
}

.wpcf7-text:focus,
.wpcf7-email:focus,
.wpcf7-textarea:focus {
    border-color: var(--cwm-orange) !important;
    outline: none !important;
}

.wpcf7-submit {
    background-color: var(--cwm-orange) !important;
    color: #fff !important;
    border: none !important;
    padding: 14px 40px !important;
    font-family: var(--font-heading) !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    border-radius: var(--radius-sm) !important;
    cursor: pointer !important;
    transition: all var(--transition-base) !important;
}

.wpcf7-submit:hover {
    background-color: var(--cwm-black) !important;
    transform: translateY(-2px);
}

.wpcf7-spinner {
    position: absolute;
}

/* Modern Feature Pills / Stats */
.feature-pills {
    padding: 80px 0;
    background-color: var(--cwm-white);
}

.feature-pills-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

@media (max-width: 992px) {
    .feature-pills-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .feature-pills-grid {
        grid-template-columns: 1fr;
    }
}

.feature-pill {
    padding: 40px;
    background: #FFFFFF;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    text-align: center;
    transition: all var(--transition-base);
    height: 100%;
}
/* Preserve LearnPress icon font */
[class*="lp-icon"], [class*="lp-icon"]::before, [class*="lp-icon"]::after {
    font-family: "lp-icon" !important;
}

h1, h2, h3, h4, h5, h6, .site-title, .course-title {
    font-family: var(--font-heading), sans-serif !important;
}

/* ============================================
   REDESIGNED COURSE HEADER
   ============================================ */
.cwm-course-header {
    background: linear-gradient(135deg, #f8f0ff 0%, #e8f4ff 50%, #fff0f8 100%);
    padding: 50px 0 40px;
}
.cwm-course-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
    align-items: center;
}
.cwm-batch-badge {
    background: linear-gradient(135deg, #ff6b9d, #c44dff);
    color: #fff;
    padding: 6px 18px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.cwm-cat-tag {
    background: rgba(255, 255, 255, 0.85);
    color: #333;
    padding: 6px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(4px);
}
.cwm-course-title {
    font-size: 42px !important;
    font-weight: 800 !important;
    line-height: 1.2;
    color: #1a1a2e;
    margin: 0 0 32px 0;
    max-width: 800px;
}
.cwm-course-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    margin-bottom: 32px;
}
.cwm-meta-instructor {
    display: flex;
    align-items: center;
    gap: 12px;
}
.cwm-meta-instructor img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}
.cwm-meta-instructor-info {
    display: flex;
    flex-direction: column;
}
.cwm-meta-label {
    font-size: 12px;
    color: #888;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.cwm-meta-instructor-info strong,
.cwm-meta-updated strong {
    font-size: 15px;
    color: #1a1a2e;
}
.cwm-meta-updated {
    display: flex;
    flex-direction: column;
}
.cwm-meta-rating {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cwm-stars {
    display: flex;
    gap: 2px;
}
.cwm-meta-rating > span {
    font-size: 14px;
    color: #555;
}
/* Bottom Info Cards */
.cwm-course-info-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-top: 8px;
}
.cwm-info-card {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 12px;
    padding: 18px 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    transition: box-shadow 0.2s ease;
}
.cwm-info-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.cwm-info-card-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cwm-orange);
}
.cwm-info-card-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cwm-info-card-label {
    font-size: 12px;
    color: #888;
    font-weight: 500;
}
.cwm-info-card-content strong {
    font-size: 15px;
    color: #1a1a2e;
}

/* Restored LP course header display */

@media (max-width: 768px) {
    .cwm-course-title {
        font-size: 28px !important;
    }
    .cwm-course-meta-row {
        gap: 20px;
    }
    .cwm-course-info-cards {
        grid-template-columns: 1fr;
    }
}

/* Footer & Header & Course Header Backgrounds */
.site-footer, .page-header {
    background: linear-gradient(135deg, #f8f0ff 0%, #e8f4ff 50%, #fff0f8 100%) !important;
}

/* Adjust text to be dark since background is now light */
.site-header .site-title, .site-header .site-title a, .site-header .logo-text, .site-header .site-logo a {
    color: #000 !important;
}
.site-header .site-logo span {
    color: var(--cwm-orange) !important;
}
.site-header .nav-menu a {
    color: #1A1D20 !important;
}
.site-header .nav-menu a:hover {
    color: var(--cwm-orange) !important;
}

.lp-single-course__header .course-title, .lp-single-course__header .learn-press-breadcrumb, .lp-single-course__header .learn-press-breadcrumb a, .lp-single-course__header .course-instructor, .lp-single-course__header .course-instructor a, .lp-single-course__header label, .lp-single-course__header .item-meta, .lp-single-course__header i {
    color: #1A1D20 !important;
}

.site-footer, .site-footer .footer-description, .site-footer .footer-links a, .site-footer .footer-bottom, .site-footer .footer-contact-item {
    color: #1A1D20 !important;
}
.site-footer .footer-logo, .site-footer .footer-column h4 {
    color: #000 !important;
}
.site-footer .footer-social a {
    background-color: rgba(0, 0, 0, 0.05) !important;
    color: #1A1D20 !important;
}
.site-footer .footer-social a:hover {
    background-color: var(--cwm-orange) !important;
    color: var(--cwm-white) !important;
}
.site-footer .footer-links a:hover {
    color: var(--cwm-orange) !important;
}
.site-footer .footer-bottom {
    border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* Scroll To Top Button */
.scroll-top {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    background-color: var(--cwm-orange) !important;
    color: var(--cwm-white) !important;
    border-radius: 100% !important;
    width: 50px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 9999 !important;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(255, 114, 0, 0.3) !important;
    border: none !important;
    cursor: pointer !important;
}
.scroll-top.visible {
    opacity: 1 !important;
    visibility: visible !important;
}
.scroll-top svg {
    stroke: var(--cwm-white) !important;
    width: 24px !important;
    height: 24px !important;
}

/* LP Single Course Right Sidebar Overrides */
.lp-single-course-main__right {
    background: transparent;
    border-radius: 20px;
    box-shadow: none;
    padding: 0 !important;
    overflow: visible;
    border: none;
    font-family: var(--font-primary), sans-serif !important;
}
.lp-single-course-main__right * {
    font-family: var(--font-primary), sans-serif !important;
}
.lp-single-course-main__right__inner {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    overflow: hidden;
}
.lp-single-course-main__right .course-img {
    margin: 0 !important;
    border-radius: 20px 20px 0 0;
    overflow: hidden;
    order: 1;
}
.lp-single-course-main__right .course-img img {
    width: 100%;
    display: block;
}
.lp-single-course-main__right .course-price {
    display: block;
    padding: 24px 24px 10px;
    font-size: 28px;
    font-weight: 800;
    color: #1a202c;
    order: 2;
    font-family: var(--font-heading), sans-serif !important;
}
.lp-single-course-main__right .course-price .price {
    font-size: 28px !important;
    font-weight: 800 !important;
    font-family: var(--font-heading), sans-serif !important;
}
.lp-single-course-main__right .course-buttons {
    padding: 0 24px 20px;
    order: 3;
}
.lp-single-course-main__right .button-purchase-course,
.lp-single-course-main__right .lp-button {
    width: 100%;
    background: var(--cwm-orange) !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 16px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    font-family: var(--font-primary), sans-serif !important;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s ease;
    border: none !important;
    cursor: pointer;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
.lp-single-course-main__right .button-purchase-course:after,
.lp-single-course-main__right .lp-button:after {
    content: ' →';
    margin-left: 8px;
    font-size: 18px;
}
.lp-single-course-main__right .button-purchase-course:hover,
.lp-single-course-main__right .lp-button:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 114, 0, 0.3);
}
.lp-single-course-main__right .info-metas {
    padding: 24px;
    border-top: 1px solid #f0f0f0;
    order: 4;
}
.lp-single-course-main__right .info-metas::before {
    content: 'This course includes:';
    display: block;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
    color: #1a202c;
    font-family: var(--font-heading), sans-serif !important;
}
.lp-single-course-main__right .info-meta-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid #f5f5f5;
    font-size: 15px;
}
.lp-single-course-main__right .info-meta-item:last-child {
    border-bottom: none;
}
.lp-single-course-main__right .info-meta-left {
    display: flex;
    align-items: center;
    color: #4a5568;
    font-weight: 500;
    font-size: 15px;
}
.lp-single-course-main__right .info-meta-left i {
    margin-right: 12px;
    font-size: 16px;
    color: #718096;
}
.lp-single-course-main__right .info-meta-right {
    font-weight: 600;
    color: #1a202c;
    font-size: 15px;
}
.lp-single-course-main__right .social-swapper {
    display: none !important;
}
.lp-single-course-main__right .course-featured-review {
    display: none !important;
}

/* ============================================
   CONTINUE BUTTON (Logged-in Student)
   ============================================ */
.lp-single-course-main__right .course-buttons {
    margin-top: 16px;
}
.lp-single-course-main__right .course-btn-continue {
    width: 100%;
    background: var(--cwm-orange) !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 16px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    font-family: var(--font-primary), sans-serif !important;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s ease;
    border: none !important;
    cursor: pointer;
}
.lp-single-course-main__right .course-btn-continue:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 114, 0, 0.3);
}

/* ============================================
   COURSE PROGRESS SECTION (Modern Redesign)
   ============================================ */

/* Animated gradient keyframes */
@keyframes cwm-progress-shimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}
@keyframes cwm-progress-grow {
    from { width: 0; }
}

.lp-single-course-main__right .info-learning,
.info-learning {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 24px !important;
    border: 1px solid #f0f0f0;
    margin-bottom: 20px;
}

/* Progress header text */
.info-learning .course-progress__heading,
.info-learning > div:first-child {
    font-size: 14px;
    font-weight: 600;
    color: #1a202c;
    margin-bottom: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Progress bar track */
.course-progress__line,
.lp-course-progress .learn-press-progress,
.learn-press-progress {
    width: 100% !important;
    height: 12px !important;
    background: #f0f0f5 !important;
    border-radius: 100px !important;
    overflow: hidden !important;
    position: relative !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.06) !important;
}

/* Animated active bar */
.course-progress__line__active,
.learn-press-progress .progress-bg .progress-active,
.learn-press-progress__active,
.learn-press-progress .progress-bg {
    height: 100% !important;
    border-radius: 100px !important;
    background: linear-gradient(
        90deg,
        #ff7200 0%,
        #ff9a44 25%,
        #ff7200 50%,
        #e85d00 75%,
        #ff7200 100%
    ) !important;
    background-size: 200% auto !important;
    animation: cwm-progress-shimmer 3s linear infinite, cwm-progress-grow 1.5s ease-out !important;
    position: relative !important;
    transition: width 0.8s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* Glow effect on bar */
.course-progress__line__active::after,
.learn-press-progress__active::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 100px;
    box-shadow: 0 0 12px rgba(255, 114, 0, 0.4), 0 0 4px rgba(255, 114, 0, 0.2);
    pointer-events: none;
}

/* Progress percentage text */
.info-learning .course-progress__percentage {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: var(--cwm-orange) !important;
}

/* Passing grade & start date text */
.info-learning .course-progress__result,
.info-learning .lp-course-progress-status {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f5f5f5;
}

/* HIDE passing grade label and number */
.info-learning .course-progress > .course-progress__label:last-child,
.info-learning .lp-course-progress-status > span {
    display: none !important;
}

.info-learning .course-progress__result > span,
.info-learning .course-progress__result > div {
    font-size: 13px;
    color: #666;
    display: flex;
    align-items: center;
    gap: 4px;
}

.info-learning .course-progress__result strong {
    color: #1a202c;
    font-weight: 600;
}

/* When progress is at 0% make the bar visible with minimum width */
.info-learning .learn-press-progress .progress-bg[style*="width: 0"],
.info-learning .course-progress__line__active[style*="width: 0%"] {
    min-width: 0 !important;
    animation: none !important;
}

/* Override LP default progress bar styles */
.lp-single-course-main__right .lp-course-progress .progress-bg {
    background: #f0f0f5 !important;
    height: 100% !important;
    border-radius: 100px !important;
}
.lp-single-course-main__right .lp-course-progress .progress-bg::before {
    display: none !important;
}

/* ============================================
   COURSE CURRICULUM REDESIGN
   ============================================ */
.course-curriculum {
    margin-top: 24px;
}

.course-curriculum .curriculum-sections {
    list-style: none;
    padding: 0;
    margin: 0;
}

.course-curriculum .section,
.course-curriculum .course-section {
    margin-bottom: 16px;
    background: transparent;
    border: none !important; /* Remove outer border */
}

.course-curriculum .section.active,
.course-curriculum .course-section.active {
    border: 1px solid var(--lp-border-color, #e2e0db) !important;
    border-radius: 6px !important;
    margin-bottom: 16px;
}

.course-curriculum .section-header,
.course-curriculum .course-section-header {
    background-color: #fff !important;
    border: 1px solid #e0e2ea !important;
    border-radius: 6px !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 16px 20px !important;
}

/* Active State for header - merge with section border */
.course-curriculum .section.active .section-header,
.course-curriculum .course-section.active .course-section-header {
    background: #f4f6fc !important;
    border: none !important; /* Remove header border when active */
    border-bottom: 1px solid #e0e2ea !important; /* Keep bottom divider */
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.course-curriculum .section-header .section-left,
.course-curriculum .course-section-header .section-left,
.course-curriculum .course-section-info {
    display: flex;
    flex-direction: column;
    flex: 1;
    order: 1;
}

.course-curriculum .section-count-items {
    order: 2;
    font-weight: 600;
    color: #111827;
    margin-right: 12px;
}

.course-curriculum .section-title,
.course-curriculum .course-section__title {
    padding: 0 !important; /* Remove padding */
    font-size: 20px !important;
    font-weight: 500 !important;
    color: #374151;
    margin: 0 !important;
    display: flex;
    align-items: center;
}

.course-curriculum .section.active .section-title,
.course-curriculum .course-section.active .course-section__title {
    color: #3b82f6;
}

/* Description logic: Hide when collapsed, show when active */
.course-curriculum .section-desc,
.course-curriculum .course-section__description {
    display: none !important;
    padding: 8px 0 16px 0 !important; /* Aligned with title */
    font-size: 15px;
    color: #666;
    margin: 0;
}

.course-curriculum .section.active .section-desc,
.course-curriculum .course-section.active .course-section__description {
    display: block !important;
}

/* Custom Orange Right Arrow */
.course-curriculum .section-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    order: 3;
}
.course-curriculum .section-toggle i { display: none !important; }
.course-curriculum .section-toggle::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff7200' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.3s ease;
}
.course-curriculum .section.active .section-toggle::before,
.course-curriculum .course-section.active .section-toggle::before {
    transform: rotate(90deg) !important;
}

/* Item List */
.course-curriculum .section-content {
    padding: 0;
    margin: 0;
    background: #fff;
    border-top: 1px solid #e0e2ea;
}

.course-curriculum .section-content li {
    list-style: none;
    border-bottom: 1px solid #f3f4f6;
}
.course-curriculum .section-content li:last-child {
    border-bottom: none;
}

.course-curriculum .section-item-link {
    display: flex;
    align-items: center;
    padding: 16px 24px 16px 40px;
    color: #4b5563;
    text-decoration: none;
    font-size: 18px;
}

.course-curriculum .section-item-link:hover {
    background: #f9fafb;
    color: #111827;
}

/* Locks / Icons */
.course-curriculum .item-meta {
    margin-left: auto;
}

/* ============================================
   COURSE TABS & DESCRIPTION (SHOW MORE)
   ============================================ */
.course-tabs-wrapper {
    margin-bottom: 24px;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 16px;
}

.course-tab-nav {
    display: flex;
    gap: 12px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.course-tab-nav li {
    padding: 10px 24px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 15px;
    cursor: pointer;
    border: 1px solid #e5e7eb;
    color: #4b5563;
    background: #fff;
    transition: all 0.3s ease;
}

.course-tab-nav li.active {
    background: #3b82f6;
    color: #fff;
    border-color: #3b82f6;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
}

/* Description Show More */
.cwm-clamped-content {
    max-height: 250px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.4s ease;
}

.cwm-clamped-content::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100px;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    pointer-events: none;
}

.cwm-clamped-content.expanded {
    max-height: 5000px; /* arbitrary large value */
}
.cwm-clamped-content.expanded::after {
    display: none;
}

.cwm-show-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #3b82f6;
    font-weight: 600;
    font-size: 15px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px 0;
    margin-top: 10px;
}

.cwm-show-more-btn:hover {
    color: #2563eb;
    text-decoration: underline;
}

/* ============================================
   RELATED COURSES REDESIGN
   ============================================ */
.lp-list-courses-related {
    margin-top: 60px;
    padding-top: 40px;
    border-top: 1px solid #e5e7eb;
}

.lp-list-courses-related .section-title,
.lp-list-courses-related h3 {
    font-size: 24px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 24px;
}

.lp-list-courses-related .learn-press-courses {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 24px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.lp-list-courses-related .course-item {
    width: 100% !important;
    margin: 0 !important;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    background: #fff;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lp-list-courses-related .course-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.06);
}

.lp-list-courses-related .course-item-image {
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
    aspect-ratio: 4/3;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lp-list-courses-related .course-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lp-list-courses-related .course-item-title {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 8px;
    line-height: 1.4;
}

.lp-list-courses-related .course-item-title a {
    color: inherit;
    text-decoration: none;
}

.lp-list-courses-related .course-instructor {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 16px;
}
.lp-list-courses-related .course-instructor strong {
    color: #111827;
}

.lp-list-courses-related .course-item-meta {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #4b5563;
}

.lp-list-courses-related .course-item-meta > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lp-list-courses-related .course-item-price {
    font-size: 20px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 16px;
}

.lp-list-courses-related .course-item-btn {
    display: block;
    width: 100%;
    text-align: center;
    padding: 12px;
    border: 1px solid #111827;
    border-radius: 8px;
    color: #111827;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
}

.lp-list-courses-related .course-item-btn:hover {
    background: #111827;
    color: #fff;
}

/* ============================================
   INSTRUCTOR REDESIGN
   ============================================ */
.cwm-instructor-title {
    font-size: 24px;
    font-weight: 700;
    color: #0a0f25;
    margin: 48px 0 24px 0;
}

.course-author .lp-course-author,
.instructor-profile {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    padding: 32px;
    background: #fff;
    border: 1px solid #e0e2ea;
    border-radius: 16px;
    margin-top: 24px;
}

.course-author__pull-left,
.instructor-avatar {
    flex-shrink: 0;
    width: 150px !important;
    height: 150px !important;
    border-radius: 50% !important;
    background: #f0f2f5;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06);
    border: 4px solid #fff;
}

.course-author__pull-left img,
.instructor-avatar img,
.instructor-profile .avatar,
.course-author .avatar {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

.course-author__pull-right,
.instructor-info {
    flex-grow: 1;
}

.author-bio,
.instructor-description {
    font-size: 16px;
    line-height: 1.7;
    color: #4b5563;
    margin-top: 15px;
    max-width: 800px;
}

.cwm-instructor-meta-row {
    border-bottom: 1px solid #f3f4f6;
    margin-bottom: 20px;
    padding-bottom: 5px;
}

.course-author__pull-right .author-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin-bottom: 8px !important;
}

.course-author__pull-right .author-description {
    font-size: 16px;
    color: #4b5563;
    line-height: 1.6;
    margin-top: 16px;
}

/* Responsive */
@media (max-width: 768px) {
    .course-author .lp-course-author {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

/* ============================================
   YOU MIGHT BE INTERESTED IN (Related Courses)
   ============================================ */
.lp-list-courses-related {
    margin-top: 80px !important;
    padding-top: 40px;
    border-top: 1px solid #f0f0f0;
}

.lp-list-courses-related .section-title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin-bottom: 32px !important;
}

.lp-list-courses-related .lp-courses-related {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 24px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Course Card Design */
.course-card {
    background: #fff;
    border: 1px solid #e0e2ea;
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
}

.course-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
    border-color: var(--cwm-orange);
}

.course-card-header {
    padding: 12px 16px;
    background: #fafafa;
    border-bottom: 1px solid #f3f4f6;
}

.course-instructor-meta {
    display: flex;
    align-items: center;
    gap: 10px;
}

.course-instructor-meta img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
}

.course-instructor-meta span {
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
}

.course-thumbnail {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9;
    overflow: hidden;
}

.course-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.course-card:hover .course-thumbnail img {
    transform: scale(1.05);
}

.course-content {
    padding: 16px;
    flex-grow: 1;
}

.course-meta-top {
    display: flex;
    gap: 15px;
    margin-bottom: 10px;
}

.course-meta-top span {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #6b7280;
}

.course-meta-top svg {
    color: #9ca3af;
}

.course-card .course-title {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

.course-card .course-title a {
    color: #111827;
    text-decoration: none;
    transition: color 0.2s;
}

.course-card .course-title a:hover {
    color: var(--cwm-orange);
}

.course-card-footer {
    padding: 16px;
    background: #fafafa;
    border-top: 1px solid #f3f4f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.course-rating {
    display: flex;
    align-items: center;
    gap: 6px;
}

.course-rating .stars {
    color: #ffb800;
    letter-spacing: 1px;
}

.course-rating .rating-score {
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

.course-price-current {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
}

/* ============================================
   BLOG & ARCHIVE PAGES
   ============================================ */
.blog-card {
    background: #fff;
    border: 1px solid #e0e2ea;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    margin-bottom: 32px;
}

.blog-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
    border-color: var(--cwm-orange);
}

.blog-card-thumbnail {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9;
    overflow: hidden;
}

.blog-card-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.blog-card:hover .blog-card-thumbnail img {
    transform: scale(1.05);
}

.blog-card-category {
    position: absolute;
    top: 16px;
    left: 16px;
    background: var(--cwm-orange);
    padding: 4px 12px;
    border-radius: 6px;
    z-index: 10;
}

.blog-card-category a {
    color: #fff !important;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
}

.blog-card-content {
    padding: 24px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.blog-card-meta {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.blog-card-meta span {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #6b7280;
}

.blog-card-meta svg {
    color: #9ca3af;
}

.blog-card-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 12px !important;
}

.blog-card-title a {
    color: #111827;
    text-decoration: none;
    transition: color 0.2s;
}

.blog-card-title a:hover {
    color: var(--cwm-orange);
}

.blog-card-excerpt {
    font-size: 15px;
    line-height: 1.6;
    color: #4b5563;
    margin-bottom: 20px;
    flex-grow: 1;
}

.blog-card-footer {
    padding-top: 16px;
    border-top: 1px solid #f3f4f6;
}

.read-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    font-weight: 700;
    color: #111827;
    text-decoration: none;
    transition: all 0.2s;
}

.read-more:hover {
    color: var(--cwm-orange);
    gap: 10px;
}

/* Pagination */
.pagination {
    margin-top: 48px;
    display: flex;
    justify-content: center;
}

.pagination .nav-links {
    display: flex;
    gap: 8px;
}

.pagination .page-numbers {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e0e2ea;
    border-radius: 8px;
    color: #111827;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.2s;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
    background: var(--cwm-orange);
    border-color: var(--cwm-orange);
    color: #fff;
}

/* Single Post */
.single-post .page-header {
    background: #fdf8f4;
    padding: 80px 0 !important;
    margin-bottom: 60px !important;
    border-bottom: 1px solid #fcefe3;
}

.single-post .page-title {
    font-size: 48px !important;
    line-height: 1.2 !important;
    max-width: 900px;
    margin: 0 auto !important;
}

.entry-content {
    font-size: 18px;
    line-height: 1.8;
    color: #374151;
}

.entry-content p {
    margin-bottom: 24px;
}

.entry-content h2 {
    font-size: 32px;
    font-weight: 700;
    margin: 48px 0 24px;
}

.entry-content h3 {
    font-size: 24px;
    font-weight: 700;
    margin: 32px 0 16px;
}

.entry-content blockquote {
    border-left: 4px solid var(--cwm-orange);
    padding: 24px 32px;
    background: #fff9f2;
    font-style: italic;
    font-size: 20px;
    margin: 40px 0;
    border-radius: 0 16px 16px 0;
}


/* Blog Layout */
.blog-layout {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 64px;
    align-items: start;
}

.posts-grid {
    display: grid;
    gap: 40px;
}

@media (max-width: 1024px) {
    .blog-layout {
        grid-template-columns: 1fr;
    }
}

.page-header .page-title {
    font-size: 42px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 48px;
}


/* Single Post Elements */
.post-meta {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-bottom: 16px;
}

.post-meta span {
    font-size: 14px;
    font-weight: 600;
    color: var(--cwm-orange);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.post-author-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
}

.post-author-meta .author-avatar img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.post-author-meta .author-name {
    font-size: 16px;
    font-weight: 500;
    color: #4b5563;
}

.post-thumbnail {
    margin-bottom: 48px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
}

.post-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

.post-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 40px;
}

.post-tags a {
    padding: 6px 16px;
    background: #f3f4f6;
    border-radius: 8px;
    font-size: 14px;
    color: #4b5563;
    text-decoration: none;
    transition: all 0.2s;
}

.post-tags a:hover {
    background: var(--cwm-orange);
    color: #fff;
}

.post-share {
    padding: 32px;
    background: #f9fafb;
    border-radius: 16px;
    margin-bottom: 48px;
}

.post-share h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 16px;
}

.share-links {
    display: flex;
    gap: 12px;
}

.share-btn {
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
}

.share-btn.twitter { background: #1DA1F2; }
.share-btn.facebook { background: #1877F2; }
.share-btn.linkedin { background: #0A66C2; }

.author-box {
    display: flex;
    gap: 32px;
    padding: 40px;
    background: #fff9f2;
    border-radius: 20px;
    margin-bottom: 64px;
    align-items: center;
}

.author-box-avatar img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.author-box-info h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 8px;
}

.author-box-info p {
    font-size: 16px;
    line-height: 1.6;
    color: #4b5563;
    margin: 0;
}

/* Post Navigation */
.post-navigation {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 64px;
}

.post-navigation .nav-links {
    display: contents;
}

.post-navigation a {
    padding: 24px;
    border: 1px solid #e0e2ea;
    border-radius: 16px;
    text-decoration: none;
    transition: all 0.2s;
}

.post-navigation a:hover {
    border-color: var(--cwm-orange);
    background: #fff;
}

.post-navigation .nav-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cwm-orange);
    margin-bottom: 8px;
}

.post-navigation .nav-title {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}


/* ============================================
   GLOBAL TYPOGRAPHY & RESET
   ============================================ */
body {
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--cwm-black);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--cwm-black);
    margin: 0;
    line-height: var(--lh-heading);
}

h1 { font-size: var(--fs-page-title); font-weight: var(--fw-bold); line-height: var(--lh-page); letter-spacing: -0.02em; }
h2 { font-size: var(--fs-section-title); font-weight: var(--fw-bold); line-height: var(--lh-section); letter-spacing: -0.015em; }
h3 { font-size: var(--fs-subsection); font-weight: var(--fw-bold); line-height: var(--lh-subsection); letter-spacing: -0.01em; }

.hero-title {
    font-size: var(--fs-hero) !important;
    font-weight: var(--fw-extrabold) !important;
    line-height: var(--lh-hero) !important;
    letter-spacing: -0.02em !important;
}

.section-title {
    font-size: var(--fs-section-title) !important;
    font-weight: var(--fw-bold) !important;
    line-height: var(--lh-section) !important;
}

.lead-text {
    font-size: var(--fs-lead);
    line-height: var(--lh-lead);
    color: var(--cwm-muted);
}

/* Section Spacing */
.section {
    padding-top: var(--section-pad);
    padding-bottom: var(--section-pad);
}

.section-warm {
    background-color: var(--cwm-warm-bg);
}

.container {
    max-width: var(--container);
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

.container-narrow {
    max-width: var(--container-narrow);
}

/* Responsive Typography */
@media (max-width: 768px) {
    :root {
        --fs-hero: 34px;
        --fs-page-title: 30px;
        --fs-section-title: 26px;
        --fs-subsection: 22px;
        --fs-card-title: 18px;
        --fs-body: 15px;
        
        --section-pad: var(--space-48);
    }
}


/* Typography Scale Refinement */
@media (min-width: 769px) {
    .hero-title { font-size: 52px !important; line-height: 1.08 !important; letter-spacing: -0.02em !important; font-weight: 800 !important; }
    .page-title { font-size: 44px !important; line-height: 1.12 !important; letter-spacing: -0.02em !important; font-weight: 700 !important; }
    .section-title { font-size: 36px !important; line-height: 1.18 !important; letter-spacing: -0.015em !important; font-weight: 700 !important; }
    .subsection-title { font-size: 28px !important; line-height: 1.22 !important; letter-spacing: -0.01em !important; font-weight: 700 !important; }
}

@media (max-width: 768px) {
    .hero-title { font-size: 34px !important; line-height: 1.12 !important; }
    .page-title { font-size: 30px !important; line-height: 1.15 !important; }
    .section-title { font-size: 26px !important; line-height: 1.2 !important; }
    .subsection-title { font-size: 22px !important; line-height: 1.25 !important; }
}

/* Eyebrow / Label Text */
.section-label {
    display: block;
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cwm-orange);
    margin-bottom: 12px;
}

/* Body Text Rules */
p, .entry-content p {
    max-width: 65ch;
    margin-bottom: var(--space-24);
    color: var(--cwm-muted);
}

/* Card Guidelines */
.card, .course-card, .blog-card {
    border-radius: var(--radius-lg);
    padding: var(--space-24);
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    box-shadow: var(--shadow-soft);
    transition: all 0.3s ease;
}

.card:hover, .course-card:hover, .blog-card:hover {
    box-shadow: var(--shadow-hover);
    transform: translateY(-4px);
}


/* Instructor Section */
.instructor-grid {
    display: grid;
    grid-template-columns: 450px 1fr;
    gap: 64px;
    align-items: center;
}

.instructor-image {
    position: relative;
}

.instructor-img {
    width: 100%;
    aspect-ratio: 3/4;
    object-fit: cover;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-soft);
}

.instructor-placeholder {
    background: linear-gradient(135deg, var(--cwm-orange) 0%, var(--cwm-orange-hover) 100%);
    border-radius: var(--radius-xl);
    width: 100%;
    aspect-ratio: 3/4;
    display: flex;
    align-items: center;
    justify-content: center;
}

.instructor-placeholder span {
    font-size: 120px;
    color: #FFF;
    font-weight: 700;
    font-family: var(--font-heading);
}

.instructor-content .section-header {
    text-align: left;
    margin-bottom: var(--space-32);
}

.instructor-bio {
    font-size: var(--fs-lead);
    line-height: var(--lh-body);
    color: var(--cwm-muted);
    margin-bottom: var(--space-32);
}

.instructor-meta {
    margin-bottom: var(--space-40);
}

.instructor-name {
    font-size: 24px;
    font-weight: 700;
    color: var(--cwm-black);
}

.instructor-title {
    font-size: 16px;
    color: var(--cwm-muted);
    font-weight: 500;
}

@media (max-width: 1024px) {
    .instructor-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .instructor-image {
        max-width: 450px;
        margin: 0 auto;
    }
}


/* Consolidated Course Card (Guideline 16 compliant) */
.course-card {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: 16px !important;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
}

.course-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
}

.course-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.course-instructor-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.course-instructor-meta img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.course-instructor-meta span {
    font-size: 13px;
    font-weight: 500;
    color: var(--cwm-muted);
}

.course-thumbnail {
    margin-bottom: 14px;
    border-radius: var(--radius-thumb);
    overflow: hidden;
    aspect-ratio: 16/9;
}

.course-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.course-card:hover .course-thumbnail img {
    transform: scale(1.05);
}

.course-meta-top {
    display: flex;
    gap: 12px;
    margin-bottom: 10px;
}

.course-meta-top span {
    font-size: 13px;
    color: var(--cwm-muted);
    display: flex;
    align-items: center;
    gap: 5px;
}

.course-card .course-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 0 12px 0 !important;
}

.course-card .course-title a {
    color: var(--cwm-black);
    text-decoration: none;
}

.course-card .course-title a:hover {
    color: var(--cwm-orange);
}

.course-card-footer {
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--cwm-border);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.course-rating {
    font-size: 13px;
    color: #FACC15; /* Star color */
}

.course-status {
    font-size: 12px;
    font-weight: 600;
    color: #10B981; /* Green color */
    display: flex;
    align-items: center;
    gap: 6px;
}

.status-dot {
    width: 6px;
    height: 6px;
    background: currentColor;
    border-radius: 50%;
}


/* Consolidated Hero Section (Guideline 15 compliant) */
.hero {
    padding-top: var(--space-40);
    padding-bottom: var(--space-80);
}

.hero-inner {
    background-color: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-2xl);
    padding: 72px 48px;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 64px;
    align-items: center;
    box-shadow: var(--shadow-soft);
}

.hero-content {
    max-width: 600px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--cwm-orange-light);
    color: var(--cwm-orange);
    border-radius: var(--radius-pill);
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 24px;
}

.hero-title {
    margin-bottom: 16px !important;
}

.hero-description {
    font-size: 18px;
    line-height: 1.7;
    color: var(--cwm-muted);
    margin-bottom: 24px;
    max-width: 55ch;
}

.hero-buttons {
    display: flex;
    gap: 12px;
    margin-bottom: 32px;
}

.hero-trust {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--cwm-muted-light);
    font-weight: 500;
}

.hero-image img, .hero-video-wrapper {
    width: 100%;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-hover);
}

@media (max-width: 1024px) {
    .hero-inner {
        grid-template-columns: 1fr;
        padding: 48px 24px;
        gap: 40px;
        text-align: center;
    }
    
    .hero-content {
        max-width: 100%;
        margin: 0 auto;
    }
    
    .hero-buttons {
        justify-content: center;
    }
    
    .hero-trust {
        justify-content: center;
    }
}


/* Full Width Hero Override */
.hero-inner {
    border-radius: 0 !important;
    border: none !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 100px 64px !important;
}


/* Fixed Feature Pills (Guideline 11 & 12 compliant) */
.feature-pills {
    padding: var(--space-80) 0 !important;
    background-color: var(--cwm-white);
}

.feature-pills-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-24);
}

.feature-pill {
    padding: var(--space-32);
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    text-align: left; /* Changed to left-align for a more premium look */
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.feature-pill:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-hover);
    border-color: var(--cwm-orange);
}

.feature-pill-icon {
    width: 56px;
    height: 56px;
    background-color: var(--cwm-orange-light);
    color: var(--cwm-orange);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-24);
}

.feature-pill-title {
    font-size: var(--fs-card-small);
    font-weight: 700;
    color: var(--cwm-black);
    margin-bottom: var(--space-12);
}

.feature-pill-text {
    font-size: var(--fs-small);
    line-height: var(--lh-small);
    color: var(--cwm-muted);
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    .feature-pills-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .feature-pills-grid {
        grid-template-columns: 1fr;
    }
    .feature-pills {
        padding: var(--space-48) 0 !important;
    }
}


/* Centered Hero Content Box (Guideline 15 corrected) */
.hero {
    background-color: var(--cwm-warm-bg);
    padding: var(--space-40) var(--space-24) var(--space-80);
}


/* Dynamic Testimonials (Guideline 11 & 12 compliant) */
.testimonials-section {
    padding: var(--space-80) 0;
    background-color: var(--cwm-warm-bg); /* Using warm bg for separation */
}

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-24);
}

.testimonial-card {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: var(--space-32);
    box-shadow: var(--shadow-soft);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.testimonial-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-hover);
}

.testimonial-rating {
    margin-bottom: var(--space-20);
    display: flex;
    gap: 2px;
}

.testimonial-text {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--cwm-muted);
    margin-bottom: var(--space-32);
    flex-grow: 1;
    font-style: italic;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 12px;
}

.testimonial-avatar {
    width: 44px;
    height: 44px;
    background: var(--cwm-orange);
    color: var(--cwm-white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
}

.testimonial-name {
    font-size: 15px;
    font-weight: 700;
    color: var(--cwm-black);
    margin-bottom: 2px;
}

.testimonial-role {
    font-size: 13px;
    color: var(--cwm-muted-light);
    font-weight: 500;
}

@media (max-width: 1024px) {
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .testimonials-grid {
        grid-template-columns: 1fr;
    }
}


/* Insights Section (Guideline 24 compliant) */
.features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-24);
}

.feature-card {
    padding: var(--space-32);
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    transition: all 0.3s ease;
}

.feature-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-hover);
}

.feature-card-icon {
    width: 56px;
    height: 56px;
    background: var(--cwm-orange-light);
    color: var(--cwm-orange);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-24);
}

.feature-card-title {
    font-size: var(--fs-card-small);
    font-weight: 700;
    color: var(--cwm-black);
    margin-bottom: var(--space-12);
}

.feature-card-text {
    font-size: var(--fs-small);
    line-height: var(--lh-small);
    color: var(--cwm-muted);
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .features-grid {
        grid-template-columns: 1fr;
    }
}


/* High-Fidelity Curriculum Accordion (Guideline 17 compliant) */
.course-curriculum {
    margin-top: var(--space-32);
}

.course-curriculum .curriculum-sections {
    list-style: none;
    padding: 0;
    margin: 0;
}

.course-curriculum .section,
.course-curriculum .course-section {
    margin-bottom: var(--space-16);
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border) !important;
    border-radius: var(--radius-sm) !important;
    overflow: hidden;
    transition: all 0.3s ease;
}

.course-curriculum .section.active,
.course-curriculum .course-section.active {
    box-shadow: var(--shadow-soft);
    border-color: var(--cwm-orange) !important;
}

.course-curriculum .section-header,
.course-curriculum .course-section-header {
    background-color: var(--cwm-white) !important;
    padding: var(--space-16) var(--space-20) !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer;
    border: none !important;
}

.course-curriculum .section.active .section-header,
.course-curriculum .course-section.active .course-section-header {
    background-color: #FAFAFA !important;
    border-bottom: 1px solid var(--cwm-border) !important;
}

.course-curriculum .section-title,
.course-curriculum .course-section__title {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--cwm-black) !important;
    margin: 0 !important;
    flex: 1;
}

.course-curriculum .section.active .section-title,
.course-curriculum .course-section.active .course-section__title {
    color: var(--cwm-orange) !important;
}

.course-curriculum .section-toggle::before {
    width: 20px;
    height: 20px;
}

.course-curriculum .section.active .section-toggle::before {
    transform: rotate(90deg);
}

.course-curriculum .section-content {
    background: var(--cwm-white);
}

.course-curriculum .section-content .course-item {
    padding: 12px 20px;
    border-bottom: 1px solid var(--cwm-border);
    display: flex;
    align-items: center;
    gap: 12px;
}

.course-curriculum .section-content .course-item:last-child {
    border-bottom: none;
}

.course-curriculum .section-content .course-item .item-name {
    font-size: 15px;
    color: var(--cwm-muted);
}



/* Comments Area (Modern Styling) */
.comments-area {
    max-width: 800px;
    margin: 0 auto;
    padding: var(--space-64) 0;
}

.comments-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: var(--space-40);
}

.comment-list {
    list-style: none;
    padding: 0;
    margin: 0 var(--space-40) 0 0;
}

.comment-body {
    padding: var(--space-24) 0;
    border-bottom: 1px solid var(--cwm-border);
}

.comment-author {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
}

.comment-author img {
    border-radius: 50%;
}

.comment-author b {
    font-size: 16px;
    font-weight: 700;
}

.comment-metadata {
    font-size: 13px;
    color: var(--cwm-muted-light);
    margin-bottom: 12px;
}

.comment-content {
    font-size: 15px;
    line-height: 1.6;
    color: var(--cwm-text);
}

.reply {
    margin-top: 12px;
}

.comment-reply-link {
    font-size: 14px;
    font-weight: 600;
    color: var(--cwm-orange);
    text-decoration: none;
}

/* Comment Form */
#respond {
    margin-top: var(--space-64);
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: var(--space-40);
    box-shadow: var(--shadow-soft);
}

#reply-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: var(--space-24);
}

.comment-form p {
    margin-bottom: var(--space-20);
}

.comment-form label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 14px;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-primary);
    transition: all 0.3s ease;
}

.comment-form input:focus,
.comment-form textarea:focus {
    outline: none;
    border-color: var(--cwm-orange);
    box-shadow: 0 0 0 4px var(--cwm-orange-light);
}


/* Remove Post Navigation Residuals */
.navigation.post-navigation,
.post-navigation {
    display: none !important;
}


/* 404 Error Page Styling */
.error-404-page {
    padding: var(--space-120) 0;
    background-color: var(--cwm-white);
    text-align: center;
}

.error-content-wrapper {
    max-width: 600px;
    margin: 0 auto;
}

.error-badge {
    font-size: 120px;
    font-weight: 800;
    color: var(--cwm-orange);
    line-height: 1;
    margin-bottom: var(--space-24);
    opacity: 0.15;
    font-family: var(--font-heading);
}

.error-404-page .page-title {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: var(--space-16);
    color: var(--cwm-black);
}

.error-404-page .page-content p {
    font-size: 18px;
    color: var(--cwm-muted);
    margin-bottom: var(--space-40);
}

.error-search {
    margin-bottom: var(--space-48);
}

.error-search form {
    display: flex;
    max-width: 400px;
    margin: 0 auto;
    gap: 12px;
}

.error-search input[type="search"] {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-primary);
}

.error-search button[type="submit"] {
    padding: 12px 24px;
    background: var(--cwm-black);
    color: var(--cwm-white);
    border: none;
    border-radius: var(--radius-sm);
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.error-search button[type="submit"]:hover {
    background: var(--cwm-orange);
}


/* Modern Sidebar Redesign */
.sidebar {
    padding: 0 !important;
    background: transparent !important;
}

.widget {
    background: var(--cwm-white);
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-lg);
    padding: var(--space-32);
    margin-bottom: var(--space-32);
    box-shadow: var(--shadow-soft);
    transition: all 0.3s ease;
}

.widget:hover {
    box-shadow: var(--shadow-hover);
    border-color: var(--cwm-orange-light);
}

.widget-title, 
.widgettitle {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--cwm-black);
    margin-bottom: var(--space-24) !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
    position: relative;
    padding-left: 16px !important;
    font-family: var(--font-heading) !important;
}

.widget-title::before,
.widgettitle::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 24px;
    background: var(--cwm-orange);
    border-radius: 2px;
}

.widget ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.widget ul li {
    padding: 12px 0 !important;
    border-bottom: 1px solid #F1F1F1;
    font-family: var(--font-primary);
}

.widget ul li:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.widget ul li a {
    color: var(--cwm-muted) !important;
    text-decoration: none !important;
    font-size: 15px;
    transition: all 0.2s ease;
    display: block;
}

.widget ul li a:hover {
    color: var(--cwm-orange) !important;
    padding-left: 8px;
}

/* Sidebar Search Widget */
.widget_search .search-form {
    display: flex;
    gap: 8px;
}

.widget_search .search-field {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid var(--cwm-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
}

.widget_search .search-submit {
    background: var(--cwm-black);
    color: var(--cwm-white);
    border: none;
    padding: 0 20px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
}

.widget_search .search-submit:hover {
    background: var(--cwm-orange);
}


/* Global Page Header Spacing Update */
.page-header {
    margin-bottom: var(--space-48) !important;
}

/* Ensure blog specific alignment */
.blog .page-header,
.archive .page-header {
    background-color: var(--cwm-white) !important;
    padding: var(--space-64) 0 !important;
    text-align: left !important;
    border-bottom: 1px solid var(--cwm-border);
}

.blog .page-title,
.archive .page-title {
    font-size: 40px !important;
    font-weight: 800 !important;
    margin-bottom: 0 !important;
    text-transform: capitalize;
}


/* Centering Blog/Archive Headers as requested */
.blog .page-header,
.archive .page-header {
    text-align: center !important;
}


/* LearnPress Profile Courses Redesign (2-Column Grid) */
.profile-courses-list.learn-press-courses {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--space-32) !important;
    list-style: none !important;
    padding: 0 !important;
}

.profile-courses-list .course {
    width: 100% !important;
    margin: 0 !important;
}

.profile-courses-list .course-item {
    background: var(--cwm-white) !important;
    border: 1px solid var(--cwm-border) !important;
    border-radius: var(--radius-lg) !important;
    overflow: hidden !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    transition: all 0.3s ease !important;
    box-shadow: var(--shadow-soft) !important;
}

.profile-courses-list .course-item:hover {
    transform: translateY(-8px) !important;
    box-shadow: var(--shadow-hover) !important;
    border-color: var(--cwm-orange-light) !important;
}

.profile-courses-list .course-thumbnail {
    aspect-ratio: 16/9 !important;
    overflow: hidden !important;
}

.profile-courses-list .course-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.5s ease !important;
}

.profile-courses-list .course-item:hover .course-thumbnail img {
    transform: scale(1.05) !important;
}

.profile-courses-list .course-content {
    padding: var(--space-24) !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.profile-courses-list .course-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--cwm-black) !important;
    margin-bottom: var(--space-12) !important;
    font-family: var(--font-heading) !important;
    line-height: 1.3 !important;
}

.profile-courses-list .course-instructor-category {
    margin-bottom: var(--space-16) !important;
    font-size: 14px !important;
    color: var(--cwm-muted) !important;
}

.profile-courses-list .course-wrap-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin-bottom: var(--space-16) !important;
    padding: var(--space-12) 0 !important;
    border-top: 1px solid #F1F1F1 !important;
    border-bottom: 1px solid #F1F1F1 !important;
}

.profile-courses-list .meta-item {
    font-size: 13px !important;
    color: var(--cwm-muted-light) !important;
    display: flex !important;
    align-items: center !important;
}

.profile-courses-list .course-short-description {
    font-size: 14px !important;
    color: var(--cwm-muted) !important;
    line-height: 1.6 !important;
    margin-bottom: var(--space-24) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.profile-courses-list .course-info {
    margin-top: auto !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.profile-courses-list .course-price {
    font-weight: 800 !important;
    font-size: 18px !important;
    color: var(--cwm-black) !important;
}

.profile-courses-list .course-readmore a {
    display: inline-block !important;
    padding: 10px 20px !important;
    background: var(--cwm-orange) !important;
    color: var(--cwm-white) !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    transition: background 0.3s ease !important;
}

.profile-courses-list .course-readmore a:hover {
    background: var(--cwm-orange-hover) !important;
}

/* Responsive adjustment for Profile */
@media (max-width: 768px) {
    .profile-courses-list.learn-press-courses {
        grid-template-columns: 1fr !important;
    }
}


/* LearnPress Profile Header Alignment */
.lp-profile-content-area {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-32) !important;
    margin-bottom: var(--space-48) !important;
    padding: var(--space-32) !important;
    background: var(--cwm-white) !important;
    border: 1px solid var(--cwm-border) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-soft) !important;
}

.lp-profile-left {
    flex-shrink: 0 !important;
}

.lp-profile-left .user-avatar {
    position: relative !important;
    width: 120px !important;
    height: 120px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 4px solid var(--cwm-white) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

.lp-profile-left .user-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.lp-btn-to-edit-avatar {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: rgba(0,0,0,0.6) !important;
    color: #fff !important;
    font-size: 10px !important;
    text-align: center !important;
    padding: 4px 0 !important;
    text-decoration: none !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
}

.lp-profile-left .user-avatar:hover .lp-btn-to-edit-avatar {
    opacity: 1 !important;
}

.lp-profile-username {
    margin: 0 !important;
    font-size: 32px !important;
    font-weight: 800 !important;
    color: var(--cwm-black) !important;
    font-family: var(--font-heading) !important;
    text-transform: capitalize !important;
}

/* Mobile responsive for profile header */
@media (max-width: 640px) {
    .lp-profile-content-area {
        flex-direction: column !important;
        text-align: center !important;
    }
}


/* Modern Unboxed Hero Section */
.hero {
    background-color: var(--cwm-white) !important;
    padding: var(--space-80) 0 !important;
}

.hero-inner {
    max-width: var(--container) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1.2fr 1fr !important;
    gap: 64px !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

@media (max-width: 1024px) {
    .hero-inner {
        grid-template-columns: 1fr !important;
        text-align: center !important;
        gap: 40px !important;
    }
}


/* Testimonials Section - Background Update to White */
.testimonials-section {
    background-color: var(--cwm-white) !important;
}


/* Contact Form 7 - Premium Spacing & Grid */
.wpcf7-form {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
}

.wpcf7-form p {
    margin: 0 !important;
}

/* Custom Grid Utility for CF7 - Use this in CF7 editor */
.cf7-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-24);
}

@media (max-width: 640px) {
    .cf7-grid {
        grid-template-columns: 1fr;
    }
}

.wpcf7-form-control-wrap {
    display: block;
    margin-top: 8px;
}

.wpcf7-text, 
.wpcf7-email, 
.wpcf7-textarea, 
.wpcf7-select {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid var(--cwm-border) !important;
    border-radius: var(--radius-sm) !important;
    font-family: var(--font-primary) !important;
    background: #fff !important;
    transition: all 0.3s ease !important;
}

.wpcf7-text:focus, 
.wpcf7-email:focus, 
.wpcf7-textarea:focus {
    outline: none !important;
    border-color: var(--cwm-orange) !important;
    box-shadow: 0 0 0 4px var(--cwm-orange-light) !important;
}

.wpcf7-submit {
    background: var(--cwm-orange) !important;
    color: var(--cwm-white) !important;
    border: none !important;
    padding: 14px 32px !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.wpcf7-submit:hover {
    background: var(--cwm-orange-hover) !important;
    transform: translateY(-2px) !important;
}


/* Contact Form 7 - Grid & Row Layout Support */
.contact-form-grid {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-24);
}

@media (max-width: 640px) {
    .form-row {
        grid-template-columns: 1fr;
    }
}

.form-group {
    display: flex;
    flex-direction: column;
}

.form-group label {
    display: block;
    font-weight: 700;
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--cwm-black);
}

.form-submit {
    margin-top: var(--space-16);
}

.form-submit .wpcf7-submit {
    width: auto !important;
    min-width: 200px;
}



/* ==========================================================================
   CONSOLIDATED RESPONSIVE OVERRIDES
   ========================================================================== */

@media (max-width: 1024px) {
    /* Header & Navigation */
    .site-header {
        position: sticky !important;
        z-index: 1000 !important;
    }

    body.mobile-menu-open {
        overflow: hidden;
    }

    .main-navigation {
        display: flex !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(86vw, 360px) !important;
        max-width: 360px !important;
        height: 100dvh !important;
        background: var(--cwm-white) !important;
        padding: 96px 28px 32px !important;
        box-shadow: -24px 0 60px rgba(17, 17, 17, 0.18) !important;
        border-top: 0 !important;
        border-left: 1px solid rgba(17, 17, 17, 0.08) !important;
        z-index: 1002 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 24px !important;
        overflow-y: auto !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateX(105%) !important;
        transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.32s ease !important;
    }

    .main-navigation.toggled {
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(0) !important;
    }

    .mobile-menu-overlay {
        display: block !important;
        position: fixed !important;
        inset: 0 !important;
        background: rgba(17, 17, 17, 0.42) !important;
        backdrop-filter: blur(2px);
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: opacity 0.24s ease, visibility 0.24s ease !important;
        z-index: 1001 !important;
    }

    .main-navigation.toggled + .mobile-menu-overlay {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .main-navigation ul {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .main-navigation .nav-menu > li {
        border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
    }

    .main-navigation a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 16px 0 !important;
        color: var(--cwm-black) !important;
        font-size: 16px !important;
        font-weight: 650 !important;
        line-height: 1.3 !important;
        text-decoration: none !important;
    }

    .main-navigation .nav-menu a::after {
        content: "";
        width: 8px;
        height: 8px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        opacity: 0.35;
        transform: rotate(45deg);
        transition: opacity 0.2s ease, transform 0.2s ease;
    }

    .main-navigation .nav-menu a:hover::after {
        opacity: 1;
        transform: translateX(3px) rotate(45deg);
    }

    .mobile-account-actions {
        display: grid !important;
        gap: 12px !important;
        margin-top: auto !important;
        padding-top: 24px !important;
        border-top: 1px solid rgba(17, 17, 17, 0.08) !important;
    }

    .mobile-account-link {
        justify-content: center !important;
        min-height: 46px !important;
        padding: 13px 16px !important;
        border: 1px solid var(--cwm-border) !important;
        border-radius: 8px !important;
        background: #F9FAFB !important;
    }

    .mobile-account-link-primary {
        background: var(--cwm-orange) !important;
        border-color: var(--cwm-orange) !important;
        color: var(--cwm-white) !important;
    }

    body.admin-bar .main-navigation {
        top: 32px !important;
        height: calc(100dvh - 32px) !important;
    }

    /* Mobile menu toggle */
    .menu-toggle {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        width: 44px !important;
        height: 44px !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        gap: 5px !important;
        cursor: pointer !important;
        color: var(--cwm-black) !important;
        position: relative !important;
        z-index: 1003 !important;
    }

    .menu-toggle span {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 24px !important;
        min-width: 24px !important;
        height: 2px !important;
        min-height: 2px !important;
        margin: 0 !important;
        background-color: currentColor !important;
        transition: all 0.3s ease !important;
        border-radius: 2px !important;
        transform-origin: center !important;
    }

    /* Simple X Animation */
    .menu-toggle[aria-expanded="true"] span:nth-child(1) {
        transform: translateY(7px) rotate(45deg) !important;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity: 0 !important;
    }
    .menu-toggle[aria-expanded="true"] span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg) !important;
    }

    /* Contact Page Feature Pills */
    .feature-pills-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: var(--space-24) !important;
    }

    /* Course Grid Mobile Spacing */
    .courses-grid {
        grid-template-columns: 1fr !important;
        gap: var(--space-48) !important;
    }
}

@media (max-width: 640px) {
    .feature-pills-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 782px) {
    body.admin-bar .main-navigation {
        top: 46px !important;
        height: calc(100dvh - 46px) !important;
    }
}


/* LearnPress Profile - Compact Student Avatars */
.lp-cell-student .instructor-avatar {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-right: 12px !important;
}

.lp-cell-student .instructor-avatar img {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
}

.lp-cell-student {
    display: flex !important;
    align-items: center !important;
}

.lp-cell-student .lp-meta {
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.2 !important;
}

.lp-cell-student .lp-name {
    font-size: 14px !important;
    font-weight: 600 !important;
}

.lp-cell-student .lp-email {
    font-size: 12px !important;
    color: var(--cwm-muted) !important;
}


/* LearnPress Profile - Updated Student Avatars to 40px */
.lp-cell-student .instructor-avatar {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    margin-right: 16px !important;
}

.lp-cell-student .instructor-avatar img {
    width: 40px !important;
    height: 40px !important;
}

/* Force Toggle Visibility on Mobile */
@media screen and (max-width: 1024px) {
    header .menu-toggle,
    .site-header .menu-toggle,
    body .menu-toggle {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .menu-toggle span {
        display: block !important;
        visibility: visible !important;
        background-color: currentColor !important;
    }
}

/* Mobile Account Actions - Layout Polish */
.mobile-account-link {
    padding-left: var(--space-20) !important;
}

/* Adjusting Toggle Position to avoid overlap */
@media screen and (max-width: 1024px) {
    .menu-toggle {
        margin-top: -8px !important;
    }
}


/* Enhanced Responsive Padding for Mobile Account Links */
@media screen and (max-width: 1024px) {
    .mobile-account-actions a {
        padding: 14px 20px !important;
        display: flex !important;
        align-items: center !important;
    }
}

/* LearnPress Profile Page Fixes */
.profile-courses-list .course-readmore a,
.learn-press-profile .course-readmore a {
    border: none !important;
    outline: none !important;
}

.lp-wrap-btn-view-course-students .lp-btn-view-students,
button.lp-button.lp-btn-view-students {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 10px !important;
    background-color: var(--cwm-black, #000) !important;
    color: #fff !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: var(--radius-sm, 6px) !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}