@font-face {
  font-family: 'DM Serif Display';
  src: url('../assets/DMSerifDisplay-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Manrope;
  src: url('../assets/Manrope-wght.ttf') format('truetype');
  font-weight: 200 800;
  font-display: swap;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--white);
  color: var(--navy);
  font: var(--body-weight) var(--body-size)/1.64 var(--sans);
}
h1, h2, h3, p, figure { margin: 0; }
h1, h2 {
  font: 400 var(--h2-size)/1.12 var(--serif);
  letter-spacing: -.023em;
  text-wrap: balance;
}
h1 { font-size: var(--h1-size); line-height: 1.07; }
h3 { font-size: 23px; line-height: 1.26; font-weight: 750; text-wrap: balance; }
p { max-width: 65ch; }
p + p { margin-top: 14px; }
:is(h1,h2,h3) + p { margin-top: 20px; }
strong { font-weight: 750; }
a { color: inherit; text-underline-offset: .22em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible, .demo-focus input {
  outline: var(--focus-width) solid var(--navy);
  outline-offset: 3px;
}
.site-footer :focus-visible { outline-color: var(--white); }
.container {
  width: min(var(--container), calc(100% - 2 * var(--gutter)));
  margin-inline: auto;
}
.section { padding-block: var(--section-space); }
.warm { background: var(--warm); }
.split > .container, .feature-pair {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: var(--gap);
  align-items: center;
}
.site-header { border-bottom: 1px solid var(--line); }
.nav-inner {
  min-height: 84px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.wordmark { font-size: 25px; font-weight: var(--brand-weight); letter-spacing: -.054em; text-decoration: none; white-space: nowrap; }
.nav-inner nav { display: flex; align-items: center; gap: clamp(13px, 1.42vw, 22px); }
.nav-inner nav a {
  position: relative;
  font-size: 13px;
  font-weight: var(--nav-weight);
  white-space: nowrap;
  text-decoration: none;
  padding-block: 9px;
}
.nav-inner nav a:is(:hover,[aria-current])::after {
  content: "";
  position: absolute;
  inset: auto 0 3px;
  height: 2px;
  background: var(--navy);
}
.nav-cta[aria-current] { text-decoration: underline; text-underline-offset: .28em; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: var(--button-height);
  max-width: 100%;
  padding: 10px 18px;
  border: 1px solid var(--navy);
  border-radius: var(--button-radius);
  font: var(--button-weight) 14px/1.3 var(--sans);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.button.primary { background: var(--navy); color: var(--white); }
.button.primary:hover:not(:disabled) { background: #35485E; }
.button.secondary { background: transparent; color: var(--navy); }
.button.secondary:hover { background: var(--warm); }
.button.nav-cta { white-space: nowrap; font-size: 13px; }
.text-link { font-size: 15px; font-weight: var(--button-weight); text-decoration: underline; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 24px; }
.hero-copy > p:first-child, .editorial-heading > p {
  display: inline-block;
  margin-bottom: 20px;
  font-size: 14px;
}
.hero-copy > p:first-child { border-bottom: 2px solid var(--sage); padding-bottom: 7px; }
.hero-copy > p:nth-last-of-type(1) { margin-top: 20px; }
.home-hero > .container { grid-template-columns: minmax(0, .91fr) minmax(0, 1.09fr); gap: clamp(30px, 3.2vw, 46px); }
.photo {
  position: relative;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--warm);
}
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.home-photo { aspect-ratio: 728 / 482; }
.home-photo img { object-position: center; }
.photo[data-showcase] img { object-fit: contain; }
.solution-opening > .container { row-gap: 16px; }
.solution-opening .solution-showcase {
  grid-column: 1 / -1;
  width: min(100%, 1060px);
  aspect-ratio: 1080 / 380;
  justify-self: center;
}
.solution-opening > .container > .actions {
  grid-column: 2;
  margin-top: 0;
}
.asset-intro .reading { border-left: 3px solid var(--sage); padding-left: 32px; }
.reading { max-width: 790px; margin-inline: auto; }
.asset-intro h2 { text-wrap: pretty; }
.process h2, .product-area h2, .principles h2 { margin-bottom: 34px; }
.flow { margin: 0; padding: 0; list-style: none; }
.flow-horizontal { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.flow-horizontal > li { border-top: 1px solid var(--slate); padding: 24px 28px 5px 0; }
.flow-horizontal > li + li { border-left: 1px solid var(--line); padding-left: 28px; }
.ordinal {
  display: block;
  width: max-content;
  color: var(--navy);
  background: var(--tint);
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .05em;
  border-radius: 4px;
  padding: 8px;
  margin-bottom: 14px;
}
.flow-result { margin-top: 27px; padding: 14px 18px; border-left: 3px solid var(--sage); }
.flow-result p { max-width: 85ch; }
.flow-vertical > li {
  display: grid;
  grid-template-columns: 54px minmax(0,.38fr) minmax(0,.62fr);
  gap: 26px;
  align-items: start;
  padding-block: 24px;
  border-top: 1px solid var(--line);
}
.flow-vertical > li:last-child { border-bottom: 1px solid var(--line); }
.flow-vertical h3 { padding-top: 3px; }
.flow-copy p { max-width: 60ch; }
.product-grid { display: grid; grid-template-columns: minmax(0,1.16fr) minmax(0,.84fr); gap: 22px; }
.custom-products .product-grid { grid-template-columns: minmax(0,.84fr) minmax(0,1.16fr); }
.product-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(25px, 3vw, 38px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}
.product-card.featured { background: var(--tint); border: 1px solid var(--sage); border-top: 4px solid var(--navy); }
.product-card h3 { font: 400 33px/1.12 var(--serif); }
.product-label { color: var(--stone); font-size: 14px; font-weight: 750; margin-bottom: 9px; }
.product-card ul { margin: 12px 0; padding-left: 21px; }
.product-card li + li { margin-top: 4px; }
.product-card .actions { margin-top: auto; padding-top: 20px; }
.page-home .product-area { padding-bottom: 54px; }
.final-cta { text-align: center; padding-block: 62px; }
.final-cta h2, .final-cta p { margin-inline: auto; }
.final-cta h2 { max-width: 880px; }
.final-cta .actions { justify-content: center; }
.editorial-opening > .container, .starter > .container, .growth-close > .container { align-items: start; }
.editorial-opening > .container { grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr); }
.editorial-opening > .container > :last-child { padding-top: 9px; }
.editorial-opening ul { padding-left: 22px; margin: 12px 0 0; }
.starter h2, .growth-close h2 { text-wrap: pretty; }
.starter .button.secondary:hover { background: var(--white); }
.custom-opening { padding-block: 68px; }
.custom-features article + article { margin-top: 62px; padding-top: 62px; border-top: 1px solid var(--line); }
.feature-pair.reverse .photo { grid-column: 2; grid-row: 1; }
.feature-pair.reverse .feature-copy { grid-column: 1; grid-row: 1; }
.showcase-services,.archive { grid-template-columns: minmax(0,1.11fr) minmax(0,.89fr); gap: 56px; }
.showcase-services .photo { aspect-ratio: 660 / 456; }
.archive .photo { aspect-ratio: 660 / 462; }
.feature-kicker { font: 750 15px/1.4 var(--sans); letter-spacing: 0; }
.feature-statement { font: 400 clamp(31px, 2.8vw, 40px)/1.13 var(--serif); margin: 12px 0 17px; text-wrap: balance; }
.feature-statement strong { font-weight: 400; }
.custom-products > .container > .actions { justify-content: flex-end; }
.growth-intro { text-align: center; }
.growth-intro p { margin-inline: auto; }
.growth-feature { padding-block: 66px; }
.growth-feature h3 { margin-top: 24px; font-size: 19px; }
.growth-feature h3 + p { margin-top: 10px; }
.feature-type { align-items: start; }
.connected-copy .feature-statement { margin-bottom: 0; }
.handoff-copy > :last-child {
  border-left: 1px solid var(--sage);
  padding-left: 26px;
  margin-top: 5px;
}
.growth-feature .handoff-copy h3 { margin-top: 0; }
.coordination .photo { aspect-ratio: 660 / 420; }
.coordination { grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: 56px; }
.appointment-note { margin-top: 19px; border-left: 3px solid var(--sage); padding: 10px 14px; background: var(--warm); font-weight: 650; }
.about-opening > .container { grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); }
.about-opening > .container > :last-child { border-top: 2px solid var(--sage); padding-top: 18px; }
.principles { padding-bottom: 61px; }
.site-footer { background: var(--navy); color: var(--white); padding-block: 44px; }
.footer-inner { display: grid; grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr); gap: var(--gap); }
.footer-inner p { color: #E2E7EA; margin-top: 9px; font-size: 14px; }
.footer-inner nav, .footer-contact { display: flex; flex-wrap: wrap; gap: 9px 19px; font-size: 14px; }
.footer-inner nav a:not([aria-current]) { text-decoration: none; }
.footer-inner nav a:hover { text-decoration: underline; }
.footer-contact { margin-top: 18px; padding-top: 13px; border-top: 1px solid var(--slate); }
.contact-opening { padding-block: 48px 40px; }
.contact-opening h1 { max-width: 1000px; text-wrap: pretty; }
.contact-main { padding-block: 28px 64px; }
.contact-grid {
  display: grid;
  grid-template-columns: minmax(0,65fr) minmax(0,35fr);
  align-items: start;
  gap: clamp(30px, 3.5vw, 50px);
}