/* Knowledge HTML keeps the reference styles; native Elementor containers use
   the same geometry without depending on the generated document stylesheet. */
/* Elementor wraps Knowledge markup in #speego-root and .page-container; their
   default padding/gap adds gutters absent from the theme's HTML render. */
body[data-route-nav="knowledge"] .elementor > #speego-root,
body[data-route-nav="knowledge"] .elementor > #speego-root > .page-container,
body[data-route-nav="knowledge"] .elementor > .page-container {
  padding: 0 !important;
  gap: 0 !important;
}

/* Only suppress the extra breadcrumb container, never the article root. */
body[data-route-nav="knowledge"] .elementor > .e-con:first-child:not(.page-container):has(.breadcrumb-section):not(:has(h1)) {
  display: none !important;
}

body[data-route-nav="knowledge"] #app-main,
body:has([data-nav="knowledge"]) #app-main {
  padding-top: var(--speego-header-expanded-height, 108px) !important;
}

/* When Knowledge hub has no breadcrumb preceding it, give hero generous top space matching reference */
.page-container[data-nav="knowledge"]:not(:has(.breadcrumb-section)) .knowledge-hero,
#app-main:not(:has(.breadcrumb-section)) .page-container[data-nav="knowledge"] .knowledge-hero {
  padding-top: 56px !important;
}

/* Never display breadcrumbs inside header container */
#header-container nav.breadcrumb-section,
#header-container #breadcrumbSection,
#header-container :is(.e-con, .elementor-element):has(#breadcrumbSection) {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Knowledge Hub Breadcrumb Display & Geometry */
body[data-route-nav="knowledge"] #app-main > .breadcrumb-section,
body[data-route-nav="knowledge"] #app-main > #breadcrumbSection,
body:has([data-nav="knowledge"]) #app-main > .breadcrumb-section,
body:has([data-nav="knowledge"]) #app-main > #breadcrumbSection,
.post-breadcrumb-desktop {
  display: block !important;
  width: 100% !important;
  background-color: transparent !important;
  padding: 12px 0 8px 0 !important;
}

/* Single knowledge post breadcrumb spacing on desktop: keep close to navbar */
@media (min-width: 769px) {
  .post-breadcrumb-desktop,
  #app-main > nav.breadcrumb-section,
  #app-main > nav#breadcrumbSection,
  nav.breadcrumb-section.post-breadcrumb-desktop,
  body.speego-knowledge-single nav.breadcrumb-section.post-breadcrumb-desktop,
  body[data-route-nav="knowledge"]:has(.post-grid) nav.breadcrumb-section.post-breadcrumb-desktop,
  body:has([data-page="knowledge-single"]) nav.breadcrumb-section.post-breadcrumb-desktop,
  body[data-route-nav="knowledge"]:has(.post-grid) #app-main > #breadcrumbSection,
  body.speego-knowledge-single #app-main > #breadcrumbSection,
  body:has([data-page="knowledge-single"]) #app-main > #breadcrumbSection {
    display: block !important;
    padding-top: 10px !important;
    padding-bottom: 6px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .post-breadcrumb-mobile,
  .post-breadcrumb-slot {
    display: none !important;
  }

  body.speego-knowledge-single .post-section,
  body[data-route-nav="knowledge"]:has(.post-grid) .post-section,
  body:has([data-page="knowledge-single"]) .post-section {
    padding-top: 40px !important;
  }
}

@media (max-width: 768px) {
  /* On single knowledge articles on mobile, hide the top breadcrumb (rendered under title) */
  .post-breadcrumb-desktop,
  body[data-route-nav="knowledge"]:has(.post-grid) #app-main > nav.breadcrumb-section:not(.post-breadcrumb-mobile nav),
  body.speego-knowledge-single #app-main > nav.breadcrumb-section:not(.post-breadcrumb-mobile nav),
  body[data-route-nav="knowledge"]:has(.post-grid) #app-main > nav#breadcrumbSection:not(.post-breadcrumb-mobile nav),
  body.speego-knowledge-single #app-main > nav#breadcrumbSection:not(.post-breadcrumb-mobile nav),
  body:has(.page-container[data-page="knowledge-single"]) #app-main > nav#breadcrumbSection:not(.post-breadcrumb-mobile nav),
  nav#breadcrumbSection:not(.post-breadcrumb-mobile nav) {
    display: none !important;
  }

  .post-breadcrumb-mobile,
  .post-breadcrumb-slot {
    display: block !important;
    margin: 0 !important;
    width: 100% !important;
  }
}

body[data-route-nav="knowledge"] .breadcrumb-section .container,
body[data-route-nav="knowledge"] #breadcrumbSection .container,
body:has([data-nav="knowledge"]) .breadcrumb-section .container,
body:has([data-nav="knowledge"]) #breadcrumbSection .container {
  width: 100% !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}

body[data-route-nav="knowledge"] .breadcrumb-list,
body[data-route-nav="knowledge"] #breadcrumbList,
body:has([data-nav="knowledge"]) .breadcrumb-list,
body:has([data-nav="knowledge"]) #breadcrumbList {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.82rem !important;
  color: #64748B !important;
  flex-wrap: wrap !important;
}

body[data-route-nav="knowledge"] .breadcrumb-link,
body:has([data-nav="knowledge"]) .breadcrumb-link {
  color: #475569 !important;
  text-decoration: none !important;
}

body[data-route-nav="knowledge"] .breadcrumb-link:hover,
body:has([data-nav="knowledge"]) .breadcrumb-link:hover {
  color: #F05828 !important;
}

body[data-route-nav="knowledge"] .breadcrumb-sep,
body:has([data-nav="knowledge"]) .breadcrumb-sep {
  color: #CBD5E1 !important;
}

body[data-route-nav="knowledge"] .breadcrumb-current,
body:has([data-nav="knowledge"]) .breadcrumb-current {
  color: #04243D !important;
  font-weight: 600 !important;
}

/* Native Elementor buttons inherit a white label. These are text links on
   pale topic cards and must also wrap long article titles on mobile. */
body[data-route-nav="knowledge"] .topic-article-link :is(a, .elementor-button, p, span),
body[data-route-nav="knowledge"] a.topic-article-link,
body[data-route-nav="knowledge"] .subcat-item :is(a, .elementor-widget-text-editor a),
body[data-route-nav="knowledge"] .topic-article-item :is(a, .elementor-widget-text-editor a) {
  font-family: var(--speego-font, 'Montserrat', sans-serif) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #08283d !important;
  background: transparent !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: normal !important;
  line-height: 1.5 !important;
  text-decoration: none;
}

body[data-route-nav="knowledge"] .topic-more-link :is(a, .elementor-button),
body[data-route-nav="knowledge"] a.topic-more-link {
  color: #a83b15 !important;
  background: transparent !important;
  padding: 0 !important;
  white-space: normal !important;
  font: inherit !important;
}

body[data-route-nav="knowledge"] :is(.topic-article-link, .topic-more-link) a:hover {
  text-decoration: underline;
}

body[data-route-nav="knowledge"] .topic-grid-3x2 .topic-article-link {
  min-width: 0 !important;
  overflow: hidden !important;
}

body[data-route-nav="knowledge"] .topic-grid-3x2 :is(a.topic-article-link, .topic-article-link :is(a, .elementor-button)) {
  display: block;
  font-weight: 700 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body[data-route-nav="knowledge"] .topic-grid-3x2 :is(a.topic-article-link, .topic-article-link a, a.topic-more-link, .topic-more-link a):hover {
  text-decoration: none !important;
}

body[data-route-nav="knowledge"] .cta-band-left .section-title {
  color: #fff !important;
}

@media (max-width: 768px) {
  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .cta-form-band-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 28px !important;
  }

  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .cta-form-band-grid > :is(.cta-band-left, .cta-band-right) {
    flex: 0 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .cta-band-left .section-title {
    font-size: clamp(2rem, 7vw, 3rem) !important;
    line-height: 1.15 !important;
    max-width: none !important;
    word-break: normal !important;
  }

  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .consult-card-white {
    width: 100% !important;
    min-width: 0 !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 600px) {
  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .cta-form-band-section .consult-form .form-row-2col {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .consult-form :is(input, textarea, select) {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

body[data-route-nav="knowledge"] .knowledge-hero:has(.topic-grid-3x2) p {
  max-width: 52ch !important;
}

body[data-route-nav="knowledge"]:not(.elementor-editor-active) .topic-card > :is(.elementor-widget-text-editor.topic-card-desc, .elementor-widget-html.topic-article-list, .elementor-widget-html.topic-card-footer) {
  display: contents !important;
}

/* Elementor's native .container keeps a fixed desktop side margin while it
   stretches to the full page width. On mid-size desktop this pushes the
   Knowledge sections past the viewport; match the reference's centered,
   padded container at every breakpoint. */
body[data-route-nav="knowledge"] :is(.knowledge-hero, .post-section, .topic-grid-section, .subcategories-section, .featured-section, .categories-explore-section, .faq-section, .cta-form-band-section) > .container {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

@media (max-width: 768px) {
  body[data-route-nav="knowledge"] :is(.knowledge-hero, .post-section, .topic-grid-section, .subcategories-section, .featured-section, .categories-explore-section, .faq-section, .cta-form-band-section) > .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

html[lang="vi"] body[data-route-nav="knowledge"]:not(.elementor-editor-active) .topic-card-header > .elementor-widget-text-editor:has(> span.topic-card-badge),
html[lang="es"] body[data-route-nav="knowledge"]:not(.elementor-editor-active) .topic-card-header > .elementor-widget-text-editor:has(> span.topic-card-badge) {
  display: contents !important;
}

@media (max-width: 991px) {
  /* A stale Elementor export hard-codes the grid track to 342px. */
  body[data-route-nav="knowledge"] .topic-grid-3x2 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  body[data-route-nav="knowledge"] .topic-grid-3x2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1200px) {
  body[data-route-nav="knowledge"] .topic-grid-3x2 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1369px) {
  /* Keep Elementor's centered 1320px containers centered against the usable
     page width when the browser reserves a vertical scrollbar gutter. */
  body[data-route-nav="knowledge"] :is(.knowledge-hero, .post-section, .topic-grid-section, .subcategories-section, .featured-section, .categories-explore-section, .faq-section, .cta-form-band-section) > .container {
    margin-left: calc((100% - 1320px) / 2) !important;
    margin-right: calc((100% - 1320px) / 2) !important;
  }
}

/* Elementor wrappers add extra spacing and fixed desktop tracks to the
   category and article sections. Restore the reference's content-first flow. */
body[data-route-nav="knowledge"] .subcat-grid-4col {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch;
  margin-top: 4px !important;
}

body[data-route-nav="knowledge"] .subcat-card {
  min-width: 0;
  padding: 24px 22px 20px !important;
}

body[data-route-nav="knowledge"] .subcat-card .subcat-title {
  margin-bottom: 8px !important;
}

body[data-route-nav="knowledge"] .subcat-card .subcat-item {
  margin: 0 !important;
  padding: 0 !important;
}

body[data-route-nav="knowledge"]:not(.elementor-editor-active) .subcat-card .subcat-item > .elementor-widget-text-editor {
  display: contents !important;
}

body[data-route-nav="knowledge"] .subcat-card > .topic-more-link {
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 561px) {
  body[data-route-nav="knowledge"] .subcat-card {
    min-height: 226px;
  }
}

body[data-route-nav="knowledge"] .featured-section :is(.featured-header, .featured-grid-2col, .featured-cards-list, .featured-article-card, .featured-img-wrap, .featured-meta) {
  padding: 0 !important;
}

body[data-route-nav="knowledge"] .featured-section .featured-sidebar {
  padding: 0 !important;
}

body[data-route-nav="knowledge"] .featured-section .core-docs-box {
  gap: 0 !important;
}

body[data-route-nav="knowledge"] .featured-section .core-docs-box > .core-docs-link.elementor-widget-text-editor:not(:last-child) {
  margin-bottom: 10px !important;
}

body[data-route-nav="knowledge"] .featured-section :is(.featured-header, .featured-meta) {
  display: block !important;
}

body[data-route-nav="knowledge"] .featured-section .featured-content {
  gap: 0 !important;
}

body[data-route-nav="knowledge"] .featured-section .featured-article-card {
  gap: 0 !important;
}

body[data-route-nav="knowledge"] .featured-section .featured-meta p {
  display: inline !important;
  margin: 0 !important;
  font: inherit !important;
}

body[data-route-nav="knowledge"] .featured-section .featured-title {
  margin-top: 19.8px;
}

body[data-route-nav="knowledge"]:not(.elementor-editor-active) .featured-section .elementor-widget-text-editor.featured-title {
  display: contents !important;
}

body[data-route-nav="knowledge"] .categories-explore-section .pills-filter-row {
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center;
  padding: 0 !important;
}

body[data-route-nav="knowledge"]:not(.elementor-editor-active) .categories-explore-section .pills-filter-row > .elementor-widget {
  display: contents !important;
}

@media (min-width: 992px) and (max-width: 1199px) {
  body[data-route-nav="knowledge"] .subcat-grid-4col {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 991px) {
  body[data-route-nav="knowledge"] .subcat-grid-4col {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 1199px) {
  body[data-route-nav="knowledge"] .featured-section .featured-content {
    padding-bottom: 28px !important;
  }
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(> h1) {
  display: block !important;
  width: 100% !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: clamp(48px, 5vw, 72px) 24px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(> h1) > span {
  display: inline-block !important;
  margin: 0 0 8px !important;
  font: 700 11.5px/1.6 var(--speego-font) !important;
  letter-spacing: .08em !important;
  color: #F05828 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor h1 {
  width: auto !important;
  max-width: 18ch !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor h1 + p {
  margin: 0 0 1.1em !important;
  max-width: 52ch !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor :is(.e-con, .e-con-inner):has(> .speego-k-card) {
  display: grid !important;
  width: 100% !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: clamp(48px, 5vw, 72px) 24px calc(clamp(48px, 5vw, 72px) + 56px) !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto !important;
  grid-auto-flow: row !important;
  gap: 24px !important;
  align-items: stretch !important;
  justify-items: stretch !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-card {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 28px 24px 24px !important;
  gap: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: stretch !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-head {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 0 12px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-title {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 0 .5em !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-badge {
  flex: 0 0 auto !important;
  margin: 2px 0 0 !important;
  letter-spacing: .02em !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-desc {
  min-height: 4.8em !important;
  margin: 0 0 20px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-list {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  gap: 12px !important;
  min-height: 0 !important;
  margin: 0 0 24px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 10px !important;
  height: auto !important;
  min-height: 0 !important;
  font-size: .88rem !important;
  line-height: 1.45 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] :is(.speego-k-dot-on, .speego-k-dot-off) {
  margin-top: 3px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-footer {
  display: block !important;
  margin-top: auto !important;
  padding-top: 14px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-more {
  display: inline-flex !important;
  align-items: center !important;
  margin: 3px 0 0 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(.e-accordion-base) {
  width: 100% !important;
  max-width: none !important;
  padding: clamp(48px, 5vw, 72px) 24px !important;
  border-top: 1px solid #D5DEE8 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(.e-accordion-base) > * {
  width: 100% !important;
  max-width: 1272px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.speego-elementor-page main[data-nav="knowledge"] details.e-accordion-item-base:not(:last-child) {
  border-bottom: 1px solid #D5DEE8 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] summary.e-accordion-item-header-base .e-paragraph-base {
  font-size: 1.05rem !important;
  line-height: 1.4 !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta {
  width: 100% !important;
  margin: 0 auto !important;
  padding: clamp(48px, 5vw, 72px) 24px !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta-card {
  flex: 1.05 1 0 !important;
  min-width: 0 !important;
}

/* The shared Elementor heading rule also reaches HTML widgets. Keep the
   imported CTA heading white and at the reference size on its navy surface. */
body.speego-elementor-page main[data-nav="knowledge"] .cta-band-left .section-title {
  max-width: 12ch !important;
  margin: 0 !important;
  font-size: clamp(2.85rem, 5.5vw, 4.25rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -.03em !important;
  color: #fff !important;
}

body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta-card :is(input, textarea) {
  text-align: left !important;
}

@media (max-width: 1024px) {
  body.speego-elementor-page main[data-nav="knowledge"] .elementor :is(.e-con, .e-con-inner):has(> .speego-k-card) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(> h1),
  body.speego-elementor-page main[data-nav="knowledge"] .elementor > .e-con:has(.e-accordion-base),
  body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.speego-elementor-page main[data-nav="knowledge"] .elementor :is(.e-con, .e-con-inner):has(> .speego-k-card) {
    grid-template-columns: minmax(0, 1fr) !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta-copy,
  body.speego-elementor-page main[data-nav="knowledge"] .speego-k-cta-card {
    flex: 0 1 auto !important;
    width: 100% !important;
  }

  /* Fix: CTA form band trên knowledge page – stack thành 1 cột (tách khối dọc) giống ảnh tham chiếu */
  body[data-route-nav="knowledge"] .cta-form-band-grid,
  body[data-route-nav="knowledge"] .cta-form-band-section > .container.cta-form-band-grid,
  body[data-route-nav="knowledge"] .cta-form-band-section > .container,
  body.speego-elementor-page main[data-nav="knowledge"] .cta-form-band-grid,
  body.speego-elementor-page main[data-nav="knowledge"] .cta-form-band-section > .container.cta-form-band-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 32px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body[data-route-nav="knowledge"] .cta-form-band-grid > :is(.cta-band-left, .cta-band-right, .cta-band-copy, .cta-band-form),
  body.speego-elementor-page main[data-nav="knowledge"] .cta-form-band-grid > :is(.cta-band-left, .cta-band-right, .cta-band-copy, .cta-band-form) {
    flex: 0 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body[data-route-nav="knowledge"] .cta-band-left .section-title,
  body.speego-elementor-page main[data-nav="knowledge"] .cta-band-left .section-title {
    font-size: clamp(2rem, 7vw, 2.75rem) !important;
    line-height: 1.15 !important;
    max-width: none !important;
    word-break: normal !important;
  }

  body[data-route-nav="knowledge"] .consult-card-white,
  body.speego-elementor-page main[data-nav="knowledge"] .consult-card-white {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 24px 20px !important;
    border-radius: 16px !important;
    box-sizing: border-box !important;
  }

  body[data-route-nav="knowledge"] .consult-card-white .consult-form div.form-row-2col,
  body.speego-elementor-page main[data-nav="knowledge"] .consult-card-white .consult-form div.form-row-2col {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    width: 100% !important;
  }
}

/* Phone and tablet article columns were frozen at 342px and sat on the left.
   Stretch them across the container, matching the reference page. */
@media (max-width: 1024px) {
  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .post-section .container div.post-grid,
  body[data-route-nav="knowledge"] .post-section .container .post-grid,
  body.speego-knowledge-single .post-grid,
  .page-container[data-page="knowledge-single"] .post-grid,
  .page-container[data-nav="knowledge"] .post-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 36px !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: stretch !important;
    justify-items: stretch !important;
  }

  body[data-route-nav="knowledge"]:not(.elementor-editor-active) .elementor .post-grid > .elementor-element,
  body[data-route-nav="knowledge"] .post-grid :is(.post-main, .post-sidebar),
  body.speego-knowledge-single .post-grid :is(.post-main, .post-sidebar),
  .page-container[data-page="knowledge-single"] .post-grid :is(.post-main, .post-sidebar),
  .page-container[data-nav="knowledge"] .post-grid :is(.post-main, .post-sidebar) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    position: static !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

/* English category Latest resources: 3 cards across, 1 card on small screens. */
body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 28px !important;
  width: 100% !important;
  --display: grid;
  --flex-direction: initial;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-layout > .e-con:not(.featured-sidebar) {
  width: 100% !important;
  max-width: 100% !important;
  --width: 100%;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-grid {
  order: 1;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-pager {
  order: 2;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-sidebar {
  order: 3;
  width: 100% !important;
  max-width: 420px !important;
  --width: 100%;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-grid,
body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-grid.single-card,
body[data-route-nav="knowledge"] .featured-latest-en .featured-cards-list.featured-latest-grid:has(> .featured-article-card:only-child) {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: none !important;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-pager {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  background: #fff;
  color: var(--text-navy, #0A2540);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-page.is-current {
  background: var(--navy-main, #0A2540);
  border-color: var(--navy-main, #0A2540);
  color: #fff;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-page:hover {
  border-color: var(--orange-primary, #F47920);
  color: var(--orange-primary, #F47920);
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-page.is-current:hover {
  color: #fff;
}

@media (max-width: 991px) {
  body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-grid,
  body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-grid.single-card,
  body[data-route-nav="knowledge"] .featured-latest-en .featured-cards-list.featured-latest-grid:has(> .featured-article-card:only-child) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-loop {
  display: block !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;
}

body[data-route-nav="knowledge"] .featured-latest-en .featured-latest-loop > .elementor-widget-loop-grid {
  width: 100% !important;
  max-width: none !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body[data-route-nav="knowledge"] .featured-latest-loop .elementor-widget-button .elementor-button {
  background: transparent;
  color: var(--orange-primary, #F47920);
  padding: 0;
  border: 0;
  box-shadow: none;
  font-weight: 700;
}

body[data-route-nav="knowledge"] .featured-latest-loop .elementor-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}

body[data-route-nav="knowledge"] .featured-latest-loop .elementor-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  background: #fff;
  color: var(--text-navy, #0A2540);
  font-weight: 700;
  text-decoration: none;
}

body[data-route-nav="knowledge"] .featured-latest-loop .elementor-pagination .page-numbers.current {
  background: var(--navy-main, #0A2540);
  border-color: var(--navy-main, #0A2540);
  color: #fff;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap {
  position: relative !important;
  display: block !important;
  height: 190px !important;
  min-height: 190px !important;
  overflow: hidden !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap > .elementor-widget-theme-post-featured-image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap > .elementor-widget-theme-post-featured-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap > .elementor-widget.featured-tag-pill {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  bottom: auto !important;
  width: max-content !important;
  max-width: calc(100% - 24px) !important;
  height: auto !important;
  z-index: 2 !important;
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-img-wrap > .elementor-widget.featured-tag-pill .featured-tag-pill {
  position: static !important;
  display: inline-block !important;
  width: auto !important;
  white-space: nowrap !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-content > .featured-meta {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  margin-bottom: 8px !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-content > .featured-meta > .elementor-widget {
  width: auto !important;
  max-width: none !important;
  flex: 0 1 auto !important;
}

body[data-route-nav="knowledge"] .featured-latest-loop .featured-content > .featured-meta .elementor-widget-container,
body[data-route-nav="knowledge"] .featured-latest-loop .featured-content > .featured-meta p {
  display: inline !important;
  white-space: nowrap !important;
  margin: 0 !important;
}

/* --------------------------------------------------------------------------
   LATEST RESOURCES: Full card clickability
   -------------------------------------------------------------------------- */
body[data-route-nav="knowledge"] .featured-article-card,
body[data-route-nav="knowledge"] .featured-latest-loop .e-loop-item,
.featured-article-card,
.featured-latest-loop .e-loop-item {
  position: relative !important;
  cursor: pointer !important;
}

body[data-route-nav="knowledge"] .featured-article-card *,
body[data-route-nav="knowledge"] .featured-latest-loop .e-loop-item * {
  cursor: pointer;
}

body[data-route-nav="knowledge"] .featured-article-card a.featured-link::after,
body[data-route-nav="knowledge"] .featured-latest-loop .e-loop-item a.featured-link::after,
.featured-article-card a.featured-link::after,
.featured-latest-loop .e-loop-item a.featured-link::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  cursor: pointer !important;
}

body[data-route-nav="knowledge"] .featured-article-card:hover .featured-title,
body[data-route-nav="knowledge"] .featured-latest-loop .e-loop-item:hover .featured-title,
.featured-article-card:hover .featured-title,
.featured-latest-loop .e-loop-item:hover .featured-title {
  color: var(--orange-primary, #F05828) !important;
  transition: color 0.2s ease !important;
}

body[data-route-nav="knowledge"] .featured-article-card:hover a.featured-link,
body[data-route-nav="knowledge"] .featured-latest-loop .e-loop-item:hover a.featured-link,
.featured-article-card:hover a.featured-link,
.featured-latest-loop .e-loop-item:hover a.featured-link {
  color: var(--orange-primary, #F05828) !important;
}

