/* 02-base: Reset, grade de 12 colunas e tipografia (títulos e textos). */

*,*::before,*::after{box-sizing:border-box;}
html{
  scroll-padding-top:var(--nav-h);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
html,body{margin:0;padding:0;}
body{
  background:var(--white);
  color:var(--ink);
  font-family:var(--font);
  font-size:var(--t-body);
  line-height:1.6;
  font-kerning:normal;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;}
button{font:inherit;}
::selection{background:var(--red);color:var(--white);}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;}

.skip{
  position:absolute;left:var(--gutter);top:-100px;z-index:calc(var(--z-modal) + 1);
  background:var(--white);color:var(--ink);padding:10px 16px;font-weight:700;
}
.skip:focus{top:12px;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
main{position:relative;overflow-y:clip;} /* o diagrama, quando acompanha a cortina final, não pode esticar a página */
main .wrap{position:relative;z-index:2;}
.grid{
  display:grid;
  grid-template-columns:repeat(12, minmax(0,1fr));
  column-gap:clamp(16px, 2.2vw, 36px);
}
.rail{grid-column:1 / span 3;}
.main{grid-column:4 / -1;}
@media (max-width:900px){
  .rail,.main{grid-column:1 / -1;}
}

/* ---------- tipografia ---------- */
.display,.h2,.h3,.number{
  font-family:var(--font);
  font-weight:800;
  font-stretch:112%;
  margin:0;
  text-wrap:balance;
}
.display{font-size:var(--t-display);line-height:.98;letter-spacing:-.035em;}
.h2{font-size:var(--t-h2);line-height:1.02;letter-spacing:-.03em;}
.h3{font-size:var(--t-h3);line-height:1.15;letter-spacing:-.015em;font-stretch:105%;}
.number{
  font-size:var(--t-number);line-height:.9;letter-spacing:-.04em;
  font-stretch:125%;font-variant-numeric:tabular-nums;
}
.lede{font-size:var(--t-lede);line-height:1.5;max-width:52ch;margin:0;text-wrap:pretty;}
p{text-wrap:pretty;}
.accent{color:var(--red);}
.meta{
  font-size:var(--t-micro);
  font-stretch:88%;
  font-weight:600;
  letter-spacing:.02em;
  line-height:1.4;
}
