/* V10.22 — final visual polish */

/* About page: a smaller, better-focused photograph that supports the copy. */
.page-about .about-introduction-grid {
  grid-template-columns: minmax(300px, .58fr) minmax(0, 1.42fr) !important;
  gap: clamp(50px, 6vw, 88px) !important;
}
.page-about .about-office-figure {
  width: 100%;
  max-width: 390px;
  justify-self: center;
}
.page-about .about-office-figure::before {
  inset: 18px -14px -16px 18px !important;
}
.page-about .about-office-figure picture {
  border-radius: 20px !important;
}
.page-about .about-office-figure img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 38 / 49 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Contact page: ensure the secondary call action is visible on the pale card. */
.page-contact .office-visit-actions .btn.outline-dark {
  color: #073f34 !important;
  background: #fff !important;
  border-color: #b89b58 !important;
}
.page-contact .office-visit-actions .btn.outline-dark:hover {
  color: #fff !important;
  background: #073f34 !important;
  border-color: #073f34 !important;
}

/* Insights authors: match Tomás's image to the circular initials badges. */
.blog-author-badge img {
  display: block !important;
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center 28% !important;
  border: 2px solid rgba(184, 155, 88, .42);
  box-shadow: 0 10px 22px rgba(0, 61, 50, .14);
}
.blog-author-grid article > span {
  margin-right: 12px !important;
}

@media only screen and (max-width: 1050px) {
  .page-about .about-introduction-grid {
    grid-template-columns: 1fr !important;
  }
  .page-about .about-office-figure {
    max-width: 380px;
  }
}

@media only screen and (max-width: 760px) {
  .page-about .about-office-figure {
    max-width: 330px !important;
  }
  .page-about .about-office-figure::before {
    inset: 12px -8px -10px 12px !important;
  }
  .page-contact .office-visit-actions .btn {
    width: 100% !important;
  }
}
