@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/montserrat-variable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: 'DM Sans';
  src: url('../fonts/dm-sans-variable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
}

:root {
  --font-ui: 'Montserrat', 'Segoe UI', sans-serif;
  --font-heading: 'DM Sans', 'Montserrat', sans-serif;
}

body,
button,
input,
select,
textarea{
  font-family: var(--font-ui);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
}

body :is(.hero-shell, main, footer, dialog) :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--font-heading);
  font-weight: 700;
}
.header nav > .nav-list > li > a,
.nav-services > summary,
.header .nav-card-copy strong,
button,
.studio-sections button,
.button,
.menu-toggle {
  font-family: var(--font-heading);
  font-weight: 600;
}
.journey-copy h1 { letter-spacing: 0; line-height: 1.08; }
.journey-copy > p,
.h3-description,
.workflow p,
.team-copy p,
.page-card p,
.page-statement,
.page-lead {
  font-family: var(--font-ui);
  font-weight: 400;
  line-height: 1.7;
}

.journey-copy > p { font-weight: 500; }