/* =========================
   Subpage hero / About / Contact / 404
   ========================= */


.subpage-hero {
  position: relative;
  min-height: 72vh;
  margin-top: -86px;
  padding: 190px 20px 92px;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
}


.subpage-bg,
.subpage-bg img,
.not-found-bg,
.not-found-bg img,
.contact-image-bg,
.contact-image-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}


.subpage-bg img,
.not-found-bg img,
.contact-image-bg img {
  object-fit: cover;
  filter: saturate(.9) contrast(1.04);
  transform: scale(1.02);
}


.subpage-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(10,10,10,.72), rgba(10,10,10,.34) 48%, rgba(10,10,10,.1)),
    linear-gradient(180deg, rgba(10,10,10,.24), rgba(10,10,10,.54));
}


.subpage-bg {
  z-index: -2;
}


.subpage-inner {
  width: min(var(--max), 100%);
  margin: 0 auto;
  color: #fff;
}


.subpage-inner h1 {
  max-width: 940px;
  margin-bottom: 24px;
  color: #fff;
}


.subpage-inner p:not(.eyebrow) {
  max-width: 660px;
  margin-bottom: 0;
  color: rgba(255,255,255,.76);
  font-size: 17px;
  line-height: 1.75;
}


.subpage-inner .eyebrow {
  color: rgba(255,255,255,.82);
}




/* About page */


.about-signature {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
  gap: 64px;
  align-items: center;
}


.about-signature-copy h2 {
  margin-bottom: 24px;
}


.about-signature-copy p {
  max-width: 620px;
}


.about-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 34px;
}


.about-metrics div {
  padding: 18px;
  border: 1px solid var(--line-soft);
  border-radius: 20px;
  background: rgba(255,255,255,.66);
}


.about-metrics span {
  display: block;
  margin-bottom: 6px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
}


.about-metrics strong {
  display: block;
  font-size: 13px;
  line-height: 1.35;
}


.about-signature-image {
  position: relative;
  min-height: 560px;
  border-radius: 34px;
  overflow: hidden;
  box-shadow: var(--shadow);
}


.about-signature-image img {
  width: 100%;
  height: 100%;
  min-height: 560px;
  object-fit: cover;
}


.about-dark-band {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 104px 20px;
  background:
    radial-gradient(circle at 14% 0%, rgba(155,122,75,.24), transparent 34rem),
    #151515;
  color: #fff;
}


.about-dark-inner {
  width: min(var(--max), 100%);
  margin: 0 auto;
}


.about-dark-inner h2 {
  max-width: 780px;
  color: #fff;
}


.section-kicker.light {
  color: rgba(234,223,206,.86);
}


.about-standard-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 48px;
}


.about-standard-grid article {
  padding: 30px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 26px;
  background: rgba(255,255,255,.055);
  backdrop-filter: blur(18px);
}


.about-standard-grid span {
  display: block;
  margin-bottom: 44px;
  color: rgba(234,223,206,.72);
  font-size: 12px;
  letter-spacing: .16em;
}


.about-standard-grid h3 {
  color: #fff;
}


.about-standard-grid p {
  margin-bottom: 0;
  color: rgba(255,255,255,.64);
}


.cred-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 38px;
}


.cred-grid article {
  padding: 30px;
  border: 1px solid var(--line-soft);
  border-radius: 26px;
  background: rgba(255,255,255,.66);
  box-shadow: 0 18px 50px rgba(18,18,18,.045);
}


.cred-grid span {
  display: block;
  margin-bottom: 18px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .14em;
  text-transform: uppercase;
}


.cred-grid p {
  margin-bottom: 0;
}


.about-service-strip {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 60px;
  align-items: start;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}


.service-strip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}


.service-strip-list span {
  padding: 11px 15px;
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  background: rgba(255,255,255,.62);
  color: var(--muted);
  font-size: 13px;
}


.cta-card-wide {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 30px;
  align-items: end;
}


.cta-card-wide .eyebrow,
.cta-card-wide h2,
.cta-card-wide p {
  grid-column: 1;
}


.cta-actions {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: flex;
  gap: 12px;
  align-self: center;
  flex-wrap: wrap;
}




/* Contact page */


.contact-lead-section {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(360px, .78fr);
  gap: 54px;
  align-items: start;
}


.contact-lead-copy h2 {
  margin-bottom: 24px;
}


.contact-lead-copy p {
  max-width: 650px;
}


.contact-card-pro {
  padding: 32px;
  border: 1px solid var(--line-soft);
  border-radius: 30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.56));
  box-shadow: var(--shadow);
}


.contact-card-top {
  padding-bottom: 24px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--line-soft);
}


.contact-card-top span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .16em;
  text-transform: uppercase;
}


.contact-card-top p {
  margin: 10px 0 0;
  font-size: 13px;
}


.contact-methods-pro {
  display: grid;
  gap: 12px;
}


.contact-methods-pro a,
.contact-methods-pro div {
  display: block;
  padding: 18px;
  border: 1px solid var(--line-soft);
  border-radius: 20px;
  background: rgba(255,255,255,.72);
  transition: transform .25s ease, border-color .25s ease;
}


.contact-methods-pro a:hover {
  transform: translateY(-2px);
  border-color: rgba(155,122,75,.34);
}


.contact-methods-pro span {
  display: block;
  margin-bottom: 6px;
  color: var(--soft);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .13em;
  text-transform: uppercase;
}


.contact-methods-pro strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
  word-break: break-word;
}


.contact-info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  padding-top: 10px;
}


.contact-info-card {
  padding: 26px;
  border: 1px solid var(--line-soft);
  border-radius: 26px;
  background: rgba(255,255,255,.62);
}


.contact-info-card span {
  display: block;
  margin-bottom: 46px;
  color: var(--accent);
  font-size: 12px;
  letter-spacing: .16em;
}


.contact-info-card p {
  margin-bottom: 0;
  font-size: 14px;
}


.contact-image-feature {
  position: relative;
  min-height: 560px;
  margin: 30px 0 0;
  padding: 100px 20px;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
}


.contact-image-bg {
  z-index: -2;
}


.contact-image-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(12,12,12,.78), rgba(12,12,12,.42), rgba(12,12,12,.12)),
    linear-gradient(180deg, rgba(12,12,12,.1), rgba(12,12,12,.56));
}


.contact-image-inner {
  width: min(var(--max), 100%);
  margin: 0 auto;
  color: #fff;
}


.contact-image-inner h2 {
  max-width: 820px;
  color: #fff;
}


.contact-image-inner p:not(.eyebrow) {
  max-width: 620px;
  color: rgba(255,255,255,.72);
}


.contact-feature-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}


.contact-bottom-note {
  display: grid;
  grid-template-columns: .8fr 1fr;
  gap: 60px;
  align-items: start;
}


.contact-bottom-note ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
}


.contact-bottom-note li {
  padding: 16px 18px;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: rgba(255,255,255,.58);
  color: var(--muted);
}




/* 404 */


.not-found-page {
  position: relative;
  min-height: 86vh;
  margin-top: -86px;
  padding: 190px 20px 110px;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
}


.not-found-bg {
  z-index: -2;
}


.not-found-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 50% 0%, rgba(155,122,75,.28), transparent 34rem),
    linear-gradient(180deg, rgba(10,10,10,.62), rgba(10,10,10,.78));
}


.not-found-inner {
  width: min(820px, 100%);
  margin: 0 auto;
  text-align: center;
  color: #fff;
}


.not-found-inner .eyebrow {
  justify-content: center;
  color: rgba(255,255,255,.82);
}


.not-found-inner h1 {
  color: #fff;
}


.not-found-inner p {
  max-width: 620px;
  margin: 0 auto 28px;
  color: rgba(255,255,255,.72);
}


.hero-actions.centered {
  justify-content: center;
}


.not-found-contact {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  color: rgba(255,255,255,.68);
  font-size: 13px;
}


.not-found-contact span {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: currentColor;
  opacity: .55;
}




/* Mobile */


@media (max-width: 920px) {
  .about-signature,
  .about-service-strip,
  .contact-lead-section,
  .contact-bottom-note,
  .cta-card-wide {
    grid-template-columns: 1fr;
  }


  .cta-card-wide .eyebrow,
  .cta-card-wide h2,
  .cta-card-wide p,
  .cta-actions {
    grid-column: auto;
    grid-row: auto;
  }


  .about-standard-grid,
  .cred-grid,
  .contact-info-grid {
    grid-template-columns: 1fr 1fr;
  }


  .about-signature-image,
  .about-signature-image img {
    min-height: 420px;
  }
}


@media (max-width: 620px) {
  .subpage-hero,
  .not-found-page {
    margin-top: -112px;
    padding-top: 210px;
  }


  .subpage-inner p:not(.eyebrow) {
    font-size: 15px;
  }


  .about-metrics,
  .about-standard-grid,
  .cred-grid,
  .contact-info-grid {
    grid-template-columns: 1fr;
  }


  .contact-card-pro,
  .about-standard-grid article,
  .cred-grid article,
  .contact-info-card {
    padding: 24px;
  }


  .contact-image-feature {
    min-height: 520px;
    padding: 78px 20px;
  }


  .not-found-contact {
    flex-direction: column;
  }


  .not-found-contact span {
    display: none;
  }
}

