/* ==========================================================================
   ClearMed — About page trust / feature strip contrast fix
   White icons + text were sitting on pale #F9F9FF / light section bg.
   ========================================================================== */

/*
 * Parent USP strip (.tagline-slider / .tagline-carousel) — white icons/text.
 * Use ClearMed button gradient on this strip only (not the full page).
 */
.tagline-slider,
.clearmed-about-page .tagline-slider,
body.page-slug-about .tagline-slider,
body.page-slug-about-us .tagline-slider {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: #ffffff !important;
  padding: 0.35rem 0 1.25rem;
}

.tagline-slider .tagline-carousel,
.tagline-slider .tagline-carousel.theme-bg-gradient,
.clearmed-about-page .tagline-slider .tagline-carousel,
body.page-slug-about .tagline-slider .tagline-carousel,
body.page-slug-about-us .tagline-slider .tagline-carousel {
  background: var(--brand-gradient) !important;
  background-image: var(--brand-gradient) !important;
  background-color: transparent !important;
  color: #ffffff !important;
  border-radius: var(--radius-lg, 0.85rem);
  padding: 1rem 0.75rem;
  box-shadow: var(--shadow-glow, 0 10px 28px rgba(139, 62, 143, 0.28));
}

.tagline-slider .short-info,
.tagline-slider .short-info *,
.tagline-slider .tagline-content,
.tagline-slider .tagline-content p,
.tagline-slider .tagline-content h1,
.tagline-slider .tagline-content h2,
.tagline-slider .tagline-content h3,
.tagline-slider .tagline-content h4,
.tagline-slider .tagline-content h5,
.tagline-slider .tagline-content h6,
.tagline-slider .tagline-content span,
.clearmed-about-page .tagline-slider .short-info,
.clearmed-about-page .tagline-slider .short-info *,
body.page-slug-about .tagline-slider .short-info,
body.page-slug-about .tagline-slider .short-info *,
body.page-slug-about-us .tagline-slider .short-info,
body.page-slug-about-us .tagline-slider .short-info * {
  color: #ffffff !important;
}

.tagline-slider .tagline-content img,
.clearmed-about-page .tagline-slider .tagline-content img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  flex-shrink: 0;
}

/* Outer About page wrapper: keep content readable */
body.page-slug-about .bg-secondary-section,
body.page-slug-about-us .bg-secondary-section,
body.about-us .bg-secondary-section,
.page-template-default.page .legal-content:has(.section-background-1),
.clearmed-about-page .bg-secondary-section {
  background-color: var(--bg-main, #FFFDFB);
}

/*
 * Trust / USP strip: pale lavender parent bg + white text = invisible.
 * Force ClearMed dark primary so icons/titles stay white and readable.
 */
body.page-slug-about .section-background-1,
body.page-slug-about-us .section-background-1,
body.about-us .section-background-1,
.clearmed-about-page .section-background-1,
body.page-slug-about .section-background-2,
body.page-slug-about-us .section-background-2,
.clearmed-about-page .section-background-2,
body.page-slug-about .color-w,
body.page-slug-about-us .color-w,
.clearmed-about-page .color-w {
  background-color: var(--dark-color) !important;
  background-image: none !important;
  color: #ffffff !important;
}

body.page-slug-about .section-background-1 *,
body.page-slug-about-us .section-background-1 *,
.clearmed-about-page .section-background-1 *,
body.page-slug-about .section-background-2 *,
body.page-slug-about-us .section-background-2 *,
.clearmed-about-page .section-background-2 *,
body.page-slug-about .color-w *,
body.page-slug-about-us .color-w *,
.clearmed-about-page .color-w * {
  color: #ffffff !important;
  fill: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.25);
}

/* Elementor icon-box trust rows on About */
body.page-slug-about .elementor-section:has(.elementor-icon-box-wrapper),
body.page-slug-about-us .elementor-section:has(.elementor-icon-box-wrapper),
.clearmed-about-page .elementor-section:has(.elementor-icon-box-wrapper),
body.page-slug-about .e-con:has(.elementor-icon-box-wrapper),
body.page-slug-about-us .e-con:has(.elementor-icon-box-wrapper),
.clearmed-about-page .e-con:has(.elementor-icon-box-wrapper) {
  background-color: var(--dark-color) !important;
  background-image: none !important;
}

body.page-slug-about .elementor-icon-box-title,
body.page-slug-about .elementor-icon-box-title *,
body.page-slug-about .elementor-icon-box-description,
body.page-slug-about .elementor-icon-box-description *,
body.page-slug-about .elementor-icon-box-icon i,
body.page-slug-about .elementor-icon-box-icon svg,
body.page-slug-about-us .elementor-icon-box-title,
body.page-slug-about-us .elementor-icon-box-title *,
body.page-slug-about-us .elementor-icon-box-description,
body.page-slug-about-us .elementor-icon-box-description *,
body.page-slug-about-us .elementor-icon-box-icon i,
body.page-slug-about-us .elementor-icon-box-icon svg,
.clearmed-about-page .elementor-icon-box-title,
.clearmed-about-page .elementor-icon-box-title *,
.clearmed-about-page .elementor-icon-box-description,
.clearmed-about-page .elementor-icon-box-description *,
.clearmed-about-page .elementor-icon-box-icon i,
.clearmed-about-page .elementor-icon-box-icon svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Gutenberg columns with white text on light page */
body.page-slug-about .wp-block-columns:has(.has-white-color),
body.page-slug-about-us .wp-block-columns:has(.has-white-color),
.clearmed-about-page .wp-block-columns:has(.has-white-color),
body.page-slug-about .wp-block-group:has(.has-white-color),
body.page-slug-about-us .wp-block-group:has(.has-white-color),
.clearmed-about-page .wp-block-group:has(.has-white-color) {
  background-color: var(--dark-color) !important;
  padding: 1.25rem 1.5rem;
  border-radius: var(--radius-lg, 0.85rem);
}

body.page-slug-about .has-white-color,
body.page-slug-about-us .has-white-color,
.clearmed-about-page .has-white-color {
  color: #ffffff !important;
}

/* Parent features strip fallback */
body.page-slug-about .features-section .header,
body.page-slug-about-us .features-section .header,
.clearmed-about-page .features-section .header {
  background-color: var(--dark-color) !important;
  color: #ffffff !important;
}

body.page-slug-about .features-section .header h4,
body.page-slug-about-us .features-section .header h4,
.clearmed-about-page .features-section .header h4,
body.page-slug-about .features-section .header .fi:before,
body.page-slug-about-us .features-section .header .fi:before,
.clearmed-about-page .features-section .header .fi:before {
  color: #ffffff !important;
}

/* Spacing polish for the 4-up trust row */
body.page-slug-about .elementor-icon-box-wrapper,
body.page-slug-about-us .elementor-icon-box-wrapper,
.clearmed-about-page .elementor-icon-box-wrapper {
  align-items: flex-start;
}

/* Blog Read More on About — keep gradient; section pairs use outline in woopw-bridge */
.clearmed-about-page .blog-section .theme-btn-outline,
.clearmed-about-page .blog-listing-section .theme-btn-outline,
.clearmed-about-page .cta-block .theme-btn-outline,
body.page-slug-about .blog-section .theme-btn-outline,
body.page-slug-about-us .blog-section .theme-btn-outline {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  width: 100% !important;
  min-height: var(--btn-min-height, 40px) !important;
  border-radius: 9999px !important;
  border: none !important;
  background: var(--brand-gradient) !important;
  background-image: var(--brand-gradient) !important;
  color: #ffffff !important;
  box-shadow: var(--shadow-glow) !important;
  font-weight: 600 !important;
}

.clearmed-about-page .blog-section .theme-btn-outline:hover,
.clearmed-about-page .cta-block .theme-btn-outline:hover,
body.page-slug-about .blog-section .theme-btn-outline:hover,
body.page-slug-about-us .blog-section .theme-btn-outline:hover {
  background: var(--brand-gradient-hover) !important;
  background-image: var(--brand-gradient-hover) !important;
  color: #ffffff !important;
  border: none !important;
}

.clearmed-about-page .blog-section .theme-btn-outline i,
.clearmed-about-page .blog-section .theme-btn-outline *,
body.page-slug-about .blog-section .theme-btn-outline * {
  color: #ffffff !important;
}

/* About section button pairs — 1st gradient, 2nd outline */
.clearmed-about-page .call-to-action,
body.page-slug-about .call-to-action,
body.page-slug-about-us .call-to-action {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.clearmed-about-page .call-to-action .mr-3,
body.page-slug-about .call-to-action .mr-3,
body.page-slug-about-us .call-to-action .mr-3 {
  margin-right: 0 !important;
}

.clearmed-about-page .call-to-action .theme-btn-outline,
.clearmed-about-page .call-to-action a.theme-btn-outline,
.clearmed-about-page .call-to-action .theme-btn-secondary,
body.page-slug-about .call-to-action .theme-btn-outline,
body.page-slug-about-us .call-to-action .theme-btn-outline {
  width: auto !important;
  background: transparent !important;
  background-image: none !important;
  color: var(--dark-color) !important;
  border: 1.5px solid var(--dark-color) !important;
  box-shadow: none !important;
}

.clearmed-about-page .call-to-action .theme-btn-outline:hover,
.clearmed-about-page .call-to-action .theme-btn-secondary:hover,
body.page-slug-about .call-to-action .theme-btn-outline:hover,
body.page-slug-about-us .call-to-action .theme-btn-outline:hover {
  background: var(--dark-color) !important;
  background-image: none !important;
  color: #ffffff !important;
  border-color: var(--dark-color) !important;
  box-shadow: none !important;
}

.clearmed-about-page .call-to-action .theme-btn-outline *,
.clearmed-about-page .call-to-action .theme-btn-secondary *,
body.page-slug-about .call-to-action .theme-btn-outline * {
  color: inherit !important;
}

/* Blog card excerpts — max 3 lines */
.blog-section .meta-info > p,
.blog-section .details .meta-info > p,
.blog-listing-section .blog-grids .grid .meta-info > p,
.blog-listing-section .blog-grids .details p,
.clearmed-about-page .blog-section .meta-info > p,
.clearmed-about-page .blog-section .details p,
body.page-slug-about .blog-section .meta-info > p,
body.page-slug-about-us .blog-section .meta-info > p {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden !important;
  text-overflow: ellipsis;
  max-height: calc(1.55em * 3);
  margin-bottom: 0;
}

/* Inline pale lavender backgrounds from page builders */
.clearmed-about-page .elementor-section[style*="F9F9FF"],
.clearmed-about-page .elementor-section[style*="f9f9ff"],
.clearmed-about-page .elementor-section[style*="249, 249, 255"],
.clearmed-about-page .e-con[style*="F9F9FF"],
.clearmed-about-page .e-con[style*="f9f9ff"],
.clearmed-about-page .e-con[style*="249, 249, 255"],
.clearmed-about-page [style*="background-color:#F9F9FF"],
.clearmed-about-page [style*="background-color: #F9F9FF"],
.clearmed-about-page [style*="background-color:#f9f9ff"] {
  background-color: var(--dark-color) !important;
  background-image: none !important;
  color: #ffffff !important;
}

/* Content-group titles sit above description (not full-width centered) */
.content-group-sections .content-column .section-header-wrapper,
.content-group-sections .content-column .content-column-header,
.clearmed-about-page .content-group-sections .content-column-header,
body.page-slug-about .content-group-sections .content-column-header,
body.page-slug-about-us .content-group-sections .content-column-header {
  text-align: left !important;
  margin: 0 0 0.75rem !important;
  padding: 0 !important;
  width: 100%;
  max-width: 100%;
}

.content-group-sections .content-column .section-eyebrow,
.content-group-sections .content-column h5.section-eyebrow,
.content-group-sections .content-column .section-header-wrapper h5,
.clearmed-about-page .content-group-sections .content-column h5 {
  margin: 0 0 0.25rem !important;
  font-size: 0.875rem !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--text-muted, #6B5176);
  text-align: left !important;
}

.content-group-sections .content-column .section-title,
.content-group-sections .content-column .section-header-wrapper h2,
.clearmed-about-page .content-group-sections .content-column .section-title {
  margin: 0 0 0.85rem !important;
  text-align: left !important;
  color: var(--dark-color, #3A2743);
  font-size: clamp(1.45rem, 1.8vw + 0.7rem, 1.95rem) !important;
  line-height: 1.2 !important;
}

.content-group-sections .content-column .content-column-body > *:first-child {
  margin-top: 0 !important;
}

.content-group-sections .content-column .call-to-action {
  margin-top: 1.25rem !important;
}

/* Tighten vertical rhythm for image + text sections */
.content-group-sections.section-padding,
.clearmed-about-page .content-group-sections.section-padding,
body.page-slug-about .content-group-sections.section-padding,
body.page-slug-about-us .content-group-sections.section-padding {
  padding-top: 2.25rem !important;
  padding-bottom: 2.25rem !important;
}

@media (min-width: 992px) {
  .content-group-sections.section-padding,
  .clearmed-about-page .content-group-sections.section-padding,
  body.page-slug-about .content-group-sections.section-padding,
  body.page-slug-about-us .content-group-sections.section-padding {
    padding-top: 2.75rem !important;
    padding-bottom: 2.75rem !important;
  }
}

/* Parent forces 55% + margin-left auto — causes huge empty gaps */
.content-group-sections .content-column,
.content-group-sections.section-even .content-column,
.clearmed-about-page .content-group-sections .content-column {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}

.content-group-sections .row {
  --bs-gutter-x: 1.75rem;
  align-items: center;
  row-gap: 1.25rem;
}

.content-group-sections .featured-img-column {
  margin-bottom: 0 !important;
}

.tagline-slider + .content-group-sections,
.page-banner + .content-group-sections {
  padding-top: 1.75rem !important;
}

@media (max-width: 767px) {
  .content-group-sections.section-padding {
    padding-top: 1.75rem !important;
    padding-bottom: 1.75rem !important;
  }

  .content-group-sections .content-column .content-column-header {
    margin-bottom: 0.5rem !important;
  }

  .content-group-sections .featured-img-column {
    margin-bottom: 0.75rem !important;
  }
}
