/* Block styles. Loaded on the site and in the block editor, where style.css
   is not loaded, so each colour carries the brand value as a fallback. */

/* Ticked boxes (List) */
.is-style-ticked-boxes{ display: grid; gap: 12px; margin: 22px 0; padding: 0; list-style: none; font-family: var(--hr-font-body, 'Inter', 'Segoe UI', sans-serif); font-size: 16.5px; line-height: 1.7; }
.is-style-ticked-boxes > li{ position: relative; margin: 0; padding: 12px 16px 12px 52px; border-radius: 12px; color: var(--hr-navy-700, #35425C); background: var(--hr-surface, #FFFFFF); border: 1px solid var(--hr-line, rgba(14, 30, 61, .12)); transition: border-color .3s ease, transform .3s var(--hr-ease, cubic-bezier(.22, .9, .32, 1)); }
.is-style-ticked-boxes > li:hover{ border-color: rgba(200, 159, 90, .6); transform: translateX(4px); }
.is-style-ticked-boxes > li::before{ content: "\2713"; position: absolute; top: 13px; left: 16px; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; font-size: 12px; color: var(--hr-gold, #C89F5A); background: var(--hr-navy, #0E1E3D); }

/* Process steps (List): same card as the homepage .hr-step.
   :is() outranks the plain list boxes in style.css on service pages. */
:is(.hr-service-content, .editor-styles-wrapper, body) .wp-block-list.is-style-process-steps{ display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; margin: 28px 0; padding: 0; list-style: none; counter-reset: hr-step; font-family: var(--hr-font-body, 'Inter', 'Segoe UI', sans-serif); font-size: 16.5px; line-height: 1.7; }
:is(.hr-service-content, .editor-styles-wrapper, body) .wp-block-list.is-style-process-steps > li{ position: relative; display: block; margin: 0; padding: 34px 26px; color: var(--hr-navy-700, #35425C); background: var(--hr-surface, #FFFFFF); border-radius: var(--hr-radius, 22px); border: 1px solid var(--hr-line, rgba(14, 30, 61, .12)); }
:is(.hr-service-content, .editor-styles-wrapper, body) .wp-block-list.is-style-process-steps > li::before{ counter-increment: hr-step; content: counter(hr-step, decimal-leading-zero); position: static; display: block; width: auto; height: auto; margin: 0 0 14px; border-radius: 0; background: none; font-family: var(--hr-font-head, 'Space Grotesk', 'Segoe UI', sans-serif); font-size: 36px; font-weight: 700; line-height: 1.18; color: var(--hr-gold-600, #AA874C); }

/* Gold accent (Heading) */
.is-style-gold-accent{ position: relative; padding-top: 18px; font-family: var(--hr-font-head, 'Space Grotesk', 'Segoe UI', sans-serif); font-weight: 600; color: var(--hr-heading, #0E1E3D); }
.is-style-gold-accent::before{ content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 3px; border-radius: 3px; background: var(--hr-gold, #C89F5A); }

@media (prefers-reduced-motion: reduce){
  .is-style-ticked-boxes > li:hover{ transform: none !important; }
}