/*
 * Module: Split Intro
 *
 * Two-column layout: text + image.
 * Variants: --reversed (image left), --circle (circular image), --shadow
 * Used on: Homepage (description), Facilitation (intro, section 2)
 * Dependencies: tokens.css, buttons.css
 */

.split-intro {
  max-width: var(--max-width);
  margin: 0 auto;
  padding-top: var(--space-100);
}
.split-intro__columns {
  display: flex;
  gap: 70px;
  align-items: center;
}

/* ── Reversed: image on left ── */
.split-intro--reversed .split-intro__columns {
  flex-direction: row-reverse;
}

/* ── Text column ── */
.split-intro__text {
  flex: 0 0 600px;
  max-width: 600px;
  display: flex; flex-direction: column;
  gap: var(--space-lg);
}
.split-intro__text > * { margin: 0; }

.split-intro__eyebrow {
  font-family: var(--font-heading); font-weight: 600; font-size: 18px;
  text-transform: uppercase; color: var(--color-primary);
  line-height: 1;
}
.split-intro__title {
  font-family: var(--font-heading); font-weight: 600; font-size: 40px;
  color: var(--color-navy); line-height: 1.15;
}
.split-intro__dot { color: var(--color-success); }

.split-intro__body {
  font-size: 18px; line-height: 28px;
  color: var(--color-text-dark);
}
.split-intro__body p + p { margin-top: 1em; }
.split-intro__body strong {
  font-family: var(--font-body); font-weight: 700;
}

.split-intro__cta .wp-block-button__link,
.split-intro__cta.btn {
  background: var(--color-primary);
  border-radius: var(--radius-pill);
  font-family: var(--font-heading); font-weight: 600; font-size: 18px;
  text-transform: uppercase; letter-spacing: 0.9px;
  padding: 15px 25px; height: 50px;
  transition: background 0.2s ease;
}
.split-intro__cta .wp-block-button__link:hover,
.split-intro__cta.btn:hover {
  background: #1B6AC0;
}

/* ── Underline link ── */
.split-intro__underline-link {
  display: inline-flex; align-items: center;
}
.split-intro__underline-link .wp-block-button.btn--underline {
  border-bottom: none;
}
.split-intro__underline-link .wp-block-button__link,
.split-intro__underline-link .btn {
  background: transparent;
  border-bottom: 4px solid var(--color-success);
  border-radius: 0;
  padding: 0;
  color: var(--color-navy);
}

/* ── Image column ── */
.split-intro__image {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
}
.split-intro__image img {
  width: 100%;
  border-radius: var(--radius-2xl);
  object-fit: cover;
}

/* Circle image variant */
.split-intro--circle .split-intro__image img {
  border-radius: 500px;
  aspect-ratio: 1 / 1;
}

/* Shadow variant */
.split-intro--shadow .split-intro__image img {
  box-shadow: 0 0 30px rgba(0,0,0,0.3);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .split-intro { padding: 60px 24px 0; }
  .split-intro__columns {
    flex-direction: column !important; gap: 40px;
  }
  .split-intro__text { flex: none; max-width: 100%; }
  .split-intro__image img { max-height: 400px; }
}
@media (max-width: 768px) {
  .split-intro { padding: 40px 16px 0; }
  .split-intro__columns { gap: 32px; }
  .split-intro__eyebrow { font-size: 13px; letter-spacing: 1.5px; }
  .split-intro__title { font-size: 28px; }
  .split-intro__body { font-size: 16px; line-height: 26px; }
}