/* The Probricks company story, using the site's existing type and palette. */
.company-hero { background: #eae6da; }
.company-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-width: 1500px; margin: 0 auto; }
.company-hero-copy { align-self: center; padding: 66px 11% 66px 14%; }
.company-hero h1 { font-size: clamp(58px, 5.8vw, 86px); line-height: 1.03; letter-spacing: -1.2px; }
.company-hero h1 em { color: #747c61; }
.company-hero-copy > p:not(.eyebrow) { font-size: 18px; line-height: 1.8; margin: 27px 0 30px; max-width: 520px; }
.company-hero-image { margin: 0; position: relative; min-height: 610px; }
.company-hero-image > img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.company-hero-image > figcaption { position: absolute; bottom: 23px; left: 25px; right: 25px; width: fit-content; padding: 8px 13px; background: #f6f3eced; color: #344437; font-size: 13px; }
.company-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 9%; }
.company-story h2, .company-values h2, .company-services h2, .company-local h2 { font-size: clamp(44px, 4.5vw, 61px); line-height: 1.08; letter-spacing: -.7px; }
.company-story h2 em, .company-services h2 em { color: #7e7c62; }
.company-story-copy > p { font-size: 18px; line-height: 1.85; margin-bottom: 24px; }
.company-director { border-top: 1px solid var(--line); margin-top: 34px; padding-top: 28px; }
.company-director .eyebrow { margin-bottom: 13px; }
.company-director h3 { font-size: 34px; line-height: 1.2; }
.company-director > p:last-child { font-size: 17px; line-height: 1.8; margin-top: 16px; }
.company-values { padding: 80px 0; background: var(--navy); color: #f6f2e7; }
.company-values h2 em { color: #d4bf95; }
.company-values-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin-top: 42px; }
.company-values article { border-top: 1px solid #7c8d7d; padding-top: 26px; }
.company-values article > span { display: block; font-size: 13px; color: #d4bf95; margin-bottom: 21px; letter-spacing: 1px; }
.company-values h3 { font-size: 32px; }
.company-values article p { color: #d4dbcf; font-size: 17px; line-height: 1.8; margin-top: 17px; }
.company-services-heading { margin-bottom: 36px; }
.company-service-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 54px; }
.company-service-links > a { display: grid; grid-template-columns: 1fr 24px; gap: 20px; align-items: start; padding: 28px 0; border-top: 1px solid var(--line); }
.company-service-links > a:hover h3 { color: #897343; }
.company-service-links h3 { font-size: 34px; line-height: 1.15; }
.company-service-links p { font-size: 17px; line-height: 1.8; margin-top: 15px; }
.company-service-links > a > span { font-size: 23px; color: #8b7851; }
.company-local { padding: 65px 0; background: #e8e8dd; text-align: center; }
.company-local p:not(.eyebrow) { font-size: 18px; line-height: 1.8; max-width: 700px; margin: 23px auto 28px; }
.company-page .button { text-transform: none; font-size: 16px; letter-spacing: .2px; }
.company-page .contact h2 { font-size: clamp(49px, 5vw, 68px); }
.company-story .eyebrow, .company-services .eyebrow, .company-local .eyebrow { font-size: 13px; }

@media (max-width: 1100px) {
  .company-hero-copy { padding: 50px 10%; }
  .company-hero h1 { font-size: 62px; }
  .company-hero-image { min-height: 580px; }
  .company-values-grid { gap: 27px; }
}
@media (max-width: 900px) {
  .company-hero-grid { grid-template-columns: 1fr; }
  .company-hero-copy { padding: 46px 5% 50px; }
  .company-hero-copy > p:not(.eyebrow) { max-width: 650px; }
  .company-hero-image { min-height: 0; aspect-ratio: 16 / 9; }
  .company-story { grid-template-columns: 1fr; gap: 30px; }
  .company-story-copy { max-width: 740px; }
  .company-values-grid { grid-template-columns: 1fr; gap: 30px; }
  .company-service-links { gap: 0 30px; }
}
@media (max-width: 600px) {
  .company-hero-copy { padding: 38px 22px 43px; }
  .company-hero h1 { font-size: clamp(48px, 12vw, 67px); letter-spacing: -.8px; }
  .company-hero-copy > p:not(.eyebrow), .company-story-copy > p { font-size: 17px; }
  .company-hero-image { aspect-ratio: 4 / 3; }
  .company-hero-image > figcaption { font-size: 12px; left: 20px; bottom: 18px; }
  .company-story h2, .company-values h2, .company-services h2, .company-local h2 { font-size: clamp(40px, 10.5vw, 50px); }
  .company-values { padding: 60px 0; }
  .company-service-links { grid-template-columns: 1fr; }
  .company-service-links h3 { font-size: 32px; }
  .company-local { padding: 55px 0; }
  .company-local p:not(.eyebrow) { font-size: 17px; }
  .company-hero-copy .button, .company-local .button { width: 100%; }
}
