/* Final site-wide typography and project-card alignment pass — 2026-07-29
   This file intentionally loads last so every page follows one hierarchy. */

:root {
  --type-heading: "Raleway", Arial, sans-serif;
  --type-h2: "Lora", Georgia, serif;
  --type-body: "Inter", Arial, sans-serif;
  --type-ink: #2d2d2d;
  --type-h2-color: #023fa1;
  --panel-dark: #2d2d2d;
  --body-size: 18px;
  --body-leading: 1.55;
}

html {
  font-size: 100%;
}

body,
button,
input,
select,
textarea {
  font-family: var(--type-body) !important;
  font-style: normal !important;
}

body {
  color: var(--type-ink) !important;
  font-size: var(--body-size) !important;
  font-weight: 400 !important;
  line-height: var(--body-leading) !important;
}

/* One exact semantic heading system across the entire website. */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  font-style: normal !important;
  line-height: 1.15 !important;
  text-transform: none !important;
  text-wrap: balance;
}

h1,
h3,
h4,
h5,
h6,
.project-title,
.about-name,
.contact-title,
.resume-title {
  color: var(--type-ink) !important;
  font-family: var(--type-heading) !important;
  letter-spacing: -0.015em !important;
}

h1,
.project-title,
.about-name,
.contact-title,
.resume-title {
  font-size: 56px !important;
  font-weight: 400 !important;
}

/* Every H2 receives the same Lora treatment, without italics. */
h2,
.about-section__title,
.learn-more__title,
.resume-editorial h2 {
  color: var(--type-h2-color) !important;
  font-family: var(--type-h2) !important;
  font-size: 42px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.15 !important;
}

h3,
.resume-editorial h3 {
  font-size: 32px !important;
  font-weight: 500 !important;
}

h4 {
  font-size: 23px !important;
  font-weight: 500 !important;
}

h5 {
  font-size: 19px !important;
  font-weight: 500 !important;
}

h6 {
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* Copy system: same font, size, weight and leading on every content page. */
main p,
main li,
main dd,
.about-section__body,
.project-summary,
.project-meta-line,
.resume-editorial__summary,
.resume-editorial__company,
.resume-editorial__date,
.resume-editorial__location,
.resume-editorial__job-copy,
.resume-editorial__skills,
.contact-intro,
.contact-item__value {
  font-family: var(--type-body) !important;
  font-size: var(--body-size) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: var(--body-leading) !important;
}

main p,
main li,
main dd,
.about-section__body,
.resume-editorial__summary,
.resume-editorial__job-copy,
.contact-intro {
  max-width: 72ch;
}

strong,
b {
  font-weight: 600;
}

em {
  font-style: normal;
}

/* Non-heading text that previously inherited Cormorant is returned to the
   correct semantic family. */
.person-intro,
.contact-item__value,
.resume-editorial__eyebrow,
.resume-editorial__role,
.resume-editorial__company,
.resume-editorial__date,
.resume-editorial__location,
.resume-editorial__skills dt,
.resume-editorial__skills dd {
  font-family: var(--type-body) !important;
  font-style: normal !important;
}

/* Resume typography follows the exact global H1/H2/H3 and copy system. */
.page-resume .resume-editorial__hero h1,
.page-resume .resume-editorial h1 {
  font-family: var(--type-heading) !important;
  font-size: 56px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.15 !important;
}

.page-resume .resume-editorial h2 {
  margin-bottom: 24px;
}

.page-resume .resume-editorial h3 {
  color: var(--type-ink) !important;
  font-family: var(--type-heading) !important;
  font-size: 32px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.15 !important;
}

.page-resume .resume-editorial__eyebrow,
.page-resume .resume-editorial__role,
.page-resume .resume-editorial__company,
.page-resume .resume-editorial__date,
.page-resume .resume-editorial__location,
.page-resume .resume-editorial__skills dt,
.page-resume .resume-editorial__skills dd,
.page-resume .resume-editorial li,
.page-resume .resume-editorial p {
  font-size: var(--body-size) !important;
  line-height: var(--body-leading) !important;
}

/* Homepage cards: enlarged labels, left aligned and vertically centered
   inside the dark panel beneath every cover. */
.project-card__content {
  box-sizing: border-box !important;
  display: flex !important;
  min-height: 84px !important;
  padding: 0 32px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  background: var(--panel-dark) !important;
  text-align: left !important;
}

.project-card__title {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: center !important;
  color: #ffffff !important;
  font-family: var(--type-heading) !important;
  font-size: 20px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

.project-card__meta {
  display: none !important;
}

/* Related-project labels remain interface text, not semantic headings. */
.learn-more-card__title {
  font-family: var(--type-heading) !important;
  font-size: 18px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
}

.site-nav,
.site-nav a,
.project-filter,
.project-filter button,
.view-switcher,
.view-switcher button,
.resume-editorial__download,
.button,
.btn {
  font-family: var(--type-heading) !important;
  font-style: normal !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --body-leading: 1.5;
  }

  h1,
  .project-title,
  .about-name,
  .contact-title,
  .resume-title,
  .page-resume .resume-editorial__hero h1,
  .page-resume .resume-editorial h1 {
    font-size: 44px !important;
  }

  h2,
  .about-section__title,
  .learn-more__title,
  .resume-editorial h2 {
    font-size: 34px !important;
  }

  h3,
  .resume-editorial h3,
  .page-resume .resume-editorial h3 {
    font-size: 26px !important;
  }

  h4 { font-size: 21px !important; }
  h5 { font-size: 17px !important; }
  h6 { font-size: 16px !important; }

  .project-card__content {
    min-height: 80px !important;
    padding-inline: 28px !important;
  }

  .project-card__title {
    font-size: 19px !important;
  }
}

@media (max-width: 767px) {
  :root {
    --body-leading: 1.5;
  }

  h1,
  .project-title,
  .about-name,
  .contact-title,
  .resume-title,
  .page-resume .resume-editorial__hero h1,
  .page-resume .resume-editorial h1 {
    font-size: 36px !important;
  }

  h2,
  .about-section__title,
  .learn-more__title,
  .resume-editorial h2 {
    font-size: 27px !important;
  }

  h3,
  .resume-editorial h3,
  .page-resume .resume-editorial h3 {
    font-size: 22px !important;
  }

  h4 { font-size: 19px !important; }
  h5 { font-size: 16px !important; }
  h6 { font-size: 16px !important; }

  .project-card__content {
    min-height: 76px !important;
    padding-inline: 24px !important;
  }

  .project-card__title {
    font-size: 18px !important;
  }
}