/* =========================================
   RESET
   ========================================= */

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
figure,
dl,
dd {
  margin: 0;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

img,
video,
iframe {
  max-width: 100%;
}

img {
  height: auto;
  vertical-align: bottom;
}

button,
input,
select,
textarea {
  font: inherit;
  appearance: none;
  align-items: center;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
  border: none;
  background: none;
  cursor: pointer;
}

/* =========================================
     FOCUS STYLES
     ========================================= */

button:focus,
input:focus,
select:focus,
select:focus-visible,
textarea:focus {
  outline: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 1px solid var(--color-border);
  outline-offset: 0;
}