/**
 * CMB responsive layout contract.
 * Loaded after legacy styles; scoped to the site, not the WordPress admin.
 * Gutters belong to outer containers; nested rows must not add viewport width.
 */
:root {
  --cmb-bg: #101010;
  --cmb-bg-surface: #1a1a1a;
  --cmb-bg-card: #1a1a1a;
  --cmb-text-muted: #aaaaaa;
  --cmb-border-mid: #333333;
  --cmb-gutter: clamp(18px, 3vw, 40px);
  --cmb-layout-width: 1240px;
  --cmb-card-radius: 16px;
  --cmb-layout-gap: clamp(20px, 2.5vw, 32px);
}

/* Intrinsic sizing: long titles, inputs and flex children can shrink. */
body.cmb-dark-mode :where(#main, #content, .section-content, .col, .col-inner,
  .row, .cmb-container, .cmb-footer-inner, [class^="cmb-"], [class*=" cmb-"]) {
  min-width: 0;
}
body.cmb-dark-mode #main :where(h1, h2, h3, h4, p, li, label, a, th, td) {
  overflow-wrap: anywhere;
}
body.cmb-dark-mode #main :where(h1, h2, h3, h4) {
  text-wrap: balance;
  line-height: 1.35;
}
body.cmb-dark-mode #main :where(p, li) { line-height: 1.8; }
body.cmb-dark-mode #main :where(img, video, iframe, audio, input, select, textarea) {
  max-width: 100%;
}
body.cmb-dark-mode #main :where(.button, button, [class*="cmb-hero-btn"], .cmb-btn-gold) {
  max-width: 100%;
  white-space: normal;
  height: auto;
  line-height: 1.5;
  text-align: center;
}
body.cmb-dark-mode #main :where(.button, [class*="cmb-hero-btn"], .cmb-btn-gold) > br { display: none; }
body.cmb-dark-mode #main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]), select) {
  min-height: 48px;
  font-size: 16px !important;
}
body.cmb-dark-mode #main textarea { font-size: 16px !important; min-height: 140px; }
body.cmb-dark-mode :where(button, a, input, select, textarea) { scroll-margin-block: 100px; }

/* Outer frames and nested Flatsome rows. Keep custom/narrow row widths. */
body.cmb-dark-mode #main .section > .section-content > .row,
body.cmb-dark-mode #main .section > .row {
  width: calc(100% - 2 * var(--cmb-gutter)) !important;
  max-width: var(--cmb-layout-width) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
body.cmb-dark-mode #main .section .row.row_sub1 { max-width: 900px !important; }
body.cmb-dark-mode #main .row .row {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
body.cmb-dark-mode #main .row > .col { min-width: 0; }
body.cmb-dark-mode #main .row-collapse > .col { padding-inline: 0 !important; }
body.cmb-dark-mode .cmb-container {
  width: 100%;
  max-width: var(--cmb-layout-width);
  margin-inline: auto;
  padding-inline: var(--cmb-gutter) !important;
}
body.cmb-dark-mode :is(.cmb-library-archive-wrap, .cmb-magazine-archive-wrap,
  .cmb-course-container, .cmb-student-portal, .cmb-student-settings-wrap,
  .cmb-student-billing-wrap, .cmb-student-courses-wrap,
  .cmb-wallet-dashboard-wrap, .cmb-wallet-topup-wrap) {
  width: 100%;
  max-width: var(--cmb-layout-width) !important;
  margin-inline: auto !important;
  padding-inline: var(--cmb-gutter) !important;
  padding-bottom: clamp(40px, 6vw, 80px) !important;
}
body.cmb-dark-mode #main .col-inner :is(.cmb-library-archive-wrap, .cmb-magazine-archive-wrap,
  .cmb-course-container, .cmb-student-portal, .cmb-student-settings-wrap,
  .cmb-student-billing-wrap, .cmb-student-courses-wrap,
  .cmb-wallet-dashboard-wrap, .cmb-wallet-topup-wrap) { padding-inline: 0 !important; }
body.cmb-dark-mode :is(.cmb-library-archive-wrap, .cmb-magazine-archive-wrap, .cmb-course-container,
  .cmb-student-portal, .cmb-student-settings-wrap, .cmb-student-billing-wrap,
  .cmb-student-courses-wrap, .cmb-wallet-dashboard-wrap, .cmb-wallet-topup-wrap) > .row {
  width: 100%; max-width: 100%; margin-inline: auto !important; padding-inline: 0 !important;
}
body.cmb-dark-mode #content.page-wrapper > .row {
  width: calc(100% - 2 * var(--cmb-gutter));
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

/* Homepage: matching edges, generous but proportional space, uncropped media. */
body.home #main .smcjhd,
body.home #main .sdfs { padding-block: clamp(36px, 5vw, 64px) !important; }
body.home #main :is(.smcjhd, .sdfs) > .section-content > .row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.home #main :is(.smcjhd, .sdfs) > .section-content > .row > .col {
  width: 100%; max-width: 100%; padding: 0 !important;
}
body.home #main :is(.smcjhd, .sdfs) .col-inner { margin: 0; }
body.home #main :is(.cx, .asd) p { text-align: start !important; }
body.home #main .row_sub1 .sd { max-width: 760px !important; margin-inline: auto; }
body.home #main .row_sub1 .sd p { padding-inline: 0 !important; }
body.home #main .row_sub1 .sd br { display: none; }
body.home #main .img img { height: auto !important; min-height: 0 !important; max-height: none !important; object-fit: contain !important; }
body.home #main .smcjhd .img-inner { border-radius: var(--cmb-card-radius); }
body.home #main .rowmmd {
  display: flex !important; flex-wrap: wrap !important;
  justify-content: center !important; gap: 16px !important;
}
body.home #main .rowmmd > .col {
  flex: 0 1 calc((100% - 64px) / 5) !important;
  max-width: 180px !important;
  padding: 0 !important;
}
body.home #main .rowmmd .img { width: 100% !important; margin-bottom: 0; }
body.home #main .rowmmd .img-inner { box-shadow: none !important; }
body.home #main .form_cnhs { padding: clamp(22px, 3vw, 36px) !important; }
body.cmb-dark-mode #main .video-fit { background: #080808; border-radius: var(--cmb-card-radius); }

/* Archive cards: a real grid replaces negative margins + percentage columns. */
body.cmb-dark-mode #cmb-library-grid,
body.cmb-dark-mode .cmb-magazine-archive-wrap > .row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--cmb-layout-gap);
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.cmb-dark-mode #cmb-library-grid > .col,
body.cmb-dark-mode .cmb-magazine-archive-wrap > .row > .col {
  width: 100% !important; max-width: 100% !important;
  padding: 0 !important; margin: 0 !important;
}
body.cmb-dark-mode :is(.cmb-library-card, .cmb-magazine-card, .cmb-card-luxury,
  .cmb-form-box, .cmb-login-card, .cmb-contact-card, .cmb-sticky-pricing) {
  padding: clamp(22px, 2.5vw, 32px) !important;
  border: 1px solid #333 !important;
  border-radius: var(--cmb-card-radius) !important;
  box-shadow: 0 8px 24px rgb(0 0 0 / 12%) !important;
}
body.cmb-dark-mode :is(.cmb-library-card, .cmb-magazine-card) { height: 100%; }
body.cmb-dark-mode :is(.cmb-library-card, .cmb-magazine-card) h3 {
  font-size: clamp(17px, 1.5vw, 20px) !important;
  line-height: 1.5 !important;
  text-wrap: pretty !important;
}
body.cmb-dark-mode :is(.cmb-library-card, .cmb-magazine-card) p { color: #aaa !important; }
body.cmb-dark-mode #cmb-library-filters {
  display: flex !important; flex-wrap: wrap !important;
  justify-content: center !important; gap: 10px !important;
  overflow: visible !important; padding: 0 !important; margin-inline: 0 !important;
}
body.cmb-dark-mode #cmb-library-filters .cmb-filter-pill {
  flex: 0 1 auto; min-width: 0; margin: 0; min-height: 44px;
  white-space: normal !important; box-shadow: none !important;
}
body.cmb-dark-mode .cmb-library-archive-wrap > .cmb-reveal > div[style*="position: absolute"] { max-width: 100%; }
body.cmb-dark-mode :is(.cmb-podcast-grid, .cmb-featured-grid, .cmb-series-grid) > * { min-width: 0; }
body.cmb-dark-mode .cmb-podcast-hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
body.cmb-dark-mode .cmb-search-box { min-width: 0; max-width: 100%; }
body.cmb-dark-mode :is(.cmb-hero-cta-group, .cmb-hero-btn-group, .cmb-breadcrumbs) { flex-wrap: wrap; }

/* Calm, consistent controls. Effects must never shift neighbouring content. */
body.cmb-dark-mode :is(.cmb-hero-btn-primary, .cmb-btn-gold, .button.primary,
  .cmb-filter-pill.is-active, .form_cnhs input[type="submit"], .cmb-wallet-btn-topup) {
  box-shadow: none !important;
  min-height: 46px;
}
body.cmb-dark-mode :is(.header-nav > li > a, .cmb-nav-student-wrap a) { box-shadow: none !important; }
@media (hover: hover) and (pointer: fine) {
  body.cmb-dark-mode #main :is(.button, .cmb-hero-btn-primary, .cmb-hero-btn-outline):hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgb(255 204 0 / 15%) !important;
  }
}

/* Footer does not assume an infinitely wide centre navigation column. */
body.cmb-dark-mode .cmb-footer-inner {
  width: 100%; max-width: var(--cmb-layout-width) !important;
  padding-inline: var(--cmb-gutter) !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 24px;
}
body.cmb-dark-mode .cmb-footer-nav ul { flex-wrap: wrap; justify-content: center; gap: 8px 24px !important; }
body.cmb-dark-mode .cmb-footer-nav li a { min-height: 36px; line-height: 1.5 !important; }
body.cmb-dark-mode .cmb-footer-social a { width: 40px; height: 40px; }
body.cmb-dark-mode .cmb-footer-legal { padding-inline: var(--cmb-gutter); }
body.cmb-dark-mode .cmb-footer-legal ul { flex-wrap: wrap; justify-content: center; }
body.cmb-dark-mode .cmb-footer-bottom { padding-inline: var(--cmb-gutter) !important; }
body.cmb-dark-mode .cmb-footer-legal a { color: #aaa !important; }

/* Tablet: two cards, full-width learning content and wrapping navigation. */
@media (max-width: 1100px) {
  body.cmb-dark-mode #header .header-inner { width: 100%; max-width: 100% !important; padding-inline: var(--cmb-gutter) !important; }
  body.cmb-dark-mode #header .header-nav { gap: 4px; }
  body.cmb-dark-mode #header .header-nav > li { margin-inline: 0 !important; }
  body.cmb-dark-mode #header .header-nav > li > a { font-size: 11px !important; padding-inline: 8px !important; }
  body.cmb-dark-mode #header #logo { width: 140px !important; margin-right: 12px; }
  body.cmb-dark-mode #header #logo img { max-width: 140px; }
  body.cmb-dark-mode .cmb-footer-inner { grid-template-columns: 1fr !important; justify-items: center; }
  body.cmb-dark-mode :is(.cmb-footer-logo, .cmb-footer-social) { justify-self: center !important; }
  body.cmb-dark-mode #cmb-library-grid,
  body.cmb-dark-mode .cmb-magazine-archive-wrap > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 849px) {
  /* Layout Stacking */
  body.cmb-dark-mode #main :is(.cmb-course-container, .cmb-lesson-cinema-wrap) .row > .col {
    flex-basis: 100% !important; max-width: 100% !important;
  }
  body.cmb-dark-mode :is(.cmb-sticky-pricing, .cmb-lesson-sidebar-box) { position: static !important; max-height: none !important; }
  
  /* Course Landing Page: Show Pricing & CTA right after summary on mobile */
  .cmb-course-container > .row.row-large {
    display: flex !important;
    flex-direction: column !important;
  }
  .cmb-course-container > .row.row-large > .col:last-child {
    order: -1 !important;
    margin-bottom: 24px !important;
  }

  /* Grid & Flex Layouts */
  body.cmb-dark-mode .cmb-podcast-hero-grid { grid-template-columns: minmax(0, 1fr); }
  body.cmb-dark-mode .cmb-podcast-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body.cmb-dark-mode #main .cmb-lesson-topbar { position: static !important; }
  body.cmb-dark-mode #main .cmb-lesson-topbar > div { flex-wrap: wrap; gap: 12px; padding-inline: var(--cmb-gutter) !important; }

  /* Anti-Clipping: Prevent button text truncation or overflowing boundaries */
  body.cmb-dark-mode #main :is(.button, .cmb-btn-gold, .cmb-hero-btn-primary, .cmb-hero-btn-outline, [class*="cmb-btn"]) {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    height: auto !important;
    line-height: 1.4 !important;
    text-align: center !important;
  }
  body.cmb-dark-mode #main :is(.cmb-course-cta-bottom .button, .cmb-sticky-pricing .button, .cmb-sticky-pricing .cmb-btn-gold, .cmb-sticky-pricing .cmb-btn-preview) {
    width: 100% !important;
    white-space: normal !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    letter-spacing: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  /* Podcast Filter Pills: Contained Horizontal Scroll (Zero Viewport Bleed) */
  body.cmb-dark-mode .cmb-toolbar-wrap {
    max-width: 100% !important;
    overflow: hidden !important;
    width: 100% !important;
  }
  body.cmb-dark-mode :is(.cmb-filter-pills, #cmb-podcast-filters) {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    max-width: 100% !important;
    width: 100% !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    padding-bottom: 8px !important;
    gap: 8px !important;
    scrollbar-width: none !important;
    box-sizing: border-box !important;
  }
  body.cmb-dark-mode :is(.cmb-filter-pills, #cmb-podcast-filters)::-webkit-scrollbar {
    display: none !important;
  }
  body.cmb-dark-mode :is(.cmb-filter-pills, #cmb-podcast-filters) > .cmb-pill {
    flex: 0 0 auto !important;
    scroll-snap-align: start !important;
    white-space: nowrap !important;
    min-height: 42px !important;
  }

  /* Touch Targets: WCAG 2.1 AA (min 44x44px) */
  body.cmb-dark-mode :is(.cmb-btn-card-listen, .cmb-btn-card-play) {
    min-height: 44px !important;
    padding: 10px 18px !important;
    font-size: 12.5px !important;
    border-radius: 999px !important;
  }
  body.cmb-dark-mode #main :is(.accordion-title, .accordion-item .toggle, .toggle) {
    min-height: 44px !important;
    min-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.cmb-dark-mode .cmb-card-detail-btn {
    min-height: 44px !important;
    padding: 8px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
  }
  body.cmb-dark-mode .cmb-ranking-play-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.cmb-dark-mode .cmb-thumb-play-overlay {
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 50% !important;
  }
  body.cmb-dark-mode :is(.cmb-btn-ctrl, .cmb-btn-speed) {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.cmb-dark-mode .cmb-progress-bar-wrap {
    height: 38px !important;
    padding: 10px 0 !important;
  }
  body.cmb-dark-mode #cmb-back-to-top {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    bottom: calc(74px + env(safe-area-inset-bottom, 8px)) !important;
    right: 16px !important;
  }
  body.cmb-dark-mode .cmb-toggle-pass {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.cmb-dark-mode #cmb-mobile-close {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Prevent Horizontal Glow/Ambient Bleed */
  body.cmb-dark-mode :is(.cmb-podcast-hub-hero, .cmb-magazine-hero, .cmb-magazine-archive-wrap, .cmb-hero-section, .banner) {
    overflow: hidden !important;
    max-width: 100vw !important;
  }
  body.cmb-dark-mode :is(.cmb-hero-glow-left, .cmb-hero-glow-right) {
    max-width: 100vw !important;
    pointer-events: none !important;
  }

  /* Bottom Floating Appbar & Spacing */
  body.cmb-dark-mode .cmb-mobile-appbar {
    padding: 6px 6px max(8px, env(safe-area-inset-bottom, 8px)) 6px !important;
    min-height: 58px !important;
  }
  body.cmb-dark-mode {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 8px)) !important;
  }
  body.cmb-dark-mode .cmb-toast {
    bottom: calc(78px + env(safe-area-inset-bottom, 8px)) !important;
    max-width: calc(100% - 32px) !important;
  }
  body.cmb-dark-mode .cmb-sticky-player {
    bottom: calc(58px + env(safe-area-inset-bottom, 8px)) !important;
  }
}

@media (max-width: 639px) {
  body.home #main :is(.smcjhd, .sdfs) > .section-content > .row { grid-template-columns: minmax(0, 1fr); }
  
  /* Homepage: 5 Platform Cards as smooth horizontal scroll snap row */
  body.home #main .rowmmd {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    gap: 12px !important;
    padding-bottom: 12px !important;
    padding-inline: var(--cmb-gutter) !important;
    justify-content: flex-start !important;
    scrollbar-width: none !important;
  }
  body.home #main .rowmmd::-webkit-scrollbar { display: none !important; }
  body.home #main .rowmmd > .col {
    flex: 0 0 140px !important;
    max-width: 140px !important;
    scroll-snap-align: center !important;
  }

  body.home #main :is(.cx, .asd) h3 { text-align: start; }
  body.cmb-dark-mode #cmb-library-grid,
  body.cmb-dark-mode .cmb-magazine-archive-wrap > .row,
  body.cmb-dark-mode .cmb-podcast-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body.cmb-dark-mode #cmb-library-filters .cmb-filter-pill { flex-basis: calc(50% - 5px); padding: 10px 8px !important; font-size: 11.5px !important; }
  body.cmb-dark-mode .cmb-magazine-archive-wrap .cmb-newsletter-form > div { grid-template-columns: minmax(0, 1fr) !important; }
  body.cmb-dark-mode #main :is(.cmb-hero-title, .cmb-course-title) { font-size: clamp(24px, 6.5vw, 32px) !important; }
  body.cmb-dark-mode #main :is(.cmb-hero-cta-group, .cmb-hero-btn-group) > a { width: 100%; margin-inline: 0 !important; }
  body.cmb-dark-mode :is(.cmb-student-portal, .cmb-student-settings-wrap, .cmb-student-billing-wrap,
    .cmb-student-courses-wrap, .cmb-wallet-dashboard-wrap, .cmb-wallet-topup-wrap) [style*="grid-template-columns"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body.cmb-dark-mode .cmb-dashboard-subnav { flex-wrap: wrap !important; overflow: visible !important; }
  body.cmb-dark-mode .cmb-dashboard-subnav > a { flex: 1 1 130px; min-width: 0 !important; white-space: normal; }
  
  /* Lesson Workspace Tabs: Horizontal Smooth Pill Bar */
  body.cmb-dark-mode #main .cmb-workspace-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    padding-bottom: 8px !important;
    gap: 8px !important;
    scrollbar-width: none !important;
  }
  body.cmb-dark-mode #main .cmb-workspace-tabs::-webkit-scrollbar { display: none !important; }
  body.cmb-dark-mode #main :is(.cmb-workspace-tab, .cmb-workspace-tab-btn) {
    flex: 0 0 auto !important;
    scroll-snap-align: start !important;
    white-space: nowrap !important;
    min-height: 42px !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    border-radius: 999px !important;
  }

  /* Form & Auth Cards on Mobile: Proper 16px side margin and padding */
  body.cmb-dark-mode :is(.cmb-form-box, .cmb-auth-card, .cmb-login-card) {
    width: calc(100% - 32px) !important;
    max-width: 100% !important;
    margin: 20px auto 40px auto !important;
    padding: 28px 20px !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
  }

  /* Form Inputs on Mobile: Prevent iOS Auto-Zoom */
  body.cmb-dark-mode #main :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]), select) {
    font-size: 16px !important;
    min-height: 48px !important;
    border-radius: 10px !important;
  }

  body.cmb-dark-mode #main .woocommerce .col { padding-inline: 0 !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.cmb-dark-mode :is(.cmb-reveal, .cmb-reveal-stagger > *, .cmb-ep-card) {
    opacity: 1 !important; visibility: visible !important; transform: none !important;
  }
  body.cmb-dark-mode #main :is(.button, .cmb-hero-btn-primary, .cmb-hero-btn-outline):hover { transform: none !important; }
}

@media (min-width: 850px) {
  /* Strict Desktop Header: Mobile Nav & mobile columns completely hidden */
  .header-main .flex-col.show-for-medium,
  .mobile-nav,
  .mobile-nav.nav-right,
  .mobile-nav.nav-left {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}