/* =========================================
TEMP DEBUG STYLES — REMOVE LATER
========================================= */

.cp-section {
  outline: 2px dashed rgba(200, 60, 60, 0.5);
  outline-offset: -2px;
}

.cp-container {
  outline: 2px dashed rgba(60, 120, 220, 0.45);
}

.cp-content,
.cp-content--narrow,
.cp-content--wide {
  outline: 2px dashed rgba(60, 160, 90, 0.5);
}

.cp-media-text {
  outline: 2px dashed rgba(160, 90, 180, 0.5);
}

.cp-media-text__media {
  outline: 2px dashed rgba(230, 150, 50, 0.55);
}

.cp-media-text__content {
  outline: 2px dashed rgba(50, 170, 170, 0.55);
}

/* =========================================
PAGE BUILDER FOUNDATION
========================================= */

.cp-section--bg-default {
  background: transparent;
}

.cp-section--bg-alt {
  background: var(--color-alt);
}

.cp-section--bg-custom-4 {
  background: var(--color-custom-4);
}

.cp-section--bg-custom-5 {
  background: var(--color-custom-5);
}

.cp-section--bg-custom-6 {
  background: var(--color-custom-6);
}

.cp-hero {
  position: relative;
  min-height: 420px;
  border-radius: var(--border-radius);
  overflow: hidden;
  background-color: var(--color-primary-dark);
}

.cp-hero--has-background {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.cp-hero__overlay {
  min-height: 420px;
  display: flex;
  align-items: center;
  padding: var(--spacing-xxxl);
  background: rgba(0, 0, 0, 0.35);
}

.cp-hero__content {
  max-width: var(--page-header-inner-max-width);
  color: var(--color-white);
}

.cp-hero__content .cp-section__heading,
.cp-hero__content .cp-section__eyebrow,
.cp-hero__content .cp-section__body {
  color: inherit;
}

.cp-hero__content .cp-section__eyebrow {
  color: var(--color-white);
}
.cp-section:has(.cp-hero)
 {
  padding-block: 0;
}



.cp-section {
  padding-block: var(--spacing-xxxl);
  color: var(--color-body);
}

.cp-section--compact {
  padding-block: var(--spacing-xl);
}

.cp-section--spacious {
  padding-block: var(--spacing-xxxxl);
}

.cp-section--default {
  background: transparent;
}

.cp-section--muted {
  background: var(--color-alt);
}

.cp-section--accent {
  background: var(--color-custom-7);
}

.cp-container {
 width: min(100% - var(--side-spacing), var(--wrap-max-width));
  margin-inline: auto;
}

.cp-content {
  max-width: var(--page-header-inner-max-width);
  margin-inline: auto;
}

.cp-content--narrow {
  max-width: 680px;
}

.cp-content--wide {
  max-width: min(100%, var(--content-max-width));
}

.cp-section__heading {
  color: var(--color-heading);
  margin: 0 0 var(--spacing-md);
}

.cp-section__eyebrow {
  margin-bottom: var(--spacing-sm);
  color: var(--color-link);
}

.cp-section__body > * + * {
  margin-top: var(--spacing-md);
}

.cp-section__actions {
  margin-top: var(--spacing-lg);
}

.cp-media-text {
  display: grid;
  gap: var(--content-sidebar-gap);
  align-items: center;
}

@media (min-width: 800px) {
  .cp-media-text {
    grid-template-columns: 1fr 1fr;
  }
}

.cp-media-text--reverse {
  direction: rtl;
}

.cp-media-text--reverse > * {
  direction: ltr;
}

.cp-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--border-radius);
}

.cp-card {
  background: var(--color-white);
  border: var(--border);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow);
  padding: var(--padding-md);
}