/* ==========================================================================
   Services pages (HR consulting, coaching, team building, recruitment, payroll, outsourcing, CV writing, HRIS) — page CSS.
   Shared sections live in css/common.css. Breakpoints: 19200 / 1399 / 1199 / 991 / 767 / 576px.
   ========================================================================== */

.hrc-eyebrow {
    display: inline-flex; align-items: center; gap: 9px;
    margin: 0 0 18px;
    padding: 8px 18px;
    font-family: var(--ax-font-sans);
    font-size: 12px; font-weight: 800; line-height: 26px;
    letter-spacing: .18em; text-transform: uppercase;
    color: var(--ax-navy-700);
    background: var(--ax-blue-100);
    border-radius: 100px;
}

.hrc-eyebrow::before {
    content: ""; width: 14px; height: 2px; border-radius: 2px;
    background: var(--ax-grad-accent);
}

.hrc-eyebrow--outline {
    color: var(--ax-blue-500); background: var(--ax-white);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ax-blue-500) 22%, transparent);
}

.hrc-eyebrow--outline::before {
    background: var(--ax-blue-500);
}

.hrc-eyebrow--soft {
    color: var(--ax-cyan-600); background: color-mix(in srgb, var(--ax-cyan-100) 70%, var(--ax-white));
}

.hrc-eyebrow--soft::before {
    background: var(--ax-cyan-600);
}

.hrc-eyebrow--soft::after {
    content: ""; width: 14px; height: 2px; border-radius: 2px; background: var(--ax-cyan-600);
}

.hrc-eyebrow--outline::after {
    content: ""; width: 14px; height: 2px; border-radius: 2px; background: var(--ax-blue-500);
}

.hrc .importance-human-resource {
    padding: 80px 0 88px !important;
    background: var(--ax-white) !important;
}

.hrc .importance-human-resource .title {
    text-align: center; margin: 0 0 40px !important; padding: 0 !important;
}

.hrc .importance-human-resource .title > p {
    padding: 0 !important;
}

.hrc .importance-human-resource .title h2 span {
    display: inline;
    background: var(--ax-grad-ink);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}

.hrc .importance-human-resource .bd .row {
    row-gap: 24px;
}

.hrc .importance-human-resource .col-item {
    position: relative; display: flex !important; flex-direction: column;
    height: 100%;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 20px;
    background: var(--ax-white) !important;
    border: 1px solid color-mix(in srgb, var(--ax-navy-900) 6%, transparent) !important;
    box-shadow: 0 1px 2px color-mix(in srgb, var(--ax-navy-900) 4%, transparent),
    0 14px 36px color-mix(in srgb, var(--ax-navy-900) 8%, transparent);
    text-align: left !important;
    transition: transform var(--ax-dur-md) var(--ax-ease), box-shadow var(--ax-dur-md) var(--ax-ease);
}

.hrc .importance-human-resource .col-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 2px 4px color-mix(in srgb, var(--ax-navy-900) 5%, transparent),
    0 24px 50px color-mix(in srgb, var(--ax-navy-900) 13%, transparent);
}

.hrc-imp__photo {
    height: 215px; overflow: hidden;
}

.hrc-imp__photo img {
    display: block; width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ax-ease);
}

.hrc .importance-human-resource .col-item:hover .hrc-imp__photo img {
    transform: scale(1.05);
}

.hrc-imp__icon {
    position: relative; z-index: 2;
    display: grid; place-items: center;
    width: 64px; height: 64px;
    margin: -32px 0 0 28px;
    border-radius: 50%;
    background: var(--ax-blue-100);
    border: 5px solid var(--ax-white);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--ax-navy-900) 12%, transparent);
    color: var(--ax-blue-500); font-size: 1.4rem;
}

.hrc .importance-human-resource .item-text {
    padding: 16px 30px 0 !important; text-align: left; flex: 1 1 auto;
}

.hrc .importance-human-resource .item-text h4 {
    margin: 0 0 10px !important;
    font-family: var(--ax-font-display) !important;
    font-size: var(--ax-t-card) !important; font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -.024em !important; color: var(--ax-navy-900) !important;
}

.hrc .importance-human-resource .item-text p {
    margin: 0 !important; padding: 0 !important;
    font-family: var(--ax-font-sans) !important;
    font-size: var(--ax-t-small) !important; line-height: 1.7 !important;
    color: var(--ax-ink-soft) !important;
}

.hrc-imp__foot {
    padding: 22px 30px 28px;
}

.hrc .service-box-outsourcing {
    padding: 84px 0 56px !important;
    background: linear-gradient(180deg, var(--ax-white) 0%, color-mix(in srgb, var(--ax-blue-100) 40%, var(--ax-white)) 100%) !important;
}

.hrc .service-box-outsourcing .h-title {
    text-align: center; margin-bottom: 28px !important; padding: 0 0 0 !important;
}

html .hrc .service-box-outsourcing .h-title h3 {
    margin-bottom: 12px !important;
}

.hrc .service-box-outsourcing .h-title .hrc-exp-intro {
    max-width: 56ch; margin: 0 auto !important; padding: 0 !important;
    font-family: var(--ax-font-sans); font-size: 1.05rem; line-height: 1.7;
    color: var(--ax-ink-soft);
}

.hrc .service-box-outsourcing .col-item-bd.hrc-exp {
    position: relative;
    margin: 0 0 24px !important;
    background: var(--ax-white);
    border: 1px solid color-mix(in srgb, var(--ax-navy-900) 7%, transparent);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--ax-navy-900) 4%, transparent),
    0 14px 36px color-mix(in srgb, var(--ax-navy-900) 6%, transparent);
}

.hrc .service-box-outsourcing .hrc-exp .item {
    padding: 0 !important;
}

.hrc .service-box-outsourcing .hrc-exp .item > span:not(.hrc-exp__num):not(.hrc-exp__bar) {
    display: none;
}

.hrc .service-box-outsourcing .hrc-exp .item > .hrc-exp__bar {
    display: block !important; width: 40px; height: 3px !important; min-height: 0; padding: 0; margin: 0 0 10px !important; border-radius: 3px; background: var(--ax-cyan-500) !important;
}

.hrc .service-box-outsourcing .hrc-exp > .row,
.hrc .service-box-outsourcing .hrc-exp > .text-details {
    display: contents !important;
}

.hrc .service-box-outsourcing .hrc-exp--feature {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: 28px;
    padding: 20px 30px 22px;
    border-radius: 18px;
}

.hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6 {
    width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important;
}

.hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:last-child {
    grid-column: 1; grid-row: 1; align-self: start; padding-top: 4px !important;
}

.hrc .service-box-outsourcing .hrc-exp--feature .hrc-panel {
    grid-column: 1 / -1; grid-row: 2;
}

.hrc .service-box-outsourcing .hrc-exp--feature .hrc-more {
    grid-column: 1; grid-row: 3; align-self: start; justify-self: start; margin: 16px 0 0 82px;
}

.hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:first-child {
    grid-column: 2; grid-row: 1; align-self: center;
}

.hrc .service-box-outsourcing .hrc-exp--flip > .row > .col-lg-6:last-child,
.hrc .service-box-outsourcing .hrc-exp--flip .hrc-more {
    grid-column: 2;
}

.hrc .service-box-outsourcing .hrc-exp--flip > .row > .col-lg-6:first-child {
    grid-column: 1;
}

.hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:first-child img {
    display: block; width: 100%; height: auto; border-radius: 0; box-shadow: none;
}

.hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:last-child .item {
    display: grid; grid-template-columns: 58px minmax(0, 1fr); column-gap: 24px;
}

.hrc .service-box-outsourcing .hrc-exp .hrc-exp__num {
    font-style: normal !important; position: static !important;
    grid-column: 1; grid-row: 1 / span 4;
    display: grid; place-items: center;
    width: 58px; height: 58px; border-radius: 13px;
    background: color-mix(in srgb, var(--ax-cyan-100) 70%, var(--ax-white)) !important; color: var(--ax-cyan-600) !important;
    font-family: var(--ax-font-display) !important; font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em;
}

.hrc .service-box-outsourcing .hrc-exp--feature .item > h4,
.hrc .service-box-outsourcing .hrc-exp--feature .item > .hrc-exp__bar,
.hrc .service-box-outsourcing .hrc-exp--feature .item > .text-item {
    grid-column: 2;
}

.hrc .service-box-outsourcing .hrc-exp .item h4 {
    margin: 0 0 10px !important;
    font-family: var(--ax-font-display) !important;
    font-size: 1.55rem !important; font-weight: 800 !important;
    line-height: 1.15 !important; letter-spacing: -.028em !important;
    color: var(--ax-navy-900) !important;
}

.hrc .service-box-outsourcing .hrc-exp .text-item {
    padding: 0 !important;
}

.hrc .service-box-outsourcing .hrc-exp .text-item p {
    margin: 0 !important; padding: 0 !important; border: 0 !important;
    font-family: var(--ax-font-sans) !important;
    font-size: .9rem !important; line-height: 1.65 !important;
    color: var(--ax-ink-soft) !important;
}

.hrc .service-box-outsourcing .hrc-exp .text-item::before,
.hrc .service-box-outsourcing .hrc-exp .text-item::after,
.hrc .service-box-outsourcing .hrc-exp .text-item p::before,
.hrc .service-box-outsourcing .hrc-exp .text-item p::after {
    display: none !important; content: none !important;
}

html .hrc-more {
    padding: 9px 22px; border-radius: 100px;
    background: var(--ax-white); color: var(--ax-blue-500);
    box-shadow: inset 0 0 0 1px var(--ax-blue-500);
    font-size: 14px; font-weight: 700;
}

.hrc-more:hover {
    background: var(--ax-blue-500); color: var(--ax-white);
}

.hrc-more:focus-visible {
    outline: 2px solid var(--ax-cyan-500); outline-offset: 3px;
}

.hrc-more i {
    font-size: 14px; transition: transform var(--ax-dur-md) var(--ax-ease);
}

.hrc-more:hover i {
    transform: translateY(2px);
}

.hrc-more[aria-expanded="true"] i,
.hrc-more[aria-expanded="true"]:hover i {
    transform: rotate(180deg);
}

.hrc .service-box-outsourcing .text-details {
    display: block !important;
}

.hrc .service-box-outsourcing .text-details .hrc-more {
    display: inline-flex !important; width: auto !important;
}

.hrc-panel {
    display: block; width: 100%;
    max-height: 0; overflow: hidden;
    transition: max-height var(--ax-dur-md) var(--ax-ease);
}

.hrc-panel__inner {
    text-align: left; padding-top: 0; transition: padding-top var(--ax-dur-md) var(--ax-ease);
}

.hrc-panel.is-open .hrc-panel__inner {
    padding-top: 26px;
}

.hrc-panel .row {
    row-gap: 18px;
}

.hrc-panel .col-sec {
    display: flex;
}

.hrc-panel .col-item {
    display: flex; gap: 18px; align-items: flex-start;
    width: 100%; padding: 24px;
    border-radius: 18px;
    background: var(--ax-white) !important;
    border: 1px solid color-mix(in srgb, var(--ax-navy-900) 7%, transparent) !important;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--ax-navy-900) 5%, transparent) !important;
}

.hrc-panel .left-icon {
    flex: 0 0 auto; display: grid; place-items: center;
    width: 58px; height: 58px; margin: 0 !important;
    border-radius: 16px;
    background: var(--ax-blue-100) !important;
}

.hrc-panel .left-icon img {
    width: 32px !important; height: 32px !important; object-fit: contain;
}

.hrc-panel .left-icon .white-img {
    display: none !important;
}

.hrc-panel .item-text h4 {
    margin: 0 0 6px !important;
    font-family: var(--ax-font-display) !important;
    font-size: 1.05rem !important; font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -.024em !important; color: var(--ax-navy-900) !important;
}

.hrc-panel .item-text p {
    margin: 0 !important;
    font-family: var(--ax-font-sans) !important;
    font-size: var(--ax-t-small) !important; line-height: 1.7 !important;
    color: var(--ax-ink-soft) !important;
}

.hrc-cta {
    display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(0, 1fr); column-gap: 24px; align-items: center;
    padding: 44px 40px 40px;
    border-radius: 28px;
    background: var(--ax-white);
    border: 1px solid color-mix(in srgb, var(--ax-navy-900) 7%, transparent);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--ax-navy-900) 4%, transparent),
    0 22px 56px color-mix(in srgb, var(--ax-navy-900) 7%, transparent);
}

.hrc-eyebrow--plain {
    color: var(--ax-ink-soft); background: color-mix(in srgb, var(--ax-blue-100) 60%, var(--ax-white));
    margin-bottom: 20px;
}

.hrc-eyebrow--plain::before {
    width: 26px; background: var(--ax-blue-500);
}

.hrc .service-footer-block .hrc-cta__text h4 {
    margin: 0 0 18px !important;
    font-family: var(--ax-font-display) !important;
    font-size: clamp(2rem, 3.5vw, 2.75rem) !important; font-weight: 800 !important;
    line-height: 1.1 !important; letter-spacing: -.035em !important;
    color: var(--ax-navy-900) !important;
}

.hrc .service-footer-block .hrc-cta__text h4 span {
    background: linear-gradient(100deg, var(--ax-blue-500), var(--ax-cyan-400));
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}

.hrc .service-footer-block .hrc-cta__text p {
    max-width: 52ch; margin: 0 0 26px !important;
    font-family: var(--ax-font-sans) !important;
    font-size: 1.02rem !important; font-weight: 400 !important; line-height: 1.65 !important;
    color: var(--ax-ink-soft) !important;
}

.hrc-cta__actions {
    display: flex; flex-wrap: wrap; align-items: center; gap: 22px 40px; margin-bottom: 30px;
}

.hrc-cta__actions .hrc-btn {
    margin-top: 0;
}

.hrc-cta__link {
    position: relative; display: inline-flex; align-items: center; gap: 12px; padding-bottom: 8px;
    font-family: var(--ax-font-display); font-size: 15px; font-weight: 700; letter-spacing: -.01em;
    color: var(--ax-navy-900); text-decoration: none;
}

.hrc-cta__link i {
    font-size: 1.35rem; color: var(--ax-blue-500);
}

.hrc-cta__link::after {
    content: ""; position: absolute; left: 34px; bottom: 0; width: 40px; height: 2px; border-radius: 2px; background: var(--ax-blue-500); transition: width var(--ax-dur-md) var(--ax-ease);
}

.hrc-cta__link:hover::after {
    width: calc(100% - 34px);
}

.hrc-cta__stats {
    display: flex; flex-wrap: wrap; margin-left: 0; gap: 18px 0; margin: 0; padding: 0; list-style: none;
}

.hrc .service-footer-block .hrc-cta__stats li {
    display: flex; align-items: center; gap: 9px; padding: 0 12px; font-family: var(--ax-font-sans); font-size: .76rem; white-space: nowrap; line-height: 1.3; color: var(--ax-ink-soft);
}

.hrc .service-footer-block .hrc-cta__stats li:first-child {
    padding-left: 0;
}

.hrc .service-footer-block .hrc-cta__stats li + li {
    border-left: 1px solid color-mix(in srgb, var(--ax-navy-900) 10%, transparent);
}

.hrc-stat strong {
    display: block; font-family: var(--ax-font-display); font-size: 1.02rem; font-weight: 800; letter-spacing: -.02em; color: var(--ax-navy-900);
}

.hrc-stat__icon {
    --tone: var(--ax-blue-500);
    flex: 0 0 auto; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px;
    background: color-mix(in srgb, var(--tone) 12%, var(--ax-white)); color: var(--tone); font-size: 1.1rem;
}

.hrc-stat--green .hrc-stat__icon {
    --tone: var(--ax-cyan-600);
}

.hrc-stat--purple .hrc-stat__icon {
    --tone: var(--ax-blue-500);
}

.hrc-cta__visual {
    position: relative; padding: 24px 0 0; aspect-ratio: 848 / 505;
}

.hrc-cta__photo {
    position: absolute; left: 0; top: 4.8%; width: 93.4%; height: 95.2%; object-fit: cover; border-radius: 20px; display: block;
}

.hrc-float {
    position: absolute; display: flex; align-items: center; gap: 14px;
    padding: 14px 18px; border-radius: 18px;
    background: var(--ax-white);
    box-shadow: 0 16px 40px color-mix(in srgb, var(--ax-navy-900) 14%, transparent), 0 1px 3px color-mix(in srgb, var(--ax-navy-900) 6%, transparent);
}

.hrc-float--top {
    right: -2%; top: 0; width: 54%;
}

.hrc-float--bottom {
    right: -2%; bottom: 0; width: 60%;
}

.hrc-float__icon {
    flex: 0 0 auto; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 13px; color: var(--ax-white); font-size: 1.3rem;
}

.hrc-float__icon--blue {
    background: var(--ax-blue-500);
}

.hrc-float__icon--green {
    background: var(--ax-cyan-600);
}

.hrc-float__text strong {
    display: block; font-family: var(--ax-font-display); font-size: .95rem; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--ax-navy-900);
}

.hrc-float__text small {
    display: block; white-space: nowrap; margin-top: 4px; font-family: var(--ax-font-sans); font-size: .72rem; color: var(--ax-ink-soft);
}

.hrc-cta--flip .hrc-cta__text {
    order: 2;
}

.hrc-cta--flip .hrc-cta__visual {
    order: 1;
}

.hrc-cta__text p + p {
    margin-top: -10px;
}

.hrc .service-box-outsourcing .hrc-exp .text-item ul {
    margin: 0; padding: 0; list-style: none;
}

.hrc .service-box-outsourcing .hrc-exp .text-item ul li {
    position: relative; margin: 0 0 10px; padding: 0 0 0 28px;
    font-family: var(--ax-font-sans) !important; font-size: .95rem !important; line-height: 1.65 !important;
    color: var(--ax-ink-soft) !important;
}

.hrc .service-box-outsourcing .hrc-exp .text-item ul li::before {
    content: "\f00c"; font-family: "Font Awesome 6 Free", "FontAwesome"; font-weight: 900;
    position: absolute; left: 0; top: 3px; display: grid; place-items: center;
    width: 18px; height: 18px; border-radius: 50%; font-size: 9px;
    background: color-mix(in srgb, var(--ax-cyan-500) 18%, var(--ax-white)); color: var(--ax-cyan-600);
}

.hrc .service-box-outsourcing .h-title[hidden] {
    display: none;
}

.hrc .service-box-outsourcing.hrc-solo {
    padding: 12px 0 28px !important; background: transparent !important;
}

.hrc .service-box-outsourcing.hrc-solo .hrc-exp {
    margin-bottom: 0 !important;
}

.hrc .service-box-outsourcing li,
.hrc .service-box-outsourcing ul li a {
    font-family: var(--ax-font-sans) !important;
    font-size: .98rem !important; line-height: 1.6 !important;
    color: var(--ax-ink-soft) !important;
}

@media screen and (max-width: 991px) {
  .hrc .importance-human-resource {
      padding: 60px 0 64px !important;
  }
  .hrc .service-box-outsourcing {
      padding: 60px 0 24px !important;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature {
      display: flex; flex-direction: column; padding: 26px 22px;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature > .row {
      display: contents !important;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:first-child {
      order: 2; margin-top: 22px; grid-column: auto;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature > .row > .col-lg-6:last-child {
      order: 1;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature .hrc-more {
      order: 3; margin-top: 20px;
  }
  .hrc .service-box-outsourcing .hrc-exp--feature .hrc-panel {
      order: 4;
  }
  .hrc-cta {
      grid-template-columns: 1fr; padding: 32px 26px; row-gap: 34px;
  }
  .hrc-float--top {
      right: 0;
  }
  .hrc-float--bottom {
      right: 0;
  }
}

@media screen and (max-width: 576px) {
  .hrc-panel .col-item {
      flex-direction: column; padding: 20px;
  }
  .hrc-cta {
      padding: 26px 18px;
  }
  .hrc .service-footer-block .hrc-cta__stats li {
      padding: 0 14px;
  }
  .hrc-float {
      gap: 10px; padding: 10px 12px;
  }
  .hrc-float__icon {
      width: 40px; height: 40px; font-size: 1.05rem;
  }
}

.hrc-hero__eyebrow {
    display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; font: 800 12px/1 var(--ax-font-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--ax-cyan-600);
}

.hrc-hero__eyebrow::before {
    content: ""; width: 22px; height: 2px; background: var(--ax-cyan-600);
}

.hrc-hero__lead {
    margin: 0 0 12px !important; font-family: var(--ax-font-display) !important; font-size: 1.35rem !important; font-weight: 800 !important; line-height: 1.3 !important; color: var(--ax-navy-900) !important;
}

.hrc-ov-eyebrow {
    display: inline-flex !important; width: auto !important; max-width: max-content; margin-bottom: 14px;
}

.hrc-ov-stats {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 30px 0 0; padding: 0; list-style: none;
}

.hrc-ov-stats li {
    display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 18px 10px; text-align: center; border-radius: 14px; background: var(--ax-white); border: 1px solid color-mix(in srgb, var(--ax-navy-900) 7%, transparent); box-shadow: 0 10px 26px color-mix(in srgb, var(--ax-navy-900) 6%, transparent);
}

.hrc-ov-stats i {
    margin-bottom: 8px; font-size: 1.6rem; color: var(--ax-blue-500);
}

.hrc-ov-stats li:nth-child(2) i {
    color: var(--ax-cyan-600);
}

.hrc-ov-stats li:nth-child(3) i {
    color: var(--ax-blue-500);
}

.hrc-ov-stats li:nth-child(4) i {
    color: var(--ax-cyan-600);
}

.hrc-ov-stats strong {
    font: 800 .85rem var(--ax-font-sans); color: var(--ax-navy-900);
}

.hrc-ov-stats span {
    font-style: normal; font-size: .78rem; line-height: 1.35; color: var(--ax-ink-soft);
}

@media screen and (max-width: 576px) {
  .hrc-ov-stats {
      grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.hrc-imp__foot:has(.hrc-imp__num) {
    display: flex; align-items: center; justify-content: space-between;
}

.hrc-imp__num {
    position: absolute; right: 26px; top: 238px; font: 800 1.15rem var(--ax-font-display); color: color-mix(in srgb, var(--ax-blue-500) 55%, var(--ax-white));
}

.hrc-imp__arrow {
    margin-left: auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid var(--ax-blue-500); color: var(--ax-blue-500); font-size: .9rem;
}

.hrc .importance-human-resource .col-item {
    position: relative;
}

.hrc .service-box-outsourcing .hrc-exp--feature {
    grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); column-gap: 44px;
}

.hrc .service-box-outsourcing .hrc-exp--flip {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr);
}

@media screen and (max-width: 991px) {
  .hrc .service-box-outsourcing .hrc-exp--feature, .hrc .service-box-outsourcing .hrc-exp--flip {
      grid-template-columns: none;
  }
}

.hrc .service-box-outsourcing .hrc-exp--feature {
    grid-template-columns: minmax(0, 2.25fr) minmax(0, 1fr);
}

.hrc .service-box-outsourcing .hrc-exp--flip {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2.25fr);
}

.hrc .service-box-outsourcing .hrc-exp .hrc-exp__num {
    grid-row: 1 / span 2; align-self: start;
}

.hrc .service-box-outsourcing .hrc-exp--feature .item > .text-item {
    grid-column: 1 / -1; margin-top: 12px;
}

.hrc .service-box-outsourcing .hrc-exp--feature .hrc-more {
    margin-left: 0;
}

@media screen and (max-width: 991px) {
  .hrc .service-box-outsourcing .hrc-exp--feature, .hrc .service-box-outsourcing .hrc-exp--flip {
      grid-template-columns: none;
  }
}

.hrc-hero__eyebrow {
    color: var(--ax-blue-500);
}

.hrc-hero__eyebrow::before {
    width: 36px; background: var(--ax-cyan-500);
}

.hrc-hero__eyebrow {
    color: var(--ax-cyan-300);
}

.hrc-hero__eyebrow::before {
    background: var(--ax-cyan-400);
}

.hrc-hero__lead {
    color: var(--ax-white) !important;
}

.hrc .service-box-outsourcing .hrc-exp--feature {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); column-gap: 36px;
}

.hrc .service-box-outsourcing .hrc-exp--flip {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
}

@media screen and (max-width: 991px) {
  .hrc .service-box-outsourcing .hrc-exp--feature, .hrc .service-box-outsourcing .hrc-exp--flip {
      grid-template-columns: none;
  }
}

.hrc .sub-services-tab-block .hrc-ov-stats {
    gap: 16px; margin-top: 34px;
}

.hrc .sub-services-tab-block .hrc-ov-stats li {
    position: relative; overflow: hidden;
    gap: 4px; padding: 22px 12px 20px; min-height: 148px; justify-content: flex-start;
    border-radius: 16px;
    background: linear-gradient(180deg, var(--ax-white) 0%, color-mix(in srgb, var(--ax-blue-100) 55%, var(--ax-white)) 100%);
    border: 1px solid color-mix(in srgb, var(--ax-blue-500) 14%, transparent);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--ax-navy-900) 5%, transparent), 0 12px 28px color-mix(in srgb, var(--ax-navy-900) 7%, transparent);
    transition: transform var(--ax-dur-md) var(--ax-ease), box-shadow var(--ax-dur-md) var(--ax-ease);
}

.hrc .sub-services-tab-block .hrc-ov-stats li::before {
    content: ""; position: absolute; top: 0; left: 24%; right: 24%; height: 3px; border-radius: 0 0 3px 3px; background: var(--ax-grad-accent);
}

.hrc .sub-services-tab-block .hrc-ov-stats li:hover {
    transform: translateY(-4px); box-shadow: 0 2px 4px color-mix(in srgb, var(--ax-navy-900) 6%, transparent), 0 20px 40px color-mix(in srgb, var(--ax-blue-500) 16%, transparent);
}

.hrc .sub-services-tab-block .hrc-ov-stats i {
    display: grid; place-items: center; width: 50px; height: 50px; margin: 0 0 10px;
    border-radius: 14px; font-size: 1.35rem;
    background: color-mix(in srgb, var(--ax-blue-500) 12%, var(--ax-white));
    color: var(--ax-blue-500) !important;
}

.hrc .sub-services-tab-block .hrc-ov-stats li:nth-child(even) i {
    background: color-mix(in srgb, var(--ax-cyan-500) 14%, var(--ax-white)); color: var(--ax-cyan-600) !important;
}

.hrc .sub-services-tab-block .hrc-ov-stats strong {
    font-family: var(--ax-font-display); font-size: 1.05rem; font-weight: 800; letter-spacing: -.01em; color: var(--ax-navy-900);
}

.hrc .sub-services-tab-block .hrc-ov-stats span {
    display: block; font-style: normal !important; font-size: .85rem !important; line-height: 1.4; color: var(--ax-ink-soft);
}

.hrc .sub-services-tab-block .hrc-ov-stats li > i {
    display: grid !important; place-items: center; width: 50px !important; height: 50px !important; margin: 0 0 10px !important;
    border-radius: 14px; font-size: 1.35rem !important; line-height: 1 !important;
    background: color-mix(in srgb, var(--ax-blue-500) 12%, var(--ax-white)) !important;
    color: var(--ax-blue-500) !important;
}

.hrc .sub-services-tab-block .hrc-ov-stats li:nth-child(even) > i {
    background: color-mix(in srgb, var(--ax-cyan-500) 14%, var(--ax-white)) !important; color: var(--ax-cyan-600) !important;
}

.hrc .sub-services-tab-block .hrc-ov-stats li > svg {
    box-sizing: border-box; display: block; width: 50px; height: 50px; margin: 0 0 10px; padding: 13px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--ax-blue-500) 12%, var(--ax-white));
    color: var(--ax-blue-500); fill: currentColor;
}

.hrc .sub-services-tab-block .hrc-ov-stats li:nth-child(even) > svg {
    background: color-mix(in srgb, var(--ax-cyan-500) 14%, var(--ax-white)); color: var(--ax-cyan-600);
}

.hrc .hrc-exp-coach .hrc-exp--feature {
    padding: 22px 34px;
}

.hrc .hrc-exp-coach .hrc-exp--feature > .row > .col-lg-6:first-child .item {
    display: flex; justify-content: flex-end;
}

.hrc .hrc-exp-coach .hrc-exp--feature > .row > .col-lg-6:first-child img {
    width: auto !important; max-width: 100%; height: auto; max-height: 190px;
}

.hrc .hrc-exp-coach .hrc-exp--flip > .row > .col-lg-6:first-child .item {
    justify-content: flex-start;
}

.hrc .hrc-exp-coach .hrc-exp--feature .text-item ul {
    margin-top: 4px;
}

.hrc-imp__photo {
    height: 240px;
}

.hrc-imp__photo img {
    object-position: 50% 0%;
}

.hrc .importance-human-resource .item-text {
    padding-top: 34px !important;
}

.hrc-imp__num {
    top: 256px;
}

.hrc-row__list {
    margin: 0 !important; padding: 0 !important; list-style: none !important;
}

.hrc-row__list li {
    position: relative; margin: 0 0 12px !important; padding: 0 0 0 24px !important; list-style: none !important; font-family: var(--ax-font-sans); font-size: 1.04rem; line-height: 1.7; color: var(--ax-ink-soft);
}

.hrc-row__list li:last-child {
    margin-bottom: 0 !important;
}

.hrc-row__list li::before {
    content: ""; position: absolute; left: 3px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--ax-cyan-600);
}

.hrc-adv h2.hrc-adv__wide {
    max-width: 30ch;
}

.hrc-band {
    position: relative; overflow: hidden; padding: 84px 0;
    background: radial-gradient(620px 360px at 92% 0%, color-mix(in srgb, var(--ax-cyan-500) 26%, transparent) 0%, transparent 62%),
    radial-gradient(520px 320px at 0% 100%, color-mix(in srgb, var(--ax-blue-500) 30%, transparent) 0%, transparent 62%),
    linear-gradient(135deg, var(--ax-navy-900), var(--ax-navy-700));
}

.hrc-band::before {
    content: ""; position: absolute; inset: 0; opacity: .35; pointer-events: none; background: radial-gradient(circle, rgba(255,255,255,.55) 1.2px, transparent 1.6px) 0 0 / 26px 26px; -webkit-mask-image: linear-gradient(90deg, #000, transparent 55%); mask-image: linear-gradient(90deg, #000, transparent 55%);
}

.hrc-band__grid {
    position: relative; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 56px; align-items: center;
}

.hrc-band .hrc-band__text h2 {
    margin: 0 0 18px !important; padding: 0 !important; font-family: var(--ax-font-display) !important; font-size: clamp(1.9rem, 3.2vw, 2.7rem) !important; font-weight: 800 !important; line-height: 1.12 !important; letter-spacing: -.03em !important; color: var(--ax-white) !important; text-align: left;
}

.hrc-band__bar {
    display: block; width: 58px; height: 4px; margin: 0 0 22px; border-radius: 4px; background: linear-gradient(90deg, var(--ax-cyan-500), var(--ax-blue-500));
}

.hrc-band .hrc-band__text p {
    margin: 0 0 30px !important; max-width: 56ch; font-family: var(--ax-font-sans) !important; font-size: 1.08rem !important; line-height: 1.75 !important; color: color-mix(in srgb, var(--ax-white) 82%, transparent) !important; text-align: left !important;
}

.hrc-band__cta {
    display: inline-flex; align-items: center; gap: 12px; padding: 16px 34px; border-radius: 999px; background: var(--ax-white); color: var(--ax-navy-900); font-family: var(--ax-font-display); font-weight: 800; text-decoration: none; box-shadow: 0 16px 34px rgba(0,0,0,.28); transition: transform var(--ax-dur-sm) var(--ax-ease), box-shadow var(--ax-dur-sm) var(--ax-ease);
}

.hrc-band__cta:hover {
    transform: translateY(-3px); color: var(--ax-navy-900); box-shadow: 0 22px 44px rgba(0,0,0,.34);
}

.hrc-band__cta i {
    color: var(--ax-blue-500); transition: transform var(--ax-dur-sm) var(--ax-ease);
}

.hrc-band__cta:hover i {
    transform: translateX(5px);
}

.hrc-band__fig {
    margin: 0; text-align: center;
}

.hrc-band__fig img {
    display: block; width: 100%; max-width: 440px; height: auto; margin: 0 auto; border-radius: 24px; border: 6px solid color-mix(in srgb, var(--ax-white) 90%, transparent); box-shadow: 0 30px 60px rgba(0,0,0,.4);
}

.hrc-js .hrc-reveal {
    opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ax-ease), transform .7s var(--ax-ease);
}

.hrc-js .hrc-reveal.is-in {
    opacity: 1; transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .hrc-js .hrc-reveal {
      opacity: 1; transform: none; transition: none;
  }
}

@media screen and (max-width: 991px) {
  .hrc-band {
      padding: 56px 0;
  }
  .hrc-band__grid {
      grid-template-columns: 1fr; gap: 36px;
  }
}

.hrc-band .hrc-band__cta {
    background: var(--ax-white) !important; color: var(--ax-navy-900) !important; border: 0 !important;
}

.hrc-band .hrc-band__cta span {
    color: var(--ax-navy-900) !important;
}

.hrc-band .hrc-band__cta:hover {
    color: var(--ax-navy-900) !important;
}

.hrc-band__fig img {
    border: 0; border-radius: 28px; background: var(--ax-white); padding: 10px;
}

.hrc-faq {
    padding: 84px 0 96px !important; background: linear-gradient(180deg, var(--ax-white) 0%, var(--ax-paper) 100%) !important;
}

.hrc-faq .title {
    margin: 0 0 40px; text-align: center;
}

.hrc-faq .title h2 {
    margin: 0 !important; font-family: var(--ax-font-display) !important; font-size: var(--ax-t-display) !important; font-weight: 800 !important; letter-spacing: -.035em !important; color: var(--ax-navy-900) !important;
}

.hrc-faq .title h2::after {
    content: ""; display: block; width: 64px; height: 4px; margin: 16px auto 0; border-radius: 4px; background: linear-gradient(90deg, var(--ax-cyan-500), var(--ax-blue-500));
}

.hrc-faq .accordion {
    max-width: 940px; margin: 0 auto; display: grid; gap: 14px;
}

.hrc-faq .accordion-item {
    border: 1px solid color-mix(in srgb, var(--ax-navy-900) 8%, transparent) !important; border-radius: 16px !important; overflow: hidden; background: var(--ax-white) !important; box-shadow: 0 8px 22px color-mix(in srgb, var(--ax-navy-900) 5%, transparent);
}

.hrc-faq .accordion-button {
    position: relative; display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; padding: 20px 26px !important; border: 0 !important; background: var(--ax-white) !important; box-shadow: none !important; cursor: pointer;
}

.hrc-faq .accordion-button h4 {
    margin: 0 !important; padding: 0 !important; font-family: var(--ax-font-display) !important; font-size: 1.08rem !important; font-weight: 700 !important; line-height: 1.4 !important; color: var(--ax-navy-900) !important; text-align: left;
}

.hrc-faq .accordion-button::after {
    content: "\f078"; font-family: "Font Awesome 6 Free", "FontAwesome"; font-weight: 900; flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; margin: 0 !important; background-image: none !important; border-radius: 50%; background-color: var(--ax-blue-100); color: var(--ax-blue-500); font-size: .8rem; transform: none; transition: transform var(--ax-dur-sm) var(--ax-ease), background var(--ax-dur-sm) var(--ax-ease);
}

.hrc-faq .accordion-button:not(.collapsed)::after {
    transform: rotate(180deg); background-color: var(--ax-blue-500); color: var(--ax-white);
}

.hrc-faq .accordion-button:not(.collapsed) {
    background: linear-gradient(135deg, var(--ax-white), var(--ax-paper)) !important;
}

.hrc-faq .accordion-body {
    padding: 4px 26px 24px !important; font-family: var(--ax-font-sans); line-height: 1.75; color: var(--ax-ink-soft);
}

.hrc-faq .accordion-body p, .hrc-faq .accordion-body li {
    font-size: 1rem; line-height: 1.75; color: var(--ax-ink-soft);
}

.hrc-faq .accordion-body ul {
    padding-left: 1.2rem; margin: 10px 0 0;
}

.hrc-faq .accordion-body li {
    margin-bottom: 6px;
}

.hrc-rows .hrc-rows__intro {
    max-width: 760px; margin: -34px auto 52px !important; text-align: center; font-family: var(--ax-font-sans); font-size: 1.05rem; line-height: 1.75; color: var(--ax-ink-soft);
}

.hrc-steps {
    max-width: 980px; margin: -28px auto 64px; border-radius: 18px; background: var(--ax-white); border: 1px solid color-mix(in srgb, var(--ax-navy-900) 8%, transparent); box-shadow: 0 10px 28px color-mix(in srgb, var(--ax-navy-900) 6%, transparent); overflow: hidden;
}

.hrc-steps summary {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 26px; cursor: pointer; list-style: none; font-family: var(--ax-font-display); font-size: 1.1rem; font-weight: 800; color: var(--ax-navy-900);
}

.hrc-steps summary::-webkit-details-marker {
    display: none;
}

.hrc-steps summary i {
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ax-blue-100); color: var(--ax-blue-500); font-size: .8rem; transition: transform var(--ax-dur-sm) var(--ax-ease), background var(--ax-dur-sm) var(--ax-ease);
}

.hrc-steps[open] summary {
    background: linear-gradient(135deg, var(--ax-white), var(--ax-paper));
}

.hrc-steps[open] summary i {
    transform: rotate(180deg); background: var(--ax-blue-500); color: var(--ax-white);
}

.hrc-steps summary:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ax-cyan-500) 60%, transparent); outline-offset: -3px;
}

.hrc-steps__list {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 8px 26px 26px; list-style: none;
}

.hrc-steps__item {
    display: flex; gap: 14px; padding: 18px; border-radius: 14px; background: var(--ax-paper);
}

.hrc-steps__n {
    flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--ax-cyan-600), var(--ax-blue-600)); color: var(--ax-white); font-family: var(--ax-font-display); font-weight: 800;
}

.hrc-steps__item h5 {
    margin: 0 0 6px !important; font-family: var(--ax-font-display) !important; font-size: 1rem !important; font-weight: 800 !important; color: var(--ax-navy-900) !important;
}

.hrc-steps__item p {
    margin: 0 !important; font-size: .95rem !important; line-height: 1.65 !important; color: var(--ax-ink-soft) !important;
}

@media screen and (max-width: 767px) {
  .hrc-steps__list {
      grid-template-columns: 1fr; padding: 6px 16px 18px;
  }
  .hrc-steps {
      margin: -20px auto 48px;
  }
}

.hrc-row__step {
    display: inline-block; margin: 0 0 12px; padding: 4px 14px; border-radius: 999px; background: var(--ax-blue-100); font-family: var(--ax-font-display); font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ax-blue-500);
}

/* ##########################################################################
   Services — responsive layer (all service pages that use this file).
   Breakpoints (max-width, desktop-first cascade):
     19200 all screens | 1399 desktop/laptop | 1199 tablet landscape
      991 tablet and smaller | 767 mobile landscape | 576 phones
   ########################################################################## */

/* ---- 19200px: all screens --------------------------------------------- */
@media screen and (max-width: 19200px) {
    .hrc-float__text { min-width: 0; }
}

/* ---- 1399px: desktop and laptop --------------------------------------- */
@media screen and (max-width: 1399px) {
    :root {
        --ax-t-display: clamp(2.3rem, 3.9vw, 3.4rem);
        --ax-t-sub:     clamp(1.6rem, 2.4vw, 2.1rem);
        --ax-sp-section: 76px;
        --ax-sp-head:    40px;
    }
    body .hrc-hero h1, body .hrc-hero .hrc-hero__title { font-size: clamp(2.2rem, 4.2vw, 3.2rem) !important; }
}

/* ---- 1199px: tablet landscape and small desktop ----------------------- */
@media screen and (max-width: 1199px) {
    :root {
        --ax-t-display: clamp(2.1rem, 3.6vw, 3rem);
        --ax-t-sub:     clamp(1.5rem, 2.3vw, 1.9rem);
        --ax-sp-section: 68px;
        --ax-sp-head:    36px;
    }
    body .hrc-hero h1, body .hrc-hero .hrc-hero__title { font-size: clamp(2rem, 4vw, 2.8rem) !important; }
}

/* ---- 1199px: float cards must not clip at the right edge ---------------- */
@media screen and (max-width: 1199px) {
    html .hrc-float--top, html .hrc-float--bottom { right: 0; }
    .hrc-float__text small { white-space: normal; }
    .hrc-ben h4, .hrc-adv h5 { padding-right: 56px; }
}

/* ---- 991px: tablet and smaller ---------------------------------------- */
@media screen and (max-width: 991px) {
    :root {
        --ax-t-display: clamp(1.75rem, 1.2rem + 2.4vw, 2.6rem);
        --ax-t-sub:     clamp(1.3rem, 1.05rem + 1.4vw, 1.8rem);
        --ax-sp-section: 56px;
        --ax-sp-head:    32px;
    }
    /* the fixed mobile header (80px) overlays the top of the page */
    .hrc-hero { padding-top: 80px; }
    body .hrc-hero h1, body .hrc-hero .hrc-hero__title { font-size: clamp(1.9rem, 1.4rem + 2.4vw, 2.5rem) !important; }
}

/* ---- 767px: mobile landscape and small tablets ------------------------ */
@media screen and (max-width: 767px) {
    :root { --ax-sp-section: 48px; --ax-sp-head: 28px; }
    .hrc-float__text small { white-space: normal; }
}

/* ---- 576px: mobile phones --------------------------------------------- */
@media screen and (max-width: 576px) {
    :root { --ax-sp-section: 40px; --ax-sp-head: 24px; }
    body .hrc-hero h1, body .hrc-hero .hrc-hero__title { font-size: 1.9rem !important; }
    /* Floating highlight cards drop out of the photo and stack beneath it, so their text is never clipped */
    .hrc-cta__visual { aspect-ratio: auto; display: flex; flex-direction: column; gap: 12px; padding: 0; }
    /* the artwork has its own highlight cards on the right 44%; crop to the photo so only the HTML cards below show */
    .hrc-cta__photo { position: static; width: 100%; height: auto; aspect-ratio: 443 / 481; object-fit: cover; object-position: left center; }
    .hrc-float, .hrc-float--top, .hrc-float--bottom { position: static; right: auto; top: auto; bottom: auto; width: 100%; }
}
