/* Partner Program — sits directly below "How it works", same
   pattern: header outside the white frame, cards inside it. */
.pp-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:22px;}
.pp-header-text h2{margin:0 0 4px;font-family:var(--font-heading);font-size:16px;font-weight:700;color:var(--blue-dark);}
.pp-header-text p{margin:0;font-size:10.5px;line-height:1.5;color:#3a7a5b;font-weight:400;}
.pp-partners-btn{
  padding:6px 14px;border-radius:999px;flex-shrink:0;
  border:1.5px solid #cfe9dc;background:#fff;
  color:var(--blue-mid);font-weight:600;font-size:11px;font-family:inherit;
  cursor:pointer;transition:background .15s ease;
}
.pp-partners-btn:hover{background:#eafaf2;}

.pp-card{
  margin-top:16px;
  background:#fff;
  border:1px solid rgba(15,44,92,.08);
  border-radius:16px;
  padding:16px;
  box-shadow:0 6px 18px -10px rgba(15,31,61,.22);
}
/* Same 2x2 equal-tile pattern as "How it works": every card is the same
   size, two per row. */
.pp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pp-step{
  background:#f3faf7;
  border-radius:14px;
  min-height:150px;
  overflow:hidden;
  position:relative;
}

/* all four cards are now real artwork, each already containing its own
   badge/title/copy, so every tile just fills edge-to-edge — matching
   the "How it works" image cards exactly. */
.pp-step-image{padding:0;}
.pp-step-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease;}
.pp-step-image:hover .pp-step-img{transform:scale(1.035);}

@media (max-width:560px){
  .pp-grid{grid-template-columns:1fr;}
}

/* CTA below the card, closing out the section — same gradient/text
   treatment as the hero's "Sign Up" button (.btn-primary). .hero-column
   is a column flexbox with default stretch, so without align-self this
   would stretch to the full column width instead of sizing to its text
   like the reference pill button. */
.pp-discuss-btn{
  align-self:flex-start;
  display:inline-flex;align-items:center;justify-content:center;
  margin-top:16px;
  padding:13px 26px;border-radius:999px;
  background:#f39c1f;
  color:#0f3d28;font-weight:600;font-size:13px;font-family:inherit;
  border:none;cursor:pointer;
  transition:background .16s ease;
}
.pp-discuss-btn:hover{background:#e97a0c;}