/* ==========================================================================
   CTA SECTIONS TEMPLATE
   Call-to-Action section patterns used across pages
   Extracted from: pages/about.css, pages/services.css, pages/homepage.css
   ========================================================================== */

/* ==========================================================================
   CTA Section Container
   ========================================================================== */
.cta-section {
  text-align: center;
  padding: var(--space-16) var(--space-4);
}

.cta-section--dark {
  background: var(--brand-primary);
  color: var(--color-text-inverse);
}

.cta-section--light {
  background: var(--color-background-muted);
}

/* ==========================================================================
   CTA Content
   ========================================================================== */
.cta-content {
  text-align: center;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title {
  font-size: var(--font-size-2xl);
  font-family: var(--font-family-heading);
  font-weight: var(--font-weight-bold);
  color: var(--brand-primary);
  margin-bottom: var(--space-4);
}

.cta-section--dark .cta-title {
  color: var(--color-text-inverse);
}

.cta-description {
  font-size: var(--font-size-lg);
  color: var(--color-text-muted);
  margin-bottom: var(--space-8);
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  line-height: var(--line-height-relaxed);
}

.cta-section--dark .cta-description {
  color: rgba(255, 255, 255, 0.9);
}

/* ==========================================================================
   CTA Assurance Items
   ========================================================================== */
.cta-assurance {
  display: flex;
  gap: var(--space-6);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: var(--space-8);
}

.assurance-item {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.cta-section--dark .assurance-item {
  color: rgba(255, 255, 255, 0.8);
}

/* ==========================================================================
   Trust Items
   ========================================================================== */
.trust-items {
  display: flex;
  justify-content: center;
  gap: var(--space-6);
  flex-wrap: wrap;
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  margin-top: var(--space-6);
}

/* ==========================================================================
   Trust Section (Dark Background)
   ========================================================================== */
.trust-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-12);
  align-items: center;
}

/* ==========================================================================
   Category CTA (inline within sections)
   ========================================================================== */
.category-cta {
  margin-top: var(--space-8);
  margin-bottom: var(--space-10);
  text-align: center;
}

/* ==========================================================================
   Responsive - Tablet (880px)
   ========================================================================== */
@media (max-width: 880px) {
  .trust-section {
    grid-template-columns: 1fr;
    gap: var(--space-8);
    text-align: center;
  }

  .trust-items {
    flex-direction: column;
    gap: var(--space-4);
  }
}

/* ==========================================================================
   Responsive - Mobile (767px)
   ========================================================================== */
@media (max-width: 767px) {
  .cta-assurance {
    flex-direction: column;
    gap: var(--space-3);
  }

  .category-cta {
    margin-top: var(--space-4);
    margin-bottom: var(--space-8);
  }
}
