/* ==========================================================================
   NPPCP Theme — Homepage Sections (minimal base layout)
   Widget-specific styling is handled inline within Elementor render() methods.
   ========================================================================== */

/* --- Section Padding Utility --- */
.nppcp-section {
  padding: 48px 0;
}

@media (min-width: 576px) {
  .nppcp-section {
    padding: 64px 0;
  }
}

@media (min-width: 992px) {
  .nppcp-section {
    padding: 80px 0;
  }
}

@media (min-width: 1200px) {
  .nppcp-section {
    padding: 96px 0;
  }
}

/* --- Hero --- */
.nppcp-hero {
  position: relative;
  overflow: hidden;
}

.nppcp-hero__cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* --- About Section --- */
.nppcp-about-section {
  background-color: var(--bg-light-green);
}

/* --- Certifications Section --- */
.nppcp-certifications {
  background-color: var(--bg-offwhite);
  text-align: center;
}

/* --- Framework Section (Split: image left, green content right) --- */
.nppcp-framework.nppcp-section {
  padding: 0;
}

.nppcp-framework__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.nppcp-framework__image {
  position: relative;
  overflow: hidden;
}

.nppcp-framework__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nppcp-framework__content {
  background-color: var(--cert-framework-bg);
  color: #fff;
  padding: 4rem 3.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (max-width: 768px) {
  .nppcp-framework__inner {
    grid-template-columns: 1fr;
  }

  .nppcp-framework__image {
    min-height: 280px;
  }

  .nppcp-framework__content {
    padding: 2.5rem 1.5rem;
  }
}

/* --- Projects Banner --- */
.nppcp-projects-banner {
  position: relative;
  overflow: hidden;
}

/* --- News Section --- */
.nppcp-news-section {
  background-color: var(--bg-gray);
}