html{
  font-family:var(--font-sans);
  color:var(--color-text);
  background:var(--color-bg);
  font-size:100%;
}
body{
  font-size:var(--font-size-base);
  line-height:var(--line-body);
  font-weight:400;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  overflow-wrap:break-word;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  line-height:var(--line-heading);
  font-weight:700;
  color:var(--color-text);
  letter-spacing:-.015em;
  text-wrap:balance;
}
h1{font-size:var(--font-size-4xl)}
h2{font-size:var(--font-size-3xl)}
h3{font-size:var(--font-size-2xl)}
h4{font-size:var(--font-size-xl)}
p{color:var(--color-text-secondary)}
p,li,dd,blockquote{overflow-wrap:anywhere}
a{text-decoration:none}
a:hover{color:var(--color-primary-dark)}
strong{color:var(--color-text)}
small{font-size:var(--font-size-sm)}
input,textarea,select{font-size:max(1rem,var(--font-size-base))}
::selection{background:var(--color-secondary);color:var(--gp-white)}
@media(max-width:479px){
  :root{
    --font-size-2xl:clamp(1.55rem,7vw,1.9rem);
    --font-size-3xl:clamp(1.85rem,8vw,2.45rem);
    --font-size-4xl:clamp(2.15rem,10vw,3rem);
    --line-body:1.62;
  }
}