*, *::before, *::after {
  box-sizing: border-box;
  margin-inline: 0;
  margin-block: 0;
  padding-inline: 0;
  padding-block: 0;
}

body {
  min-block-size: 100vh;
}

article, div {
  border-start-start-radius: 12px;
  border-start-end-radius: 12px;
}

span, h1 {
  color: hsl(229, 23%, 23%);
  font-weight: 700;
}

@font-face {
  font-family: "Kumbh Sans";
  src: url("../fonts/Kumbh_Sans/KumbhSans-VariableFont_YOPQ,wght.ttf") format("truetype");
  font-weight: 400 700;
}
html {
  font-family: "Kumbh Sans", sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: hsl(227, 10%, 46%);
}

h1 {
  font-size: clamp(1.25em, 0.85em + 0.9vw, 1.42em);
}

body {
  background-image: url("../images/bg-pattern-top.svg"), url("../images/bg-pattern-bottom.svg");
  background-position: bottom 60vw right 50vw, top 100vw left;
  background-repeat: no-repeat;
  background-color: hsl(185, 75%, 39%);
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 35rem) {
  body {
    background-position: bottom 20vw right 55vw, top 25vw left 50vw;
  }
}

article {
  border-end-start-radius: 12px;
  border-end-end-radius: 12px;
  background-color: hsl(225, 10%, 92%);
  inline-size: min(100% - 9vw, 24em);
  box-shadow: 3px 3px 40px hsl(185, 75%, 39%);
}

div {
  background-image: url("../images/bg-pattern-card.svg");
  block-size: clamp(8.5em, 20vw, 10em);
}

section {
  position: relative;
  inset-block-end: 2.75em;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

img {
  border-start-start-radius: 50px;
  border-start-end-radius: 50px;
  border-end-start-radius: 50px;
  border-end-end-radius: 50px;
  border-block: 4px solid hsl(225, 10%, 92%);
  border-inline: 4px solid hsl(225, 10%, 92%);
}

footer {
  border-block-start: 1px solid hsl(227, 10%, 46%);
  display: flex;
  justify-content: space-evenly;
}

.card__author {
  margin-block-start: clamp(1em, 0.5em + 2vw, 1.4em);
}
.card__author-name {
  display: inline-block;
}
.card__author-age {
  display: inline;
  margin-inline-start: clamp(0.1em, 0.05em + 0.4vw, 0.3em);
}
.card__author-origin {
  text-align: center;
  margin-block-start: clamp(0.5em, 0.3em + 1vw, 0.8em);
}
.card__footer {
  padding-block: clamp(0.8em, 0.75em + 0.5vw, 1em);
}
.card__stats {
  font-size: 0.7em;
  text-align: center;
  letter-spacing: 1px;
}
.card__stats-count {
  display: block;
  font-size: clamp(1.3em, 1.25em + 0.35vw, 1.5em);
  margin-block-end: clamp(0.2em, 0.18em + 0.2vw, 0.3em);
}

/*# sourceMappingURL=styles.css.map */