:root {
  --font-display: "Plus Jakarta Sans", "Segoe UI", sans-serif;
  --font-body: "Manrope", "Segoe UI", sans-serif;
}

html {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-body);
  font-optical-sizing: auto;
  font-size: 1rem;
  font-weight: 450;
  line-height: 1.72;
  letter-spacing: -0.006em;
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar-brand {
  font-family: var(--font-display);
  font-optical-sizing: auto;
  font-weight: 750;
  line-height: 1.13;
  letter-spacing: -0.032em;
  text-wrap: balance;
}

h3,
h4,
h5,
h6 {
  letter-spacing: -0.022em;
}

p,
li,
address,
.accordion-body {
  text-wrap: pretty;
}

.display-title {
  font-size: clamp(2.7rem, 5.4vw, 5rem);
  font-weight: 800;
  line-height: 1.035;
  letter-spacing: -0.058em;
}

.page-hero .display-title {
  max-width: 1050px;
  font-size: clamp(2.55rem, 5vw, 4.65rem);
}

.section-title {
  font-size: clamp(2rem, 3.6vw, 3.35rem);
  font-weight: 780;
  line-height: 1.08;
  letter-spacing: -0.046em;
}

.lead {
  font-size: clamp(1.08rem, 1.5vw, 1.24rem);
  font-weight: 500;
  line-height: 1.68;
  letter-spacing: -0.012em;
}

.section-intro {
  font-size: 1.035rem;
  line-height: 1.78;
}

.brand-name {
  font-family: var(--font-display);
  font-size: .96rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}

.brand-name small {
  font-family: var(--font-body);
  font-size: .61rem;
  font-weight: 750;
  letter-spacing: .135em;
}

.navbar-nav .nav-link,
.btn,
.form-label,
.accordion-button,
.tag,
.photo-badge,
.mobile-actions a {
  font-family: var(--font-body);
  font-weight: 750;
  letter-spacing: -0.014em;
}

.navbar-nav .nav-link {
  font-size: .92rem;
}

.btn {
  font-size: .93rem;
}

.eyebrow {
  font-family: var(--font-body);
  font-size: .73rem;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .115em;
}

.feature-card h3,
.course-card h3,
.skill-card h3,
.contact-card h2 {
  font-weight: 760;
}

.feature-card p,
.course-card p,
.skill-card p,
.contact-card p,
.placeholder-card p {
  color: #496176;
  line-height: 1.68;
}

.process-step .number {
  font-family: var(--font-display);
  font-weight: 800;
}

.form-control,
.form-select {
  font-family: var(--font-body);
  font-size: .96rem;
  line-height: 1.5;
}

.site-footer {
  font-size: .94rem;
  line-height: 1.72;
}

.site-footer h3,
.site-footer h4 {
  font-family: var(--font-display);
  font-size: .96rem;
  font-weight: 750;
  letter-spacing: -.018em;
}

@media (max-width: 767.98px) {
  body {
    font-size: .975rem;
    line-height: 1.68;
  }

  .display-title,
  .page-hero .display-title {
    font-size: clamp(2.2rem, 10.2vw, 3.05rem);
    line-height: 1.06;
    letter-spacing: -.048em;
  }

  .section-title {
    font-size: clamp(1.8rem, 8vw, 2.45rem);
    letter-spacing: -.04em;
  }

  .lead {
    font-size: 1.04rem;
    line-height: 1.62;
  }
}
