/* ================================================================
   ARFADA Service Pages — design system
   Scoped under .arf-tpm so it never clashes with your theme.
   ================================================================ */
.arf-tpm *{box-sizing:border-box}
.arf-tpm{
  font-family:'Cairo','Segoe UI',system-ui,Arial,sans-serif;
  color:#2c2c34;line-height:1.7;max-width:1160px;margin:0 auto;
}
.arf-tpm a{color:inherit;text-decoration:none}

/* HERO */
.arf-tpm .hero{
  background:linear-gradient(135deg,#5B2A86 0%,#7B4BA8 100%);
  color:#fff;border-radius:20px;padding:64px 48px;position:relative;overflow:hidden;
}
.arf-tpm .hero::after{
  content:"";position:absolute;right:-80px;top:-80px;width:280px;height:280px;
  background:rgba(255,255,255,.06);border-radius:50%;
}
.arf-tpm .hero .eyebrow{
  font-size:14px;letter-spacing:2px;text-transform:uppercase;
  color:#E6D5F5;font-weight:700;margin-bottom:14px;
}
.arf-tpm .hero h1{font-size:44px;line-height:1.2;font-weight:800;margin:0 0 18px;max-width:800px;color:#fff !important}
.arf-tpm .hero .eyebrow{color:#E6D5F5 !important}
.arf-tpm .hero p{font-size:19px;color:#F0E7FA !important;max-width:720px;margin-bottom:30px}
.arf-tpm .btn{
  display:inline-block;background:#fff;color:#5B2A86;font-weight:700;font-size:16px;
  padding:15px 34px;border-radius:10px;transition:transform .15s ease,box-shadow .15s ease;
}
.arf-tpm .btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.18)}
.arf-tpm .btn-outline{
  display:inline-block;border:2px solid rgba(255,255,255,.7);color:#fff;font-weight:700;
  font-size:16px;padding:13px 30px;border-radius:10px;margin-inline-start:12px;
}

/* STATS */
.arf-tpm .stats{
  display:grid;grid-template-columns:repeat(6,1fr);gap:0;
  background:#fff;border:1px solid #ECE3F5;border-radius:16px;
  margin-top:-34px;position:relative;z-index:2;box-shadow:0 14px 40px rgba(91,42,134,.10);overflow:hidden;
}
.arf-tpm .stats .st{padding:24px 14px;text-align:center;border-inline-end:1px solid #F0EAF7}
.arf-tpm .stats .st:last-child{border-inline-end:none}
.arf-tpm .stats .num{font-size:30px;font-weight:800;color:#5B2A86;line-height:1}
.arf-tpm .stats .lbl{font-size:13px;color:#6b6b78;margin-top:8px}

/* SECTIONS */
.arf-tpm .sec{padding:56px 8px}
.arf-tpm .sec h2{font-size:31px;font-weight:800;color:#3a1e5c;margin:0 0 16px}
.arf-tpm .sec .lead{font-size:17px;color:#55555f;max-width:840px;margin-bottom:8px}
.arf-tpm .kicker{
  display:inline-block;font-size:13px;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;color:#7B4BA8;margin-bottom:10px;
}

/* SERVICES GRID */
.arf-tpm .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:32px}
.arf-tpm .card{
  background:#fff;border:1px solid #ECE3F5;border-radius:14px;padding:28px;
  transition:transform .18s ease,box-shadow .18s ease;
}
.arf-tpm .card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(91,42,134,.10)}
.arf-tpm .card .ico{
  width:52px;height:52px;border-radius:12px;background:#F2EAFA;
  display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:16px;
}
.arf-tpm .card h3{font-size:19px;font-weight:700;color:#3a1e5c;margin:0 0 8px}
.arf-tpm .card p{font-size:15px;color:#5f5f6a;margin:0}

/* PROCESS */
.arf-tpm .process{background:#F8F4FC;border-radius:20px;padding:48px 40px;margin-top:8px}
.arf-tpm .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:30px}
.arf-tpm .step .n{
  width:44px;height:44px;border-radius:50%;background:#5B2A86;color:#fff;
  font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;
}
.arf-tpm .step h4{font-size:17px;font-weight:700;color:#3a1e5c;margin:0 0 6px}
.arf-tpm .step p{font-size:14px;color:#5f5f6a;margin:0}

/* SECTORS */
.arf-tpm .sectors{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.arf-tpm .chip{
  background:#fff;border:1px solid #E1D2F0;color:#5B2A86;font-weight:600;font-size:15px;
  padding:11px 20px;border-radius:30px;
}

/* WHY US */
.arf-tpm .why{
  background:linear-gradient(135deg,#3a1e5c 0%,#5B2A86 100%);color:#fff;
  border-radius:20px;padding:52px 44px;
}
.arf-tpm .why h2{color:#fff !important}
.arf-tpm .why .lead{color:#E6D5F5 !important}
.arf-tpm .why .kicker{color:#E6D5F5 !important}
.arf-tpm .whygrid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:30px}
.arf-tpm .whyitem{display:flex;gap:14px;align-items:flex-start}
.arf-tpm .whyitem .check{
  flex:0 0 28px;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.16);
  display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:15px;
}
.arf-tpm .whyitem h4{font-size:17px;font-weight:700;margin:0 0 4px;color:#ffffff !important}
.arf-tpm .whyitem p{font-size:14.5px;color:#EADCF6 !important;margin:0}

/* FAQ */
.arf-tpm .faq{margin-top:14px}
.arf-tpm .faq details{
  background:#fff;border:1px solid #ECE3F5;border-radius:12px;padding:0;margin-bottom:14px;overflow:hidden;
}
.arf-tpm .faq summary{
  cursor:pointer;list-style:none;padding:20px 24px;font-weight:700;font-size:17px;color:#3a1e5c;
  display:flex;justify-content:space-between;align-items:center;
}
.arf-tpm .faq summary::-webkit-details-marker{display:none}
.arf-tpm .faq summary::after{content:"+";font-size:24px;color:#7B4BA8;font-weight:400}
.arf-tpm .faq details[open] summary::after{content:"–"}
.arf-tpm .faq .ans{padding:0 24px 22px;font-size:15.5px;color:#55555f}

/* FINAL CTA */
.arf-tpm .cta{text-align:center;background:#F2EAFA;border-radius:20px;padding:56px 40px;margin-top:8px}
.arf-tpm .cta h2{font-size:30px;color:#3a1e5c;margin:0 0 12px}
.arf-tpm .cta p{font-size:17px;color:#55555f;max-width:640px;margin:0 auto 26px}
.arf-tpm .cta .btn{background:#5B2A86;color:#fff}

/* RESPONSIVE */
@media(max-width:900px){
  .arf-tpm .hero{padding:44px 26px}
  .arf-tpm .hero h1{font-size:32px}
  .arf-tpm .stats{grid-template-columns:repeat(2,1fr)}
  .arf-tpm .stats .st:nth-child(2){border-inline-end:none}
  .arf-tpm .grid3{grid-template-columns:1fr}
  .arf-tpm .steps{grid-template-columns:1fr 1fr}
  .arf-tpm .whygrid{grid-template-columns:1fr}
  .arf-tpm .btn-outline{margin-inline-start:0;margin-top:12px;display:block;text-align:center}
}
