/* Final light-theme correction for the contact CTA and article controls. */
html[data-theme="light"] .cta.media-section {
  background-color: #edf1f3 !important;
  background-image:
    var(--decor-platinum),
    linear-gradient(135deg, #f8fafb 0%, #e7ecef 100%) !important;
  background-position: center, center !important;
  background-repeat: repeat, no-repeat !important;
  background-size: var(--decor-size), auto !important;
}

html[data-theme="light"] .cta .media-overlay {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.62), rgba(248, 250, 251, 0.18) 52%, rgba(209, 218, 224, 0.3)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(184, 197, 205, 0.12)) !important;
}

html[data-theme="light"] .cta h2 {
  color: #17242e;
}

html[data-theme="light"] .cta h2 span {
  color: #526777;
}

html[data-theme="light"] .cta-lede {
  color: rgba(23, 36, 46, 0.72);
}

html[data-theme="light"] .cta-contact-item {
  border-color: rgba(23, 36, 46, 0.18);
  background: rgba(255, 255, 255, 0.84);
  color: #17242e;
  box-shadow: 0 10px 24px rgba(23, 36, 46, 0.08);
}

html[data-theme="light"] .cta-contact-item:hover,
html[data-theme="light"] .cta-contact-item:focus-visible {
  background: #ffffff;
  color: #17242e;
}

html[data-theme="light"] .cta-contact-more {
  color: #526777;
}

html[data-theme="light"] .contact-form {
  border-color: rgba(23, 36, 46, 0.22);
  background: rgba(255, 255, 255, 0.96);
  color: #17242e;
  box-shadow: 0 18px 42px rgba(23, 36, 46, 0.14);
}

/* Keep the article section and card treatment aligned with the 14 August layout. */
html[data-theme="light"] .articles-home-section {
  border-block-color: transparent !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(var(--ivory-rgb), 0.42), transparent 24rem),
    var(--decor-platinum),
    linear-gradient(180deg, #f7f9fa 0%, #eef2f4 38%, #e4eaed 100%) !important;
  background-size: auto, var(--decor-size), auto !important;
  box-shadow: none !important;
}

html[data-theme="light"] .articles-home-section .section-kicker,
html[data-theme="light"] .articles-home-section .articles-home-link {
  color: var(--primary-strong) !important;
}

html[data-theme="light"] .articles-home-section .section-copy p {
  color: rgba(var(--primary-deep-rgb), 0.72) !important;
}

html[data-theme="light"] .article-card {
  border-color: rgba(var(--primary-deep-rgb), 0.18) !important;
  background-color: #ffffff !important;
  background-image: var(--decor-platinum) !important;
  background-size: var(--decor-size) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 16px 38px rgba(var(--primary-deep-rgb), 0.1) !important;
}

html[data-theme="light"] .article-card:hover,
html[data-theme="light"] .article-card:focus-visible {
  border-color: rgba(var(--primary-rgb), 0.42) !important;
  background-color: #ffffff !important;
  background-image: var(--decor-platinum) !important;
  background-size: var(--decor-size) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 22px 46px rgba(var(--primary-deep-rgb), 0.14) !important;
}

html[data-theme="light"] .article-card::before {
  filter: saturate(0.72) contrast(1.06) brightness(1.03) !important;
  opacity: 0.28 !important;
}

html[data-theme="light"] .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--primary-rgb), 0.06), transparent 34%),
    linear-gradient(105deg, rgba(255, 255, 255, 0.98) 0%, rgba(250, 252, 253, 0.94) 52%, rgba(237, 243, 246, 0.76) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--primary-rgb), 0.08) 54.12% 54.26%, transparent 54.42% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .article-card-index,
html[data-theme="light"] .article-card-icon,
html[data-theme="light"] .article-card strong,
html[data-theme="light"] .article-card-description,
html[data-theme="light"] .article-card-meta,
html[data-theme="light"] .article-card-meta .material-symbols-outlined {
  color: var(--primary-deep) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.96);
}

html[data-theme="light"] .article-card-category,
html[data-theme="light"] .article-card-link,
html[data-theme="light"] .article-card-link .material-symbols-outlined {
  color: var(--primary-strong) !important;
}

.articles-carousel-dots {
  min-height: 22px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  margin-block-start: clamp(16px, 2vw, 22px) !important;
}

/* Article navigation: dots instead of numbered pills, plain arrow controls. */
.articles-carousel-button,
html[data-theme="light"] .articles-carousel-button {
  width: 36px !important;
  height: 56px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--primary) !important;
}

.articles-carousel-button:hover,
html[data-theme="light"] .articles-carousel-button:hover,
html[data-theme="light"] .articles-carousel-button:focus-visible {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--primary-strong) !important;
}

.articles-carousel-button:focus-visible,
html[data-theme="light"] .articles-carousel-button:focus-visible {
  outline: 2px solid currentColor !important;
  outline-offset: 4px;
}

.articles-carousel-dot,
html[data-theme="light"] .articles-carousel-dot {
  width: 8px !important;
  height: 8px !important;
  min-width: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(var(--text-muted-rgb), 0.38) !important;
  color: transparent !important;
  font-size: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

.articles-carousel-dot:hover,
.articles-carousel-dot:focus-visible,
.articles-carousel-dot.is-active,
html[data-theme="light"] .articles-carousel-dot:hover,
html[data-theme="light"] .articles-carousel-dot:focus-visible,
html[data-theme="light"] .articles-carousel-dot.is-active {
  border: 0 !important;
  background: var(--primary) !important;
  box-shadow: 0 0 0 4px rgba(var(--primary-rgb), 0.14) !important;
  outline: none;
  transform: scale(1.25) !important;
}