.inner-page-hero {
  background-color: rgb(255 255 255);
}

.inner-page-hero.contact-us-hero {
  background-color: #ffffff;
}

.contact-us-hero .section-eyebrow {
  background-color: #ffffff;
  border-color: #79c1ff;
  color: #0878e8;
}

.contact-us-hero .section-eyebrow::before {
  background-color: currentColor;
}

.contact-us-hero .contact-us-hero__heading {
  color: var(--zerp-color-on-secondary-fixed-variant);
}

.contact-us-hero .contact-us-hero__description {
  color: var(--zerp-color-on-surface-variant);
}

.contact-us-hero .contact-us-hero__cta {
  color: var(--zerp-color-on-primary);
}

.contact-us-hero .contact-us-hero__cta:hover {
  color: var(--zerp-color-on-primary);
}

.contact-us-hero .contact-us-hero__cta:focus-visible {
  color: var(--zerp-color-on-primary);
}

.inner-page-breadcrumbs {
  background-color: rgb(240 244 252);
}

.inner-page-hero h1.text-display-hero {
  font-weight: 700;
}

/* Compact Culture gallery used only on the About Us page. */
.about-culture {
  background-color: #ffffff;
  padding: 4.25rem 0;
}

.about-culture__header {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
  gap: 2rem 3rem;
  align-items: end;
  margin-bottom: 2rem;
}

.about-culture__heading h2 {
  margin-top: 1rem;
}

.about-culture__intro {
  max-width: 42rem;
  margin: 0;
}

.about-culture__gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1.4fr 1fr;
  gap: 0.75rem;
}

.about-culture__photo {
  min-width: 0;
  height: 10.5rem;
  margin: 0;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 0.875rem;
  background-color: #f0f4fc;
  box-shadow: 0 1px 2px rgb(15 23 42 / 5%);
}

.about-culture__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: none;
}

.about-culture__photo--outdoor img {
  object-position: center 67%;
}

.about-culture__photo--event img {
  object-position: center 56%;
}

.about-culture__photo--panorama img {
  object-position: center 52%;
}

.about-culture__photo--team-event img {
  object-position: center 58%;
}

@media (max-width: 1023px) {
  .about-culture {
    padding: 3.25rem 0;
  }

  .about-culture__header {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .about-culture__gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-culture__photo {
    height: 11rem;
  }
}

@media (max-width: 639px) {
  .about-culture {
    padding: 2.75rem 0;
  }

  .about-culture__header {
    margin-bottom: 1.5rem;
  }

  .about-culture__gallery {
    gap: 0.625rem;
  }

  .about-culture__photo {
    height: 8.5rem;
  }

  .about-culture__photo--panorama,
  .about-culture__photo--team-event {
    grid-column: span 2;
    height: 10.5rem;
  }
}

/* Theme tokens shared by the industry solution cards. */
:root {
  --zerp-primary: #003b8c;
  --zerp-primary-container-rgb: 27 82 176;
}

.industry-solution-card {
  transition-property: border-color, box-shadow, color, transform;
  transition-duration: 150ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.industry-solution-card:hover,
.industry-solution-card:focus-visible {
  border-color: rgb(var(--zerp-primary-container-rgb));
  box-shadow: 0 4px 20px rgb(var(--zerp-primary-container-rgb) / 8%);
  color: var(--zerp-primary);
  transform: translateY(-2px);
}

.industry-solution-card:hover > p,
.industry-solution-card:focus-visible > p {
  color: var(--zerp-primary);
}

.industry-solution-card:focus-visible {
  outline: 3px solid var(--zerp-primary);
  outline-offset: 3px;
}

footer .footer-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
}

footer .footer-copy {
  margin: 0;
  width: 100%;
  text-align: center;
}

/* Shared responsive rhythm and type scale for inner pages. */
@media (max-width: 1023.98px) {
  body .inner-page-hero {
    padding-block: clamp(2.5rem, 4vw, 4rem);
  }

  body .py-section-padding {
    padding-block: clamp(2.5rem, 5vw, 4rem);
  }

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

  footer .footer-top-row {
    gap: 0.875rem;
  }

  body .font-display-hero,
  body .text-display-hero {
    font-size: clamp(2rem, calc(1.15rem + 2.75vw), 2.875rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
  }

  body .font-headline-lg,
  body .text-headline-lg {
    font-size: clamp(1.625rem, calc(1.05rem + 1.8vw), 2.5rem);
    line-height: 1.15;
  }

  body .font-headline-md,
  body .text-headline-md {
    font-size: clamp(1.375rem, calc(1.05rem + 1.1vw), 2rem);
    line-height: 1.2;
  }

  body .font-headline-sm,
  body .text-headline-sm {
    font-size: clamp(1.125rem, calc(0.95rem + 0.6vw), 1.5rem);
    line-height: 1.25;
  }

  body .font-body-lg,
  body .text-body-lg {
    font-size: clamp(0.9375rem, calc(0.9rem + 0.25vw), 1.0625rem);
    line-height: 1.6;
  }

  body .font-body-md,
  body .text-body-md {
    font-size: clamp(0.9375rem, calc(0.9rem + 0.15vw), 1rem);
    line-height: 1.55;
  }

  body .font-button-text,
  body .text-button-text {
    font-size: 0.875rem;
    line-height: 1.2;
  }

  body .font-label-caps,
  body .text-label-caps {
    font-size: 0.75rem;
    line-height: 1.25;
  }

  body .p-component-padding {
    padding: clamp(1.25rem, 3vw, 1.75rem);
  }

  .inner-page-hero .grid.gap-10,
  .inner-page-hero .grid.gap-12 {
    gap: clamp(1.25rem, 3.5vw, 2rem);
  }

  .inner-page-hero .space-y-5 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1rem;
    margin-bottom: 0;
  }

  .inner-page-hero .space-y-6 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1rem;
    margin-bottom: 0;
  }

  .inner-page-hero .space-y-8 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1.25rem;
    margin-bottom: 0;
  }

  .inner-page-hero .mt-6 {
    margin-top: 1rem;
  }

  .inner-page-hero .mb-6 {
    margin-bottom: 1rem;
  }

  .inner-page-hero .mt-8 {
    margin-top: 1.25rem;
  }

  .inner-page-hero .mb-8 {
    margin-bottom: 1.25rem;
  }

  .py-section-padding .space-y-10 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1.5rem;
    margin-bottom: 0;
  }

  .py-section-padding .space-y-12 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 2rem;
    margin-bottom: 0;
  }

  .py-section-padding .mb-16 {
    margin-bottom: 2rem;
  }

  .py-section-padding .mb-14 {
    margin-bottom: 1.75rem;
  }

  .py-section-padding .mb-12 {
    margin-bottom: 1.5rem;
  }

  .py-section-padding .mb-10 {
    margin-bottom: 1.25rem;
  }

  .py-section-padding .mt-16 {
    margin-top: 2rem;
  }

  .py-section-padding .mt-12 {
    margin-top: 1.5rem;
  }

  .inner-page-hero h1,
  .inner-page-hero h2,
  .inner-page-hero h3,
  .inner-page-hero p {
    text-wrap: balance;
  }

  footer .max-w-container-max.mx-auto {
    gap: clamp(1.25rem, 2.5vw, 2rem);
  }

  footer img {
    height: 2.75rem;
    width: auto;
  }
}

/* Inner page heroes retain their desktop composition while using a clear,
   left-aligned reading flow on phones.  The selectors intentionally outrank
   the generated utility classes without relying on !important. */
@media (max-width: 767.98px) {
  body .inner-page-hero {
    text-align: left;
  }

  body .inner-page-hero.inner-page-hero--centered {
    justify-content: flex-start;
  }

  body .inner-page-hero__content--centered,
  body .inner-page-hero__content .text-center {
    text-align: left;
  }

  body .inner-page-hero__content.flex.flex-col.items-center,
  body .inner-page-hero__content--centered.flex.flex-col.items-center {
    align-items: flex-start;
  }

  body .inner-page-hero__content .flex.flex-wrap.justify-center,
  body .inner-page-hero__actions {
    justify-content: flex-start;
  }

  body .inner-page-hero__actions {
    align-items: flex-start;
    width: auto;
    max-width: 100%;
  }

  body .inner-page-hero__actions > a {
    display: inline-flex;
    align-self: flex-start;
    width: auto;
    max-width: 100%;
  }
}

@media (min-width: 1024px) {
  .inner-page-hero {
    padding-block: 5rem;
  }

  .py-section-padding {
    padding-block: 5rem;
  }

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

@media (prefers-reduced-motion: reduce) {
  .industry-solution-card,
  .industry-solution-card:hover,
  .industry-solution-card:focus-visible {
    transform: none;
  }
}
