/* Talent landing pages (HCM Functional Consultants, Workday Payroll Talent). Loaded only for those templates.
   Markup: template-parts/talent-page.php; copy: inc/talent-pages.php.
   Reuses the site's hero, service-card, tv-accordion, faqs-section and job-cta-section styles; this file only adds what's new. */

/* ---- hero / banner ---- */
.talent-hero { padding-bottom: 56px; }
.talent-hero h1 { max-width: var(--talent-h1-w, 700px); margin-left: auto; margin-right: auto; font-size: 40px; line-height: 1.2; }
.talent-hero-lead { max-width: var(--talent-lead-w, 690px); font-size: 18.5px; }
.talent-hero-lead p { margin-bottom: 0; }
.talent-hero .tv-btn { min-width: 260px; justify-content: space-between; padding-left: 24px; padding-right: 24px; }
.talent-wide { max-width: 1056px; }
.talent-narrow { max-width: 954px; }
.talent-banner { padding-bottom: 120px; }
.talent-banner-img { display: block; width: 100%; height: auto; }

/* shared heading sizes on this page */
.talent-roles h2, .talent-how h2 { font-size: 31px; font-weight: 600; line-height: 1.2; }

/* ---- who we place ---- */
.talent-roles { padding-top: 80px; }
.talent-roles .eyebrow-label { font-size: 10px; letter-spacing: .6px; margin-bottom: 10px; }
.talent-roles h2 { margin-bottom: 34px; }
.talent-role-card { padding: 20px 22px 24px; }
.talent-role-card .service-card-icon { width: 50px; height: 50px; margin-bottom: 18px; }
/* the 3D icons are grey/red; tint them red to match the design (the glass sphere is already pink) */
.talent-role-card .service-card-icon img.talent-tint { filter: grayscale(1) sepia(1) saturate(6) hue-rotate(-52deg); }
.talent-role-card .service-card-title { margin-bottom: 8px; font-size: 16.5px; font-weight: 500; }
.talent-role-card .service-card-description p { font-size: 12.5px; line-height: 1.45; color: #6b7280; margin-bottom: 0; }

/* ---- red "when teams usually call us" band ---- */
.talent-calls { background-color: #c20000; padding: 52px 0 76px; }
.talent-calls-inner { max-width: 1130px; }
.talent-calls h2 { margin-bottom: 52px; font-size: 36px; font-weight: 500; line-height: 1.2; }
.talent-calls-grid { display: grid; grid-template-columns: repeat(3, 1fr); row-gap: 62px; }
.talent-call { border-left: 1px solid rgba(255, 255, 255, .22); padding: 6px 60px 6px 46px; min-height: 160px; }
.talent-call:nth-child(3n) { border-right: 1px solid rgba(255, 255, 255, .22); }
.talent-call-icon { display: block; width: 38px; height: 38px; margin-bottom: 22px; color: #fff; }
.talent-call-icon svg { display: block; width: 100%; height: 100%; }
.talent-call p { font-size: 15px; line-height: 1.4; font-weight: 600; color: #fff; margin: 0; }

/* ---- how we check them / ways to work ---- */
.talent-how { padding-top: 120px; padding-bottom: 120px; }
.talent-how h2 { margin-bottom: 20px; }
.talent-how-text { font-size: 17.5px; line-height: 1.45; }
.talent-how-text p { margin-bottom: 0; }
.talent-ways-label { font-size: 15px; font-weight: 600; letter-spacing: .3px; margin: 84px 0 22px; }
.talent-ways { --bs-gutter-x: 20px; --bs-gutter-y: 20px; }
.talent-way { background: #fff; border: 1px solid #e5e7eb; border-radius: 0; box-shadow: none; padding: 22px 22px 26px; }
.talent-way-icon { display: block; width: 26px; height: 26px; color: #c20000; margin-bottom: 18px; }
.talent-way h3 { font-size: 14.5px; font-weight: 700 !important; color: #111; margin-bottom: 8px; }
.talent-way p { font-size: 12.5px; line-height: 1.65; color: #5f6675; margin: 0; }

/* ---- FAQ + CTA tweaks ---- */
.talent-faq { background-color: #f3f6fc !important; }
.talent-faq .tv-accordion .accordion-item .accordion-button:not(.collapsed) { color: #2b2b2b !important; }
.talent-cta .container { max-width: 960px; }
.talent-cta h2 { font-size: 40px; font-weight: 700 !important; line-height: 1.15; max-width: var(--talent-cta-w, 470px); }
.talent-cta .text-large { font-size: 16px; max-width: 560px; }

/* the "how we check / ways" block sits slightly left of centre in the design */
@media (min-width: 1200px) {
  .talent-narrow { margin-left: calc(50% - 505px); margin-right: 0; }
}

@media (max-width: 991.98px) {
  .talent-hero { padding-top: 120px; }
  .talent-hero h1 { font-size: 34px; }
  .talent-roles { padding-top: 56px; }
  .talent-banner { padding-bottom: 24px; }
  .talent-how { padding-top: 72px; padding-bottom: 72px; }
  .talent-calls-grid { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .talent-call:nth-child(3n) { border-right: 0; }
  .talent-call:nth-child(2n) { border-right: 1px solid rgba(255, 255, 255, .22); }
  .talent-cta h2 { font-size: 32px; }
}
@media (max-width: 575.98px) {
  .talent-hero h1 { font-size: 28px; }
  .talent-hero-lead { font-size: 16.5px; }
  .talent-hero .tv-btn { min-width: 0; }
  .talent-roles h2, .talent-how h2 { font-size: 26px; }
  .talent-calls { padding: 44px 0 52px; }
  .talent-calls h2 { font-size: 28px; margin-bottom: 32px; }
  .talent-calls-grid { grid-template-columns: 1fr; row-gap: 28px; }
  .talent-call, .talent-call:nth-child(2n), .talent-call:nth-child(3n) { border-right: 0; min-height: 0; padding: 4px 8px 4px 24px; }
  .talent-call-icon { width: 32px; height: 32px; margin-bottom: 14px; }
  .talent-ways-label { margin-top: 56px; }
  .talent-cta h2 { font-size: 28px; }
}

/* ---- Enterprise Talent page (template-enterprise-talent.php): matches the supplied design ---- */
.talent-role-card--lg .service-card-title { font-size: 17px; margin-bottom: 8px; }
.talent-role-card--lg .service-card-description p { font-size: 14.5px; line-height: 1.5; }
/* darker "when teams call us" card with plain dot bullets (the site's default card uses a red photo background + arrow bullets) */
.talent-dark-card { background-image: linear-gradient(115deg, #2b0407 0%, #6a0a12 30%, #b81d29 55%, #c20000 80%) !important; }
.talent-dark-card .use-cases-list li { font-size: 14.5px; line-height: 1.5; }
.talent-dark-card .use-cases-list li:before { content: "\2022"; background-image: none; width: auto; height: auto; top: 0; font-size: 15px; line-height: 1.5; color: #fff; }
