@charset "UTF-8";
/* -----------------------------------
 * 1. CONFIGURATION
 * ----------------------------------- */
/* ============================================
   DESIGN TOKENS — GLOBAL VARIABLES
   ============================================ */
/* Container */
/* Gutter system */
/* Spacings */
/* Breakpoints */
/* Hero design */
:root {
  --Font-Inter: "Inter", sans-serif;
  --Font-Playfair: "Playfair", serif;
  --Color-Gray-gray-700: #3F3F46;
  --Background-bg-page: #FBF9F6;
  --Color-Gray-gray-900: #18181B;
  --Font-Size-60: 60px;
  --white: rgba(255, 255, 255, 1) !important;
  --black-25: rgba(250, 250, 250, 1) !important;
  --black-50: rgba(246, 246, 246, 1) !important;
  --black-900: rgba(56, 56, 56, 1) !important;
  --black-950: rgba(38, 38, 38, 1) !important;
  --blue-900: rgba(38, 53, 130, 1) !important;
  --blue-800: rgba(41, 58, 164, 1) !important;
  --blue-600: rgba(52, 89, 220, 1) !important;
  --bg-blue-50: rgba(240, 245, 254, 1) !important;
  --blue-25: rgba(249, 251, 254, 1) !important;
  --blue-50: rgba(240, 245, 254, 1) !important;
  --blue-600: rgba(52, 89, 220, 1) !important;
  --blue-800: rgba(41, 58, 164, 1) !important;
  --blue-950: rgba(28, 35, 80, 1) !important;
  --blue: #001655;
  --blue-2: #1943bc;
  --white: #fff;
  --black: #000;
  --yellow: #ff8d3e;
  --background-gradient: radial-gradient(71.6% 152.65% at 10.93% 93.63%, rgba(244, 205, 28, 0.4) 0, rgba(247, 208, 0, 0) 100%);
  --line: #e5e5e5;
  --blue-3: #f7faff;
  --radical-gradient: radial-gradient(45.75% 101.5% at 50% 50%, rgba(44, 80, 185, 0) 0, rgba(44, 80, 185, 0.05) 100%);
  --gradient-blue: radial-gradient(100% 315.27% at 0 49.96%, #f5f8ff 0, rgba(245, 248, 255, 0) 100%);
  --icon-gradient: linear-gradient(180deg, rgba(25, 67, 188, 0.2) 0, rgba(25, 67, 188, 0.6) 100%);
}

/* ---------------------------------------------------
   FLEXBOX HELPERS
--------------------------------------------------- */
/* ---------------------------------------------------
   SIZE HELPERS
--------------------------------------------------- */
/* ---------------------------------------------------
   POSITION HELPERS
--------------------------------------------------- */
/* ---------------------------------------------------
   TRANSITIONS & ANIMATIONS
--------------------------------------------------- */
/* ---------------------------------------------------
   SPACING HELPERS
--------------------------------------------------- */
/* Usage:
 * @include p(20px);
 * @include px(20px);
 * @include pt(10px);
 */
/* ---------------------------------------------------
   TYPOGRAPHY HELPERS
--------------------------------------------------- */
/* ---------------------------------------------------
   RESPONSIVE HELPERS (FLATSOME)
--------------------------------------------------- */
/* Flatsome breakpoints:
 * xs (mobile):   <= 549px
 * sm (tablet):   550px – 849px
 * md (desktop):  >= 850px
 * lg (wide):     >= 1200px (tuỳ chọn, Flatsome không bắt buộc)
 */
/* Simple usage:
 * @include respond(xs) { ... }
 */
/* Smart usage: apply to a range
 * @include respond-max(849px) { ... }
 */
/* ---------------------------------------------------
   SHADOW HELPERS
--------------------------------------------------- */
/* ---------------------------------------------------
   GRADIENT HELPERS
--------------------------------------------------- */
/* ============================================
   GRID GUTTER MIXIN — giống Bootstrap
   ============================================ */
/* -----------------------------------
 * 2. BASE
 * ----------------------------------- */
html {
  scroll-behavior: smooth;
}

body {
  color: var(--general-foreground, #1F2937);
  /* paragraph/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.absolute-footer,
html {
  background-color: var(--general-accent, #F3F4F6);
}

.container,
.col,
.columns,
.gallery-item {
  padding-left: 12px;
  padding-right: 12px;
}

.col {
  padding-bottom: 24px;
}

.nav-column > li > a,
.nav-dropdown > li > a,
.nav-vertical-fly-out > li > a,
.nav > li > a {
  color: var(--general-secondary-foreground, #312E81);
}

/* 1) Ép toàn bộ icon- dùng Lucide */
i[class^=icon-],
i[class*=" icon-"],
[class^=icon-]:not(.icon-box-left),
[class*=" icon-"]:not(.icon-box-left) {
  font-family: "lucide" !important;
  font-style: normal !important;
  font-weight: 400 !important;
  speak: none !important;
  text-transform: none !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Auto-generated from Figma Tokens (TCP 2026) */
/* Shadcn-style CSS variables (HSL components) */
:root {
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans",
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  --font-definitions-font-family-body: var(--font-sans);
}

/* -----------------------------------
 * 3. COMPONENTS (reusable)
 * ----------------------------------- */
.accordion .toggle {
  left: unset;
  right: 0;
  margin-right: 0;
  top: 0.6em;
}

.accordion-item:first-of-type .accordion-title {
  border-top: none;
}

.accordion-item .accordion-title {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.accordion-title {
  padding: 16px 0;
  border-top: var(--general-foreground, #1F2937);
}

.accordion-title.active {
  border-top: var(--general-foreground, #1F2937);
  background-color: transparent;
}

.accordion-title .toggle .icon-angle-down::before {
  content: "\e06d";
}

.accordion-inner {
  padding: 0;
}

.accordion-inner p, .accordion-inner b, .accordion-inner span {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.button {
  display: inline-flex;
  min-height: 36px;
  padding: 8px var(--semantic-md, 16px);
  justify-content: center;
  align-items: center;
  gap: var(--semantic-xs, 8px);
  line-height: normal !important;
  border-radius: var(--semantic-rounded-lg, 8px);
  color: var(--general-primary-foreground, #F9FAFB);
  text-align: center;
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.07px;
}

.button.primary {
  color: var(--general-primary-foreground, #F9FAFB);
  background-color: var(--general-primary, #4F46E5);
  border-color: var(--general-primary, #4F46E5);
}

.button.primary:hover {
  background-color: var(--unofficial-primary-hover, #6366F1);
  border-color: var(--unofficial-primary-hover, #6366F1);
}

.button.primary.is-link {
  color: var(--general-muted-foreground, #6B7280);
  padding: 8px var(--semantic-md, 16px);
}

.button.primary.is-link:hover {
  color: var(--general-foreground, #1F2937);
  background-color: var(--unofficial-ghost-hover, rgba(0, 0, 0, 0.05)) !important;
  border-color: var(--unofficial-ghost-hover, rgba(0, 0, 0, 0.05)) !important;
}

.button.white {
  color: var(--general-secondary-foreground, #312E81);
  background-color: var(--indigo-50, #EEF2FF) !important;
  border-radius: var(--semantic-rounded-lg, 8px);
  border-color: var(--indigo-50, #EEF2FF);
}

.button.white.is-outline {
  border: 1px solid var(--unofficial-border-3, #D1D5DB);
  background-color: var(--unofficial-outline, rgba(255, 255, 255, 0.1)) !important;
  color: var(--general-foreground, #1F2937);
}

.button.white.is-outline:hover {
  background-color: var(--Color-Gray-gray-100, #F4F4F5) !important;
  background-color: var(--unofficial-outline-hover, rgba(51, 65, 85, 0.03));
  /* shadow-sm */
  box-shadow: var(--sm-shadow-1-x, 0) var(--sm-shadow-1-y, 1px) var(--sm-shadow-1-blur, 3px) var(--sm-shadow-1-spread, 0) var(--sm-color, rgba(55, 65, 81, 0.1)), 0 1px 2px -1px var(--sm-color, rgba(55, 65, 81, 0.1));
}

.button.white.is-link {
  border: none;
  background-color: transparent !important;
}

.button.is-badge {
  padding: 6px 12px;
  border-radius: 8px !important;
  min-height: unset;
}

.button.is-badge span {
  /* Semibold/text-xs */
  font-family: var(--Font-Inter, Inter);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  /* 133.333% */
}

.button.is-badge:not([href]) {
  pointer-events: none;
}

.button.blue-grey.is-badge {
  background-color: rgb(162, 180, 181);
  --text-color: var(--Color-Gray-gray-900, #18181B);
}

a[data-popup] {
  cursor: pointer;
}

.is-small,
.is-small.button {
  font-size: var(--paragraph-small-font-size, 14px);
}

.button,
button,
input[type=button],
input[type=reset],
input[type=submit] {
  text-transform: none;
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.button i,
button i {
  top: unset;
}

/* Component: CTA Banner (split content + media)
   File: assets/src/scss/components/_cta-banner.scss
*/
@media (max-width: 549px) {
  .c-cta-banner .c-cta-banner__layout-col > .col-inner {
    min-height: 400px;
  }
}
.c-cta-banner__layout.row-collapse .c-cta-banner__layout-col {
  /* col wrapper */
}

@media (max-width: 849px) {
  .c-cta-banner__layout.row-collapse .c-cta-banner__layout-col {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}
.c-cta-banner__layout-col > .col-inner {
  position: relative;
  padding: 80px;
  border-radius: var(--semantic-rounded-3xl, 24px);
  background: var(--gray-100, #F3F4F6);
}

@media (max-width: 849px) {
  .c-cta-banner__layout-col > .col-inner {
    padding: 40px;
  }
}
.c-cta-banner {
  /* Panel thật (row align-middle) */
}

.c-cta-banner__inner {
  position: relative;
  overflow: hidden;
  z-index: 1;
  padding: 0;
}

.c-cta-banner {
  /* Left content */
}

.c-cta-banner__content {
  position: relative;
  z-index: 2;
  padding-bottom: 0;
  display: flex;
  padding-right: 40px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.c-cta-banner__content h4 {
  color: var(--general-foreground, #1F2937);
  /* heading 2 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-2-font-size, 30px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-2-line-height, 120%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
}

@media (max-width: 849px) {
  .c-cta-banner__content h4 {
    font-size: 24px;
    line-height: var(--heading-3-line-height, 116.667%);
  }
}
.c-cta-banner__content .button {
  margin-bottom: 0;
}

.c-cta-banner {
  /* CTA button */
}

.c-cta-banner {
  /* Right media */
}

.c-cta-banner__media {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 0;
  max-width: 746px;
}

@media (max-width: 849px) {
  .c-cta-banner__media {
    width: 80% !important;
  }
}
@media (max-width: 549px) {
  .c-cta-banner__media {
    width: 100% !important;
  }
}
.c-cta-banner__media img {
  aspect-ratio: 746/345;
}

.row-small > .col,
.row-small > .flickity-viewport > .flickity-slider > .col {
  padding: 0 12px 24px;
}

.slider .flickity-page-dots {
  left: 7px;
  right: unset;
}

.slider .flickity-page-dots .dot {
  width: 32px;
  height: 8px;
  border-radius: 4px;
  background: var(--unofficial-accent-2, #E5E7EB);
  opacity: 1 !important;
}

.slider .flickity-page-dots .dot.is-selected {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: var(--gray-400, #9CA3AF);
}

.align-equal .flickity-slider > .col {
  display: flex;
  align-items: stretch;
  min-height: 100%;
}

.align-equal .flickity-slider > .col > .col-inner > * {
  height: 100%;
}

.learning-platform__gallery.flickity-enabled .flickity-button,
.home-courses__grid.flickity-enabled .flickity-button {
  display: none;
}

@media (max-width: 849px) {
  .js-slider-nav .flickity-slider > .col {
    max-width: 50% !important;
  }
}
@media (max-width: 549px) {
  .js-slider-nav .flickity-slider > .col {
    max-width: 80% !important;
  }
}
/* Component: Intro (eyebrow + title + desc + button) */
.c-intro {
  /* Eyebrow */
}

.c-intro__eyebrow p {
  margin: 0 0 8px 0;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(15, 23, 42, 0.6);
}

.c-intro {
  /* Body wrapper (title + desc) */
}

.c-intro__body h2,
.c-intro__body .c-intro__title {
  margin: 0;
  font-weight: 800;
  font-size: 26px;
  line-height: 1.15;
  color: #0f172a;
}

.c-intro__body p,
.c-intro__body .c-intro__desc {
  margin: 12px 0 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(15, 23, 42, 0.7);
}

.c-intro__title {
  margin: 0;
  font-weight: 800;
  font-size: 26px;
  line-height: 1.15;
  color: #0f172a;
}

.c-intro__desc {
  margin: 12px 0 24px 0;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(15, 23, 42, 0.7);
}

.c-intro {
  /* Button */
}

.c-intro__btn {
  margin-top: 14px;
  border-radius: 10px; /* để bỏ inline style */
  padding: 0.6rem 0.95rem;
  font-size: 13px;
  line-height: 1;
  height: auto;
  transition: transform 0.15s ease, opacity 0.15s ease;
  margin: 0;
}

.c-intro__btn:hover {
  transform: translateY(-1px);
  opacity: 0.96;
}

@media (max-width: 849px) {
  .c-intro__body h2,
  .c-intro__body .c-intro__title {
    font-size: 22px;
  }
  .c-intro__title {
    font-size: 22px;
  }
}
@media (max-width: 549px) {
  .c-intro__body h2,
  .c-intro__body .c-intro__title {
    font-size: 20px;
  }
  .c-intro__title {
    font-size: 20px;
  }
}
.logo-slider .img {
  height: 115.2px;
  width: auto !important;
}

.logo-slider .img > .img-inner > img {
  height: 115.2px;
  width: auto;
}

.logo-slider__swiper.col {
  padding-bottom: 0;
}

.logo-slider__swiper {
  overflow: hidden;
  display: flex;
}

.logo-slider__swiper .col-inner {
  display: block;
  white-space: nowrap;
  will-change: transform;
  mix-blend-mode: overlay;
  width: auto;
}

.logo-slider__swiper .col-inner img {
  margin-bottom: 0;
}

.logo-slider__swiper > .col-inner > .img {
  display: inline-block;
  margin-right: 16px;
}

/* Component: Media Card (background image + bottom white panel)
   Compatible with Flatsome: .box -> .box-image -> .box-text
*/
.c-media-card {
  position: relative;
  overflow: hidden;
  min-height: 358px;
  border-radius: var(--semantic-rounded-2xl, 16px);
  background-blend-mode: color, normal;
}

.c-media-card.box-overlay.dark .box-text, .c-media-card.box-shade.dark .box-text {
  text-shadow: none;
}

.c-media-card {
  /* đảm bảo box của Flatsome không tự phá layout */
}

.c-media-card.box {
  background: transparent;
}

.c-media-card {
  /* Media / background */
}

.c-media-card .box-image {
  position: relative;
  height: 100%;
}

.c-media-card .box-image img,
.c-media-card .box-image .c-media-card__img {
  width: 100%;
  height: auto;
  display: block;
}

.c-media-card .box-image .overlay,
.c-media-card .box-image .c-media-card__overlay {
  pointer-events: none;
}

.c-media-card {
  /* Panel trắng */
}

.c-media-card .box-text {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 12px;
  width: calc(100% - 32px);
  padding: 0;
  /* Flatsome có thể set padding ở box-text-inner nên để inner handle */
}

.c-media-card .box-text .box-text-inner {
  display: flex;
  padding: var(--semantic-lg, 20px);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--semantic-xs, 8px);
  flex: 1 0 0;
  align-self: stretch;
  border-radius: var(--absolute-radius-8, 8px);
  background: var(--general-background, #FFF);
}

.c-media-card .box-text .box-text-inner .c-media-card__title > * {
  overflow: hidden;
  color: var(--general-foreground, #1F2937);
  text-overflow: ellipsis;
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.c-media-card .box-text .box-text-inner .c-media-card__desc > * {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  /*  */
  letter-spacing: 0.07px;
}

.c-media-card .box-text .box-text-inner .c-media-card__meta > * {
  color: var(--unofficial-foreground-alt, #374151);
  /* paragraph mini/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  /* */
  letter-spacing: 0.18px;
}

.mfp-bg .mfp-content {
  background-color: var(--general-background, #FFF);
  /* shadow-lg */
  box-shadow: var(--lg-shadow-1-x, 0) var(--lg-shadow-1-y, 10px) var(--lg-shadow-1-blur, 15px) var(--lg-shadow-1-spread, -3px) var(--lg-color, rgba(55, 65, 81, 0.1)), var(--lg-shadow-2-x, 0) var(--lg-shadow-2-y, 4px) var(--lg-shadow-2-spread, 6px) var(--lg-shadow-2-blur, -4px) var(--lg-color, rgba(55, 65, 81, 0.1));
}

.mfp-bg.mfp-ready {
  background-color: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(8px);
  opacity: 1;
}

/* Component: Profile Card (Flatsome box) */
.c-profile-card {
  border-radius: 16px;
  overflow: hidden;
  min-height: 424px;
  background: radial-gradient(122.11% 100% at 20.24% -0.1%, var(--gray-50, #F9FAFB) 0%, var(--gray-200, #E5E7EB) 100%), var(--card-card, #FFF);
}

.c-profile-card .c-profile-card__media,
.c-profile-card .box-image {
  position: relative;
}

.c-profile-card .c-profile-card__media img,
.c-profile-card .box-image img {
  width: 294px;
  height: 294px;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom right;
     object-position: bottom right;
}

.c-profile-card .c-profile-card__media img.c-profile-card__img,
.c-profile-card .box-image img.c-profile-card__img {
  width: 100%;
  height: auto;
  display: block;
}

.c-profile-card .c-profile-card__media .c-profile-card__overlay,
.c-profile-card .box-image .c-profile-card__overlay {
  pointer-events: none;
}

.c-profile-card .box-image {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.c-profile-card .box-image > div .overlay {
  display: none;
}

.c-profile-card .box-text {
  padding: 24px;
  bottom: unset;
  top: 0;
  text-shadow: none !important;
}

.c-profile-card .box-text > .box-text-inner > h4 {
  color: var(--general-foreground, #1F2937);
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  /* 140% */
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

.c-profile-card .box-text > .box-text-inner > p {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.c-profile-card .c-profile-card__inner {
  padding: 16px;
}

.c-profile-card .c-profile-card__title {
  margin: 0 0 6px 0;
  font-size: 16px;
  line-height: 1.25;
}

.c-profile-card .c-profile-card__meta {
  margin: 0;
  font-size: 12px;
  opacity: 0.75;
}

.rank-math-breadcrumb > p {
  display: flex;
  gap: 8px;
  align-items: center;
}

.rank-math-breadcrumb > p a,
.rank-math-breadcrumb > p span {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.07px;
}

.rank-math-breadcrumb > p .separator {
  font-family: "lucide" !important;
  font-style: normal !important;
  font-weight: 400 !important;
  speak: none !important;
  text-transform: none !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.rank-math-breadcrumb > p .separator::before {
  content: "\e06f";
}

.rank-math-breadcrumb > p .last {
  color: var(--general-foreground, #1F2937);
  font-weight: 700;
}

.rank-math-breadcrumb > p > a {
  line-height: 1;
}

.rank-math-breadcrumb > p > a:has(svg) {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rank-math-breadcrumb > p > a:has(svg) svg {
  fill: var(--Black-300, #B0B0B0);
}

.rank-math-breadcrumb > p > a:has(svg) svg path {
  fill: var(--Black-300, #B0B0B0);
}

.rank-math-breadcrumb > p > a:has(svg):hover svg path {
  fill: var(--blue);
}

/* Component: Section Header (eyebrow + title) */
@media (max-width: 549px) {
  .c-section-header .button {
    margin-bottom: 0;
  }
}
.c-section-header__col {
  padding-bottom: 0;
}

.c-section-header__eyebrow > * {
  color: var(--indigo-600, #4F46E5);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
  margin-bottom: 0;
}

.c-section-header {
  /* Main title */
}

.c-section-header__title > * {
  /* heading 2 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-2-font-size, 30px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-2-line-height, 120%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
  margin-bottom: 40px;
}

@media (max-width: 849px) {
  .c-section-header__title > * {
    /* heading 3 */
    font-size: 24px;
    line-height: var(--heading-3-line-height, 116.667%);
    margin-bottom: 24px;
  }
}
.c-section-header {
  /* Optional desc */
}

section.section {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

@media (max-width: 849px) {
  section.section {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}
/* =========================================
   Slider Nav (custom)
   ========================================= */
.slider-wrap .slider-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  max-width: 1270px;
  margin-left: auto;
  margin-right: auto;
}

.slider-wrap .slider-nav button {
  margin: 0 !important;
}

.slider-wrap .slider-nav__btn {
  display: flex;
  min-width: 32px;
  min-height: 32px;
  padding: 7px;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  border-radius: var(--semantic-rounded-full, 9999px) !important;
  background: var(--general-secondary, #F9FAFB);
  color: #312E81;
}

.slider-wrap .slider-nav__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* =========================================
   Slider Dots
   ========================================= */
.slider-dots {
  display: flex;
  align-items: center;
  gap: 8px;
}

.slider-dots__dot {
  display: inline-block;
  width: 32px;
  height: 8px;
  border-radius: 4px;
  background: var(--unofficial-accent-2, #E5E7EB);
  border: 0;
  padding: 0;
  min-height: unset;
  min-width: unset;
}

.slider-dots__dot.is-active {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: var(--gray-400, #9CA3AF);
}

/* =========================================
   Component: Testimonial Card
   Block: .c-testimonial-card
   ========================================= */
.c-testimonial-card {
  display: flex;
  padding: 24px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  border-radius: 16px;
  background: var(--general-background, #FFF);
}

.c-testimonial-card__quote {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  flex: 1;
}

@media (max-width: 849px) {
  .c-testimonial-card__quote {
    flex-direction: column;
  }
}
.c-testimonial-card__quote img {
  width: 40px;
  height: 40px;
  aspect-ratio: 1/1;
}

.c-testimonial-card__content {
  position: relative;
  border: unset;
  padding: 0;
  flex: 1 0 0;
  color: var(--general-foreground, #1F2937);
  /* paragraph/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
  margin-bottom: 0;
}

.c-testimonial-card__content p:last-of-type {
  margin-bottom: 0;
}

.c-testimonial-card__footer {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
}

.c-testimonial-card__avatar {
  display: flex;
  overflow: hidden;
  width: 40px;
  height: 40px;
  justify-content: center;
  align-items: center;
  border-radius: 40px;
}

.c-testimonial-card__avatar img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
  background: var(--unofficial-accent-2, #E5E7EB);
}

.c-testimonial-card__author {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  flex: 1 0 0;
}

.c-testimonial-card__name {
  color: var(--indigo-600, #4F46E5);
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  margin-bottom: 0;
}

.c-testimonial-card__meta {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  margin-bottom: 0;
}

.c-testimonial-card {
  /* ===== Modifiers (nếu cần) ===== */
}

.c-testimonial-card--center {
  /* center layout variation */
}

.c-testimonial-card--dark {
  /* dark theme variation */
}

.c-testimonial-card--compact {
  /* compact spacing variation */
}

.c-testimonial-card {
  /* ===== States (nếu cần) ===== */
}

.c-testimonial-card.is-active {
  /* active state */
}

.divider-line {
  display: flex;
  height: 1px;
  align-items: center;
  flex-shrink: 0;
  align-self: stretch;
  background: var(--general-border, #E5E7EB);
  margin-top: 24px;
  margin-bottom: 24px;
}

.c-form .c-form__submit {
  width: 100%;
}

.c-form__field input:not([type=submit]),
.c-form__field .button,
.c-form__field button,
.c-form__field fieldset,
.c-form__field select,
.c-form__field textarea {
  border-radius: var(--semantic-rounded-lg, 8px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-input, #FFF);
  /* shadow-xs */
  box-shadow: var(--xs-x, 0) var(--xs-y, 1px) var(--xs-blur, 2px) var(--xs-spread, 0) var(--xs-color, rgba(55, 65, 81, 0.05));
}

.c-form__field:last-of-type .button,
.c-form__field:last-of-type button,
.c-form__field:last-of-type fieldset,
.c-form__field:last-of-type input,
.c-form__field:last-of-type select,
.c-form__field:last-of-type textarea {
  margin-bottom: 0;
}

.c-form__required,
.c-form__label {
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 22px);
  letter-spacing: 0.07px;
}

.c-form__label {
  color: var(--general-foreground, #1F2937);
}

.c-form__required {
  color: var(--red-600, #DC2626);
}

.c-form__actions input[type=submit] {
  margin-top: 24px;
  margin-bottom: 0;
}

.c-form__actions .wpcf7-spinner {
  display: none;
}

.product-small > .col-inner.has-course-card-bg {
  background-image: var(--tcp-course-card-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  position: relative;
  /* để các content nằm trên overlay */
}

/* Trainer overlay layout */
.c-courseBadges {
  display: flex;
  flex-flow: row wrap;
  gap: 6px;
}

.c-courseBadge {
  display: inline-flex;
  min-height: 24px;
  padding: 3px var(--semantic-xs, 8px);
  justify-content: center;
  align-items: center;
  gap: var(--absolute-15, 6px);
  padding: 6px 12px;
  border-radius: var(--semantic-rounded-full, 9999px);
  background: var(--orange-100, #FFEDD5);
  color: var(--orange-500, #F97316);
  text-transform: uppercase;
  text-align: center;
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  /*  */
  letter-spacing: 0.18px;
}

.c-courseMeta {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--unofficial-foreground-alt, #374151);
  font-size: 14px;
}

.c-courseMeta__dot {
  color: var(--indigo-500, #6366F1);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  /*  */
  letter-spacing: 0.18px;
}

.c-courseMeta__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.c-courseMeta__icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  opacity: 0.7;
}

.c-courseMeta__value {
  color: var(--unofficial-foreground-alt, #374151);
  /* paragraph mini/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.c-courseMeta--full-icon {
  display: flex;
  align-items: center;
  gap: 40px;
}

.category-page-row {
  padding-top: 24px;
}

.tcp-coupon__row {
  display: flex;
  padding: 8px var(--absolute-2, 8px) 8px var(--absolute-3, 12px);
  align-items: center;
  gap: var(--semantic-xs, 8px);
  align-self: stretch;
  border-radius: var(--semantic-rounded-lg, 8px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-input, #FFF);
  /* shadow-xs */
  box-shadow: var(--xs-x, 0) var(--xs-y, 1px) var(--xs-blur, 2px) var(--xs-spread, 0) var(--xs-color, rgba(55, 65, 81, 0.05));
}

.tcp-coupon__row input.input-text {
  border: none;
  padding-left: 0;
  padding-right: 0;
  box-shadow: none;
  height: 22px;
}

.tcp-coupon__row input.input-text:hover, .tcp-coupon__row input.input-text:active {
  border: none;
  box-shadow: none;
}

.tcp-coupon__row button[type=submit] {
  display: flex;
  padding: 4px var(--semantic-md, 16px);
  justify-content: center;
  align-items: center;
  gap: var(--semantic-xs, 8px);
  background: var(--indigo-50, #EEF2FF);
  color: var(--general-secondary-foreground, #312E81);
  text-align: center;
  min-width: 89px;
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.07px;
  margin: 0;
  min-height: 30px;
  line-height: 1;
}

span.amount {
  color: var(--general-muted-foreground, #6B7280);
}

.price del .amount {
  overflow: hidden;
  color: var(--general-muted-foreground, #6B7280);
  text-overflow: ellipsis;
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  text-decoration-line: line-through;
}

.price ins .amount {
  overflow: hidden;
  color: var(--orange-500, #F97316);
  text-overflow: ellipsis;
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

.product > .col-inner {
  border-radius: var(--semantic-rounded-2xl, 16px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: linear-gradient(0deg, var(--indigo-500, #6366F1) 0%, var(--indigo-500, #6366F1) 100%);
  background-blend-mode: color, normal;
  /* shadow-sm */
  box-shadow: var(--sm-shadow-1-x, 0) var(--sm-shadow-1-y, 1px) var(--sm-shadow-1-blur, 3px) var(--sm-shadow-1-spread, 0) var(--sm-color, rgba(55, 65, 81, 0.1)), 0 1px 2px -1px var(--sm-color, rgba(55, 65, 81, 0.1));
}

.product .product-cat {
  color: var(--orange-500, #F97316);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.product .product-title {
  color: var(--general-foreground, #1F2937);
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.product .box-text {
  padding: 0 12px 12px 12px;
}

.product .box-text .add-to-cart-button > .button {
  width: 100%;
  margin-right: 0;
}

.product .box-text__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.product .box-text__inner .box-text__group {
  flex: 1;
}

.product .box-text__group {
  padding: 20px;
  border-radius: var(--semantic-rounded-lg, 8px);
  background: var(--general-background, #FFF);
}

.product .box-text__footer {
  margin-top: 8px;
}

.product .box-text__top,
.product .box-text__body,
.product .box-text__footer {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--semantic-xs, 8px);
  align-self: stretch;
}

.product .box-text__top:empty,
.product .box-text__body:empty,
.product .box-text__footer:empty {
  display: none !important;
}

.c-courseQuota {
  /* ==== Tokens ==== */
  --quota-h: 24px;
  --quota-r: 8px;
  --quota-bg: #d1d5db;
  --quota-fill: #ea580c;
  --quota-text: #F9FAFB;
  /* % fill: set từ inline style --quota-pct: 50% */
  --quota-pct: 50%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  height: var(--quota-h);
  border-radius: var(--quota-r);
  background: var(--quota-bg);
  overflow: hidden;
  isolation: isolate;
  /* Fill bar */
}

.c-courseQuota::before {
  content: "";
  position: absolute;
  inset: 0;
  width: var(--quota-pct);
  background: var(--quota-fill);
  border-radius: var(--quota-r);
  z-index: 0;
  transition: width 240ms ease;
}

.c-courseQuota {
  /* Content nằm trên fill */
}

.c-courseQuota__icon, .c-courseQuota__text {
  position: relative;
  z-index: 1;
  color: var(--quota-text);
  line-height: 1;
  white-space: nowrap;
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.18px;
}

.c-courseQuota__icon {
  font-size: 16px;
  width: 16px;
  height: 16px;
}

.c-courseQuota__icon img {
  -o-object-fit: contain;
     object-fit: contain;
}

.c-courseQuota {
  /* Optional: nếu muốn canh text nằm giữa chính xác */
}

.c-courseQuota--center {
  justify-content: center;
}

.shop-cat-tabs__list {
  display: flex;
  align-items: flex-start;
  align-self: stretch;
  list-style: none;
}

.shop-cat-tabs__list:hover .shop-cat-tabs__item .shop-cat-tabs__link.is-active {
  background: unset;
}

.shop-cat-tabs__list:hover .shop-cat-tabs__item .shop-cat-tabs__link:hover {
  background: var(--indigo-50, #EEF2FF);
}

.shop-cat-tabs__list .shop-cat-tabs__item {
  margin-bottom: 0;
}

.shop-cat-tabs__list .shop-cat-tabs__item .shop-cat-tabs__link.is-active {
  background: var(--indigo-50, #EEF2FF);
}

.shop-cat-tabs__list .shop-cat-tabs__link {
  display: flex;
  min-width: 32px;
  min-height: 32px;
  padding: 5.5px var(--absolute-25, 10px);
  justify-content: center;
  align-items: center;
  gap: var(--semantic-xs, 8px);
  color: var(--general-foreground, #1F2937);
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  border-radius: var(--semantic-rounded-lg-xl, 10px);
}

.page-title-inner {
  padding-top: 44px;
}

.shop-page-title__heading {
  color: var(--general-foreground, #1F2937);
  /* heading 1 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-1-font-size, 48px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-1-line-height, 116.667%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
  margin-bottom: 24px;
}

.admin-bar .c-course-stickyHeader {
  top: 100px;
}

.c-course-stickyHeader {
  display: none;
  position: sticky;
  top: 72px;
  z-index: 9;
  background: var(--general-accent, #F3F4F6);
}

.c-course-stickyHeader.is-visible {
  display: block;
}

.c-course-stickyHeader__inner {
  display: flex;
  padding-top: 12px;
  padding-bottom: 12px;
  align-items: center;
  align-self: stretch;
}

.c-course-stickyHeader__title {
  display: flex;
  width: 399px;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--semantic-2xs, 4px);
  align-self: stretch;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  align-self: stretch;
  color: var(--general-foreground, #1F2937);
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

.c-course-stickyHeader__meta {
  display: flex;
  gap: 40px;
}

.c-course__sidebar.active .is-sticky-column {
  z-index: 10;
}

/* === Keyframes co/giãn chiều cao === */
@keyframes tcpTopCollapse {
  0% {
    max-height: var(--tcp-top-max, 1000px);
  }
  50% {
    max-height: 150px;
  }
  100% {
    max-height: 0;
  }
}
@keyframes tcpTopExpand {
  0% {
    max-height: 0;
  }
  50% {
    max-height: 150px;
  }
  100% {
    max-height: var(--tcp-top-max, 1000px);
  }
}
/* === Base === */
.c-course-sidebar__card--top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  overflow: hidden;
  /* baseline: phải có max-height lớn để “auto-like” */
  max-height: var(--tcp-top-max, 1000px);
  opacity: 1;
  transform: translateY(0);
  will-change: max-height, opacity, transform;
}

/* === Hidden (collapse) === */
.c-course-sidebar__card--top.is-hidden {
  opacity: 0;
  transform: translateY(-8px);
  animation: tcpTopCollapse 360ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
  /* fade/slide có delay nhẹ cho cảm giác co trước rồi mới mờ */
  transition: opacity 200ms ease 60ms, transform 200ms ease 60ms;
}

/* === Show (expand) === */
/* Khi remove is-hidden, ta cần 1 class để chạy animation expand */
.c-course-sidebar__card--top.is-showing {
  opacity: 1;
  transform: translateY(0);
  animation: tcpTopExpand 360ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
  transition: opacity 220ms ease, transform 220ms ease;
}

/* Disable animation/transition khi init để tránh flash */
.c-course__sidebar.is-init .c-course-sidebar__card--top {
  animation: none !important;
  transition: none !important;
}

.c-course__sidebar.is-init [data-course-sticky-header],
.is-init [data-course-sticky-header] {
  transition: none !important;
}

.single-product #main,
.single-product #wrapper {
  background-color: var(--general-secondary, #F9FAFB);
}

.c-course__body .c-course__content > .col-inner {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}

.c-course__body .c-course__content > .col-inner,
.c-course__body .c-course__sidebar > .col-inner,
.c-course__body .c-course__sidebar > .is-sticky-column > .is-sticky-column__inner > .col-inner {
  padding: 24px;
  border-radius: var(--semantic-rounded-xl, 12px);
  background-color: var(--general-background, #FFF);
}

.c-course__sidebar.product-info {
  padding-top: 0;
}

.c-course__sidebar.product-info .price {
  margin-top: 0;
  margin-bottom: 0;
}

.c-course-section:not(.c-course-hero-cover) {
  padding-left: 40px;
  padding-right: 40px;
}

.c-course-section {
  width: 100%;
}

.c-course-section .c-course-section__eyebrow {
  margin-bottom: 4px;
}

.c-course-section .c-course-section__title {
  margin-bottom: 24px;
}

.c-course-section__eyebrow {
  color: var(--gray-500, #6B7280);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.c-course-section__title {
  color: var(--general-secondary-foreground, #312E81);
  /* heading 3 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-3-line-height, 116.667%);
  letter-spacing: var(--heading-3-letter-spacing, 0);
}

.product-footer {
  background: var(--general-background, #FFF);
  display: flex;
  padding: 48px 0;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  align-self: stretch;
}

.product-footer .product-section {
  border-top: unset;
}

.product-section-title-related {
  color: var(--indigo-900, #312E81);
  /* heading 2 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-2-font-size, 30px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-2-line-height, 120%);
  /*  */
  letter-spacing: var(--heading-2-letter-spacing, 0);
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 40px;
}

.product-section-title-related__eyebrow {
  color: var(--gray-500, #6B7280);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  /*  */
  letter-spacing: 0.18px;
}

/* ==========================================================================
   Course Audience (BEM)
   ========================================================================== */
.c-course-audience__grid {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 24px;
  align-self: stretch;
  flex-wrap: wrap;
}

.c-course-audience__card {
  display: flex;
  min-width: 248px;
  padding: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--general-secondary, #F9FAFB);
}

.c-course-audience__icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}

.c-course-audience__cardTitle {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

/* Modifiers */
/* ==========================================================================
   Course Curriculum (BEM)
   ========================================================================== */
.c-course-curriculum__accordion {
  padding: 0 24px;
  border-radius: 16px;
  background: var(--general-secondary, #F9FAFB);
}

/* Module content inside accordion item */
.c-course-curriculum__lessons {
  list-style: none;
}

.c-course-curriculum__lessons .c-course-curriculum__lesson {
  margin-left: 0;
  margin-bottom: 0;
}

.c-course-curriculum__lesson {
  display: flex;
  height: 38px;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}

.c-course-curriculum__lesson .c-course-curriculum__lessonTitle {
  flex: 1 0 0;
}

.c-course-curriculum__lessonTitle {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.c-course-curriculum__lessonMeta {
  display: flex;
  height: 38px;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}

.c-course-curriculum__lessonPreview {
  display: flex;
  min-height: 24px;
  padding: 4px var(--semantic-xs, 8px);
  justify-content: center;
  align-items: center;
  gap: var(--absolute-15, 6px);
  color: var(--indigo-700, #4338CA);
  text-align: center;
  /* paragraph mini/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.c-course-curriculum__lessonPreview [class^=icon-] {
  font-size: 16px;
  color: #4F46E5;
}

.c-course-curriculum__lessonDur {
  color: var(--general-muted-foreground, #6B7280);
  text-align: right;
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

/* Optional: target Flatsome accordion classes */
/* ==========================================================================
   Course FAQ (BEM)
   ========================================================================== */
/* Optional: target Flatsome accordion classes inside (để customize UI)
*/
/* ==========================================================================
   Course Hero Cover (BEM)
   ========================================================================== */
.c-course-hero-cover__media {
  border-radius: var(--semantic-rounded-md, 6px);
  background: linear-gradient(0deg, var(--indigo-400, #818CF8) 0%, var(--indigo-400, #818CF8) 100%), url(<path-to-image>) lightgray 50%/cover no-repeat, #D9D9D9;
  background-blend-mode: color, normal, normal;
}

.c-course-hero-cover__media img {
  width: 100%;
}

/* Modifiers (tuỳ dùng sau này) */
/* ==========================================================================
   Course Micro Learning (BEM)
   ========================================================================== */
.c-course-micro__inner {
  display: flex;
  padding: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  align-self: stretch;
  border-radius: 16px;
  background: var(--indigo-50, #EEF2FF);
}

.c-course-micro__header .c-course-micro__title {
  margin-bottom: 0;
}

.c-course-micro__grid {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 24px;
  align-self: stretch;
  flex-wrap: wrap;
}

.c-course-micro__card {
  display: flex;
  min-width: 172px;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  flex: 1 0 0;
  border-radius: 16px;
  background: var(--card-card, #FFF);
}

.c-course-micro__icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}

.c-course-micro__cardTitle {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.c-course-micro__note {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

/* Modifiers */
/* ==========================================================================
   Course Outcomes (BEM)
   ========================================================================== */
.c-course-outcomes__inner {
  padding: 32px;
  border-radius: 16px;
  background: var(--general-background, #FFF);
  box-shadow: 0 0 24px 0 var(--indigo-200, #C7D2FE) inset;
}

.c-course-outcomes__list {
  list-style: none;
}

.c-course-outcomes__list .c-course-outcomes__item {
  margin-left: 0;
  margin-bottom: 16px;
}

.c-course-outcomes__list .c-course-outcomes__item:last-of-type {
  margin-bottom: 0;
}

.c-course-outcomes__item {
  display: flex;
  align-items: center;
}

.c-course-outcomes__item .c-course-outcomes__icon {
  margin-right: 20px;
}

.c-course-outcomes__icon {
  color: #6366F1;
}

.c-course-outcomes__text {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

/* Modifiers */
/* ==========================================================================
   Course Pain Points (BEM)
   ========================================================================== */
.c-course-painpoints__list {
  list-style: none;
}

.c-course-painpoints__list .c-course-painpoints__item {
  margin-left: 0;
  margin-bottom: 16px;
}

.c-course-painpoints__list .c-course-painpoints__item:last-of-type {
  margin-bottom: 0;
}

.c-course-painpoints__item {
  display: flex;
  align-items: center;
}

.c-course-painpoints__item .c-course-painpoints__icon {
  margin-right: 20px;
  color: #9CA3AF;
}

.c-course-painpoints__text {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  /*  */
  letter-spacing: 0.07px;
}

/* Modifiers */
/* ==========================================================================
   Course Sidebar (BEM)
   ========================================================================== */
.c-course-sidebar__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.c-course-sidebar__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.c-course-sidebar__badge {
  color: var(--orange-500, #F97316);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.c-course-sidebar__title {
  margin-bottom: 0;
}

.c-course-sidebar__meta {
  display: flex;
  align-self: stretch;
}

.c-course-sidebar__meta .c-course-sidebar__metaItem {
  display: flex;
  padding: var(--semantic-xs, 8px) var(--semantic-md, 16px);
  align-items: center;
  gap: var(--semantic-md, 16px);
  flex: 1 0 0;
}

.c-course-sidebar__meta .c-course-sidebar__metaItem:nth-child(1) {
  border-radius: 16px 0 0 16px;
  border: 1px solid var(--general-border, #E5E7EB);
}

.c-course-sidebar__meta .c-course-sidebar__metaItem:nth-child(2) {
  border-radius: 0 16px 16px 0;
  border: 1px solid var(--general-border, #E5E7EB);
}

.c-course-sidebar__metaItem__inner {
  display: flex;
  align-items: center;
  gap: var(--semantic-md, 16px);
  flex: 1 0 0;
}

.c-course-sidebar__metaIcon {
  color: #9CA3AF;
}

.c-course-sidebar__metaLabel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  color: var(--general-foreground, #1F2937);
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.c-course-sidebar__metaValue {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.c-course-sidebar__price .price-wrapper .price-on-sale {
  display: flex;
  flex-direction: column;
}

.c-course-sidebar__price .price-wrapper .price bdi .amount {
  overflow: hidden;
  color: var(--general-muted-foreground, #6B7280);
  text-overflow: ellipsis;
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  text-decoration-line: line-through;
}

.c-course-sidebar__price .price-wrapper .price ins .amount {
  color: var(--general-secondary-foreground, #312E81);
  text-align: center;
  /* heading 2 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-2-font-size, 30px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-2-line-height, 120%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
}

.c-course-sidebar__price .price-wrapper .price ins .amount .woocommerce-Price-currencySymbol {
  /* paragraph/bold */
  font-size: var(--paragraph-regular-font-size, 16px);
}

.c-course-sidebar__actions {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.c-course-sidebar__actions .button {
  font-size: var(--paragraph-small-font-size, 14px);
  letter-spacing: 0.07px;
  margin: 0;
}

.c-course-sidebar__actions .c-course-sidebar__trial {
  flex: 1 0 0;
}

.c-course-sidebar__addToCart .cart {
  margin-bottom: 0;
}

.c-course-sidebar__note {
  display: flex;
  padding: 16px;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  border-radius: 16px;
  background: var(--indigo-50, #EEF2FF);
}

.c-course-sidebar__noteIcon {
  width: 32px;
  height: 32px;
  aspect-ratio: 1/1;
}

.c-course-sidebar__noteText {
  color: var(--indigo-600, #4F46E5);
  /* paragraph mini/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

/* optional: sticky variant */
.c-course-sidebar__cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.c-course-sidebar__cta .c-course-sidebar__ctaTitle {
  color: var(--general-foreground, #1F2937);
  text-align: center;
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  /*  */
  letter-spacing: 0.07px;
}

.c-course-sidebar__cta .c-course-sidebar__ctaActions {
  width: 100%;
}

.c-course-sidebar__cta .c-course-sidebar__ctaActions .c-course-sidebar__ctaSecondary {
  width: 100%;
}

.c-course-sidebar__cover {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  background: #D9D9D9;
}

.c-course-sidebar__coverLink {
  position: relative;
  display: block;
}

.c-course-sidebar__coverImg {
  display: block;
  width: 100%;
  height: auto;
}

.c-course-sidebar__coverOverlay {
  position: absolute;
  inset: 0;
}

.c-course-sidebar__coverPlay {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 42px;
  color: #4F46E5;
}

.c-course-sidebar__coverPlayText {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 12px;
  text-align: center;
}

.c-course-sidebar__taskbar {
  display: none;
}

.c-course-sidebar.is-compact .c-course-sidebar__cover,
.c-course-sidebar.is-compact .c-course-sidebar__badge,
.c-course-sidebar.is-compact .c-course-sidebar__title,
.c-course-sidebar.is-compact .c-course-sidebar__meta {
  display: none;
}

.c-course-sidebar.is-compact .c-course-sidebar__taskbar {
  display: block;
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--general-background, #fff);
  border-bottom: 1px solid var(--general-border, #E5E7EB);
  padding: 10px 12px;
}

.c-course-sidebar__taskbarTitle {
  font-weight: 700;
  margin-bottom: 6px;
}

/* ==========================================================================
   Course Testimonials (BEM)
   ========================================================================== */
.c-course-testimonials__list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.c-course-testimonials__list .c-testimonial-card {
  border-radius: 16px;
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-background, #FFF);
  margin-bottom: 0;
}

.c-course-testimonials__card {
  display: flex;
  min-width: 289px;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--semantic-md, 16px);
  align-self: stretch;
  border-radius: 16px;
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-background, #FFF);
}

/* Modifiers */
/* ==========================================================================
   Course Trainer (BEM)
   ========================================================================== */
.c-course-trainer {
  margin-top: -80px;
}

.c-course-trainer__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  align-self: stretch;
}

.c-course-trainer__card .c-course-trainer__media {
  flex-shrink: 0;
}

.c-course-trainer__card .c-course-trainer__body {
  flex: 1;
}

.c-course-trainer__top {
  display: flex;
  align-items: flex-end;
  gap: 24px;
  align-self: stretch;
}

.c-course-trainer__media {
  display: flex;
  width: 120px;
  height: 120px;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 8px;
  border: 4px solid #FFF;
}

.c-course-trainer__media img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
  background: #E5E7EB;
}

/* Modifiers */
.c-course-trainer__description {
  position: relative;
}

.c-course-trainer__description::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: var(--general-border, #E5E7EB);
  margin-bottom: 40px;
}

.c-course-trainer__description p:last-of-type {
  margin-bottom: 0;
}

.cart-popup-inner {
  padding: 0;
}

.cart-popup-title {
  padding: var(--semantic-md, 16px) var(--semantic-xl, 24px);
  color: var(--general-secondary-foreground, #312E81);
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

.cart-popup-title__amount {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.widget_shopping_cart > .widget_shopping_cart_content .widget_shopping_cart {
  display: flex;
  padding: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--semantic-md, 16px);
  flex: 1 0 0;
  align-self: stretch;
}

.widget_shopping_cart > .widget_shopping_cart_content .widget_shopping_cart .widget_shopping_cart_content {
  width: 100%;
}

.off-canvas-cart .ux-mini-cart-footer {
  margin-left: 0;
  margin-right: 0;
}

.woocommerce-mini-cart-item .price ins .amount {
  font-size: 14px;
}

.woocommerce-mini-cart-item a.icon-remove,
.woocommerce-mini-cart-item a.remove {
  border: unset;
  border-radius: unset;
  width: 16px;
  height: 16px;
  font-size: 16px;
}

ul.product_list_widget li {
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 80px;
}

ul.product_list_widget li img {
  height: 53px;
  width: 80px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
}

ul.product_list_widget li a.remove {
  top: 50%;
  transform: translateY(-50%);
}

ul.product_list_widget li a:not(.remove) {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.woocommerce-mini-cart__buttons {
  text-align: right;
}

.woocommerce-mini-cart__buttons .button.checkout {
  width: auto;
}

.tcp-mini-cart-totals__row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.tcp-mini-cart-totals__row .tcp-mini-cart-totals__label {
  flex: 1 0 0;
}

.tcp-mini-cart-totals__row .tcp-mini-cart-totals__value {
  flex: 1 0 0;
}

.tcp-mini-cart-totals__row.tcp-mini-cart-totals__row--subtotal span.amount {
  color: var(--general-foreground, #1F2937);
  text-align: right;
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.tcp-mini-cart-totals__row.tcp-mini-cart-totals__row--saving .tcp-mini-cart-totals__label,
.tcp-mini-cart-totals__row.tcp-mini-cart-totals__row--saving .tcp-mini-cart-totals__value,
.tcp-mini-cart-totals__row.tcp-mini-cart-totals__row--saving span.amount {
  color: var(--emerald-600, #059669);
}

.tcp-mini-cart-totals__label,
.tcp-mini-cart-totals__value {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.tcp-mini-cart-totals__value {
  text-align: right;
}

.off-canvas-cart .ux-mini-cart-footer {
  border-top: unset;
  padding: 16px 24px;
}

.cart-popup-inner .woocommerce-mini-cart {
  gap: 16px;
  margin-bottom: 24px;
}

ul.product_list_widget li + li {
  border-top: unset;
}

.widget_shopping_cart ul.product_list_widget li {
  padding-right: 24px;
}

ul.product_list_widget li a.remove {
  right: 24px;
}

/* -----------------------------------
 * 4. LAYOUT (global sections)
 * ----------------------------------- */
@media (max-width: 849px) {
  .medium-logo-center #logo.logo {
    max-width: 110px !important;
  }
  .mobile-nav > .has-icon {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
#header #masthead .header-inner {
  max-width: 1416px;
}

@media (max-width: 849px) {
  #header .header-inner {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  #header .header-main {
    height: 48px;
  }
  #header .header-main .nav > li {
    margin: 0 4px;
  }
  #header .header-main .nav > li > a {
    padding-top: 0;
    padding-bottom: 0;
  }
}
@media (max-width: 849px) {
  body .header.show-on-scroll,
  body .stuck .header-main {
    height: 48px !important;
  }
}
#masthead {
  background: var(--general-background, #FFF);
  /* shadow-sm */
  box-shadow: var(--sm-shadow-1-x, 0) var(--sm-shadow-1-y, 1px) var(--sm-shadow-1-blur, 3px) var(--sm-shadow-1-spread, 0) var(--sm-color, rgba(55, 65, 81, 0.1)), 0 1px 2px -1px var(--sm-color, rgba(55, 65, 81, 0.1));
}

#masthead .nav > li.menu-item {
  margin-right: 0;
}

#masthead .nav > li.menu-item.current-menu-item > a {
  background: var(--unofficial-ghost-hover, rgba(0, 0, 0, 0.05));
  color: var(--general-secondary-foreground, #312E81);
}

#masthead .nav > li.menu-item > a {
  color: var(--general-secondary-foreground, #312E81);
  border-radius: var(--semantic-rounded-full, 9999px);
  text-align: center;
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
  padding: 8px 16px;
}

#masthead .nav > li.current-menu-item > a {
  background: var(--unofficial-ghost-hover, rgba(0, 0, 0, 0.05));
}

#masthead .nav:hover > li.menu-item > a {
  background: unset;
}

#masthead .nav:hover > li.menu-item > a:hover {
  background: var(--unofficial-ghost-hover, rgba(0, 0, 0, 0.05));
}

#masthead .cart-item .header-cart-link {
  padding: 8px;
}

#masthead .cart-item .icon-shopping-cart {
  color: var(--unofficial-ghost-foreground, #1F2937);
}

#masthead .cart-item .icon-shopping-cart::before {
  font-size: 20px;
  color: var(--unofficial-ghost-foreground, #1F2937);
}

#masthead .header-cart-icon img[width="1"][height="1"] {
  width: 20px;
}

#masthead .header-language-toggle .header-language-toggle__link {
  padding: 8px 16px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
}

#masthead .header-language-toggle .header-language-toggle__icon {
  line-height: 1;
}

#masthead .header-language-toggle .header-language-toggle__icon::before {
  font-size: 20px;
  color: var(--general-muted-foreground, #6B7280);
}

#masthead .header-language-toggle .header-language-toggle__icon ~ .header-language-toggle__text {
  margin-left: 8px;
}

#masthead .header-language-toggle .header-language-toggle__text {
  color: var(--general-muted-foreground, #6B7280);
  text-align: center;
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.nav > li.header-search > a {
  color: var(--unofficial-ghost-foreground, #1F2937);
}

.header-search .icon-search {
  padding: 8px;
  line-height: 1;
}

.header-search .icon-search::before {
  font-size: 20px;
}

[data-icon-label]:after {
  border-radius: var(--semantic-rounded-full, 9999px);
  background: var(--general-primary, #4F46E5);
}

#main-menu.mobile-sidebar {
  height: 100%;
  display: flex;
  width: 280px;
  padding: 8px 0;
  flex-direction: column;
  align-items: flex-start;
  background: var(--general-background, #FFF);
}

#main-menu.mobile-sidebar > * {
  width: 100%;
}

.mobile-sidebar > .sidebar-menu {
  padding-top: 0;
  padding-bottom: 0;
}

.mobile-sidebar > .sidebar-menu ul {
  margin-bottom: 0;
}

.mobile-sidebar > .sidebar-menu ul > li + li {
  margin-bottom: 0;
}

.mobile-sidebar > .sidebar-menu ul > li > a {
  display: flex;
  min-height: 36px;
  padding: 8px var(--semantic-md, 16px);
  align-items: center;
  gap: 8px;
  align-self: stretch;
  color: var(--general-secondary-foreground, #312E81);
  text-align: center;
  /* paragraph small/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.nav-sidebar.nav-vertical > li + li {
  border-top: unset;
}

.off-canvas-left .mfp-content:has(#main-menu),
.off-canvas-right .mfp-content:has(#main-menu) {
  background-color: rgba(3, 7, 18, 0.05) !important;
  backdrop-filter: blur(12px) !important;
}

.mfp-ready:has(#main-menu) .mfp-close {
  display: flex;
  min-width: 32px;
  min-height: 32px;
  padding: 7px;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 8px;
  top: 8px;
  opacity: 1;
  border-radius: var(--semantic-rounded-full, 9999px) !important;
  background: var(--general-secondary, #F9FAFB);
  color: rgb(49, 46, 129);
}

#footer {
  background-color: transparent;
}

#footer .site-footer {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

#footer .absolute-footer {
  display: none;
}

.site-footer {
  background-color: transparent !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.site-footer .site-footer__inner > .col {
  padding-bottom: 0;
}

.site-footer .site-footer__inner > .col > .col-inner {
  padding: 72px 72px 48px;
  border-radius: 24px;
  background: linear-gradient(56deg, #8795FC 0%, #747EE8 20.9%, #201192 70.01%);
}

@media (max-width: 849px) {
  .site-footer .site-footer__inner > .col > .col-inner {
    padding: 32px 32px 16px 32px;
  }
}
.site-footer .site-footer__panel {
  margin-left: auto !important;
  margin-right: auto !important;
}

.site-footer__top .site-footer__brand .footer-image__logo .img {
  margin-bottom: 20px;
}

.site-footer__top .site-footer__brand .footer-image__logo img {
  margin-left: 0;
  height: 120px;
  width: auto;
}

@media (max-width: 849px) {
  .site-footer__top .site-footer__brand .footer-image__logo img {
    height: 80px;
  }
}
.site-footer__top .site-footer__brand .text {
  color: var(--general-background, #FFF);
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 24px);
  /* 150% */
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.site-footer__top .site-footer__brand .social-icons {
  margin-top: 24px;
  margin-bottom: 24px;
}

.site-footer__top .site-footer__brand .social-icons > .icon {
  padding: 7px;
  font-size: 18px;
}

.site-footer__top .site-footer__brand .site-footer__contact .icon-box-left {
  line-height: 1;
}

.site-footer__top .site-footer__nav > .col-inner {
  display: flex;
  flex-direction: column;
}

.site-footer__top .site-footer__nav > .col-inner .site-footer__subscribe {
  margin-top: auto;
}

.site-footer__top .site-footer__nav > .col-inner .site-footer__subscribe > .col {
  padding-bottom: 0;
}

.site-footer__contact > .col {
  padding-bottom: 0;
}

.site-footer__contact .icon-box-left.icon-box {
  align-items: center;
}

.site-footer__contact .icon-box + .icon-box {
  margin-top: 8px;
}

.site-footer__contact .icon-box .icon-box-img img {
  padding-top: 0;
  width: 16px;
}

.site-footer__contact .icon-box .icon-box-text {
  padding-left: 6px;
}

.site-footer__contact .icon-box .icon-box-text ul {
  list-style: none;
  margin-left: 0;
}

.site-footer__contact .icon-box .icon-box-text ul > li {
  margin-left: 0;
}

.newsletter__field {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 58px;
  padding: 8px 8px 8px 24px;
  border-radius: 999px;
  border: 1px solid var(--general-border, #E5E7EB);
  background: transparent;
}

.newsletter__field > p {
  margin: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 0;
}

.newsletter__field br {
  display: none !important;
}

.newsletter__field .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  height: 100%;
}

.newsletter__field .newsletter__input {
  width: 100%;
  height: 100%;
  border: 0 !important;
  outline: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--general-background, #FFF);
  /* paragraph/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 400;
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
  line-height: 1;
  padding: 0;
}

.newsletter__field .newsletter__input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.85);
}

.newsletter__field .newsletter__input::placeholder {
  color: rgba(255, 255, 255, 0.85);
}

.newsletter__field .newsletter__btn-wrap {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 28px;
  background: var(--general-primary, #4F46E5);
}

.newsletter__field .newsletter__btn-wrap::before {
  content: "\e4f2";
  font-family: "lucide" !important;
  font-style: normal !important;
  font-weight: 400 !important;
  speak: none !important;
  text-transform: none !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  pointer-events: none;
}

.newsletter__field .newsletter__btn.wpcf7-submit {
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.08);
  cursor: pointer;
  font-size: 0 !important;
  color: transparent !important;
  text-indent: -9999px;
  overflow: hidden;
}

.newsletter__field .newsletter__btn.wpcf7-submit:hover {
  background: rgba(255, 255, 255, 0.14);
}

.newsletter__field .wpcf7-spinner {
  position: absolute;
  right: -30px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}

@media (max-width: 549px) {
  .site-footer__bottom {
    flex-direction: column-reverse;
  }
  .site-footer__bottom .site-footer__copy {
    padding-bottom: 0;
  }
}
.site-footer__legal > .col-inner {
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 549px) {
  .site-footer__legal > .col-inner {
    text-align: left;
    justify-content: flex-start;
  }
}
.site-footer__legal > .col-inner .ux-menu.justify-start {
  justify-content: flex-end;
  flex-direction: row;
}

@media (max-width: 549px) {
  .site-footer__legal > .col-inner .ux-menu.justify-start {
    justify-content: flex-start;
    flex-direction: column;
  }
}
.site-footer__legal > .col-inner .ux-menu-link__link {
  min-height: unset !important;
}

.site-footer__legal > .col-inner .ux-menu-link + .ux-menu-link {
  margin-left: 24px !important;
}

@media (max-width: 549px) {
  .site-footer__legal > .col-inner .ux-menu-link + .ux-menu-link {
    margin-left: 0 !important;
  }
}
.site-footer__title > * {
  color: var(--general-primary-foreground, #F9FAFB);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 16px);
  /* 133.333% */
  letter-spacing: 0.18px;
  margin-bottom: 8px !important;
}

.site-footer__list .ux-menu-link + .ux-menu-link {
  margin-top: 8px !important;
}

.site-footer__list .ux-menu-link > .ux-menu-link__link {
  padding: unset;
  min-height: unset;
}

.site-footer__list .ux-menu-link .ux-menu-link__text {
  color: var(--general-primary-foreground, #F9FAFB);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 22px);
  /* 157.143% */
  letter-spacing: 0.07px;
}

.site-footer__legal .ux-menu > .ux-menu-link > .ux-menu-link__link > .ux-menu-link__text {
  color: var(--general-primary-foreground, #F9FAFB);
  /* paragraph mini/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-mini-line-height, 16px);
  /* 133.333% */
  letter-spacing: 0.18px;
}

.site-footer__copy > .col-inner {
  color: var(--general-primary-foreground, #F9FAFB);
  /* paragraph mini/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-mini-line-height, 16px);
  /* 133.333% */
  letter-spacing: 0.18px;
}

/* -----------------------------------
 * 5. PAGES
 * ----------------------------------- */
.cart-header {
  position: absolute;
  left: 0;
  right: 0;
  height: 56px;
  z-index: 999;
  display: flex;
  padding: 8px 24px;
  justify-content: space-between;
  align-items: center;
  background: var(--general-background, #FFF);
  /* shadow-sm */
  box-shadow: var(--sm-shadow-1-x, 0) var(--sm-shadow-1-y, 1px) var(--sm-shadow-1-blur, 3px) var(--sm-shadow-1-spread, 0) var(--sm-color, rgba(55, 65, 81, 0.1)), 0 1px 2px -1px var(--sm-color, rgba(55, 65, 81, 0.1));
}

.tcp-coupon .button.is-disabled {
  cursor: not-allowed;
}

.tcp-coupon .button.is-loading {
  position: relative;
  opacity: 0.85;
  pointer-events: none;
}

.tcp-coupon .button.is-loading::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: 8px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  vertical-align: -2px;
  animation: tcpSpin 0.8s linear infinite;
}

@keyframes tcpSpin {
  to {
    transform: rotate(360deg);
  }
}
/* Scope vào checkout block */
.wp-block-woocommerce-checkout .wc-block-components-text-input,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon {
  position: relative;
}

.wc-block-components-text-input {
  display: flex;
  flex-direction: column-reverse;
}

/* Label nằm trên */
.wp-block-woocommerce-checkout .wc-block-components-text-input > label,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon > label {
  position: static !important;
  transform: none !important;
  display: block !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
}

/* Input không cần chừa chỗ cho floating label */
.wp-block-woocommerce-checkout .wc-block-components-text-input > input,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon > input {
  padding-top: 12px !important;
}

/* Tắt trạng thái floating khi focus/has value */
.wp-block-woocommerce-checkout .wc-block-components-text-input.is-active > label,
.wp-block-woocommerce-checkout .wc-block-components-text-input.has-value > label,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon.is-active > label,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon.has-value > label {
  transform: none !important;
}

/* Nếu label có overlay/background */
.wp-block-woocommerce-checkout .wc-block-components-text-input > label::before,
.wp-block-woocommerce-checkout .wc-block-components-text-input-with-icon > label::before {
  content: none !important;
}

.wc-block-components-title.wc-block-components-checkout-step__title {
  color: var(--general-foreground, #1F2937);
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.wc-block-components-checkout-step__heading-container {
  margin-bottom: 24px;
}

.wc-block-components-form .wc-block-components-text-input input[type=email],
.wc-block-components-form .wc-block-components-text-input input[type=number],
.wc-block-components-form .wc-block-components-text-input input[type=password],
.wc-block-components-form .wc-block-components-text-input input[type=tel],
.wc-block-components-form .wc-block-components-text-input input[type=text],
.wc-block-components-form .wc-block-components-text-input input[type=url],
.wc-block-components-text-input input[type=email],
.wc-block-components-text-input input[type=number],
.wc-block-components-text-input input[type=password],
.wc-block-components-text-input input[type=tel],
.wc-block-components-text-input input[type=text],
.wc-block-components-text-input input[type=url],
.tcp-elearn input[type=email] {
  display: flex;
  padding: 8px var(--absolute-3, 12px);
  align-items: center;
  gap: var(--semantic-xs, 8px);
  align-self: stretch;
  border-radius: var(--semantic-rounded-lg, 8px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-input, #FFF);
  /* shadow-xs */
  box-shadow: var(--xs-x, 0) var(--xs-y, 1px) var(--xs-blur, 2px) var(--xs-spread, 0) var(--xs-color, rgba(55, 65, 81, 0.05));
}

.wc-block-checkout__billing-fields .screen-reader-text {
  display: none;
}

.form-row .label {
  color: var(--general-foreground, #1F2937);
  /* paragraph small/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
  margin-bottom: 4px;
}

.form-row .label .required {
  color: var(--red-500, #EF4444);
}

.woocommerce-input-wrapper label {
  display: flex !important;
  height: 24px;
  align-items: center;
  gap: var(--semantic-xs, 8px);
}

.woocommerce-input-wrapper label .optional {
  display: none;
}

.woocommerce-input-wrapper input {
  display: flex;
  padding: 8px var(--absolute-3, 12px);
  align-items: center;
  gap: var(--semantic-xs, 8px);
  align-self: stretch;
  border-radius: var(--semantic-rounded-lg, 8px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--general-input, #FFF);
  /* shadow-xs */
  box-shadow: var(--xs-x, 0) var(--xs-y, 1px) var(--xs-blur, 2px) var(--xs-spread, 0) var(--xs-color, rgba(55, 65, 81, 0.05));
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

#order_review {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex-shrink: 0;
}

#order_review > * {
  width: 100%;
}

.page-template-page-checkout #main,
.page-template-page-checkout #wrapper {
  background-color: var(--general-accent, #F3F4F6);
}

.page-checkout-simple {
  padding-top: 0;
}

.wc-page-checkout__main {
  display: flex;
  padding-top: 96px;
  padding-right: 40px;
  padding-bottom: 120px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
  align-self: stretch;
  background: var(--general-secondary, #F9FAFB);
  overflow: visible;
  clip-path: inset(0 0 -100vw 0);
}

.wc-page-checkout__main #customer_details {
  width: 100%;
}

.wc-page-checkout__sidebar {
  padding-top: 60px;
  padding-left: 24px;
}

.wc-page-checkout__sidebar .col-inner.is-well {
  box-shadow: none;
  margin-top: 24px;
  padding: 24px;
  border-radius: 16px;
  background: var(--general-background, #FFF);
}

.wc-block-components-sidebar-layout .wc-block-components-main {
  width: 100%;
}

.tcp-checkout-back__link {
  margin-bottom: 0;
  margin-right: 0;
}

.woocommerce-billing-fields {
  padding-top: 0;
}

form.checkout h3 {
  padding-top: 0;
  color: var(--general-foreground, #1F2937);
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
  margin-bottom: 24px;
  text-transform: none;
}

form.checkout input[type=submit],
form.checkout button#place_order {
  padding: 8px var(--semantic-xl, 24px);
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.07px;
}

.woocommerce-checkout-payment__header {
  margin-bottom: 24px;
}

.woocommerce-checkout-payment__header .woocommerce-checkout-payment__title {
  margin-bottom: 4px !important;
}

.woocommerce-checkout-payment__description {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  /*  */
  letter-spacing: 0.07px;
}

#payment .wc_payment_methods {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--semantic-md, 16px);
  align-self: stretch;
}

#payment .wc_payment_methods .wc_payment_method {
  padding: var(--semantic-xs, 8px) var(--absolute-3, 12px);
  border-radius: var(--semantic-rounded-lg-xl, 10px);
  border: 1px solid var(--general-border, #E5E7EB);
  background: var(--card-card, #FFF);
  width: 100%;
}

#payment .wc_payment_methods .wc_payment_method input {
  margin-top: 0;
  margin-bottom: 0;
}

.c-checkout-billing__elearning .c-checkout-billing__elearning-title {
  color: var(--general-foreground, #1F2937);
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
  margin-bottom: 4px;
}

.c-checkout-billing__elearning .c-checkout-billing__elearning-desc {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.c-checkout-billing__elearning .c-checkout-billing__elearning-fields {
  margin-top: 24px;
}

.c-elearning-head {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  align-self: stretch;
}

.c-elearning-head .c-elearning-head__title {
  display: flex;
  height: 21px;
  padding-right: 112px;
  align-items: center;
  flex: 1 0 0;
}

.c-elearning-head .c-elearning-head__toggle {
  display: flex;
  height: 24px;
  align-items: center;
  gap: var(--semantic-xs, 8px);
}

.woocommerce-billing-fields {
  border-top: unset;
}

.woocommerce-checkout-review-order-table {
  margin-bottom: 0;
  border: none;
}

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
  border: unset;
}

.woocommerce-checkout-review-order-table thead .product-name {
  color: var(--general-muted-foreground, #6B7280);
  /* paragraph mini/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.woocommerce-checkout-review-order-table thead .product-total {
  color: var(--general-muted-foreground, #6B7280);
  text-align: right;
  /* paragraph mini/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.woocommerce-checkout-review-order-table tbody {
  border-bottom: 1px solid var(--general-border, #E5E7EB);
}

.cart_item .product-total {
  display: flex;
  flex-direction: column;
}

.cart_item .product-total ins .amount {
  color: var(--general-foreground, #1F2937);
}

.c-ro-item {
  display: flex;
  gap: 14px;
  align-items: center;
}

.c-ro-item .c-ro-item__thumb {
  width: 80px;
  flex-shrink: 0;
  align-self: stretch;
}

.c-ro-item .c-ro-item__content {
  flex: 1 1 auto;
  min-width: 0;
}

.c-ro-item .c-ro-item__title {
  color: var(--general-foreground, #1F2937);
  /* paragraph mini/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.cart-subtotal span.amount,
.order-total span.amount {
  color: var(--general-foreground, #1F2937);
  text-align: right;
  /* paragraph/bold */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-regular-font-size, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--paragraph-regular-line-height, 150%);
  letter-spacing: var(--paragraph-regular-letter-spacing, 0);
}

.cart-savings th,
.cart-savings td {
  color: var(--emerald-600, #059669);
  /* paragraph mini/medium */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-mini-font-size, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--paragraph-mini-line-height, 133.333%);
  letter-spacing: 0.18px;
}

.cart-savings td span.amount {
  color: var(--emerald-600, #059669);
  font-weight: 700;
}

.c-divider td {
  border-bottom: 1px solid var(--general-border, #E5E7EB);
  padding: 0;
}

.c-divider-gap td {
  padding: 0 0 16px;
}

@media (max-width: 849px) {
  .c-contact-cta__container.row-collapse {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}
.c-contact-cta__container > .col > .col-inner {
  padding: 24px 24px 0;
  border-radius: 40px;
  background: var(--general-secondary, #F9FAFB);
}

.c-contact-cta__media > .col-inner .img,
.c-contact-cta__media > .col-inner .img-inner,
.c-contact-cta__media > .col-inner .img-inner > img {
  height: 100%;
}

.c-contact-cta__media img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
  border-radius: var(--semantic-rounded-3xl, 24px);
}

.c-contact-cta__content-inner > .col > .col-inner {
  padding: 24px;
  background: var(--general-secondary, #F9FAFB);
}

@media (max-width: 549px) {
  .c-contact-cta__content-inner > .col > .col-inner {
    padding: 0;
  }
}
.c-contact-cta__form form {
  margin-bottom: 0;
}

.c-contact-cta__form > .col {
  padding-bottom: 0;
}

/* Home > Section: Card Info (intro left + media cards right) */
@media (max-width: 849px) {
  .home-card-info__layout.row-collapse > .col {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}
.home-card-info__layout > .col > .col-inner {
  border-radius: 40px;
  background: var(--indigo-50, #EEF2FF);
  padding: 80px 80px 56px;
}

@media (max-width: 849px) {
  .home-card-info__layout > .col > .col-inner {
    padding: 32px;
  }
}
.home-card-info__inner {
  align-items: center;
}

.home-card-info__col .c-intro__btn {
  margin-top: 24px;
}

.home-card-info__col--cards {
  padding-bottom: 0;
}

.home-card-info__grid {
  margin-left: -12px;
  margin-right: -12px;
}

.home-card-info__grid > .col {
  padding-left: 12px;
  padding-right: 12px;
}

@media (max-width: 849px) {
  .home-card-info__grid {
    margin-left: -10px;
    margin-right: -10px;
  }
  .home-card-info__grid > .col {
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* =========================================================
 * Section: Home Corporate Training
 * File: assets/src/scss/pages/home/_corporate-training.scss
 * (Only structure — no styling)
 * ========================================================= */
/* =========================================================
 * Component: Mosaic
 * File: assets/src/scss/components/_mosaic.scss
 * (Only structure — no styling)
 * ========================================================= */
.c-mosaic {
  padding-bottom: 0;
}

@media (max-width: 549px) {
  .c-mosaic--left {
    order: 1;
  }
}
@media (max-width: 549px) {
  .c-mosaic--right {
    order: 2;
  }
}
@media (max-width: 549px) {
  .c-mosaic--center {
    order: 3;
  }
}
@media (min-width: 550px) {
  .c-mosaic__row {
    height: 100%;
  }
}
/* =========================================================
 * Component: Section Header (center variant used here)
 * File: assets/src/scss/components/_section-header.scss
 * (Only structure — no styling)
 * ========================================================= */
.c-section-header--center > .col-inner {
  display: flex;
  flex-direction: column;
}

.c-section-header--center .c-mosaic__row {
  height: auto;
  flex-shrink: 0;
}

@media (max-width: 849px) {
  .c-mosaic__group {
    display: block;
  }
}
.c-mosaic__group > .col-inner {
  height: inherit;
}

.c-mosaic__group .img {
  overflow: hidden;
  border-radius: var(--semantic-rounded-3xl, 24px);
}

.c-mosaic__group .img img {
  aspect-ratio: 188/188;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top center;
     object-position: top center;
  width: 100%;
  height: 100%;
}

@media (min-width: 550px) {
  .c-mosaic__group--single .img {
    height: 60%;
  }
}
@media (min-width: 550px) {
  .c-mosaic__group--single .img > a,
  .c-mosaic__group--single .img > .img-inner,
  .c-mosaic__group--single .img > a > .img-inner {
    height: 100%;
  }
}
@media (min-width: 550px) {
  .c-mosaic__group--single .img img {
    aspect-ratio: 188/334;
  }
}
.c-mosaic__group--stack > .col-inner {
  display: flex;
  flex-direction: column;
}

@media (max-width: 549px) {
  .c-mosaic__group--stack > .col-inner {
    flex-direction: row;
    gap: 24px;
  }
  .c-mosaic__group--stack > .col-inner > * {
    flex-basis: 50%;
    max-width: 50%;
  }
}
@media (min-width: 550px) {
  .c-mosaic__group--stack > .col-inner .img:nth-child(1) {
    flex-shrink: 0;
  }
  .c-mosaic__group--stack > .col-inner .img:nth-child(2) {
    flex: 1;
  }
  .c-mosaic__group--stack > .col-inner .img:nth-child(2) a,
  .c-mosaic__group--stack > .col-inner .img:nth-child(2) .img-inner {
    height: 100%;
  }
}
@media (max-width: 548px) {
  .home-corporate-training__mosaic-mobile {
    display: grid;
    grid-template-columns: repeat(4, 72px);
    grid-auto-rows: 72px;
    gap: 12px;
    justify-content: center;
  }
  .home-corporate-training__mosaic-mobile .img > a, .home-corporate-training__mosaic-mobile .img > a > .img-inner {
    height: 100%;
  }
  .home-corporate-training__mosaic-mobile img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 16px;
  }
  .home-corporate-training__mosaic-mobile .img:nth-child(1),
  .home-corporate-training__mosaic-mobile .img:nth-child(2),
  .home-corporate-training__mosaic-mobile .img:nth-child(5),
  .home-corporate-training__mosaic-mobile .img:nth-child(6) {
    grid-row: span 2;
  }
}
/* Home > Section: CTA */
.home-cta {
  /* ===== Layout wrapper (row ngoài) ===== */
}

@media (max-width: 849px) {
  .home-cta__layout.row-collapse > .col {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}
.home-cta__layout-col > .col-inner {
  padding: var(--semantic-2xl, 32px);
  border-radius: var(--semantic-rounded-2xl, 16px);
  background: linear-gradient(90deg, var(--indigo-700, #4338CA) 0%, var(--indigo-800, #3730A3) 100%);
}

.home-cta {
  /* ===== Panel CTA (row trong) ===== */
}

.home-cta {
  /* ===== Columns trong panel ===== */
}

.home-cta__panel-col {
  padding-bottom: 0;
}

@media (max-width: 549px) {
  .home-cta__panel-col {
    padding-bottom: 24px;
  }
}
.home-cta__panel-col--content {
  color: var(--general-primary-foreground, #F9FAFB);
}

.home-cta__panel-col--content h4 {
  color: var(--general-primary-foreground, #F9FAFB);
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

@media (max-width: 549px) {
  .home-cta__panel-col--actions {
    padding-bottom: 0;
  }
}
.home-cta__panel-col--actions .button {
  margin: 0;
}

.home-cta__panel-col--actions .col-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

@media (max-width: 549px) {
  .home-cta__panel-col--actions .col-inner {
    justify-content: center;
  }
}
@media (max-width: 849px) {
  .home-cta .gap-element {
    display: none;
  }
}
/* Home > Section: Courses (Woo product grid) */
.home-courses {
  /* Header */
}

.home-courses__col--header {
  padding-bottom: 0;
}

@media (max-width: 549px) {
  .home-courses__grid .flickity-slider > * {
    display: flex;
    align-items: stretch;
    min-height: 100%;
    width: 80%;
  }
}
.home-courses__grid .product-small.col {
  /* item spacing */
}

.home-courses__grid .product-small.box {
  /* card wrapper */
}

.home-courses__grid .box-image {
  /* media */
}

.home-courses__grid .box-image img {
  /* image */
}

.home-courses__grid .badge-container {
  /* badge positioning */
}

.home-courses__grid .onsale {
  /* on sale label */
}

.home-courses__grid .box-text-products {
  /* body */
}

.home-courses__grid .product-cat {
  /* category */
}

.home-courses__grid .product-title {
  /* title */
}

.home-courses__grid .product-title a {
  /* link */
}

.home-courses__grid .price-wrapper,
.home-courses__grid .price {
  /* price */
}

.home-courses__grid .quick-view {
  /* quick view */
}

.home-courses__cta > .col {
  padding-bottom: 0;
}

.home-courses__cta .button {
  margin-bottom: 0;
}

.home-logos .c-section-header__eyebrow h2 {
  color: var(--general-foreground, #1F2937);
  text-align: center;
  /* heading 4 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-4-font-size, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-4-line-height, 140%);
  /*  */
  letter-spacing: var(--heading-4-letter-spacing, 0);
}

.home-testimonials {
  background: linear-gradient(180deg, #FFF 0%, #F3F4F6 100%);
}

/* Home > Section: Learning Platform */
.learning-platform__col--hero {
  padding-bottom: 0;
}

.learning-platform__col--title {
  padding-bottom: 0;
}

.learning-platform__col--title h1 {
  /* heading 1 */
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-1-font-size, 48px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-1-line-height, 116.667%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
  margin-bottom: 40px;
}

@media (max-width: 849px) {
  .learning-platform__col--title h1 {
    font-size: var(--heading-2-font-size, 30px);
    line-height: var(--heading-2-line-height, 120%);
    margin-bottom: 24px;
  }
}
@media (max-width: 549px) {
  .learning-platform__col--title h1 br {
    display: none;
  }
}
.learning-platform__gallery .flickity-viewport {
  overflow: visible;
  clip-path: inset(0 -90px 0 0);
}

.learning-platform__gallery .gallery-col {
  /* slide */
}

@media (max-width: 549px) {
  .learning-platform__gallery .gallery-col {
    width: 72% !important;
  }
}
.learning-platform__gallery .gallery-box {
  /* card */
}

.learning-platform__gallery .box-image img {
  /* image */
}

.learning-platform__gallery .box-text:has(p:empty) {
  display: none;
}

.learning-platform__gallery .flickity-button {
  opacity: 1 !important;
  height: 100%;
}

.learning-platform__gallery {
  /* Nav buttons (Flickity) */
}

.learning-platform__gallery .flickity-prev-next-button {
  /* prev/next */
}

.learning-platform__gallery .flickity-prev-next-button.previous {
  left: -1%;
}

.learning-platform__gallery .flickity-prev-next-button.next {
  right: -1%;
}

.learning-platform__gallery {
  /* Dots */
}

/* Home > Section: Trainers */
.home-trainers__row {
  margin-bottom: 40px;
}

.home-trainers__col {
  padding-bottom: 0;
}

.home-trainers__col--cta .button {
  margin: 0;
}

.home-trainers__col--intro > .col-inner {
  margin-left: 0 !important;
  margin-right: auto;
  max-width: 400px;
}

.home-trainers__col--intro > .col-inner .c-section-header__title > * {
  margin-bottom: 24px;
}

.home-trainers__stat p {
  margin: 0;
}

.home-trainers__stat p:first-child {
  margin-bottom: 8px;
}

.home-trainers__stat p:first-child strong {
  color: var(--general-foreground, #1F2937);
  font-family: var(--font-definitions-font-family-headings, Inter);
  font-size: var(--heading-1-font-size, 48px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--heading-1-line-height, 116.667%);
  letter-spacing: var(--heading-2-letter-spacing, 0);
}

@media (max-width: 849px) {
  .home-trainers__stat p:first-child strong {
    color: var(--indigo-600, #4F46E5);
    font-size: var(--heading-2-font-size, 30px);
    line-height: var(--heading-2-line-height, 120%);
    letter-spacing: var(--heading-2-letter-spacing, 0);
  }
}
.home-trainers__stat p:nth-child(2) {
  color: var(--general-secondary-foreground, #312E81);
  /* paragraph small/regular */
  font-family: var(--font-definitions-font-family-body, Inter);
  font-size: var(--paragraph-small-font-size, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--paragraph-small-line-height, 157.143%);
  letter-spacing: 0.07px;
}

.home-trainers__col--cta .button.white {
  border-radius: 10px;
}

/* -----------------------------------
 * 6. SINGLES
 * ----------------------------------- */
/* -----------------------------------
 * 7. TAXONOMIES
 * ----------------------------------- */
/* -----------------------------------
 * 8. Vendor
 * ----------------------------------- */