/* Shared typography across the portfolio, including the About introduction. */
:root{
  --sans:Oswald,'Arial Narrow','Segoe UI',Arial,sans-serif;
  --display:var(--sans);
  --copy-size:18px;
  --copy-leading:1.8;
  --section-title-size:clamp(36px,3.5vw,50px);
  --subheading-size:28px;
}
body{font-family:var(--sans);font-size:var(--copy-size);font-weight:400;line-height:var(--copy-leading)}
.hero-description,
.section-heading>p,
.project-description,
.about-body>p,
.about-body .large-copy,
.skill-row>p,
.learning-copy p,
.contact-layout>div>p,
.dialog-intro,
.case-sections p,
.case-sections li{
  font-family:var(--sans);
  font-size:var(--copy-size);
  font-weight:400;
  line-height:var(--copy-leading);
  letter-spacing:.01em;
  color:var(--muted);
}
.about-body>p{margin-bottom:22px}
.section-heading h2,.about-intro h2{
  font-family:var(--display);
  font-size:var(--section-title-size);
  font-weight:500;
  line-height:1.18;
  letter-spacing:0;
}
.project-card h3,.skill-row h3,.learning-heading h3{
  font-size:var(--subheading-size);
  font-weight:500;
  line-height:1.25;
  letter-spacing:0;
}
.hero .eyebrow,.section-top .eyebrow,.about-intro .eyebrow,.learning-heading .eyebrow{
  font-family:var(--display);
  font-size:14px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:.8px;
}
.hero .eyebrow{max-width:100%}
.education-school,.affiliations>span{font-size:22px;line-height:1.45}
.education div>p:nth-child(2),.affiliations small{font-size:16px;line-height:1.7}
.education .mono,.about-signature small{font-size:13px;line-height:1.7}
.learning-copy strong{font-weight:500}
.hero-footer>p:nth-child(2){font-family:var(--sans);font-size:15px;line-height:1.7;letter-spacing:0}
.project-role,.skill-tools{font-family:var(--sans);font-size:16px;line-height:1.7}
.contact-value{font-family:var(--sans);font-size:19px;line-height:1.6}
.image-credit,.illustration-note{font-family:var(--sans);font-size:14px;line-height:1.7}
.identity-sub{font-family:var(--sans);font-size:12px;line-height:1.4;letter-spacing:.7px}
.footer-name span{font-size:14px}
.engine-controls button,.engine-adjustments summary{font-family:var(--display);font-size:16px}
.engine-setting label,.hero-visual figcaption{font-family:var(--sans);font-size:14px;line-height:1.65}
.hero-visual figcaption small{font-size:13px}
.case-insight h3{font-size:13px;line-height:1.6}

/* Fixed reading progress: a compositor-only fill, with no layout movement. */
.scroll-progress{position:fixed;inset:0 0 auto;height:3px;z-index:80;background:#142335;pointer-events:none}
.scroll-progress>span{display:block;width:100%;height:100%;background:var(--accent);box-shadow:0 0 7px #3e95ffcc,0 0 18px #2388ff80;transform:scaleX(0);transform-origin:left center}
@media(max-width:900px){.scroll-progress{height:4px}}

@media(max-width:900px){
  :root{--section-title-size:clamp(34px,6vw,44px);--subheading-size:30px}
  .section-heading>p{max-width:640px}
  .identity-sub{font-size:11px}
  .hero .eyebrow{max-width:560px}
}
@media(max-width:360px){
  .identity-sub{font-size:10px;letter-spacing:.5px}
  .contact-value{font-size:18px}
}