/* Additions on top of the original site styles (site.css). */

[hidden] { display: none !important; }

/* ---- About Us: split hero with the leadership group photo ---- */
.hsus-split-hero { position: relative; isolation: isolate; overflow: hidden; }
.hsus-split-hero-photo { position: relative; aspect-ratio: 3 / 2; width: 100%; overflow: hidden; background: var(--hsus-color-panel); }
.hsus-split-hero-photo img { object-position: 50% 30%; }
.hsus-split-hero-inner { padding-top: var(--hsus-hero-content-top); padding-bottom: var(--hsus-hero-content-bottom); }
@media (min-width: 768px) {
  .hsus-split-hero { min-height: var(--hsus-hero-min-h-sm); }
  .hsus-split-hero-photo { position: absolute; inset: 0 auto 0 0; width: 50%; aspect-ratio: auto; }
  .hsus-split-hero-inner { display: flex; justify-content: flex-end; align-items: center; min-height: var(--hsus-hero-min-h-sm);
    padding-top: var(--hsus-hero-content-top-sm); padding-bottom: var(--hsus-hero-content-bottom-sm); }
  .hsus-split-hero-text { width: 50%; padding-left: 3rem; max-width: 560px; margin-left: auto; }
}
@media (min-width: 1024px) {
  .hsus-split-hero { min-height: var(--hsus-hero-min-h-lg); }
  .hsus-split-hero-inner { min-height: var(--hsus-hero-min-h-lg); padding-top: var(--hsus-hero-content-top-lg); padding-bottom: var(--hsus-hero-content-bottom-lg); }
  .hsus-split-hero-text { padding-left: 4rem; }
}
@media (min-width: 1440px) {
  .hsus-split-hero-text { width: auto; max-width: 560px; }
}

/* ---- Homepage: "how we work" statements ---- */
.hsus-statements { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .hsus-statements { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .hsus-statements > * { padding: 0 2rem; border-left: 1px solid var(--hsus-color-border); }
  .hsus-statements > *:first-child { padding-left: 0; border-left: 0; }
  .hsus-statements > *:last-child { padding-right: 0; } }


/* ---- Client references page ---- */
.hsus-reference-card blockquote { quotes: none; }

/* ---- Contact / assessment form status messages ---- */
.hsus-form-status { border: 1px solid var(--hsus-color-border); background: var(--hsus-color-panel); padding: 1rem; }
.hsus-quote-mark { display: block; font-size: 4rem; line-height: 1; height: 2.25rem; }

/* Utility classes the original markup referenced but its stylesheet never defined */
.bg-ink\/75 { background-color: rgb(28 27 25 / .75); }
.border-border { border-color: var(--hsus-color-border); }
.bg-border { background-color: var(--hsus-color-border); }
.text-body\/60 { color: rgb(74 72 68 / .6); }
.text-\[22px\] { font-size: 22px; }
.leading-\[1\.25\] { line-height: 1.25; }
@media (min-width: 640px) {
  .sm\:mt-14 { margin-top: 3.5rem; }
  .sm\:text-\[24px\] { font-size: 24px; }
  .sm\:text-\[26px\] { font-size: 26px; }
}
.skip-link:not(:focus) { top: -5rem; }

/* Profile pop-up: on larger screens the card fits the window and only the bio scrolls */
.hsus-profile-photo-frame { position: absolute; inset: 0; }
@media (min-width: 768px) {
  .hsus-profile-dialog { height: calc(100vh - 4rem); max-height: 860px; }
  .hsus-profile-dialog > div:last-child { overflow-y: auto; min-height: 0 !important; }
  .hsus-profile-photo { min-height: 0 !important; }
}

/* Quote bands: "Read the full quote" opens the client's complete statement in place */
.hsus-quote-full { display: flex; flex-direction: column; gap: .875rem; font-family: var(--font-serif); font-size: 1.0625rem; line-height: 1.55; color: rgb(254 253 251 / .9); }
.hsus-quote-full p { margin: 0; }
.hsus-quote-toggle { margin-top: .75rem; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0; background: none; border: 0; cursor: pointer;
  font-family: var(--font-sans); font-size: .875rem; font-weight: 600; color: var(--hsus-color-paper); }
.hsus-quote-toggle:hover { text-decoration: underline; text-underline-offset: 4px; }
.hsus-quote-toggle:focus-visible { outline: 2px solid var(--hsus-color-accent); outline-offset: 2px; }
.hsus-quote-toggle span { color: #e8683f; font-size: 1.125rem; line-height: 1; }

/* Logo: trimmed image, shown larger in the header and footer */
.hsus-logo { height: 52px; transition: height var(--hsus-duration-1, .15s) ease; }
.hsus-logo.hsus-logo--small { height: 42px; }
.hsus-logo-footer { height: 56px; }
@media (max-width: 639.98px) { .hsus-logo { height: 44px; } .hsus-logo.hsus-logo--small { height: 38px; } }