/* ============ Service pages: Buy Airtime, Send Money, Health ============ */

/* ---------- hero ---------- */
.svc-hero { padding: 35px 0 20px; }
.svc-hero-row { display: grid; grid-template-columns: 1fr 1fr; column-gap: 5.5%; }
.svc-hero-text { padding-top: 35px; }
.svc-hero-text h1 { padding-bottom: 10px; font-size: 64px; font-weight: 700; line-height: 65px; color: #000000; }
.svc-hero-text p { margin-top: 28px; font-size: 17px; line-height: 24px; color: var(--ink-2); }
.svc-hero-text .btn { margin-top: 32px; }
.svc-hero-img img { width: 100%; }

/* ---------- features ---------- */
.svc-features { background: var(--white); padding: 90px 0 89px; }
.svc-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 34px; }
.svc-col { display: flex; flex-direction: column; gap: 18px; }

/* ---------- FAQ ---------- */
.svc-faq { padding: 81px 0 112px; }
.svc-faq-title { padding-bottom: 10px; margin-bottom: 8px; font-size: 40px; font-weight: 700; line-height: 52px; color: #1f1f1f; text-align: center; }

/* ---------- tablet ---------- */
@media (max-width: 980px) {
  .svc-hero { padding: 120px 0 20px; }
  .svc-hero-row { grid-template-columns: 1fr; text-align: center; }
  .svc-hero-text { padding-top: 0; }
  .svc-hero-text h1 { font-size: 43px; line-height: 42px; }
  .svc-hero-text .btn { margin-top: 30px; }
  .svc-hero-img { margin-top: 105px; }

  .svc-features { padding: 90px 0; }
  .svc-grid { grid-template-columns: 1fr; }
  .svc-col { gap: 30px; }
  .svc-col + .svc-col { margin-top: 30px; }

  .svc-faq { padding: 80px 0 110px; }
  .svc-faq-title { font-size: 30px; line-height: 39px; }
}

/* ---------- phone ---------- */
@media (max-width: 767px) {
  .svc-hero { padding: 50px 0 50px; }
  .svc-hero-text h1 { font-size: 26px; line-height: 42px; }
  .svc-hero-text h1 br,
  .svc-hero-text p br { display: none; }
  .svc-hero-img { display: none; }

  .svc-faq .acc-item { padding: 20px 0; }
}

/* =================== Health: page-specific differences =================== */
.page-health .svc-hero-text { padding-top: 72px; }
.page-health .svc-hero-text p { margin-top: 8px; }
.page-health .svc-hero-img { padding-top: 27px; text-align: center; }
.page-health .svc-hero-img img { width: 80%; margin: 0 auto; }
.page-health .svc-col { gap: 17px; }

@media (max-width: 980px) {
  .page-health .svc-hero { padding-top: 80px; }
  .page-health .svc-hero-text { padding-top: 0; }
  .page-health .svc-hero-img { margin-top: 65px; padding-top: 0; }
  .page-health .svc-features { padding: 50px 0; }
  .page-health .svc-grid { grid-template-columns: 1fr 1fr; column-gap: 2%; padding: 0 1%; }
  .page-health .svc-col { gap: 30px; }
  .page-health .svc-col + .svc-col { margin-top: 0; }
  .page-health .svc-col:last-child { margin-bottom: 30px; }
  .page-health .svc-box { min-height: 310px; }
}

@media (max-width: 767px) {
  .page-health .svc-hero { padding: 30px 0 31px; }
  .page-health .svc-hero-text h1 { line-height: 30px; }
  .page-health .svc-grid { grid-template-columns: 1fr; padding: 0; }
  .page-health .svc-col + .svc-col { margin-top: 30px; }
  .page-health .svc-col:last-child { margin-bottom: 0; }
  .page-health .svc-box { min-height: 0; }
  .page-health .svc-faq-title { font-size: 26px; line-height: 33.8px; }
}

/* Health's intro paragraph drops its forced line breaks below 1280px (live: .disable-line-break) */
@media (max-width: 1279px) {
  .page-health .svc-hero-text p br { display: none; }
}

/* =================== Send Money: page-specific differences =================== */
.page-send-money .svc-hero { padding-top: 117px; }
.page-send-money .svc-hero-text { padding-top: 65px; }
.page-send-money .svc-hero-text h1 { font-size: 62px; }
.page-send-money .svc-hero-text p { margin-top: 8px; }
.page-send-money .svc-col { gap: 17px; }

@media (max-width: 980px) {
  .page-send-money .svc-hero { padding-top: 140px; }
  .page-send-money .svc-hero-text { padding-top: 0; }
  .page-send-money .svc-hero-text h1 { font-size: 43px; }
  .page-send-money .svc-hero-img { margin-top: 65px; }
  .page-send-money .svc-grid { grid-template-columns: 1fr 1fr; column-gap: 2%; padding: 0 1%; }
  .page-send-money .svc-col { gap: 30px; margin-bottom: 30px; }
  .page-send-money .svc-col + .svc-col { margin-top: 0; }
  .page-send-money .svc-box { min-height: 310px; }
  .page-send-money .svc-features { padding-bottom: 84px; }
}

@media (max-width: 767px) {
  .page-send-money .svc-hero { padding: 90px 0 31px; }
  .page-send-money .svc-hero-text h1 { font-size: 26px; line-height: 30px; }
  .page-send-money .svc-grid { grid-template-columns: 1fr; padding: 0; }
  .page-send-money .svc-col { margin-bottom: 0; }
  .page-send-money .svc-col + .svc-col { margin-top: 30px; }
  .page-send-money .svc-box { min-height: 0; }
  .page-send-money .svc-features { padding-bottom: 90px; }
  .page-send-money .svc-faq-title { font-size: 22px; line-height: 28.6px; }
}