/*
 * CiCC Light UI Core
 * One public light surface for phone, laptop and desktop.
 * This file is the migration target for all public templates.
 */
:root {
  --cicc-ui-bg: var(--bg, #f3fafc);
  --cicc-ui-surface: #ffffff;
  --cicc-ui-surface-muted: var(--cicc-mist, #eaf4f7);
  --cicc-ui-border: #cbd5e1;
  --cicc-ui-text: var(--gray-800, #243b53);
  --cicc-ui-heading: var(--cicc-ink, #102a43);
  --cicc-ui-muted: var(--gray-600, #486581);
  --cicc-ui-link: var(--cicc-blue, #1261a0);
  --cicc-ui-link-hover: var(--cicc-blue-600, #0b4f83);
  --cicc-ui-focus: var(--cicc-blue-light, #2f80ed);
  --cicc-ui-radius: 14px;
  --cicc-ui-shadow: 0 8px 28px rgba(15, 23, 42, .06);
}

html {
  color-scheme: light;
  background: var(--cicc-ui-bg);
}

body.cicc-light-ui {
  background: var(--cicc-ui-bg) !important;
}

/* Content follows WordPress/Gutenberg defaults. Only the outer surface is themed. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) {
  background: var(--cicc-ui-surface);
  color: var(--cicc-ui-text);
  border-color: var(--cicc-ui-border);
}

/* Legacy content can still carry hidden-state classes; never hide the reading surface. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) {
  opacity: 1;
  visibility: visible;
}

/* Gutenberg/legacy article text: neutralize only text elements that can carry
 * stale inline colors. Media, buttons and intentionally styled UI blocks keep
 * their own presentation. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, figcaption, blockquote, th, td) {
  color: var(--cicc-ui-text) !important;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(h1, h2, h3, h4, h5, h6) {
  color: var(--cicc-ui-heading) !important;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(a) {
  color: var(--cicc-ui-link) !important;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(p, li, dt, dd, figcaption, blockquote, th, td) {
  background-color: transparent;
}

/* Inline Gutenberg/HTML text inherits the readable tone as well. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(p, li, dt, dd, figcaption, blockquote, th, td, h1, h2, h3, h4, h5, h6) :where(span, strong, em, small, code) {
  color: inherit !important;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) :where(.has-white-color, .has-white-color span, [style*="color: white"], [style*="color:#fff"], [style*="color: #fff"]) {
  color: var(--cicc-ui-text) !important;
}

/* Editorial rhythm for long-form reading. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(h2, h3, h4) {
  margin-top: clamp(1.8rem, 4vw, 2.8rem);
  margin-bottom: .8rem;
  line-height: 1.25;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(blockquote) {
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border-left: 4px solid var(--cicc-ui-focus);
  border-radius: 0 12px 12px 0;
  background: #eff6ff;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(table) {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--cicc-ui-border);
  background: var(--cicc-ui-surface);
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(th) {
  background: var(--cicc-ui-surface-muted);
  font-weight: 700;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(th, td) {
  padding: .7rem .85rem;
  border: 1px solid var(--cicc-ui-border);
  text-align: left;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(pre) {
  padding: 1rem 1.15rem;
  overflow-x: auto;
  border: 1px solid var(--cicc-ui-border);
  border-radius: 12px;
  background: var(--cicc-ui-bg);
  color: var(--cicc-ui-text);
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(input:not([type="submit"]):not([type="button"]), select, textarea) {
  max-width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: var(--cicc-ui-text);
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(input, textarea)::placeholder {
  color: var(--cicc-ui-muted);
  opacity: 1;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(details) {
  margin: 1rem 0;
  padding: .85rem 1rem;
  border: 1px solid var(--cicc-ui-border);
  border-radius: 12px;
  background: #fff;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(summary) {
  cursor: pointer;
  color: var(--cicc-ui-heading) !important;
  font-weight: 700;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(input, select, textarea, summary):focus-visible {
  outline: 3px solid rgba(47, 128, 237, .32);
  outline-offset: 2px;
  border-color: var(--cicc-ui-focus);
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(figure) {
  margin: 1.5rem 0;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(figure img, picture, video, iframe) {
  display: block;
  margin-inline: auto;
  border-radius: 12px;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(figcaption) {
  margin-top: .6rem;
  font-size: .875rem;
  line-height: 1.5;
  text-align: center;
  color: var(--cicc-ui-muted) !important;
}
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(a) {
  overflow-wrap: anywhere;
  text-underline-offset: 3px;
}

/* Homepage visual rhythm: vivid accents on a calm light canvas. */
body.cicc-light-ui.home #hero,
body.cicc-light-ui.front-page #hero {
  background:
    radial-gradient(circle at 12% 18%, rgba(14, 165, 233, .28), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(124, 58, 237, .25), transparent 30%),
    linear-gradient(90deg, rgba(2, 6, 23, .99) 0%, rgba(2, 6, 23, .94) 34%, rgba(2, 6, 23, .56) 60%, rgba(2, 6, 23, .2) 100%),
    url('../images/cicc-home-hero-ai-command.webp') center right / cover no-repeat;
}
body.cicc-light-ui.home #hero h1,
body.cicc-light-ui.front-page #hero h1 {
  color: #fff !important;
  text-shadow: 0 3px 20px rgba(2, 8, 23, .28);
}
body.cicc-light-ui.home #hero h1 .gradient-text,
body.cicc-light-ui.front-page #hero h1 .gradient-text {
  background: linear-gradient(135deg, #67e8f9, #c4b5fd 58%, #fef08a);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.cicc-light-ui.home #hero .cicc-hero__subtitle,
body.cicc-light-ui.front-page #hero .cicc-hero__subtitle {
  color: rgba(255,255,255,.86) !important;
}
body.cicc-light-ui.home #hero .cicc-hero__stat,
body.cicc-light-ui.front-page #hero .cicc-hero__stat {
  min-width: 132px;
  border: 1px solid rgba(255,255,255,.2);
  background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.05));
  box-shadow: 0 12px 30px rgba(2, 8, 23, .2);
  backdrop-filter: blur(12px);
}
body.cicc-light-ui.home #hero .cicc-hero__stat:nth-child(1),
body.cicc-light-ui.front-page #hero .cicc-hero__stat:nth-child(1) { border-bottom: 3px solid #22d3ee; }
body.cicc-light-ui.home #hero .cicc-hero__stat:nth-child(2),
body.cicc-light-ui.front-page #hero .cicc-hero__stat:nth-child(2) { border-bottom: 3px solid #a78bfa; }
body.cicc-light-ui.home #hero .cicc-hero__stat:nth-child(3),
body.cicc-light-ui.front-page #hero .cicc-hero__stat:nth-child(3) { border-bottom: 3px solid #4ade80; }
body.cicc-light-ui.home #hero .cicc-hero__stat:nth-child(4),
body.cicc-light-ui.front-page #hero .cicc-hero__stat:nth-child(4) { border-bottom: 3px solid #fb923c; }
body.cicc-light-ui.home #hero .cicc-hero__stat-num,
body.cicc-light-ui.front-page #hero .cicc-hero__stat-num { color: #fff !important; }
body.cicc-light-ui.home #hero .cicc-hero__stat-label,
body.cicc-light-ui.front-page #hero .cicc-hero__stat-label { color: rgba(255,255,255,.78) !important; }
body.cicc-light-ui.home .hero-cta-card,
body.cicc-light-ui.front-page .hero-cta-card {
  box-shadow: 0 16px 36px rgba(15, 23, 42, .09);
}
body.cicc-light-ui.home .hero-cta-card:hover,
body.cicc-light-ui.front-page .hero-cta-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(15, 23, 42, .15);
}
body.cicc-light-ui.home .feature-card,
body.cicc-light-ui.front-page .feature-card,
body.cicc-light-ui.home .cicc-course-card,
body.cicc-light-ui.front-page .cicc-course-card {
  border: 1px solid var(--cicc-ui-border);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
}
body.cicc-light-ui.home .feature-card:hover,
body.cicc-light-ui.front-page .feature-card:hover,
body.cicc-light-ui.home .cicc-course-card:hover,
body.cicc-light-ui.front-page .cicc-course-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 42px rgba(15, 23, 42, .12);
}
body.cicc-light-ui.home .stat-counter,
body.cicc-light-ui.front-page .stat-counter {
  position: relative;
  padding: 24px 18px;
  border: 1px solid var(--cicc-ui-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
}

/* Tin bài page: one light editorial system, including its legacy inline markup. */
body.cicc-light-ui .cicc-news-page .cicc-hero--gradient-navy {
  background: linear-gradient(135deg, #ffffff 0%, #eff6ff 58%, #e0f2fe 100%);
  border-bottom: 1px solid #dbeafe;
  color: var(--cicc-ui-heading);
}
body.cicc-light-ui .cicc-news-page .cicc-hero h1,
body.cicc-light-ui .cicc-news-page .cicc-hero p {
  color: var(--cicc-ui-heading) !important;
  text-shadow: none;
}
body.cicc-light-ui .cicc-news-page .cicc-hero h1 span {
  color: var(--cicc-ui-link) !important;
}
body.cicc-light-ui .cicc-news-page .cicc-hero span[style*="background:rgba(255,255,255"] {
  background: #dbeafe !important;
  color: #075985 !important;
}

/* Standard navy heroes on interior public pages share the light editorial tone. */
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy {
  background: linear-gradient(135deg, #ffffff 0%, #eff6ff 58%, #e0f2fe 100%);
  border-bottom: 1px solid #dbeafe;
  color: var(--cicc-ui-heading);
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy h1,
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy p,
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy .breadcrumb,
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy .breadcrumb a,
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy .breadcrumb span {
  color: var(--cicc-ui-heading) !important;
  text-shadow: none;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-navy .cicc-hero__tag {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #075985 !important;
  backdrop-filter: none;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-green {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 58%, #d1fae5 100%);
  border-bottom: 1px solid #bbf7d0;
  color: #064e3b;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-orange {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 58%, #fef3c7 100%);
  border-bottom: 1px solid #fed7aa;
  color: #431407;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero--gradient-purple {
  background: linear-gradient(135deg, #faf5ff 0%, #ede9fe 58%, #e0e7ff 100%);
  border-bottom: 1px solid #ddd6fe;
  color: #3b0764;
}
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) h1,
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) p,
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) .breadcrumb,
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) .breadcrumb a,
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) .breadcrumb span {
  color: var(--cicc-ui-heading) !important;
  text-shadow: none;
}
body.cicc-light-ui:not(.home):not(.front-page) :is(.cicc-hero--gradient-green, .cicc-hero--gradient-orange, .cicc-hero--gradient-purple) .cicc-hero__tag {
  background: #fff !important;
  border-color: var(--cicc-ui-border);
  color: var(--cicc-ui-link) !important;
  backdrop-filter: none;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero input[type="search"],
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero input[type="text"] {
  background: #fff !important;
  border-color: #cbd5e1 !important;
  color: var(--cicc-ui-text) !important;
}
body.cicc-light-ui:not(.home):not(.front-page) .cicc-hero input::placeholder {
  color: #64748b !important;
  opacity: 1;
}
body.cicc-light-ui .cicc-news-page section[style*="background:var(--bg)"] {
  background: var(--cicc-ui-bg) !important;
  border-color: var(--cicc-ui-border) !important;
}
body.cicc-light-ui .cicc-news-page input[name="s"] {
  background: #fff !important;
  border-color: #cbd5e1 !important;
  color: var(--cicc-ui-text) !important;
}
body.cicc-light-ui .cicc-news-page input[name="s"]::placeholder {
  color: #64748b !important;
  opacity: 1;
}
body.cicc-light-ui .cicc-news-page #post-grid > a,
body.cicc-light-ui .cicc-news-page #featured-track > a {
  min-width: 0;
  border: 1px solid var(--cicc-ui-border);
  box-shadow: var(--cicc-ui-shadow) !important;
}
body.cicc-light-ui .cicc-news-page #post-grid > a:hover,
body.cicc-light-ui .cicc-news-page #featured-track > a:hover {
  box-shadow: 0 16px 36px rgba(15, 23, 42, .12) !important;
  transform: translateY(-5px);
}
body.cicc-light-ui .cicc-news-page .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 2px solid var(--cicc-ui-border);
  border-radius: 10px;
  color: var(--cicc-ui-heading);
  font-weight: 600;
  font-size: .875rem;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
body.cicc-light-ui .cicc-news-page .page-numbers:hover {
  border-color: var(--cicc-ui-link);
  color: var(--cicc-ui-link);
  transform: translateY(-2px);
}
body.cicc-light-ui .cicc-news-page .page-numbers.current {
  background: var(--cicc-ui-link);
  border-color: var(--cicc-ui-link);
  color: #fff !important;
}
body.cicc-light-ui .cicc-news-page .page-numbers.dots {
  border-color: transparent;
  color: var(--cicc-ui-muted);
}

@media (max-width: 1100px) {
  body.cicc-light-ui .cicc-news-page #post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 680px) {
  body.cicc-light-ui .cicc-news-page #post-grid { grid-template-columns: 1fr !important; }
  body.cicc-light-ui .cicc-news-page .cicc-hero h1 { font-size: clamp(1.85rem, 9vw, 2.5rem) !important; }
  body.cicc-light-ui .cicc-news-page form[method="get"] { max-width: none !important; }
  body.cicc-light-ui .cicc-news-page form[method="get"] input[name="s"] { min-width: 0; }
  body.cicc-light-ui .cicc-news-page #featured-track > a { flex-basis: min(86vw, 320px) !important; }
}

/* Reveal is decorative only; it can never hide a public page. */
body.cicc-light-ui :where(.fade-in, .fade-in-left, .fade-in-right, .scale-in, .sp-reveal) {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

body.cicc-light-ui :where(input, select, textarea) {
  color: var(--cicc-ui-text);
  background: var(--cicc-ui-surface);
  border-color: var(--cicc-ui-border);
}

/* Gutenberg media and data blocks must fit narrow screens without changing content. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(img, video, audio, iframe, canvas, svg) {
  max-width: 100%;
  height: auto;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(pre, table) {
  max-width: 100%;
  overflow-x: auto;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(.wp-block-columns, .wp-block-table, .wp-block-code, .wp-block-preformatted) {
  min-width: 0;
}

/* Interior pages use a light editorial hero; the homepage/CTA hero remains branded. */
body.cicc-light-ui.page .cicc-hero--gradient-navy {
  background: linear-gradient(135deg, #ffffff 0%, #eff6ff 58%, #e0f2fe 100%);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #dbeafe;
}

body.cicc-light-ui.page .cicc-hero--gradient-navy::before {
  background-image: radial-gradient(#bfdbfe 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: .45;
}

body.cicc-light-ui.page .cicc-hero--gradient-navy .cicc-hero__tag {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #075985;
  backdrop-filter: none;
}

body.cicc-light-ui.page .cicc-hero--gradient-navy h1 {
  color: var(--cicc-ui-heading);
  text-shadow: none;
}

/* Course detail templates: warm light hero and a clear conversion panel. */
body.cicc-light-ui.single-course .cicc-hero--gradient-orange,
body.cicc-light-ui.single-khoa_hoc .cicc-hero--gradient-orange {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 58%, #fef3c7 100%);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #fed7aa;
}

body.cicc-light-ui.single-course .cicc-hero--gradient-orange::before,
body.cicc-light-ui.single-khoa_hoc .cicc-hero--gradient-orange::before {
  background-image: radial-gradient(#fdba74 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: .38;
}

body.cicc-light-ui.single-course .cicc-hero--gradient-orange .cicc-hero__tag,
body.cicc-light-ui.single-khoa_hoc .cicc-hero--gradient-orange .cicc-hero__tag {
  background: #ffedd5;
  border-color: #fed7aa;
  color: #9a3412;
  backdrop-filter: none;
}

body.cicc-light-ui.single-course .cicc-hero--gradient-orange h1,
body.cicc-light-ui.single-khoa_hoc .cicc-hero--gradient-orange h1 {
  color: #431407;
  text-shadow: none;
}

body.cicc-light-ui.single-course .breadcrumb,
body.cicc-light-ui.single-khoa_hoc .breadcrumb,
body.cicc-light-ui.single-course .breadcrumb a,
body.cicc-light-ui.single-khoa_hoc .breadcrumb a,
body.cicc-light-ui.single-course .breadcrumb span,
body.cicc-light-ui.single-khoa_hoc .breadcrumb span {
  color: #9a3412 !important;
}

body.cicc-light-ui :where(.cicc-course-layout) > :nth-child(2) {
  background: #fff;
  border: 1px solid var(--cicc-ui-border);
  border-radius: 18px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: var(--cicc-ui-shadow);
}

body.cicc-light-ui :where(.cicc-course-tabs) {
  overflow-x: auto;
  scrollbar-width: thin;
}

body.cicc-light-ui :where(.cicc-course-tabs .course-tab) {
  white-space: nowrap;
}

@media (max-width: 900px) {
  body.cicc-light-ui :where(.cicc-course-layout) {
    grid-template-columns: 1fr !important;
  }
}

/* Knowledge, event, project, location and media singles share one editorial shell. */
body.cicc-light-ui.single-knowledge .cicc-hero--gradient-purple {
  background: linear-gradient(135deg, #faf5ff, #ede9fe 62%, #e0e7ff);
  color: #3b0764;
  border-bottom: 1px solid #ddd6fe;
}
body.cicc-light-ui.single-project .cicc-hero--gradient-green {
  background: linear-gradient(135deg, #f0fdf4, #dcfce7 62%, #d1fae5);
  color: #064e3b;
  border-bottom: 1px solid #bbf7d0;
}
body.cicc-light-ui.single-event .cicc-hero--gradient-navy,
body.cicc-light-ui.single-media .cicc-hero--gradient-navy,
body.cicc-light-ui.single-location .cicc-hero {
  background: linear-gradient(135deg, #ffffff, #eff6ff 62%, #e0f2fe);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #dbeafe;
}
body.cicc-light-ui.single-knowledge .cicc-hero::before,
body.cicc-light-ui.single-project .cicc-hero::before,
body.cicc-light-ui.single-event .cicc-hero::before,
body.cicc-light-ui.single-media .cicc-hero::before,
body.cicc-light-ui.single-location .cicc-hero::before {
  background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: .4;
}
body.cicc-light-ui.single-knowledge .cicc-hero h1,
body.cicc-light-ui.single-project .cicc-hero h1,
body.cicc-light-ui.single-event .cicc-hero h1,
body.cicc-light-ui.single-media .cicc-hero h1,
body.cicc-light-ui.single-location .cicc-hero h1 {
  color: var(--cicc-ui-heading);
  text-shadow: none;
}
body.cicc-light-ui.single-knowledge .cicc-hero__tag,
body.cicc-light-ui.single-project .cicc-hero__tag,
body.cicc-light-ui.single-event .cicc-hero__tag,
body.cicc-light-ui.single-media .cicc-hero__tag,
body.cicc-light-ui.single-location .cicc-hero__tag {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #075985;
  backdrop-filter: none;
}
body.cicc-light-ui.single-knowledge .breadcrumb,
body.cicc-light-ui.single-project .breadcrumb,
body.cicc-light-ui.single-event .breadcrumb,
body.cicc-light-ui.single-media .breadcrumb,
body.cicc-light-ui.single-location .breadcrumb,
body.cicc-light-ui.single-knowledge .breadcrumb a,
body.cicc-light-ui.single-project .breadcrumb a,
body.cicc-light-ui.single-event .breadcrumb a,
body.cicc-light-ui.single-media .breadcrumb a,
body.cicc-light-ui.single-location .breadcrumb a,
body.cicc-light-ui.single-knowledge .breadcrumb span,
body.cicc-light-ui.single-project .breadcrumb span,
body.cicc-light-ui.single-event .breadcrumb span,
body.cicc-light-ui.single-media .breadcrumb span,
body.cicc-light-ui.single-location .breadcrumb span {
  color: #475569 !important;
}
body.cicc-light-ui:is(.single-knowledge, .single-event, .single-project, .single-location, .single-media) .entry-content {
  background: #fff;
  border: 1px solid var(--cicc-ui-border);
  border-radius: 18px;
  padding: clamp(22px, 4vw, 40px);
  box-shadow: var(--cicc-ui-shadow);
}

/* Archive listing: editorial grid instead of a flat legacy list. */
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-heading {
  padding: clamp(28px, 6vw, 64px) 20px 12px;
}
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-heading h1 {
  letter-spacing: -.03em;
}
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-grid {
  align-items: stretch;
}
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-card {
  box-shadow: 0 8px 24px rgba(15,23,42,.05);
  transition: transform .25s ease, box-shadow .25s ease;
}
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 34px rgba(15,23,42,.1) !important;
}
body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-card h2 {
  letter-spacing: -.015em;
}

body.cicc-light-ui.post-type-archive-course .cicc-hero--gradient-orange {
  background: linear-gradient(135deg, #fff7ed, #ffedd5 62%, #fef3c7);
  color: #431407;
  border-bottom: 1px solid #fed7aa;
}
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero--gradient-purple {
  background: linear-gradient(135deg, #faf5ff, #ede9fe 62%, #e0e7ff);
  color: #3b0764;
  border-bottom: 1px solid #ddd6fe;
}

/* Archive heroes use the same readable light language as detail pages. */
body.cicc-light-ui:is(.post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary) .cicc-hero--gradient-navy {
  background: linear-gradient(135deg, #ffffff, #eff6ff 62%, #e0f2fe);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #dbeafe;
}
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category) .cicc-hero--gradient-green {
  background: linear-gradient(135deg, #f0fdf4, #dcfce7 62%, #d1fae5);
  color: #064e3b;
  border-bottom: 1px solid #bbf7d0;
}
body.cicc-light-ui:is(.post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao) .cicc-hero--gradient-navy {
  background: linear-gradient(135deg, #ffffff, #eff6ff 62%, #e0f2fe);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #dbeafe;
}
body.cicc-light-ui:is(.post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-project, .tax-project_category, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao) .breadcrumb,
body.cicc-light-ui:is(.post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-project, .tax-project_category, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao) .breadcrumb a,
body.cicc-light-ui:is(.post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-project, .tax-project_category, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao) .breadcrumb span {
  color: #475569 !important;
}

body.cicc-light-ui.post-type-archive-knowledge .cicc-hero input[type="search"] {
  background: #fff !important;
  border-color: #cbd5e1 !important;
  color: var(--cicc-ui-text) !important;
}

/* Search and category results are editorial pages, not dark promotional areas. */
body.cicc-light-ui.search .cicc-hero,
body.cicc-light-ui.category .cicc-hero {
  background: linear-gradient(135deg, #ffffff, #eff6ff 62%, #e0f2fe);
  color: var(--cicc-ui-heading);
  border-bottom: 1px solid #dbeafe;
}
body.cicc-light-ui.search .cicc-hero h1,
body.cicc-light-ui.category .cicc-hero h1 {
  color: var(--cicc-ui-heading);
  text-shadow: none;
}
body.cicc-light-ui.search .breadcrumb,
body.cicc-light-ui.search .breadcrumb a,
body.cicc-light-ui.search .breadcrumb span,
body.cicc-light-ui.category .breadcrumb,
body.cicc-light-ui.category .breadcrumb a,
body.cicc-light-ui.category .breadcrumb span {
  color: #475569 !important;
}
body.cicc-light-ui.search .cicc-hero input,
body.cicc-light-ui.category .cicc-hero input {
  background: #fff !important;
  border-color: #cbd5e1 !important;
  color: var(--cicc-ui-text) !important;
}
body.cicc-light-ui.post-type-archive-course .cicc-hero h1,
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero h1 {
  color: var(--cicc-ui-heading);
  text-shadow: none;
}
body.cicc-light-ui.post-type-archive-course .cicc-hero__tag,
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero__tag {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #075985;
  backdrop-filter: none;
}
body.cicc-light-ui.post-type-archive-course .cicc-hero__stats,
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero__stats {
  border-top-color: #cbd5e1;
}
body.cicc-light-ui.post-type-archive-course .cicc-hero__stat-num,
body.cicc-light-ui.post-type-archive-course .cicc-hero__stat-label,
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero__stat-num,
body.cicc-light-ui.post-type-archive-knowledge .cicc-hero__stat-label {
  color: #475569;
}

@media (max-width: 900px) {
  body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
  body.cicc-light-ui:is(.archive, .category, .search) .cicc-archive-grid { grid-template-columns: 1fr !important; gap: 16px; }
}

@media (max-width: 900px) {
  body.cicc-light-ui :where(.single-knowledge, .single-event, .single-location, .single-media) section.cicc-section > .container > div[style*="grid-template-columns"],
  body.cicc-light-ui.single-project section.cicc-section > .container > div[style*="grid-template-columns"],
  body.cicc-light-ui :where(.entry-content, .cicc-page-content, .cicc-content) :where(div, section)[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    }
}

body.cicc-light-ui :where(:focus-visible) {
  outline: 3px solid rgba(37, 99, 235, .35);
  outline: 3px solid color-mix(in srgb, var(--cicc-ui-focus) 35%, transparent);
  outline-offset: 3px;
}

@media (max-width: 1024px) {
  body.cicc-light-ui .container { padding-inline: 20px; }
}

@media (max-width: 768px) {
  body.cicc-light-ui .container { padding-inline: 16px; }
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content, .course-tab-content) {
    font-size: 1rem;
    line-height: 1.8;
    overflow-wrap: anywhere;
  }
  body.cicc-light-ui :where(.entry-content, .cicc-page-content, .cicc-content) :where(table) {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* Mobile layout hardening for template/content blocks. Inline grids and
   long tables are common in legacy pages, so make their mobile behavior
   explicit instead of relying on each template to repeat the same rules. */
@media (max-width: 768px) {
  body.cicc-light-ui :where(.site-main, .entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) > * {
    max-width: 100%;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) :where(img, video, iframe, embed, object) {
    max-width: 100%;
    height: auto;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) :where(pre, .wp-block-code) {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) :where(table) {
    width: max-content;
    min-width: 100%;
    max-width: none;
    margin-block: 16px;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content, .wp-block-post-content) :where(.wp-block-table, .table-responsive) {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content) :where(div, section)[style*="grid-template-columns"],
  body.cicc-light-ui.page-template-page-founder .cicc-founder-hero + section .container > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    min-width: 0;
  }

  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content) :where(form) input,
  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content) :where(form) select,
  body.cicc-light-ui :where(.entry-content, .cicc-content, .cicc-page-content) :where(form) textarea {
    max-width: 100%;
    min-width: 0;
  }

  body.cicc-light-ui.page-template-page-founder .cicc-founder-hero {
    padding: 112px 0 48px !important;
  }

  body.cicc-light-ui.page-template-page-founder .cicc-founder-hero .container > div[style*="display:flex"] {
    gap: 20px !important;
  }
}

/* Dark AI hero contrast: this file loads after public-polish.css, so keep the
   mapped visual surfaces readable even when the light UI rules use !important. */
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero :is(h1, h2, h3, p, .cicc-hero__lead, .cicc-hero__subtitle, .cicc-hero__tag, .cicc-hero__stat-num, .cicc-hero__stat-label) {
  color: #fff !important;
}
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero h1 {
  text-shadow: 0 2px 24px rgba(0, 0, 0, .46) !important;
  color: #fff !important;
  background: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
}
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero p {
  color: rgba(255, 255, 255, .86) !important;
}
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero a {
  color: #fff !important;
  text-decoration-color: rgba(255, 255, 255, .72) !important;
}
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero a:hover,
body.cicc-light-ui:is(.page-template-page-gioi-thieu, .page-template-page-khach-hang, .page-template-page-dao-tao) .cicc-hero a:focus-visible {
  color: #67e8f9 !important;
}
body.cicc-light-ui.page-template-page-gioi-thieu .cicc-hero {
  background-image: linear-gradient(90deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .82) 54%, rgba(2, 6, 23, .3)), url('../images/cicc-home-hero-ai-command.webp') !important;
  background-position: center, center right;
  background-size: cover, cover;
}
body.cicc-light-ui.page-template-page-khach-hang .cicc-hero {
  background-image: linear-gradient(90deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .8) 54%, rgba(2, 6, 23, .28)), url('../images/cicc-ai-command-center-hero.webp') !important;
  background-position: center, center right;
  background-size: cover, cover;
}

/* Theme-wide H1 safety guard: never let a text-gradient declaration make a
   heading invisible on a dark visual surface. Intentional gradient spans
   (for example the homepage hero span) are left untouched. */
body.cicc-light-ui :is(.cicc-hero, .cicc-archive-heading, .cicc-level-hero, .cicc-consult-hero, .cicc-founder-hero) h1 {
  -webkit-text-fill-color: currentColor !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
}

/* Homepage is also marked as a WordPress page; keep its AI hero dark after
   the generic interior-page light-hero rules. */
body.cicc-light-ui.home #hero,
body.cicc-light-ui.front-page #hero {
  background:
    radial-gradient(circle at 12% 18%, rgba(14, 165, 233, .28), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(124, 58, 237, .25), transparent 30%),
    linear-gradient(90deg, rgba(2, 6, 23, .99) 0%, rgba(2, 6, 23, .94) 34%, rgba(2, 6, 23, .56) 60%, rgba(2, 6, 23, .2) 100%),
    url('../images/cicc-home-hero-ai-command.webp') center right / cover no-repeat !important;
  color: #fff !important;
}
body.cicc-light-ui.home #hero .cicc-hero__tag,
body.cicc-light-ui.front-page #hero .cicc-hero__tag {
  color: #fff !important;
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .2) !important;
}

/* Course detail heroes use the fast, dark visual treatment and therefore
   require the same explicit contrast as the homepage AI hero. */
body.cicc-light-ui:is(.single-khoa_hoc, .single-course) .cicc-hero--gradient-orange {
  background-image: linear-gradient(90deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .84) 54%, rgba(2, 6, 23, .3)), url('../images/cicc-course-hero.webp') !important;
  background-position: center, center right;
  background-size: cover, cover;
  color: #fff !important;
}
body.cicc-light-ui:is(.single-khoa_hoc, .single-course) .cicc-hero--gradient-orange :is(h1, h2, h3, p, a, span, .breadcrumb, .cicc-hero__tag) {
  color: #fff !important;
}
body.cicc-light-ui:is(.single-khoa_hoc, .single-course) .cicc-hero--gradient-orange h1 {
  background: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .46) !important;
}

/* Final contrast contract for dark hero surfaces across the theme. */
body.cicc-light-ui:is(
  .page-template-page-gioi-thieu,
  .page-template-page-khach-hang,
  .page-template-page-dao-tao,
  .page-template-page-phan-mem,
  .page-template-page-giai-phap,
  .page-template-page-6sapp,
  .page-template-page-dich-vu,
  .page-template-page-form,
  .page-template-page-lien-he,
  .single-khoa_hoc,
  .single-course,
  .single-knowledge,
  .single-glossary,
  .single-event,
  .single-project,
  .single-location,
  .single-media
) .cicc-hero :is(h1, h2, h3, p, a, span, strong, small, .breadcrumb) {
  color: #fff !important;
}
body.cicc-light-ui:is(
  .page-template-page-gioi-thieu,
  .page-template-page-khach-hang,
  .page-template-page-dao-tao,
  .page-template-page-phan-mem,
  .page-template-page-giai-phap,
  .page-template-page-6sapp,
  .page-template-page-dich-vu,
  .page-template-page-form,
  .page-template-page-lien-he,
  .single-khoa_hoc,
  .single-course,
  .single-knowledge,
  .single-glossary,
  .single-event,
  .single-project,
  .single-location,
  .single-media
) .cicc-hero :is(p, .cicc-hero__lead, .cicc-hero__subtitle) {
  color: rgba(255, 255, 255, .86) !important;
}
body.cicc-light-ui:is(
  .page-template-page-gioi-thieu,
  .page-template-page-khach-hang,
  .page-template-page-dao-tao,
  .page-template-page-phan-mem,
  .page-template-page-giai-phap,
  .page-template-page-6sapp,
  .page-template-page-dich-vu,
  .page-template-page-form,
  .page-template-page-lien-he,
  .single-khoa_hoc,
  .single-course,
  .single-knowledge,
  .single-glossary,
  .single-event,
  .single-project,
  .single-location,
  .single-media
) .cicc-hero h1 {
  background: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .46) !important;
}

/* Explicit lead selectors for legacy templates whose inline markup is a
   direct child of the hero content. */
body.cicc-light-ui.page-template-page-gioi-thieu .cicc-hero.cicc-hero--gradient-navy .cicc-hero__content > p,
body.cicc-light-ui.single-khoa_hoc .cicc-hero.cicc-hero--gradient-orange .cicc-hero__content > p,
body.cicc-light-ui.single-course .cicc-hero.cicc-hero--gradient-orange .cicc-hero__content > p {
  color: rgba(255, 255, 255, .9) !important;
  opacity: 1 !important;
  text-shadow: 0 1px 12px rgba(0, 0, 0, .5) !important;
}

/* Light editorial archives: restore dark readable text after the shared
   dark-surface contrast guard. */
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc, .search, .category) .cicc-hero :is(h1, h2, h3, p, a, span, strong, small, .breadcrumb) {
  color: var(--cicc-ui-heading) !important;
  text-shadow: none !important;
}
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc, .search, .category) .cicc-hero :is(p, .cicc-hero__lead, .cicc-hero__subtitle) {
  color: var(--cicc-ui-text) !important;
}
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc, .search, .category) .cicc-hero .cicc-hero__tag {
  color: var(--cicc-ui-link) !important;
  background: #dbeafe !important;
  border-color: #bfdbfe !important;
}

/* These archives carry an AI image with a dark overlay, so their contrast
   contract is white (search/category remain the genuinely light exceptions). */
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc) .cicc-hero :is(h1, h2, h3, p, a, span, strong, small, .breadcrumb) {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .42) !important;
}
body.cicc-light-ui:is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc) .cicc-hero .cicc-hero__tag {
  color: #fff !important;
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .3) !important;
}

/* Higher-specificity correction for archive templates that also match the
   generic light interior-hero selectors. */
body.cicc-light-ui:not(.home):not(.front-page):is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc) .cicc-hero :is(h1, h2, h3, p, a, span, strong, small, .breadcrumb) {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .42) !important;
}
body.cicc-light-ui:not(.home):not(.front-page):is(.post-type-archive-project, .tax-project_category, .post-type-archive-event, .tax-event_type, .post-type-archive-location, .tax-location_region, .post-type-archive-media_gallery, .tax-media_category, .post-type-archive-glossary, .post-type-archive-knowledge, .post-type-archive-chuong_trinh_dao_tao, .post-type-archive-chuong-trinh-dao-tao, .post-type-archive-course, .post-type-archive-khoa_hoc) .cicc-hero .cicc-hero__tag {
  color: #fff !important;
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .3) !important;
}

/* Final theme-wide hero contract. Legacy parent/child templates may carry
   their own light gradient rules; normalize interior promotional heroes to a
   dark AI surface so every heading, lead, link and stat remains readable. */
body.cicc-light-ui:not(.home):not(.front-page):not(.search):not(.category) .cicc-hero {
  background-image: linear-gradient(90deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .84) 54%, rgba(2, 6, 23, .3)), url('../images/cicc-ai-hub-hero.webp') !important;
  background-position: center, center right !important;
  background-size: cover, cover !important;
  color: #fff !important;
}
body.cicc-light-ui:not(.home):not(.front-page):not(.search):not(.category) .cicc-hero :is(h1, h2, h3, p, a, span, strong, small, .breadcrumb, .cicc-hero__lead, .cicc-hero__subtitle, .cicc-hero__stat-num, .cicc-hero__stat-label) {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .42) !important;
}
body.cicc-light-ui:not(.home):not(.front-page):not(.search):not(.category) .cicc-hero h1 {
  background: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
}
body.cicc-light-ui:not(.home):not(.front-page):not(.search):not(.category) .cicc-hero .cicc-hero__tag {
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .3) !important;
}

/* Standard article pages use the legacy .sp-hero surface instead of
   .cicc-hero. Keep its dark AI hero and title/meta contrast consistent. */
body.cicc-light-ui.single-post .sp-hero {
  background-image: linear-gradient(90deg, rgba(2, 6, 23, .98), rgba(2, 6, 23, .84) 54%, rgba(2, 6, 23, .3)), url('../images/cicc-ai-glossary-hero.webp') !important;
  background-position: center, center right !important;
  background-size: cover, cover !important;
  color: #fff !important;
}
body.cicc-light-ui.single-post .sp-hero :is(h1, h2, h3, p, a, span, strong, small) {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .42) !important;
}
body.cicc-light-ui.single-post .sp-hero__cat {
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .3) !important;
}
body.cicc-light-ui.single-post .sp-hero__title {
  background: none !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
}

/* Mobile reading rhythm: keep the viewport wide while preserving breathing room. */
@media (max-width: 640px) {
  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) {
    font-size: 1rem;
    line-height: 1.75;
    overflow-wrap: anywhere;
  }

  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) p {
    margin-block: 0 1.05rem;
  }

  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :is(h2, h3, h4) {
    line-height: 1.28;
    overflow-wrap: anywhere;
  }

  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) img {
    max-width: 100%;
    height: auto;
  }
}

/* T2.4: lock overlays without losing the user's scroll position. */
body.cicc-light-ui.cicc-scroll-locked {
  position: fixed;
  width: 100%;
  overflow: hidden;
}

/* T2.5: mobile controls remain comfortable at the smallest supported width. */
@media (max-width: 768px) {
  body.cicc-light-ui .mobile-nav {
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px));
    overscroll-behavior: contain;
  }

  body.cicc-light-ui .mobile-bottom-nav__item {
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
    padding-inline: 8px;
  }

  body.cicc-light-ui .mobile-bottom-nav__item span {
    font-size: clamp(10px, 2.8vw, 11px) !important;
  }
}

/* Content alignment: editorial copy stays left-readable; only wide desktop prose may justify. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) {
  text-align: left;
}

@media (min-width: 768px) {
  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) > p {
    text-align: justify;
    text-justify: inter-word;
  }
}

/* T2.2: readable type scale for long-form content without disturbing hero/card UI. */
body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) {
  font-size: 1rem;
  line-height: 1.75;
}

body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(h1, h2, h3, h4, h5, h6) {
  line-height: 1.28;
  text-wrap: balance;
}

@media (max-width: 640px) {
  body.cicc-light-ui :where(.entry-content, .wp-block-post-content, .post-content, .cicc-content, .cicc-page-content, .article-content, .cicc-readable-content) :where(h1, h2, h3, h4, h5, h6) {
    letter-spacing: normal;
  }
}

/* Mobile first-render guard: hero content must fit the viewport, never clip. */
@media (max-width: 768px) {
  body.cicc-light-ui #hero .cicc-hero__content,
  body.cicc-light-ui.front-page #hero .cicc-hero__content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  body.cicc-light-ui #hero .cicc-hero__tag,
  body.cicc-light-ui.front-page #hero .cicc-hero__tag {
    display: flex;
    width: min(100%, calc(100vw - 32px));
    margin-inline: auto;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    justify-content: center;
    text-align: center;
  }

  body.cicc-light-ui #hero .stats-row,
  body.cicc-light-ui.front-page #hero .stats-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: min(100%, calc(100vw - 32px));
    margin-inline: auto;
    box-sizing: border-box;
  }

  body.cicc-light-ui #hero h1,
  body.cicc-light-ui.front-page #hero h1,
  body.cicc-light-ui #hero .hero-desc,
  body.cicc-light-ui.front-page #hero .hero-desc {
    width: min(100%, calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    margin-inline: auto;
    overflow-wrap: anywhere;
  }

  body.cicc-light-ui #hero .stats-row .cicc-hero__stat,
  body.cicc-light-ui.front-page #hero .stats-row .cicc-hero__stat {
    width: auto;
    min-width: 0;
  }
}

/* Services landing: collapse the desktop intro grid before it can clip. */
@media (max-width: 768px) {
  body.page-template-page-dich-vu .cicc-hero h1 {
    max-width: calc(100vw - 32px);
    margin-inline: auto;
    font-size: clamp(1.8rem, 8vw, 2.5rem);
    line-height: 1.18;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  body.page-template-page-dich-vu .cicc-section .container > div[style*="grid-template-columns:300px 1fr"] {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }

body.page-template-page-dich-vu .cicc-section .container > div[style*="grid-template-columns:300px 1fr"] > div:first-child {
    position: static !important;
  }
}

/* Final mobile shell guard: preserve the menu trigger at narrow widths. */
@media (max-width: 480px) {
  body.cicc-light-ui .site-header .header-inner { min-width: 0; width: 100%; box-sizing: border-box; padding-inline: 12px; }
  body.cicc-light-ui .site-header .header-actions { min-width: 0; gap: 4px; }
  body.cicc-light-ui .site-header .header-actions .btn-header-search { display: none !important; }
  body.cicc-light-ui .site-header .mobile-toggle { display: flex !important; flex: 0 0 auto; }
}

@media (max-width: 768px) {
  body.page-template-page-dich-vu .cicc-services-hero__copy,
  body.page-template-page-dich-vu .cicc-services-hero h1,
  body.page-template-page-dich-vu .cicc-services-hero__lead { width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; min-width: 0 !important; box-sizing: border-box; white-space: normal !important; overflow-wrap: anywhere; word-break: normal; }
}
