/*
 * Leadership Pages — Shared Styles
 *
 * Covers all leadership sub-page sections:
 * hero (group variant), icon-cards, outcomes, 4C framework, path cards,
 * ROI, brand statement, bio, week grid, checklist,
 * pricing, workshop cards, booking, prefooter CTA.
 * Dependencies: tokens.css, buttons.css
 */

/* ── Section spacing reset ──
   global.css adds margin-top: var(--space-2xl) between .page-content > * + *.
   Leadership wp:html sections are direct children of main.page-content.
   Each section has its own padding, so we suppress the global gap. */
.page-content .leadership-icon-cards,
.page-content .leadership-outcomes,
.page-content .leadership-brand-statement,
.page-content .leadership-4c,
.page-content .leadership-paths,
.page-content .leadership-roi,
.page-content .leadership-prefooter {
  margin-top: 0 !important;
  margin-block-start: 0 !important;
}

/* ── Hero (wp-block-group variant — not a cover block) ── */
/* The hero uses wp:group with align:full. Ensures it breaks out of any
   constrained parent and fills the full viewport width. */
.hero.wp-block-group.alignfull {
  width: 100%;
  max-width: none !important;
}
/* Outline-white btn on dark navy hero background — covers both standalone
   .btn and wp:button block wrapper scenarios */
.hero .btn--outline-white,
.hero .wp-block-button.btn--outline-white .wp-block-button__link {
  border-color: rgba(255,255,255,0.8);
  color: #fff;
  background: transparent;
}
.hero .btn--outline-white:hover,
.hero .wp-block-button.btn--outline-white .wp-block-button__link:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
}

/* ── Icon Cards (Reality Check) ── */
.leadership-icon-cards {
  padding: var(--space-2xl) var(--space-xl);
  background: #fff;
  text-align: center;
}
.leadership-icon-cards__grid {
  display: flex;
  gap: var(--space-lg);
  justify-content: center;
  margin-top: var(--space-lg);
}
.leadership-icon-cards__item {
  flex: 1;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
}
.leadership-icon-cards__icon {
  width: 44px;
  height: 44px;
  border-radius: 500px;
  background: var(--color-success);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
}
.leadership-icon-cards__label {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-xl);
  color: var(--color-dark);
}
.leadership-icon-cards__body {
  font-size: var(--font-md);
  line-height: 1.55;
  color: var(--color-black);
}
.leadership-icon-cards__closing {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--font-lg);
  color: var(--color-dark);
  max-width: 800px;
  margin: var(--space-lg) auto 0;
  text-align: center;
}

/* ── Outcomes (Horizontal Icon List Cards) ── */
.leadership-outcomes {
  padding: var(--space-2xl) var(--space-xl);
  background: var(--color-grey-100);
}
.leadership-outcomes__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
  margin-top: var(--space-lg);
}
.leadership-outcomes__item {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-sm) var(--space-sm);
  background: #fff;
  border-radius: var(--radius-sm);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.leadership-outcomes__item-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 500px;
  background: var(--color-success);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
}
.leadership-outcomes__item-text {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-md);
  color: var(--color-dark);
}

/* ── 4C Framework ── */
.leadership-4c {
  padding: var(--space-2xl) var(--space-xl);
  background: var(--color-accent);
  border-radius: 0 0 0 var(--radius-section);
  text-align: center;
}
.leadership-4c__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.leadership-4c__card {
  background: #fff;
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-sm);
  text-align: left;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}
.leadership-4c__card-icon {
  width: 36px;
  height: 36px;
  border-radius: 500px;
  background: var(--color-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-accent);
  font-size: 18px;
  margin-bottom: var(--space-xs);
}
.leadership-4c__card-title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-xl);
  color: var(--color-dark);
  margin-bottom: var(--space-3xs);
}
.leadership-4c__card-body {
  font-size: var(--font-md);
  line-height: 1.55;
  color: var(--color-black);
}

/* ── Path Cards ── */
.leadership-paths {
  padding: var(--space-2xl) var(--space-100);
  background: #fff;
}
.leadership-paths__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.leadership-paths__card {
  display: flex;
  align-items: stretch;
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: 0 0 12px rgba(0,0,0,0.06), 0 6px 24px rgba(0,0,0,0.08);
  border-left: 4px solid var(--color-primary);
}
.leadership-paths__card--green { border-left-color: var(--color-success); }
.leadership-paths__card--navy  { border-left-color: var(--color-dark); }
.leadership-paths__letter {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--space-md);
  font-family: var(--font-body);
  font-weight: 900;
  font-size: 72px;
  color: var(--color-primary);
  opacity: 0.12;
}
.leadership-paths__card--green .leadership-paths__letter { color: var(--color-success); }
.leadership-paths__card--navy  .leadership-paths__letter { color: var(--color-dark); }
.leadership-paths__content {
  flex: 1;
  padding: var(--space-sm) var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
}
.leadership-paths__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-xl);
  color: var(--color-dark);
}
.leadership-paths__subtitle {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--font-md);
  color: var(--color-primary);
}
.leadership-paths__card--green .leadership-paths__subtitle { color: var(--color-success); }
.leadership-paths__card--navy  .leadership-paths__subtitle { color: var(--color-dark); }
.leadership-paths__body {
  font-size: var(--font-md);
  line-height: 1.55;
  color: var(--color-black);
}
.leadership-paths__for {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--font-sm);
  color: var(--color-grey-500);
}
.leadership-paths__buttons {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
  margin-top: var(--space-xs);
}
/* Override white border on white-background cards — use primary blue */
.leadership-paths__buttons .btn--outline-white {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.leadership-paths__buttons .btn--outline-white:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
}
/* Pre-footer buttons container */
.leadership-prefooter__buttons {
  display: flex;
  gap: var(--space-sm);
  justify-content: center;
  flex-wrap: wrap;
}

/* ── ROI Section ── */
.leadership-roi {
  padding: var(--space-2xl) var(--space-xl);
  background: var(--color-dark);
  text-align: center;
}
.leadership-roi__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.leadership-roi__card {
  background: rgba(255,255,255,0.08);
  border-radius: var(--radius-md);
  padding: var(--space-md) var(--space-sm);
  text-align: center;
}
.leadership-roi__card-title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-lg);
  color: #fff;
  margin-bottom: var(--space-3xs);
}
.leadership-roi__card-body {
  font-size: var(--font-md);
  line-height: 1.55;
  color: #fff;
}
.leadership-roi__closing {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--font-lg);
  color: #fff;
  max-width: 800px;
  margin: var(--space-lg) auto 0;
}

/* ── Brand Statement ── */
.leadership-brand-statement {
  padding: var(--space-xl) var(--space-2xl);
  background: var(--color-grey-200);
  text-align: center;
}
.leadership-brand-statement__text {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  color: var(--color-dark);
  max-width: 800px;
  margin: 0 auto;
}

/* ── Bio Section ── */
.leadership-bio {
  padding: var(--space-2xl) var(--space-xl);
  display: flex;
  gap: var(--space-xl);
  align-items: center;
}
.leadership-bio__photo {
  width: 380px;
  height: 380px;
  border-radius: 500px;
  object-fit: cover;
  background: var(--color-grey-200);
  flex-shrink: 0;
}
.leadership-bio__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.leadership-bio__name {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 36px;
  color: var(--color-dark);
}
.leadership-bio__role {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--font-md);
  color: var(--color-success);
  line-height: 1.5;
}
.leadership-bio__text {
  font-size: 17px;
  line-height: 1.65;
  color: var(--color-black);
}

/* ── Week Grid ── */
.leadership-weeks {
  padding: var(--space-2xl) var(--space-100);
  background: var(--color-accent);
  border-radius: 0 0 var(--radius-section) 0;
  text-align: center;
}
.leadership-weeks__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-sm);
  margin-top: var(--space-lg);
}
.leadership-weeks__card {
  background: #fff;
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-sm);
  text-align: left;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.leadership-weeks__number {
  font-family: var(--font-body);
  font-weight: 900;
  font-size: 32px;
  color: var(--color-success);
  line-height: 1;
  margin-bottom: var(--space-3xs);
}
.leadership-weeks__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 17px;
  color: var(--color-dark);
  line-height: 1.25;
  margin-bottom: var(--space-4xs);
}
.leadership-weeks__body {
  font-size: 14px;
  line-height: 1.55;
  color: var(--color-black);
}

/* ── Checklist ── */
.leadership-checklist {
  padding: var(--space-2xl) var(--space-100);
}
.leadership-checklist__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-md) var(--space-lg);
  margin-top: var(--space-lg);
}
.leadership-checklist__item {
  display: flex;
  align-items: center;
  gap: var(--space-2xs);
}
.leadership-checklist__check {
  color: var(--color-success);
  font-size: 16px;
  flex-shrink: 0;
}
.leadership-checklist__text {
  font-size: var(--font-md);
  color: var(--color-black);
}

/* ── Pricing ── */
.leadership-pricing {
  padding: var(--space-2xl) var(--space-2xl);
  background: var(--color-grey-100);
  text-align: center;
}
.leadership-pricing__price {
  font-family: var(--font-body);
  font-weight: 900;
  font-size: 56px;
  color: var(--color-success);
  line-height: 1;
  margin: var(--space-md) 0 var(--space-3xs);
}
.leadership-pricing__per {
  font-size: var(--font-lg);
  color: var(--color-grey-500);
  margin-bottom: var(--space-md);
}
.leadership-pricing__note {
  font-size: var(--font-md);
  line-height: 1.55;
  color: var(--color-black);
  max-width: 600px;
  margin: 0 auto var(--space-md);
}

/* ── Audience (Who This Is For) ── */
.leadership-audience {
  padding: var(--space-2xl) var(--space-100);
}
.leadership-audience__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-xl);
  align-items: center;
}
.leadership-audience__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.leadership-audience__text h2 {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 40px;
  line-height: 1.15;
  color: var(--color-dark);
}
.leadership-audience__body {
  font-size: var(--font-md);
  line-height: 1.65;
  color: var(--color-black);
}
.leadership-audience__card {
  background: var(--color-grey-100);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}
.leadership-audience__card-heading {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-lg);
  color: var(--color-dark);
  margin-bottom: var(--space-sm);
}
.leadership-audience__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.leadership-audience__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-xs);
}
.leadership-audience__check {
  width: 28px;
  height: 28px;
  min-width: 28px;
  border-radius: 500px;
  background: var(--color-success);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 13px;
  margin-top: 1px;
}
.leadership-audience__item-text {
  font-size: var(--font-md);
  line-height: 1.55;
  color: var(--color-black);
}

/* ── Workshop Cards ── */
.leadership-workshops {
  padding: var(--space-2xl) var(--space-100);
  text-align: center;
}
.leadership-workshops h2 {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 40px;
  line-height: 1.15;
  color: var(--color-dark);
  margin-top: var(--space-sm);
}
.leadership-workshops__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
  margin-top: var(--space-lg);
  text-align: left;
}
.leadership-workshop-card {
  display: flex;
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
  border-left: 4px solid var(--color-primary);
  box-shadow: 0 0 12px rgba(0,0,0,0.06), 0 6px 24px rgba(0,0,0,0.08);
}
.leadership-workshop-card--green { border-left-color: var(--color-success); }
.leadership-workshop-card--navy  { border-left-color: var(--color-dark); }
/* Watermark number — color driven by card variant, not inline style */
.leadership-workshop-card__number {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--space-sm);
  font-family: var(--font-body);
  font-weight: 900;
  font-size: 56px;
  color: var(--color-primary);
  opacity: 0.15;
  user-select: none;
}
.leadership-workshop-card--green .leadership-workshop-card__number {
  color: var(--color-success);
}
.leadership-workshop-card--navy .leadership-workshop-card__number {
  color: var(--color-dark);
}
.leadership-workshop-card__content {
  flex: 1;
  padding: var(--space-sm) var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
}
.leadership-workshop-card__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--font-lg);
  color: var(--color-dark);
  line-height: 1.2;
}
.leadership-workshop-card__body {
  font-size: var(--font-sm);
  line-height: 1.55;
  color: var(--color-black);
  flex: 1;
}

/* ── Booking ── */
.leadership-booking {
  padding: var(--space-2xl) var(--space-2xl);
  background: var(--color-grey-100);
  text-align: center;
}
.leadership-booking h2 {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 40px;
  line-height: 1.15;
  color: var(--color-dark);
  margin-top: var(--space-sm);
}
.leadership-booking__body {
  font-size: var(--font-lg);
  line-height: 1.6;
  color: var(--color-black);
  max-width: 700px;
  margin: var(--space-md) auto;
}

/* ── Pre-footer CTA ── */
.leadership-prefooter {
  padding: var(--space-2xl) var(--space-2xl);
  background: var(--color-dark);
  border-radius: var(--radius-section-sm) var(--radius-section-sm) 0 0;
  text-align: center;
}
.leadership-prefooter__heading {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 48px;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 var(--space-md);
}
.leadership-prefooter__poem {
  font-family: var(--font-body);
  font-size: 22px;
  line-height: 1.7;
  color: #fff;
  max-width: 600px;
  margin: 0 auto var(--space-md);
}

/* ── Max-width inner containers ── */
/* Sections use full-bleed backgrounds but content should not exceed 1200px.
   These rules constrain the section content without adding extra wrapper divs. */
.leadership-bio,
.leadership-outcomes,
.leadership-weeks,
.leadership-pricing,
.leadership-roi,
.leadership-prefooter,
.leadership-brand-statement,
.leadership-checklist,
.leadership-paths,
.leadership-workshops,
.leadership-audience,
.leadership-booking,
.leadership-icon-cards {
  box-sizing: border-box;
  max-width: 100%;
}
.leadership-bio > *,
.leadership-outcomes > *,
.leadership-pricing > *,
.leadership-roi > *,
.leadership-prefooter > * {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
/* Sections that already constrain via padding — ensure content grids stay bounded */
.leadership-weeks__grid,
.leadership-outcomes__grid,
.leadership-roi__grid {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* ── Bio photo — fallback background for missing image ── */
.leadership-bio__photo {
  background-color: var(--color-grey-200, #e5e5e5);
  display: block;
}
/* Show placeholder dimensions even when src is empty */
.leadership-bio__photo[src=""],
.leadership-bio__photo:not([src]) {
  min-width: 380px;
  min-height: 380px;
}

/* ── Pricing — ensure price stands out ── */
.leadership-pricing__price {
  display: block;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .leadership-4c__grid { grid-template-columns: repeat(2, 1fr); }
  .leadership-weeks__grid { grid-template-columns: repeat(2, 1fr); }
  .leadership-roi__grid { grid-template-columns: 1fr; }
  .leadership-checklist__grid { grid-template-columns: repeat(2, 1fr); }
  .leadership-workshops__grid { grid-template-columns: 1fr; }
  .leadership-audience__inner { grid-template-columns: 1fr; gap: var(--space-md); }
  .leadership-bio { flex-direction: column; text-align: center; }
  .leadership-bio__photo { width: 260px; height: 260px; min-width: 260px; min-height: 260px; }
}

@media (max-width: 768px) {
  .leadership-icon-cards__grid { flex-direction: column; align-items: center; }
  .leadership-outcomes__grid { grid-template-columns: 1fr; }
  .leadership-4c__grid { grid-template-columns: 1fr; }
  .leadership-4c { border-radius: 0; }
  .leadership-weeks__grid { grid-template-columns: 1fr 1fr; }
  .leadership-weeks { border-radius: 0; }
  .leadership-paths__card { flex-direction: column; }
  .leadership-paths__letter { padding: var(--space-xs); font-size: 48px; }
  .leadership-checklist__grid { grid-template-columns: 1fr; }
  .leadership-prefooter { border-radius: 40px 40px 0 0; }
  /* Bio centering on mobile */
  .leadership-bio { align-items: center; }
  .leadership-bio__photo { min-width: unset; min-height: unset; }
  /* Pricing buttons stack on mobile */
  .leadership-pricing > div[style*="flex"] {
    flex-direction: column;
    align-items: center;
  }
  /* ROI closing text */
  .leadership-roi__closing { font-size: var(--font-md); }
  /* Prefooter poem */
  .leadership-prefooter__poem { font-size: 18px; }
}

@media (max-width: 480px) {
  .leadership-weeks__grid { grid-template-columns: 1fr; }
}