/* Custom Padding Scale (Extended beyond Bootstrap 5) */
/* 1 rem = 16px. Scales up to 12.5rem (200px) */

.mp-p-6 {
  padding: 3.5rem !important;
}

.mp-py-6 {
  padding-block: 3.5rem !important;
}

.mp-px-6 {
  padding-inline: 3.5rem !important;
}

.mp-pt-6 {
  padding-top: 3.5rem !important;
}

.mp-pb-6 {
  padding-bottom: 3.5rem !important;
}

.mp-p-7 {
  padding: 4.0rem !important;
}

.mp-py-7 {
  padding-block: 4.0rem !important;
}

.mp-px-7 {
  padding-inline: 4.0rem !important;
}

.mp-pt-7 {
  padding-top: 4.0rem !important;
}

.mp-pb-7 {
  padding-bottom: 4.0rem !important;
}

.mp-p-8 {
  padding: 4.5rem !important;
}

.mp-py-8 {
  padding-block: 4.5rem !important;
}

.mp-px-8 {
  padding-inline: 4.5rem !important;
}

.mp-pt-8 {
  padding-top: 4.5rem !important;
}

.mp-pb-8 {
  padding-bottom: 4.5rem !important;
}

.mp-p-9 {
  padding: 5.0rem !important;
}

.mp-py-9 {
  padding-block: 5.0rem !important;
}

.mp-px-9 {
  padding-inline: 5.0rem !important;
}

.mp-pt-9 {
  padding-top: 5.0rem !important;
}

.mp-pb-9 {
  padding-bottom: 5.0rem !important;
}

.mp-p-10 {
  padding: 5.5rem !important;
}

.mp-py-10 {
  padding-block: 5.5rem !important;
}

.mp-px-10 {
  padding-inline: 5.5rem !important;
}

.mp-pt-10 {
  padding-top: 5.5rem !important;
}

.mp-pb-10 {
  padding-bottom: 5.5rem !important;
}

.mp-p-11 {
  padding: 6.0rem !important;
}

.mp-py-11 {
  padding-block: 6.0rem !important;
}

.mp-px-11 {
  padding-inline: 6.0rem !important;
}

.mp-pt-11 {
  padding-top: 6.0rem !important;
}

.mp-pb-11 {
  padding-bottom: 6.0rem !important;
}

.mp-p-12 {
  padding: 6.5rem !important;
}

.mp-py-12 {
  padding-block: 6.5rem !important;
}

.mp-px-12 {
  padding-inline: 6.5rem !important;
}

.mp-pt-12 {
  padding-top: 6.5rem !important;
}

.mp-pb-12 {
  padding-bottom: 6.5rem !important;
}

.mp-p-13 {
  padding: 7.0rem !important;
}

.mp-py-13 {
  padding-block: 7.0rem !important;
}

.mp-px-13 {
  padding-inline: 7.0rem !important;
}

.mp-pt-13 {
  padding-top: 7.0rem !important;
}

.mp-pb-13 {
  padding-bottom: 7.0rem !important;
}

.mp-p-14 {
  padding: 7.5rem !important;
}

.mp-py-14 {
  padding-block: 7.5rem !important;
}

.mp-px-14 {
  padding-inline: 7.5rem !important;
}

.mp-pt-14 {
  padding-top: 7.5rem !important;
}

.mp-pb-14 {
  padding-bottom: 7.5rem !important;
}

.mp-p-15 {
  padding: 8.0rem !important;
}

.mp-py-15 {
  padding-block: 8.0rem !important;
}

.mp-px-15 {
  padding-inline: 8.0rem !important;
}

.mp-pt-15 {
  padding-top: 8.0rem !important;
}

.mp-pb-15 {
  padding-bottom: 8.0rem !important;
}

.mp-p-16 {
  padding: 8.5rem !important;
}

.mp-py-16 {
  padding-block: 8.5rem !important;
}

.mp-px-16 {
  padding-inline: 8.5rem !important;
}

.mp-pt-16 {
  padding-top: 8.5rem !important;
}

.mp-pb-16 {
  padding-bottom: 8.5rem !important;
}

.mp-p-17 {
  padding: 9.0rem !important;
}

.mp-py-17 {
  padding-block: 9.0rem !important;
}

.mp-px-17 {
  padding-inline: 9.0rem !important;
}

.mp-pt-17 {
  padding-top: 9.0rem !important;
}

.mp-pb-17 {
  padding-bottom: 9.0rem !important;
}

.mp-p-18 {
  padding: 9.5rem !important;
}

.mp-py-18 {
  padding-block: 9.5rem !important;
}

.mp-px-18 {
  padding-inline: 9.5rem !important;
}

.mp-pt-18 {
  padding-top: 9.5rem !important;
}

.mp-pb-18 {
  padding-bottom: 9.5rem !important;
}

.mp-p-19 {
  padding: 10.0rem !important;
}

.mp-py-19 {
  padding-block: 10.0rem !important;
}

.mp-px-19 {
  padding-inline: 10.0rem !important;
}

.mp-pt-19 {
  padding-top: 10.0rem !important;
}

.mp-pb-19 {
  padding-bottom: 10.0rem !important;
}

.mp-p-20 {
  padding: 10.5rem !important;
}

.mp-py-20 {
  padding-block: 10.5rem !important;
}

.mp-px-20 {
  padding-inline: 10.5rem !important;
}

.mp-pt-20 {
  padding-top: 10.5rem !important;
}

.mp-pb-20 {
  padding-bottom: 10.5rem !important;
}

.mp-p-21 {
  padding: 11.0rem !important;
}

.mp-py-21 {
  padding-block: 11.0rem !important;
}

.mp-px-21 {
  padding-inline: 11.0rem !important;
}

.mp-pt-21 {
  padding-top: 11.0rem !important;
}

.mp-pb-21 {
  padding-bottom: 11.0rem !important;
}

.mp-p-22 {
  padding: 11.5rem !important;
}

.mp-py-22 {
  padding-block: 11.5rem !important;
}

.mp-px-22 {
  padding-inline: 11.5rem !important;
}

.mp-pt-22 {
  padding-top: 11.5rem !important;
}

.mp-pb-22 {
  padding-bottom: 11.5rem !important;
}

.mp-p-23 {
  padding: 12.0rem !important;
}

.mp-py-23 {
  padding-block: 12.0rem !important;
}

.mp-px-23 {
  padding-inline: 12.0rem !important;
}

.mp-pt-23 {
  padding-top: 12.0rem !important;
}

.mp-pb-23 {
  padding-bottom: 12.0rem !important;
}

.mp-p-24 {
  padding: 12.5rem !important;
}

.mp-py-24 {
  padding-block: 12.5rem !important;
}

.mp-px-24 {
  padding-inline: 12.5rem !important;
}

.mp-pt-24 {
  padding-top: 12.5rem !important;
}

.mp-pb-24 {
  padding-bottom: 12.5rem !important;
}

/* ============================================================
   Reusable Button Components
   Use these classes on <a> or <button> tags across all pages.
   ============================================================ */

/* Primary: solid green fill */
.mp-btn,
.mp-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 32px;
  background: #142c4e;
  color: #ffffff !important;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
  border-radius: 8px;
  border: 2px solid #142c4e;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 14px rgba(25, 164, 99, 0.30);
}

.mp-btn:hover,
.mp-btn-primary:hover {
  background: #148b52;
  border-color: #148b52;
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(25, 164, 99, 0.40);
}

/* Outline: ghost green border, fills on hover */
.mp-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 32px;
  background: transparent;
  color: #142c4e !important;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5;
  border-radius: 8px;
  border: 2px solid #142c4e;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

.mp-btn-outline:hover {
  background: #142c4e;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* Size modifiers */
.mp-btn-sm,
.mp-btn-primary.mp-btn-sm,
.mp-btn-outline.mp-btn-sm {
  padding: 8px 20px;
  font-size: 14px;
  border-radius: 6px;
}

.mp-btn-lg,
.mp-btn-primary.mp-btn-lg,
.mp-btn-outline.mp-btn-lg {
  padding: 16px 42px;
  font-size: 18px;
  border-radius: 10px;
}

/* FORMS */
.required::after {
  content: " *";
  color: #f1416c;
}

input::placeholder {
  color: #01010160 !important;
}