@font-face {
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(font-7.ttf) format('truetype');
}
@font-face {
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(font-8.ttf) format('truetype');
}
@font-face {
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(font-9.ttf) format('truetype');
}
@font-face {
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(font-10.ttf) format('truetype');
}
html[data-typography="libre"] body{font-family:'Libre Franklin','Yu Gothic',Meiryo,sans-serif}
html[data-typography="libre"] :is(h1,h2,h3){font-family:'Libre Franklin','Yu Gothic',Meiryo,sans-serif;font-weight:600;letter-spacing:0}
 html[data-typography="libre"] body{font-size:17px}
 html[data-typography="libre"] .lead{font-size:19px}
 html[data-typography="libre"] :is(.story-copy p,.careers-copy p){font-size:18px}
 html[data-typography="libre"] :is(.section-top p,.step p){font-size:17px}
 html[data-typography="libre"] :is(.card p,.text-link){font-size:16px}
 html[data-typography="libre"] :is(.card h3,.step h3){font-size:23px}
 html[data-typography="libre"] .team-gallery figcaption{font-size:16px}
 html[data-typography="libre"] h1{font-size:clamp(46px,5.9vw,80px)}
 html[data-typography="libre"] h2{font-size:clamp(32px,3.3vw,47px)}
 @media(max-width:750px){
 html[data-typography="libre"] .hero h1{font-size:clamp(38px,9vw,54px);overflow-wrap:break-word}
 html[data-typography="libre"] .lead{font-size:18px}
 html[data-typography="libre"] :is(.card h3,.step h3){font-size:23px}
 }
/* Slightly larger navigation lettering, including the compact scroll state. */
html[data-typography="libre"] header.nav .navlinks{font-size:16px}
html[data-typography="libre"] header.nav .navlinks :is(a,.button,.staff-entry,.lang){font-size:15px}
html[data-typography="libre"] header.nav .navlinks>a:not(.button):not(.staff-entry){font-size:16px}
@media(max-width:650px){
 html[data-typography="libre"] header.nav .navlinks :is(a,.button,.staff-entry,.lang){font-size:14px}
 html[data-typography="libre"] header.nav .navlinks>a:not(.button):not(.staff-entry){font-size:14px}
}
/* Keep desktop navigation close to the wordmark instead of the far edge. */
@media(min-width:1101px){
 html[data-typography="libre"] header.nav{justify-content:flex-start;column-gap:clamp(36px,5vw,72px)}
 html[data-typography="libre"] header.nav .navlinks{justify-content:flex-start;margin-left:0;flex:1}
}
