/* 08 WHY CHOOSE US — native Divi modules, scoped under .cdt-why only. */
.cdt-why, .cdt-why * { box-sizing: border-box; }

.cdt-why { padding: 6.5rem 24px !important; background: #ffffff; }
.cdt-why__inner { max-width: 1180px; margin: 0 auto !important; display: flex !important; flex-wrap: wrap; align-items: center; gap: 3rem; }
.cdt-why__content, .cdt-why__grid { padding: 0 !important; }
.cdt-why__grid { flex: 1 1 380px; display: flex !important; flex-wrap: wrap; gap: 1.4rem; }
.cdt-why__content { flex: 1 1 380px; }

.cdt-tag { display: inline-flex; align-items: center; gap: .5rem; font-size: .8rem; font-weight: 600; color: #5b39f2; background: #f6f5fc; border: 1px solid #e7e4f5; padding: .35rem .9rem; border-radius: 999px; margin: 0 0 1rem !important; }
.cdt-heading h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 700; color: #1c1836; margin: 0 0 1.2rem; }
.cdt-why__desc p { color: #635f78; margin: 0 0 2rem; max-width: 460px; }

.cdt-video-showcase, .cdt-video-showcase a {
  display: inline-flex !important; align-items: center; gap: .8rem;
  padding: .6rem 1.2rem .6rem .6rem !important; border-radius: 999px !important;
  background: #f6f5fc !important; color: #1c1836 !important; font-weight: 700 !important;
  text-decoration: none !important; text-transform: uppercase; letter-spacing: .05em; font-size: .82rem !important;
}

.cdt-why-card { flex: 1 1 calc(50% - .7rem); background: #ffffff !important; border: 1px solid #e7e4f5; border-radius: 18px; padding: 1.8rem !important; }
.cdt-why-card h2, .cdt-why-card h3, .cdt-why-card [class*="title"] { font-size: 1.05rem !important; color: #1c1836 !important; margin: 0 0 .5rem !important; }
.cdt-why-card p, .cdt-why-card [class*="content"] { font-size: .88rem !important; color: #635f78 !important; margin: 0 !important; }
.cdt-why-card--highlight { background: linear-gradient(145deg, #5b39f2 0%, #3f6fd8 100%) !important; border-color: transparent; }
.cdt-why-card--highlight h2, .cdt-why-card--highlight h3, .cdt-why-card--highlight [class*="title"] { color: #ffffff !important; }
.cdt-why-card--highlight p, .cdt-why-card--highlight [class*="content"] { color: rgba(255,255,255,.85) !important; }

@media (max-width: 700px) { .cdt-why-card { flex: 1 1 100%; } }