/* Contact-only refinements loaded after inner-contact-tree.css. */
body.contact-page .contact-email-copy { display:none!important; }
body.contact-page .lede .ch {
  position: relative;
  animation: none !important;
  opacity: 0;
  transition: opacity .12s ease-out !important;
}
body.contact-page .lede .ch.is-typed { opacity: 1; }
body.contact-page .contact-email-address.is-copied { color:var(--tree-accent); font-weight:700; outline:none; }
@media (prefers-reduced-motion: reduce) {
 body.contact-page .lede .ch { opacity:1; transition:none !important; }
}

/* The pen tip lives inside the current character and never occupies line width. */
body.contact-page .lede .ch > .caret {
  position: absolute;
  z-index: 1;
  top: 0.17em;
  right: -0.08em;
  display: block;
  width: 2px;
  height: 0.98em;
  margin: 0;
  pointer-events: none;
}


/* Share the company heading height; contact details flow independently. */
html[lang] body.contact-page .office,
html[lang] body.contact-page .office h2,
html[lang] body.contact-page .office dl,
html[lang] body.contact-page .office dt,
html[lang] body.contact-page .office dd { min-width: 0; }
html[lang] body.contact-page .office .tabular { white-space: normal; }
html[lang] body.contact-page .office dd,
html[lang] body.contact-page .contact-email-address { overflow-wrap: anywhere; }
html[lang="en"] body.contact-page .office dl > div {
  grid-template-columns: 4.4rem minmax(0, 1fr);
  column-gap: .6rem;
}
/* Align each label to the first text baseline, including multi-line addresses. */
html[lang] body.contact-page .office dl > div { align-items: baseline; }
html[lang] body.contact-page .office dt,
html[lang] body.contact-page .office dd { align-self: baseline; }

/* Full-width details on laptops/tablets; the tree and opening copy stay above. */
@media (min-width: 601px) and (max-width: 1199px) {
  html[lang] body.contact-page .ct-plate-body {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-content: center;
    row-gap: clamp(24px, 4vw, 40px);
  }
  html[lang] body.contact-page .plate {
    grid-column: 1 / 6; grid-row: 1;
    width: min(100%, 340px); margin: 0 auto;
  }
  html[lang] body.contact-page .lede {
    grid-column: 6 / -1; grid-row: 1;
    align-self: center; margin: 0;
    font-size: clamp(22px, 2.3vw, 28px);
  }
  html[lang] body.contact-page .ct-context {
    grid-column: 1 / -1; grid-row: 2; margin: 0;
  }
  html[lang] body.contact-page .offices { grid-column: 1 / -1; grid-row: 2; }
  html[lang] body.contact-page .ct-context:not([hidden]) ~ .offices { grid-row: 3; }
}

@media (min-width: 601px) {
  html[lang] body.contact-page .offices { column-gap: clamp(24px, 3.5vw, 48px); row-gap: 0; grid-template-rows: auto auto; }
  @supports (grid-template-rows: subgrid) {
    html[lang] body.contact-page .office {
      display: grid; grid-template-rows: subgrid;
      grid-row: 1 / span 2; row-gap: 0;
    }
    html[lang] body.contact-page .office:first-child { grid-column: 1; }
    html[lang] body.contact-page .office:nth-child(2) { grid-column: 2; }
    html[lang] body.contact-page .office dl {
      display: block; grid-row: 2; align-self: start;
    }
  }
  @supports not (grid-template-rows: subgrid) {
    html[lang] body.contact-page .offices { grid-template-rows: auto; }
    html[lang] body.contact-page .office,
    html[lang] body.contact-page .office dl { display: block; grid-row: auto; }
  }
}

@media (max-width: 600px) {
  html[lang] body.contact-page .offices { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; gap: 28px; }
  html[lang] body.contact-page .office,
  html[lang] body.contact-page .office dl { display: block; grid-row: auto; grid-column: auto; }
  html[lang] body.contact-page .office + .office { border-top: 1px solid var(--tree-rule); padding-top: 24px; }
  html[lang] body.contact-page .office h2 { margin-bottom: 16px; }
  html[lang] body.contact-page .office dl > div { padding-block: 10px; }
  html[lang] body.contact-page .office dl > div:first-child { padding-top: 0; }
  html[lang] body.contact-page .ct-sheet-foot a { max-width: 100%; white-space: normal; }
}
