/* Background Checks page (Wave-2) — Figma-aligned synced patterns. Scope .rp-bc.
   Enqueued AFTER migration.css; presence-gated via inc/kadence-background-check.php.
   Figma: BliGiNMu5qH2EStgHwk35S node 16785:43952 (PP-U "Background Checks"). */

.rp-bc { font-family: "Mulish", sans-serif; }

/* ── #CTA Surgical pass 2026-06-30 (Background Check QA): the canonical CTA is the icon-bar blue
   card (white RemotePass pin LEFT, heading+body, white "Book A Demo" RIGHT) — the .rp-ent-cta pattern
   used on the By-Department pages, NOT the photo card the stopgap shipped. These rules (copied from
   enterprise.css's .rp-ent-cta) render the swapped CTA markup in wp_block 7631/7638. */
.rp-ent-cta { padding: 48px 24px; }
.rp-ent-cta .rp-cm-cta__card { max-width: 1200px; margin: 0 auto; background: #114EF7; border-radius: 24px; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 40px 56px; flex-wrap: wrap; }
.rp-ent-cta__lead { display: flex; align-items: center; gap: 28px; flex: 1 1 480px; min-width: 260px; }
.rp-ent-cta__icon { width: 64px; height: 64px; flex: none; filter: brightness(0) invert(1); }
.rp-ent-cta .rp-cm-cta__title { font-family: Mulish, -apple-system, sans-serif; font-weight: 700; font-size: 32px; line-height: 1.2; color: #fff; margin: 0 0 12px; }
.rp-ent-cta .rp-cm-cta__sub { font-family: Mulish, -apple-system, sans-serif; font-size: 16px; line-height: 1.5; color: rgba(255,255,255,.85); margin: 0; max-width: 540px; }
.rp-ent-cta .rp-cm-cta__btn { flex: none; background: #fff; color: #021143; font-family: Mulish, -apple-system, sans-serif; font-weight: 700; font-size: 15px; padding: 18px 32px; border-radius: 8px; text-decoration: none; white-space: nowrap; }
.rp-ent-cta .rp-cm-cta__btn:hover { background: #F0F4FE; }
@media (max-width: 991px) {
  .rp-ent-cta .rp-cm-cta__card { flex-direction: column; align-items: stretch; text-align: center; gap: 24px; padding: 28px 24px; }
  .rp-ent-cta__lead { flex-direction: column; text-align: center; gap: 16px; flex: none; }
  .rp-ent-cta .rp-cm-cta__sub { max-width: none; }
  .rp-ent-cta .rp-cm-cta__btn { width: 100%; text-align: center; }
}
[dir="rtl"] .rp-ent-cta__lead { text-align: right; }
.rp-bc * { box-sizing: border-box; }
.rp-bc-accent { color: #114ef7; }

/* ===== HERO ===== */
.rp-bc-hero {
  background: linear-gradient(180deg, rgba(228,235,254,0) 0%, rgba(228,235,254,1) 70.5%), #ffffff;
  border-bottom-left-radius: 56px; border-bottom-right-radius: 56px; overflow: clip;
}
.rp-bc-hero__inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; gap: 40px; padding: 72px 24px 40px; }
.rp-bc-hero__text { flex: 1 0 600px; max-width: 624px; min-width: 0; }
.rp-bc-hero__media { flex: 0 1 560px; min-width: 0; display: flex; justify-content: flex-end; }
.rp-bc-hero__img { width: 100%; max-width: 527px; height: auto; }
.rp-bc-hero__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.rp-bc-hero__pill { display: inline-flex; align-items: center; gap: 8px; background: #fff; border-radius: 40px; padding: 8px 12px; font-size: 12px; font-weight: 700; line-height: 20px; color: #044d80; box-shadow: 0 2px 8px rgba(2,17,67,.06); }
.rp-bc-hero__pill-icon { width: 20px; height: 20px; display: block; flex: 0 0 auto; }
.rp-bc-hero__title { font-size: 56px; line-height: 64px; font-weight: 700; color: #0e1e36; margin: 0 0 16px; }
.rp-bc-hero__sub { font-size: 18px; line-height: 27.9px; font-weight: 400; color: #4a5878; margin: 0 0 28px; }
.rp-bc-hero__ctas { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.rp-bc-hero__cta { display: inline-flex; align-items: center; justify-content: center; height: 56px; padding: 0 24px; border-radius: 4px; background: #114ef7; color: #fff; font-size: 14px; font-weight: 700; line-height: 22px; text-decoration: none; white-space: nowrap; transition: background .15s ease; }
.rp-bc-hero__cta:hover { background: #0d3fd0; color: #fff; }

/* ===== shared frames ===== */
.rp-bc-pain__inner, .rp-bc-how__inner, .rp-bc-hires__inner, .rp-bc-faq__inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* ===== PAIN ===== */
.rp-bc-pain { padding: 80px 0; background: #fff; }
.rp-bc-pain__head { max-width: 720px; margin: 0 auto 56px; text-align: center; }
.rp-bc-pain__title { font-size: 32px; line-height: 40px; font-weight: 700; color: #021143; margin: 0 0 16px; }
.rp-bc-pain__sub { font-size: 16px; line-height: 24px; color: #4a5878; margin: 0; }
.rp-bc-pain__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.rp-bc-pain__card { background: #fff; border: 1px solid #ECEFF6; border-radius: 16px; padding: 25px; min-height: 184px; }
.rp-bc-pain__icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: #FCEAEA; margin-bottom: 18px; }
.rp-bc-pain__icon svg { width: 18px; height: 18px; display: block; }
/* Match the standard "RP Pain Points (3-up)" X (overrides the inline stroke attr). */
.rp-bc-pain__icon svg path { stroke: #DE2626; }
.rp-bc-pain__text { font-size: 16px; line-height: 24px; font-weight: 400; color: #2A2A2A; margin: 0; }

/* ===== BENEFITS ===== */
.rp-bc-benefits { padding: 24px 0 40px; background: #fff; }
.rp-bc-benefits__intro { max-width: 760px; margin: 40px auto 24px; padding: 0 24px; text-align: center; }
.rp-bc-benefits__intro-title { font-size: 40px; line-height: 48px; font-weight: 700; color: #021143; margin: 0; }
.rp-bc-benefit { max-width: 1200px; margin: 0 auto; padding: 40px 24px; display: flex; align-items: center; gap: 48px; }
.rp-bc-benefit__text { flex: 1 1 0; min-width: 0; max-width: 652px; }
.rp-bc-benefit__media { flex: 0 0 auto; min-width: 0; display: flex; justify-content: center; }
.rp-bc-benefit__media img { width: 100%; max-width: 500px; height: auto; }
.rp-bc-benefit--text-right .rp-bc-benefit__media img { max-width: 500px; }
.rp-bc-benefit__title { font-size: 40px; line-height: 48px; font-weight: 700; color: #021143; margin: 0 0 16px; }
.rp-bc-benefit__lead { font-size: 18px; line-height: 27px; color: #4a5878; margin: 0 0 14px; }
.rp-bc-benefit__lead strong { color: #021143; font-weight: 700; }
.rp-bc-benefit__list { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.rp-bc-benefit__list li { display: flex; align-items: center; gap: 12px; font-size: 17px; line-height: 24px; color: #021143; }
.rp-bc-benefit__check { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #E4ECFF; flex: 0 0 auto; }
.rp-bc-benefit__check svg { width: 12px; height: 12px; display: block; }
.rp-bc-benefit__stats { display: flex; gap: 24px; margin-top: 28px; }
.rp-bc-benefit__stat { display: flex; flex-direction: column; flex: 1 1 0; }
.rp-bc-benefit__num { font-size: 28px; line-height: 34px; font-weight: 700; color: #114ef7; }
.rp-bc-benefit__lbl { font-size: 15px; line-height: 20px; color: #4a5878; margin-top: 6px; }
.rp-bc-benefit__cta { display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 28px; border-radius: 4px; margin-top: 8px; background: #114ef7; color: #fff; font-size: 15px; font-weight: 700; text-decoration: none; }
.rp-bc-benefit__cta:hover { background: #0d3fd0; color: #fff; }

/* ===== HOW (3 steps) ===== */
.rp-bc-how { padding: 80px 0; background: #fff; }
.rp-bc-how__head { max-width: 760px; margin: 0 auto 56px; text-align: center; }
.rp-bc-how__title { font-size: 48px; line-height: 56px; font-weight: 700; color: #021143; margin: 0 0 16px; }
.rp-bc-how__sub { font-size: 18px; line-height: 26px; color: #4a5878; margin: 0; }
.rp-bc-how__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; position: relative; }
.rp-bc-how__steps::before { content: ""; position: absolute; left: 28px; right: 28px; top: 28px; border-top: 2px dashed #D7DEEE; z-index: 0; }
.rp-bc-how__step { position: relative; z-index: 1; }
.rp-bc-how__num { width: 56px; height: 56px; border-radius: 14px; background: #fff; border: 1.5px solid #114ef7; color: #114ef7; display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 700; margin-bottom: 22px; }
.rp-bc-how__pill { display: inline-flex; align-items: center; gap: 8px; background: #EEF3FF; border-radius: 8px; padding: 6px 10px; margin-bottom: 16px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #114ef7; }
.rp-bc-how__pill svg { width: 18px; height: 18px; display: block; }
.rp-bc-how__step-title { font-size: 20px; line-height: 25px; font-weight: 700; color: #021143; margin: 0 0 14px; }
.rp-bc-how__step-text { font-size: 16px; line-height: 24px; color: #4a5878; margin: 0; }
.rp-bc-how__step-text strong { color: #021143; font-weight: 700; }

/* ===== HIRES (one workflow, 3 cards) ===== */
.rp-bc-hires { padding: 80px 0; background: #EEF2FE; }
.rp-bc-hires__head { max-width: 760px; margin: 0 auto 48px; text-align: center; }
.rp-bc-hires__title { font-size: 40px; line-height: 48px; font-weight: 700; color: #021143; margin: 0 0 16px; }
.rp-bc-hires__sub { font-size: 18px; line-height: 26px; color: #4a5878; margin: 0; }
.rp-bc-hires__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.rp-bc-hires__card { background: #fff; border: 1px solid #E6EAF4; border-radius: 16px; padding: 28px; }
.rp-bc-hires__icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #EEF3FF; margin-bottom: 18px; }
.rp-bc-hires__icon svg { width: 20px; height: 20px; display: block; }
.rp-bc-hires__card-title { font-size: 20px; line-height: 26px; font-weight: 700; color: #021143; margin: 0 0 10px; }
.rp-bc-hires__card-text { font-size: 16px; line-height: 24px; color: #4a5878; margin: 0; }
.rp-bc-hires__foot { text-align: center; margin: 36px 0 0; font-size: 15px; color: #6b7794; }
.rp-bc-hires__foot a { color: #114ef7; font-weight: 700; text-decoration: none; }

/* ===== CTA BANNER ===== */
.rp-bc-cta { padding: 40px 0 80px; background: #fff; }
.rp-bc-cta__banner { max-width: 1200px; margin: 0 auto; padding: 56px; background: #114ef7; border-radius: 24px; overflow: clip; position: relative; display: flex; align-items: center; gap: 40px; }
.rp-bc-cta__pin { width: 118px; height: auto; flex: 0 0 auto; }
.rp-bc-cta__text { flex: 1 1 0; min-width: 0; }
.rp-bc-cta__title { font-size: 40px; line-height: 44px; font-weight: 700; color: #fff; margin: 0 0 12px; }
.rp-bc-cta__sub { font-size: 18px; line-height: 26px; color: rgba(255,255,255,.85); margin: 0; max-width: 560px; }
.rp-bc-cta__action { flex: 0 0 auto; }
.rp-bc-cta__btn { display: inline-flex; align-items: center; justify-content: center; height: 56px; padding: 0 32px; border-radius: 8px; background: #fff; color: #021143; font-size: 15px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.rp-bc-cta__btn:hover { background: #f0f4fe; color: #021143; }

/* ===== FAQ ===== */
.rp-bc-faq { padding: 16px 0 88px; background: #fff; }
.rp-bc-faq__title { font-size: 40px; line-height: 48px; font-weight: 700; color: #021143; margin: 40px 0 8px; }
.rp-bc-faq__lead { font-size: 16px; line-height: 24px; font-weight: 500; color: #3f3f3f; margin: 0 0 24px; }
.rp-bc-faq__list { display: flex; flex-direction: column; gap: 8px; }
.rp-bc-faq__item { background: #f0f4fe; border-radius: 16px; padding: 0 24px; }
.rp-bc-faq__q { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 24px 0; font-size: 20px; line-height: 28px; font-weight: 600; color: #000; }
.rp-bc-faq__q::-webkit-details-marker { display: none; }
/* go-live §B7: drop the default focus outline on the FAQ summary for pointer
   users (the designer flagged it), but keep a clean keyboard-focus ring for a11y. */
.rp-bc-faq__q:focus { outline: none; }
.rp-bc-faq__q:focus-visible { outline: 2px solid #114ef7; outline-offset: 2px; border-radius: 8px; }
.rp-bc-faq__q::after { content: ""; flex: 0 0 auto; width: 14px; height: 14px; border-right: 2px solid #021143; border-bottom: 2px solid #021143; transform: rotate(45deg); transition: transform .2s ease; margin-top: -4px; }
.rp-bc-faq__item[open] .rp-bc-faq__q::after { transform: rotate(-135deg); margin-top: 4px; }
.rp-bc-faq__a { font-size: 16px; line-height: 24px; color: #545454; padding: 0 0 24px; max-width: 920px; }

/* ===== RESPONSIVE ===== */
@media (max-width: 991px) {
  .rp-bc-hero__inner { flex-direction: column; text-align: center; padding-top: 48px; }
  .rp-bc-hero__text { flex: 1 1 auto; max-width: 100%; }
  .rp-bc-hero__pills, .rp-bc-hero__ctas, .rp-bc-hero__media { justify-content: center; }
  .rp-bc-hero__title { font-size: 40px; line-height: 48px; }
  .rp-bc-pain__grid, .rp-bc-hires__grid { grid-template-columns: 1fr; }
  .rp-bc-benefit, .rp-bc-benefit--text-right { flex-direction: column; text-align: left; }
  .rp-bc-benefit__text { max-width: 100%; }
  .rp-bc-how__steps { grid-template-columns: 1fr; }
  .rp-bc-how__steps::before { display: none; }
  .rp-bc-pain__title, .rp-bc-how__title { font-size: 34px; line-height: 42px; }
  .rp-bc-benefits__intro-title, .rp-bc-benefit__title, .rp-bc-hires__title, .rp-bc-cta__title, .rp-bc-faq__title { font-size: 30px; line-height: 38px; }
  .rp-bc-cta__banner { flex-direction: column; text-align: center; padding: 40px 24px; }
  .rp-bc-cta__sub { max-width: 100%; }
}
@media (max-width: 600px) {
  .rp-bc-hero__title { font-size: 32px; line-height: 40px; }
  .rp-bc-benefit__stats { flex-direction: column; gap: 18px; }
}

/* --text-right benefit row → full-bleed light-blue band; content kept at ~1200 via
   side padding (50vw-600px). */
.rp-bc-benefit--text-right {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  background-color: #F0F4FE !important;
  padding-left: max(24px, calc(50vw - 600px)) !important;
  padding-right: max(24px, calc(50vw - 600px)) !important;
}