/* Shared identity, contact section and navigation across all static routes. */
:root { --color-accent-lit: #bce4bd; }
.band-dark-lift { background: #14231f; }
.sj-contact h2 {
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -.045em;
}
.sj-contact__kicker { font-size: .62rem; line-height: 1.6; }
.sj-contact__kicker + h2 { margin-top: 1rem; }
.sj-contact__button,
.sj-contact__email {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 3.3rem;
  font-size: .9rem;
}
.sj-contact__button { padding: .85rem 1.35rem; border-radius: 4px; background: #bce4bd; color: #14231f; font-weight: 500; }
.sj-contact__button:is(:hover, :focus-visible) { background: #d6f0d7; }
.sj-contact__email:hover { text-decoration: underline; text-underline-offset: .3em; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
main [id] { scroll-margin-top: 6rem; }
.sj-menu-sheet { visibility: hidden; }
.sj-menu-state:checked ~ .sj-menu-sheet { visibility: visible; }
@media (min-width: 48rem) {
  .sj-menu-state { display: none; }
}
.sj-service-index {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.5rem;
  padding-bottom: 3rem;
}
.sj-service-index > a {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  border-top: 1px solid #3b5145;
  padding-block: 1.2rem;
  min-width: 0;
}
.sj-service-index > a > .label-mono { color: #a9b6af; font-size: .6rem; }
.sj-service-index strong { display: block; font-size: .95rem; font-weight: 400; }
.sj-service-index strong + span { display: block; margin-top: .4rem; font-size: .78rem; line-height: 1.6; color: #a9b6af; }
.sj-service-index > a > span:last-child { margin-left: auto; color: #bce4bd; }
.sj-service-index > a:is(:hover, :focus-visible) strong { color: #bce4bd; }
.sj-example-note { margin-bottom: 1rem; font-size: .7rem; line-height: 1.6; color: var(--color-slate); }
.sj-case-example-note { margin-block: .8rem 1.5rem; font-size: .78rem; line-height: 1.7; color: var(--color-slate); }
@media (prefers-reduced-motion: no-preference) {
  .sj-contact__button { transition: background-color 180ms, translate 250ms; }
  .sj-contact__button > span[aria-hidden],
  .sj-contact__email > span[aria-hidden],
  .sj-service-index > a > span:last-child { display: inline-block; transition: translate 250ms; }
  .sj-contact__button:focus-visible > span[aria-hidden],
  .sj-contact__email:focus-visible > span[aria-hidden],
  .sj-service-index > a:focus-visible > span:last-child { translate: 3px -3px; }
  @media (hover: hover) and (pointer: fine) {
    .sj-contact__button:hover { translate: 0 -2px; }
    .sj-contact__button:hover > span[aria-hidden],
    .sj-contact__email:hover > span[aria-hidden],
    .sj-service-index > a:hover > span:last-child { translate: 3px -3px; }
  }
}
.sj-brand-lockup { display: inline-flex; align-items: center; gap: .7rem; min-height: 44px; }
.sj-brand-lockup__mark {
  display: grid;
  grid-auto-flow: column;
  place-content: center;
  width: 39px;
  height: 39px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-size: 1.6rem;
  letter-spacing: -.1em;
  padding-right: .1em;
}
.sj-brand-lockup__mark > span { opacity: .6; }
.sj-brand-lockup__type { display: grid; gap: .28rem; }
.sj-brand-lockup__name { font-size: 1rem; font-weight: 500; letter-spacing: -.035em; line-height: 1.1; }
.sj-brand-lockup__name > span { opacity: .55; }
.sj-brand-lockup__role { font-size: .55rem; letter-spacing: .075em; line-height: 1.4; opacity: .7; }

.sj-contact { --hero-accent: #bce4bd; padding-block: clamp(3.5rem, 6.5vw, 6rem); background: #14231f; color: #fbfaf8; }
.sj-contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5rem; align-items: center; }
.sj-contact .sj-contact__kicker { color: #bce4bd; }
.sj-contact__copy > p:first-child { max-width: 29rem; font-size: 1rem; line-height: 1.8; color: #c0cbc5; }
.sj-contact__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.75rem; margin-top: 1.8rem; }
.sj-contact .sj-contact__email { color: #fbfaf8; }
.sj-contact__note { margin-top: 1.4rem; color: #a9b6af; font-size: .72rem; line-height: 1.7; }
@media (max-width: 63.99rem) {
  .sj-brand-lockup__role { display: none; }
  .sj-brand-lockup__name { font-size: .9rem; }
  .sj-contact__grid { gap: 3rem; }
}
@media (max-width: 47.99rem) {
  .sj-brand-lockup__role { display: block; font-size: .5rem; letter-spacing: .025em; }
  .sj-brand-lockup__mark { width: 34px; height: 34px; font-size: 1.35rem; }
  .sj-contact__grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .sj-service-index { grid-template-columns: minmax(0, 1fr); }
}
