/* Reset */
*,::after,::before{box-sizing:border-box}
blockquote,body,dd,dl,figure,h1,h2,h3,h4,p{margin:0}
ol[role=list],ul[role=list]{list-style:none}
html:focus-within{scroll-behavior:smooth}
body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}
a:not([class]){text-decoration-skip-ink:auto}
img,picture{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
@media (prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  *,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;scroll-behavior:auto!important}
}

/* Theme tokens */
:root{
  --clr-dark:#242424;
  --clr-light:#fff;
  --clr-text:var(--clr-light);
  --clr-bg:var(--clr-dark);
  --clr-btn-bg:var(--clr-dark);
  --clr-btn-txt:var(--clr-light);
}

/* Layout and type */
body,h1,h2,h3,h4,h5,h6{font-family:Arial,sans-serif}
.title,body{color:var(--clr-text)}
.nav__link,.title{text-align:center}
body{margin:1em;background-color:var(--clr-bg);line-height:1.5}
.main-grid{display:grid;grid-auto-flow:row;grid-template-columns:minmax(auto,80ch);justify-content:space-around;gap:2em;box-sizing:border-box;margin-left:1ch;margin-right:1ch}
h1,h2,h3,h4,h5,h6{margin-top:1.618ch}
.title{text-transform:uppercase;margin-top:1.618ch;margin-bottom:.3ch;font-size:2.5rem}
.nav{display:grid;grid-auto-flow:column;justify-content:space-around;justify-items:center;grid-template-columns:1fr}

/* Links: gradient text */
a{background-image:linear-gradient(45deg,#42b7db,#3b8ccf);background-clip:text;-webkit-background-clip:text;color:transparent;text-decoration:none}
a:visited{background-image:linear-gradient(45deg,#a842db,#8c3bcf)}
a:hover{background-image:linear-gradient(45deg,#3b8ccf,#42b7db)}
.nav__link:hover{text-decoration:underline}

/* Figures */
img{margin:auto;max-width:100%;height:auto}
caption{width:200px;text-align:center}