/* Canonical typography system and homepage scroll-chevron cleanup — 2026-07-29 */
:root {
  --font-heading: "Raleway", Arial, sans-serif;
  --font-body: "Inter", Arial, sans-serif;
  --font-editorial: "Lora", Georgia, serif;
  --color-heading: #2d2d2d;
  --color-subheading: #023fa1;
  --color-body: #2d2d2d;
  --color-scroll-accent: #cccc33;

  --body-size: 1rem;
  --body-leading: 1.68;

  /* Mobile, up to 767px */
  --h1-size: 2.25rem;    /* 36px */
  --h2-size: 1.6875rem;  /* 27px */
  --h3-size: 1.375rem;   /* 22px */
  --h4-size: 1.1875rem;  /* 19px */
  --h5-size: 1rem;       /* 16px */
  --h6-size: 1rem;       /* 16px */
}

/* One body-copy system across every page. */
html,
body,
button,
input,
select,
textarea {
  font-family: var(--font-body) !important;
  color: var(--color-body) !important;
}

body,
p,
li,
dd,
dt,
blockquote,
figcaption,
label,
input,
select,
textarea,
.about-section__body,
.resume-editorial__summary,
.resume-editorial__company,
.resume-editorial__location,
.contact-copy,
.project-summary,
.source-media-section p,
.source-case-section p {
  font-family: var(--font-body) !important;
  font-size: var(--body-size) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: var(--body-leading) !important;
}

/* Consistent emphasis. No incidental italics or heavy bolding. */
strong,
b {
  font-family: inherit !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

em,
i {
  font-family: inherit !important;
  font-style: normal !important;
  font-weight: inherit !important;
}

/* Canonical semantic heading hierarchy. */
html body h1,
html body .project-title,
html body .contact-title,
html body .about-name,
html body .resume-editorial h1 {
  margin-top: 0;
  font-family: var(--font-heading) !important;
  font-size: var(--h1-size) !important;
  font-style: normal !important;
  font-weight: 300 !important;
  letter-spacing: -0.038em !important;
  line-height: 1.04 !important;
  color: var(--color-heading) !important;
}

html body h2,
html body .about-section__title,
html body .learn-more__title,
html body .resume-editorial__section > h2,
html body .source-media-section > h2 {
  font-family: var(--font-editorial) !important;
  font-size: var(--h2-size) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: -0.024em !important;
  line-height: 1.12 !important;
  color: var(--color-subheading) !important;
}

html body h3,
html body .resume-editorial__job-copy h3,
html body .resume-editorial__job-identity h3,
html body .resume-editorial__education h3,
html body .source-media-section > h3 {
  font-family: var(--font-heading) !important;
  font-size: var(--h3-size) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: -0.016em !important;
  line-height: 1.22 !important;
  color: var(--color-heading) !important;
}

html body h4 {
  font-family: var(--font-heading) !important;
  font-size: var(--h4-size) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.3 !important;
  color: var(--color-heading) !important;
}

html body h5 {
  font-family: var(--font-heading) !important;
  font-size: var(--h5-size) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  color: var(--color-heading) !important;
}

html body h6 {
  font-family: var(--font-heading) !important;
  font-size: var(--h6-size) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
  color: var(--color-heading) !important;
}

/* Every H2 uses the same Lora treatment. */

/* Interface copy is not part of the H1–H6 scale. */
.site-nav__link,
.menu-panel a,
.menu-work-toggle,
.project-filter__toggle,
.project-filter__menu button,
.view-switcher__button,
.explore-work,
.resume-editorial__download,
.back-link,
.project-card__title,
.learn-more-card__title {
  font-family: var(--font-heading) !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

.page-home .project-card__title,
.project-page .learn-more-card__title {
  display: block !important;
  font-size: 1rem !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

/* Ensure profile and resume narrative copy use the exact same body treatment. */
.page-profile .about-section__body,
.page-resume .resume-editorial__summary,
.page-resume .resume-editorial__job-copy li,
.page-resume .resume-editorial__education li,
.page-resume .resume-editorial__skills dd,
.page-resume .resume-editorial__company,
.page-resume .resume-editorial__location {
  font-family: var(--font-body) !important;
  font-size: var(--body-size) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: var(--body-leading) !important;
}

/* Remove the white circular artifact and render one clean, thicker lime V. */
.page-home .hero-scroll-indicator,
.page-home .hero-scroll-indicator:hover,
.page-home .hero-scroll-indicator:active,
.page-home .hero-scroll-indicator:focus {
  width: 72px !important;
  height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: var(--color-scroll-accent) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-decoration: none !important;
  overflow: visible !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

.page-home .hero-scroll-indicator::before,
.page-home .hero-scroll-indicator::after {
  content: "" !important;
  position: absolute !important;
  top: 14px !important;
  display: block !important;
  width: 30px !important;
  height: 5px !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: currentColor !important;
  box-shadow: none !important;
}

.page-home .hero-scroll-indicator::before {
  left: 7px !important;
  transform: rotate(25deg) !important;
  transform-origin: right center !important;
}

.page-home .hero-scroll-indicator::after {
  right: 7px !important;
  transform: rotate(-25deg) !important;
  transform-origin: left center !important;
}

.page-home .hero-scroll-indicator:focus-visible {
  outline: 2px solid var(--color-subheading) !important;
  outline-offset: 7px !important;
}

/* Tablet: 768px–1023px */
@media (min-width: 768px) {
  :root {
    --h1-size: 2.75rem;   /* 44px */
    --h2-size: 2.125rem;  /* 34px */
    --h3-size: 1.625rem;  /* 26px */
    --h4-size: 1.3125rem; /* 21px */
    --h5-size: 1.0625rem; /* 17px */
    --h6-size: 1rem;      /* 16px */
  }
}

/* Desktop: 1024px and up */
@media (min-width: 1024px) {
  :root {
    --h1-size: 3.5rem;    /* 56px */
    --h2-size: 2.625rem;  /* 42px */
    --h3-size: 1.875rem;  /* 30px */
    --h4-size: 1.4375rem; /* 23px */
    --h5-size: 1.125rem;  /* 18px */
    --h6-size: 1rem;      /* 16px */
  }
}