.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

address {
  font-style: normal;
}

.zerp-cf7-fallback {
  padding: 1rem 1.25rem;
  border: 1px solid #dbe4f0;
  border-radius: 1rem;
  background: #f8fbff;
  color: #174d99;
}

.zerp-contact-form .wpcf7,
.case-study-gate .wpcf7 {
  width: 100%;
}

.zerp-contact-form .wpcf7 form,
.case-study-gate .wpcf7 form {
  margin: 0;
}

.zerp-contact-form .wpcf7-form,
.case-study-gate .wpcf7-form {
  display: grid;
  gap: 1.25rem;
}

.zerp-contact-form .wpcf7-form-control-wrap,
.case-study-gate .wpcf7-form-control-wrap {
  display: block;
}

.zerp-contact-form input:not([type="checkbox"]):not([type="submit"]),
.zerp-contact-form textarea,
.case-study-gate input:not([type="checkbox"]):not([type="submit"]),
.case-study-gate textarea {
  width: 100%;
  min-height: 3.5rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #ffffff;
  padding: 0.75rem 1rem;
  color: #171c22;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.zerp-contact-form input:focus,
.zerp-contact-form textarea:focus,
.case-study-gate input:focus,
.case-study-gate textarea:focus {
  border-color: #003b8c;
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 59, 140, 0.15);
}

.zerp-contact-form textarea,
.case-study-gate textarea {
  min-height: 8rem;
  resize: vertical;
}

.zerp-contact-form .wpcf7-submit,
.case-study-gate .wpcf7-submit {
  cursor: pointer;
  border: 0;
}

.case-study-gate .wpcf7 input[type="submit"],
.case-study-gate .wpcf7 button[type="submit"],
.case-study-gate .wpcf7 .wpcf7-submit {
  display: block;
  width: 100%;
  min-height: 3rem;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  border-radius: 0.75rem;
  background: var(--zerp-color-primary);
  padding: 0.875rem 1.25rem;
  color: var(--zerp-color-on-primary);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25rem;
  text-align: center;
  box-shadow: 0 14px 28px rgba(0, 59, 140, 0.18);
  transition: background-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.case-study-gate .wpcf7 input[type="submit"]:hover,
.case-study-gate .wpcf7 button[type="submit"]:hover,
.case-study-gate .wpcf7 .wpcf7-submit:hover,
.case-study-gate .wpcf7 input[type="submit"]:focus-visible,
.case-study-gate .wpcf7 button[type="submit"]:focus-visible,
.case-study-gate .wpcf7 .wpcf7-submit:focus-visible {
  background: var(--zerp-color-primary-container);
}

.case-study-gate .wpcf7 input[type="submit"]:focus-visible,
.case-study-gate .wpcf7 button[type="submit"]:focus-visible,
.case-study-gate .wpcf7 .wpcf7-submit:focus-visible {
  outline: 2px solid var(--zerp-color-primary);
  outline-offset: 2px;
}

.zerp-contact-form .wpcf7-spinner,
.case-study-gate .wpcf7-spinner {
  margin: 0 0 0 0.75rem;
  vertical-align: middle;
}

.zerp-contact-form .wpcf7-not-valid-tip,
.case-study-gate .wpcf7-not-valid-tip {
  margin-top: 0.5rem;
  color: #ba1a1a;
  font-size: 0.875rem;
  line-height: 1.5;
}

.zerp-contact-form .wpcf7-response-output,
.case-study-gate .wpcf7-response-output {
  margin: 0 !important;
  border-radius: 0.75rem;
  padding: 0.875rem 1rem !important;
  font-size: 0.9375rem;
  line-height: 1.5;
}

.zerp-contact-form .wpcf7-response-output {
  background: #f0f4fc;
  border-color: #c3d4f6 !important;
  color: #174d99;
}

.case-study-gate .wpcf7-response-output {
  background: #eef4ff;
  border-color: #c3d4f6 !important;
  color: #174d99;
}

.zerp-contact-form .contact-checkbox .wpcf7-list-item,
.zerp-contact-form .contact-checkbox .wpcf7-list-item-label {
  margin: 0;
}

.zerp-contact-form .contact-checkbox .wpcf7-list-item {
  display: block;
}

.zerp-contact-form .contact-checkbox label {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}

.zerp-contact-form .contact-checkbox input[type="checkbox"] {
  margin-top: 0.25rem;
}

/*
 * Contact Us / Contact Form 7
 *
 * The Contact Us form is authored in CF7 and therefore has additional spans,
 * paragraphs and a submit spinner around the reference form markup. Keep the
 * layout rules scoped to the semantic classes from that form so the generic
 * CF7 treatment above, and the case-study form, are unaffected.
 */
.zerp-contact-form .zerp-enquiry-form {
  width: 100%;
}

.zerp-contact-form .zerp-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
}

.zerp-contact-form .zerp-form-field {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.5rem;
}

.zerp-contact-form .zerp-form-field-full {
  min-width: 0;
  grid-column: 1 / -1;
}

/* CF7 auto-formats the form template with p and br elements. */
.zerp-contact-form .zerp-form-field > p,
.zerp-contact-form .zerp-form-label br {
  margin: 0;
}

.zerp-contact-form .zerp-form-label br {
  display: none;
}

.zerp-contact-form .zerp-form-label {
  display: block;
  color: var(--zerp-color-on-surface-variant);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25rem;
}

.zerp-contact-form .required-mark {
  color: inherit;
}

.zerp-contact-form .zerp-form-field .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

.zerp-contact-form .zerp-enquiry-form input.zerp-form-control,
.zerp-contact-form .zerp-enquiry-form textarea.zerp-form-control {
  width: 100%;
  min-height: 3rem;
  box-sizing: border-box;
  border: 1px solid var(--zerp-color-border-subtle);
  border-radius: 0.75rem;
  background: var(--zerp-color-surface-white);
  padding: 0.75rem 1rem;
  color: var(--zerp-color-on-surface);
  font-family: "Noto Sans", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5rem;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.zerp-contact-form .zerp-enquiry-form textarea.zerp-form-textarea {
  height: 7.5rem;
  min-height: 7.5rem;
  resize: vertical;
}

.zerp-contact-form .zerp-enquiry-form .zerp-form-control::placeholder {
  color: rgb(67 70 82 / 60%);
}

.zerp-contact-form .zerp-enquiry-form .zerp-form-control:focus {
  border-color: var(--zerp-color-primary);
  outline: none;
  box-shadow: none;
}

.zerp-contact-form .zerp-enquiry-form .zerp-form-control:focus-visible,
.zerp-contact-form .zerp-consent-box input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--zerp-color-primary);
  outline-offset: 2px;
}

.zerp-contact-form .zerp-consent-box {
  display: flex;
  width: 100%;
  align-items: center;
  border: 1px solid var(--zerp-color-border-subtle);
  border-radius: 0.75rem;
  background: var(--zerp-color-surface-container-low);
  padding: 1rem;
}

.zerp-contact-form .zerp-consent-box .wpcf7-form-control-wrap,
.zerp-contact-form .zerp-consent-box .wpcf7-acceptance {
  display: block;
  width: 100%;
}

.zerp-contact-form .zerp-consent-box .wpcf7-list-item {
  display: block;
  margin: 0;
}

.zerp-contact-form .zerp-consent-box label {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  color: var(--zerp-color-on-surface-variant);
  font-family: "Noto Sans", sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5rem;
}

.zerp-contact-form .zerp-consent-box input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  min-height: 0;
  flex: 0 0 auto;
  margin-top: 0.25rem;
  border: 1px solid var(--zerp-color-outline-variant);
  border-radius: 0.25rem;
  color: var(--zerp-color-primary);
  accent-color: var(--zerp-color-primary);
}

.zerp-contact-form .zerp-form-footer {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.75rem;
}

.zerp-contact-form .zerp-form-note {
  margin: 0;
  color: var(--zerp-color-on-surface-variant);
  font-family: "Noto Sans", sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.25rem;
}

.zerp-contact-form .zerp-submit-wrap {
  position: relative;
  display: inline-flex;
  width: 100%;
  align-items: center;
}

/* The submit is an input, so the send indicator belongs on its wrapper. */
.zerp-contact-form .zerp-submit-wrap::after {
  position: absolute;
  top: 50%;
  right: 1.5rem;
  content: "\2192";
  color: var(--zerp-color-on-primary);
  font-size: 1.125rem;
  line-height: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

.zerp-contact-form .zerp-enquiry-form input.zerp-submit {
  display: block;
  width: 100%;
  min-height: 3rem;
  border: 0;
  border-radius: 0.5rem;
  background: var(--zerp-color-primary);
  padding: 0.875rem 3.25rem 0.875rem 1.5rem;
  color: var(--zerp-color-on-primary);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.25rem;
  text-align: center;
  box-shadow: 0 1px 2px rgb(15 23 42 / 10%);
  cursor: pointer;
  transition: background-color 150ms ease, box-shadow 150ms ease;
}

.zerp-contact-form .zerp-enquiry-form input.zerp-submit:hover,
.zerp-contact-form .zerp-enquiry-form input.zerp-submit:focus-visible {
  background: var(--zerp-color-primary-container);
}

.zerp-contact-form .zerp-enquiry-form input.zerp-submit:focus-visible {
  outline: 2px solid var(--zerp-color-primary);
  outline-offset: 2px;
}

.zerp-contact-form .zerp-submit-wrap .wpcf7-spinner {
  position: absolute;
  top: 50%;
  left: calc(100% + 0.75rem);
  margin: 0;
  transform: translateY(-50%);
}

.zerp-contact-form .zerp-enquiry-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 0.5rem;
}

.zerp-contact-form .zerp-enquiry-form .wpcf7-not-valid {
  border-color: var(--zerp-color-error);
}

@media (min-width: 640px) {
  .zerp-contact-form .zerp-consent-box {
    padding-right: 1.25rem;
    padding-left: 1.25rem;
  }

  .zerp-contact-form .zerp-form-footer {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .zerp-contact-form .zerp-submit-wrap {
    width: auto;
    flex: 0 0 auto;
  }

  .zerp-contact-form .zerp-enquiry-form input.zerp-submit {
    width: auto;
  }
}

@media (min-width: 768px) {
  .zerp-contact-form .zerp-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 639.98px) {
  .zerp-contact-form .zerp-submit-wrap .wpcf7-spinner {
    top: calc(100% + 0.5rem);
    right: 0;
    left: auto;
    transform: none;
  }
}

/*
 * Shared semantic utility fallback for the converted PHP theme.
 *
 * The live site currently receives stock Tailwind runtime utilities, but the
 * custom token classes used across the PHP templates are missing completely.
 * Restoring them here fixes the shared layout/container/typography system
 * without adding page-specific overrides.
 */
:root {
  --zerp-color-surface-container-lowest: #ffffff;
  --zerp-color-on-secondary-container: #00285c;
  --zerp-color-surface-container: #eaeef6;
  --zerp-color-secondary-fixed: #d8e2ff;
  --zerp-color-on-primary: #ffffff;
  --zerp-color-surface: #f7f9ff;
  --zerp-color-on-tertiary-fixed: #111c2d;
  --zerp-color-tertiary-fixed-dim: #bcc7de;
  --zerp-color-primary-fixed-dim: #b0c6ff;
  --zerp-color-surface-container-low: #f0f4fc;
  --zerp-color-error: #ba1a1a;
  --zerp-color-surface-bright: #f7f9ff;
  --zerp-color-inverse-on-surface: #edf1f9;
  --zerp-color-secondary-container: #4d8efe;
  --zerp-color-on-background: #171c22;
  --zerp-color-tertiary: #354053;
  --zerp-color-surface-tint: #275ab8;
  --zerp-color-on-primary-container: #b9ccff;
  --zerp-color-surface-dim: #d6dae2;
  --zerp-color-tertiary-container: #4c576b;
  --zerp-color-on-primary-fixed-variant: #00429b;
  --zerp-color-background: #f7f9ff;
  --zerp-color-on-tertiary-fixed-variant: #3c475a;
  --zerp-color-secondary: #005ac1;
  --zerp-color-on-error-container: #93000a;
  --zerp-color-on-surface-variant: #434652;
  --zerp-color-surface-variant: #dee3ea;
  --zerp-color-on-tertiary-container: #c2cde5;
  --zerp-color-on-secondary-fixed: #001a41;
  --zerp-color-primary: #003b8c;
  --zerp-color-border-subtle: #e2e8f0;
  --zerp-color-surface-white: #ffffff;
  --zerp-color-surface-container-high: #e4e8f0;
  --zerp-color-on-surface: #171c22;
  --zerp-color-outline-variant: #c3c6d4;
  --zerp-color-inverse-surface: #2c3137;
  --zerp-color-primary-fixed: #d9e2ff;
  --zerp-color-success-green: #10b981;
  --zerp-color-secondary-fixed-dim: #adc6ff;
  --zerp-color-on-secondary: #ffffff;
  --zerp-color-on-primary-fixed: #001945;
  --zerp-color-outline: #737784;
  --zerp-color-on-secondary-fixed-variant: #004494;
  --zerp-color-error-container: #ffdad6;
  --zerp-color-on-error: #ffffff;
  --zerp-color-primary-container: #1b52b0;
  --zerp-color-surface-container-highest: #dee3ea;
  --zerp-color-tertiary-fixed: #d8e3fb;
  --zerp-color-inverse-primary: #b0c6ff;
  --zerp-color-on-tertiary: #ffffff;
  --zerp-rgb-primary: 0 59 140;
  --zerp-rgb-primary-fixed: 217 226 255;
  --zerp-rgb-secondary-container: 77 142 254;
  --zerp-rgb-surface-white: 255 255 255;
  --zerp-rgb-outline-variant: 195 198 212;
}

.max-w-container-max {
  max-width: 1280px;
}

.px-gutter {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.py-section-padding {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.py-footer-padding {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}

.p-component-padding {
  padding: 2rem;
}

.font-body-lg,
.text-body-lg {
  font-family: "Noto Sans", sans-serif;
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
}

.font-body-md,
.text-body-md {
  font-family: "Noto Sans", sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

.font-display-hero,
.text-display-hero {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 46px;
  line-height: 64px;
  letter-spacing: -0.02em;
  font-weight: 700;
}

.font-button-text,
.text-button-text {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

.font-headline-lg,
.text-headline-lg {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 40px;
  line-height: 48px;
  font-weight: 700;
}

.font-headline-md,
.text-headline-md {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 32px;
  line-height: 40px;
  font-weight: 600;
}

.font-headline-sm,
.text-headline-sm {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
}

.font-label-caps,
.text-label-caps {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.05em;
  font-weight: 700;
}

.bg-border-subtle {
  background-color: var(--zerp-color-border-subtle);
}

.bg-on-tertiary {
  background-color: var(--zerp-color-on-tertiary);
}

.bg-on-tertiary-fixed {
  background-color: var(--zerp-color-on-tertiary-fixed);
}

.bg-primary {
  background-color: var(--zerp-color-primary);
}

.bg-primary-container {
  background-color: var(--zerp-color-primary-container);
}

.bg-primary-fixed {
  background-color: var(--zerp-color-primary-fixed);
}

.bg-secondary-container {
  background-color: var(--zerp-color-secondary-container);
}

.bg-surface {
  background-color: var(--zerp-color-surface);
}

.bg-surface-container {
  background-color: var(--zerp-color-surface-container);
}

.bg-surface-container-high {
  background-color: var(--zerp-color-surface-container-high);
}

.bg-surface-container-low {
  background-color: var(--zerp-color-surface-container-low);
}

.bg-surface-container-lowest {
  background-color: var(--zerp-color-surface-container-lowest);
}

.bg-surface-dim {
  background-color: var(--zerp-color-surface-dim);
}

.bg-surface-tint {
  background-color: var(--zerp-color-surface-tint);
}

.bg-surface-white {
  background-color: var(--zerp-color-surface-white);
}

.bg-tertiary {
  background-color: var(--zerp-color-tertiary);
}

.bg-primary\/5 {
  background-color: rgb(var(--zerp-rgb-primary) / 0.05);
}

.bg-primary-fixed\/10 {
  background-color: rgb(var(--zerp-rgb-primary-fixed) / 0.1);
}

.bg-primary-fixed\/30 {
  background-color: rgb(var(--zerp-rgb-primary-fixed) / 0.3);
}

.bg-secondary-container\/20 {
  background-color: rgb(var(--zerp-rgb-secondary-container) / 0.2);
}

.bg-surface-white\/90 {
  background-color: rgb(var(--zerp-rgb-surface-white) / 0.9);
}

.text-error {
  color: var(--zerp-color-error);
}

.text-on-background {
  color: var(--zerp-color-on-background);
}

.text-on-primary {
  color: var(--zerp-color-on-primary);
}

.text-on-primary-container {
  color: var(--zerp-color-on-primary-container);
}

.text-on-secondary {
  color: var(--zerp-color-on-secondary);
}

.text-on-surface {
  color: var(--zerp-color-on-surface);
}

.text-on-surface-variant {
  color: var(--zerp-color-on-surface-variant);
}

.text-on-tertiary-container {
  color: var(--zerp-color-on-tertiary-container);
}

.text-primary {
  color: var(--zerp-color-primary);
}

.text-primary-container {
  color: var(--zerp-color-primary-container);
}

.text-secondary {
  color: var(--zerp-color-secondary);
}

.text-secondary-container {
  color: var(--zerp-color-secondary-container);
}

.text-success-green {
  color: var(--zerp-color-success-green);
}

.text-surface-white {
  color: var(--zerp-color-surface-white);
}

.text-tertiary {
  color: var(--zerp-color-tertiary);
}

.text-primary-fixed\/90 {
  color: rgb(var(--zerp-rgb-primary-fixed) / 0.9);
}

.border-border-subtle {
  border-color: var(--zerp-color-border-subtle);
}

.border-outline {
  border-color: var(--zerp-color-outline);
}

.border-outline-variant {
  border-color: var(--zerp-color-outline-variant);
}

.border-primary {
  border-color: var(--zerp-color-primary);
}

.border-primary-container {
  border-color: var(--zerp-color-primary-container);
}

.border-surface-white {
  border-color: var(--zerp-color-surface-white);
}

.border-tertiary-container {
  border-color: var(--zerp-color-tertiary-container);
}

.border-outline-variant\/30 {
  border-color: rgb(var(--zerp-rgb-outline-variant) / 0.3);
}

.border-primary\/10 {
  border-color: rgb(var(--zerp-rgb-primary) / 0.1);
}

.border-primary\/20 {
  border-color: rgb(var(--zerp-rgb-primary) / 0.2);
}

.border-surface-white\/30 {
  border-color: rgb(var(--zerp-rgb-surface-white) / 0.3);
}

.from-primary-fixed {
  --tw-gradient-from: var(--zerp-color-primary-fixed) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(var(--zerp-rgb-primary-fixed) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-surface-container-low {
  --tw-gradient-to: var(--zerp-color-surface-container-low) var(--tw-gradient-to-position);
}

.hover\:bg-on-tertiary:hover {
  background-color: var(--zerp-color-on-tertiary);
}

.hover\:bg-primary:hover {
  background-color: var(--zerp-color-primary);
}

.hover\:bg-primary-container:hover {
  background-color: var(--zerp-color-primary-container);
}

.hover\:bg-primary-fixed:hover {
  background-color: var(--zerp-color-primary-fixed);
}

.hover\:bg-surface-container:hover {
  background-color: var(--zerp-color-surface-container);
}

.hover\:bg-surface-container-high:hover {
  background-color: var(--zerp-color-surface-container-high);
}

.hover\:bg-surface-container-low:hover {
  background-color: var(--zerp-color-surface-container-low);
}

.hover\:bg-surface-white:hover {
  background-color: var(--zerp-color-surface-white);
}

.hover\:bg-surface-white\/10:hover {
  background-color: rgb(var(--zerp-rgb-surface-white) / 0.1);
}

.hover\:border-primary-container:hover {
  border-color: var(--zerp-color-primary-container);
}

.hover\:text-primary:hover {
  color: var(--zerp-color-primary);
}

.hover\:text-primary-container:hover {
  color: var(--zerp-color-primary-container);
}

.hover\:text-primary-fixed:hover {
  color: var(--zerp-color-primary-fixed);
}

.hover\:text-tertiary:hover {
  color: var(--zerp-color-tertiary);
}

.group:hover .group-hover\:bg-primary-container {
  background-color: var(--zerp-color-primary-container);
}

.group:hover .group-hover\:text-on-primary {
  color: var(--zerp-color-on-primary);
}

.focus-visible\:ring-primary:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(var(--zerp-rgb-primary) / var(--tw-ring-opacity));
}

.focus-visible\:ring-offset-primary:focus-visible {
  --tw-ring-offset-color: var(--zerp-color-primary);
}

.focus-visible\:ring-offset-surface-white:focus-visible {
  --tw-ring-offset-color: var(--zerp-color-surface-white);
}

.dark .dark\:bg-on-tertiary-fixed {
  background-color: var(--zerp-color-on-tertiary-fixed);
}

.dark .dark\:bg-surface-dim {
  background-color: var(--zerp-color-surface-dim);
}

.dark .dark\:border-outline-variant {
  border-color: var(--zerp-color-outline-variant);
}
