:root{
  --bg: #f3f0ea;
  --fg: #1f2328;
  --border: #d9d3c7;
  --card: #fbfaf7;
  --link: rgba(20,20,22,.62);
  --link-hover: rgba(20,20,22,.82);
  --font-sans: system-ui, -apple-system,"Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-serif: "Georgia", ui-serif, Cambria, "Times New Roman", Times, serif;
}

html, body{
  margin: 0;
  padding: 0;
  background-color: var(--bg);
  background-image:
    linear-gradient(
      rgba(58,0,0,0.022),
      rgba(58,0,0,0.022)
    ),
    url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAvklEQVR42mNgGAWDEf7/PwPDYDBnYGBoYGBw9/GDA4NnBgYmngMWA4OEglQD8Rlg4OMkWwBgYmFhswX9ChAEfRmgGxYGBw4f6UgiHEZbFiYHBkYODg5ygBEwvGA4PAuMGp5mKQ5mMA+4gJDAwMBgYmxAFsuBiZsWFgYGBgz8Dq9yBuGkC3AGKgIGXxZgiRG6Mhlx6PBgYGBgYGAUDgQmhBy1mQegAAAABJRU5ErkJggg==");
  background-repeat: repeat;
  background-blend-mode: multiply;

  color: var(--fg);
  font: 16px/1.65 var(--font-sans);
}


main{
  max-width: 80ch;
  margin: 0 auto;
  padding: 48px 18px 64px;
}

.card{
  background: transparent;
  padding: 28px 22px;
}

h1{
  margin: 0 0 18px 0;
  display: flex;
  justify-content: center;
  text-align: center;
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.4px;
}

p{
  margin: 0 0 14px 0;
}

p:last-of-type{
  margin-bottom: 0;
}

.about-return{
  margin-top: 22px;
  display: flex;
  justify-content: center;
  font-family: var(--font-serif);
}

.about-return-btn{
  display: inline-block;
  padding: 8px 10px;
  font-weight: 400;
  letter-spacing: .06em;
  font-size: 1rem;
  color: var(--link);
  text-decoration: none;
  transition: color 0.5s ease;
  -webkit-tap-highlight-color: transparent;
}

.about-return-btn:hover{
  color: var(--link-hover);
  text-decoration: none;
}