/* 03 ABOUT — native Divi modules, scoped under .cdt-about only.
   !important used throughout: Divi 5 renders its own per-module design-tab
   styling (often inline or via high-specificity generated selectors) which
   otherwise beats a plain external stylesheet regardless of load order —
   confirmed the hard way earlier on the Header/Hero sections in this project. */
.cdt-about, .cdt-about * { box-sizing: border-box !important; }

.cdt-about {
  padding: 6.5rem 24px !important;
  background: #f3f0fb !important;
  background-image: none !important;
}
.cdt-about__inner {
  max-width: 1180px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 3rem !important;
  align-items: center !important;
}
.cdt-about__media { padding: 0 !important; }
.cdt-about__media img {
  border-radius: 28px !important;
  background: #ffffff !important;
  padding: 10px !important;
  box-shadow: 0 20px 45px -20px rgba(76,55,176,.25) !important;
  width: 100% !important;
}
.cdt-about__content { padding: 0 !important; }

.cdt-tag {
  display: inline-flex !important; align-items: center !important; gap: .5rem !important;
  font-size: .8rem !important; font-weight: 600 !important; color: #5b39f2 !important;
  background: #ffffff !important; border: 1px solid #e7e4f5 !important;
  padding: .35rem .9rem !important; border-radius: 999px !important; margin: 0 0 1rem !important;
}

.cdt-heading, .cdt-heading h1, .cdt-heading h2, .cdt-heading h3 {
  font-size: clamp(1.8rem, 3.4vw, 2.6rem) !important;
  font-weight: 700 !important;
  color: #17143c !important;
  margin: 0 0 20px !important;
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 14px !important;
  line-height: 1.2 !important;
}
.cdt-heading h2::after, .cdt-heading::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 90px !important;
  height: 4px !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, #5b39f2, #8fd6ff, transparent) !important;
  animation: cdt-about-underline 2.4s ease-in-out infinite !important;
  transform-origin: left !important;
}
@keyframes cdt-about-underline {
  0%, 100% { transform: scaleX(.7); opacity: .7; }
  50% { transform: scaleX(1); opacity: 1; }
}

.cdt-about__desc, .cdt-about__desc p {
  color: #6a6482 !important;
  margin: 0 0 2rem !important;
  max-width: 560px !important;
  line-height: 1.75 !important;
  font-size: 1rem !important;
}

.cdt-stats { display: flex !important; gap: 3rem !important; padding: 0 !important; margin: 0 !important; flex-wrap: wrap !important; }
.cdt-stat { display: flex !important; flex-direction: column !important; }
.cdt-stat .et_pb_number_counter_number,
.cdt-stat [class*="number"],
.cdt-stat span:first-child {
  font-size: 2.4rem !important;
  font-weight: 800 !important;
  color: #5b39f2 !important;
  line-height: 1.1 !important;
}
.cdt-stat h1, .cdt-stat h2, .cdt-stat h3, .cdt-stat h4,
.cdt-stat [class*="title"] {
  color: #6a6482 !important;
  font-size: .9rem !important;
  font-weight: 400 !important;
  max-width: 150px !important;
  margin: .25rem 0 0 !important;
}

@media (max-width: 900px) {
  .cdt-about { padding: 4.5rem 20px !important; }
  .cdt-about__inner { grid-template-columns: 1fr !important; text-align: left !important; }
  .cdt-stats { gap: 2rem !important; }
}