/* ============ SERVICE PROVIDERS (service-providers.html) ============ */

/* ---- Three pillars ---- */
.pillars{padding:88px 48px}
.pillars .eyebrow{color:var(--teal)}
.pillars .h2x{font-family:"DM Sans";font-weight:700;color:var(--ink);font-size:clamp(30px,4vw,44px);
  letter-spacing:-.8px;line-height:1.12;max-width:24ch;margin-bottom:40px}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pcard{background:#fff;border:1px solid rgba(70,65,60,.14);border-radius:16px;padding:30px 28px;
  box-shadow:0 6px 24px rgba(70,65,60,.07)}
.pcard .k{font-family:"DM Sans";font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--teal);display:block;margin-bottom:12px}
.pcard h3{font-family:"DM Sans";font-weight:700;font-size:20px;color:var(--ink);letter-spacing:-.3px;margin-bottom:10px}
.pcard p{font-size:15.5px;color:var(--ink-soft);line-height:1.6}
.rate{margin-top:36px;font-family:"DM Sans";font-weight:600;font-size:clamp(19px,2.4vw,24px);line-height:1.5;
  color:var(--ink);max-width:66ch}
.rate .b{color:var(--blue);font-weight:700}

/* ---- Punch band ---- */
.punchband{background:var(--ink);color:#F7F4EF;padding:80px 48px}
.punchband .ptext{max-width:80ch;font-size:clamp(17px,2vw,20px);line-height:1.7}
.punchband strong{color:#fff;font-weight:600}
.punchband .q{color:var(--azure);font-style:italic}
.punchband .win{font-family:"DM Sans";font-weight:700;color:var(--azure)}

/* ---- Benefits grid ---- */
.benefits{padding:88px 48px;background:#fff}
.benefits .eyebrow{color:var(--teal)}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.bitem{border-top:3px solid var(--blue);padding-top:14px}
.bitem h3{font-family:"DM Sans";font-weight:700;font-size:17px;color:var(--ink);margin-bottom:6px}
.bitem p{font-size:14.5px;color:var(--ink-soft);line-height:1.55}

@media (max-width:900px){
  .pgrid,.bgrid{grid-template-columns:1fr}
  .pillars,.punchband,.benefits{padding-left:22px;padding-right:22px}
}