/* =========================================================
   BUTTONS
========================================================= */

.pia-hero-actions,
.pia-join-actions,
.pia-program-detail-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.pia-hero-actions {
  margin-top: 34px;
}

.pia-join-actions {
  justify-content: center;
  margin: 60px 0 90px;
}

.pia-program-detail-actions {
  margin-top: 38px;
}


/* BASE */

.pia-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  min-height: 52px;
  padding: 14px 24px;

  border: 2px solid transparent;
  border-radius: 999px;

  appearance: none;
  cursor: pointer;

  font-size: 15px;
  font-weight: 700;
  line-height: 1;

  text-align: center;
  text-decoration: none;
  white-space: nowrap;

  transition:
    transform .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    color .2s ease,
    box-shadow .2s ease;
}

.pia-btn:hover {
  transform: translateY(-2px);
}

.pia-btn:active {
  transform: translateY(0);
}


/* PRIMARY */

.pia-btn-primary {
  border-color: var(--pia-black);
  background: var(--pia-black);
  color: var(--pia-white) !important;
}

.pia-btn-primary:hover {
  border-color: var(--pia-pink);
  background: var(--pia-pink);
  color: var(--pia-black) !important;
  box-shadow: 0 12px 30px rgba(17,17,17,.12);
}


/* SECONDARY */

.pia-btn-secondary {
  border-color: var(--pia-black);
  background: transparent;
  color: var(--pia-black) !important;
}

.pia-btn-secondary:hover {
  border-color: var(--pia-pink);
  background: var(--pia-pink);
  color: var(--pia-black) !important;
}


/* LIGHT */

.pia-btn-light {
  border-color: var(--pia-white);
  background: var(--pia-white);
  color: var(--pia-black) !important;
}

.pia-btn-light:hover {
  border-color: var(--pia-pink);
  background: var(--pia-pink);
  color: var(--pia-black) !important;
}


/* BUTTONS INSIDE DARK SECTIONS */

.pia-program-detail-dark .pia-btn-primary,
.pia-transformation .pia-btn-primary,
.pia-contact-section .pia-btn-primary {
  border-color: var(--pia-pink);
  background: var(--pia-pink);
  color: var(--pia-black) !important;
}

.pia-program-detail-dark .pia-btn-primary:hover,
.pia-transformation .pia-btn-primary:hover,
.pia-contact-section .pia-btn-primary:hover {
  border-color: var(--pia-white);
  background: var(--pia-white);
}


/* ACCESSIBILITY */

.pia-btn:focus-visible,
.pia-nav-cta:focus-visible,
.pia-nav-links a:focus-visible,
.pia-brand:focus-visible,
.pia-text-link:focus-visible,
.pia-program-link:focus-visible,
.pia-footer a:focus-visible,
.pia-modal-close:focus-visible,
.pia-form-submit:focus-visible {
  outline: 3px solid var(--pia-pink);
  outline-offset: 4px;
}


/* MOBILE */

@media (max-width: 600px) {

  .pia-hero-actions,
  .pia-join-actions,
  .pia-program-detail-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .pia-btn {
    width: 100%;
  }

}

/* =========================================================
   DARK SECTION BUTTON ACCESSIBILITY
========================================================= */

.pia-activity-dark .pia-btn-primary {
  border-color: var(--pia-pink);
  background: var(--pia-pink);
  color: var(--pia-black) !important;
}

.pia-activity-dark .pia-btn-primary:hover {
  border-color: var(--pia-white);
  background: var(--pia-white);
  color: var(--pia-black) !important;
}

.pia-activity-dark .pia-btn-primary:focus-visible {
  outline: 3px solid var(--pia-white);
  outline-offset: 4px;
}