/* -------------------------------- Elements -------------------------------- */

/* headers */
h3 {
  font-size: var(--font-size-big-1);
}

h2 {
  font-size: var(--font-size-big-2);
}

h1 {
  font-size: var(--font-size-big-3);
}

/* text */
p {
  line-height: 1.4em;
}

/* links */
a {
  color: var(--color--link);
  text-decoration: underline;
  fill: var(--color--link);
}

a:hover,
a:focus {
  color: var(--color--link-active);
  background-color: var(--color--outline);
  outline: 3px solid var(--color--outline);
  fill: var(--color--link-active);
}

/* Form elements */

select:focus {
  outline: 3px solid var(--color--outline);
}

/* Figures */
figure {
  margin: 0;
}

figcaption {
  box-sizing: content-box;
  padding-right: var(--caption-space);
  padding-left: var(--caption-space);
}

figure > img,
figure > video,
iframe {
  width: 100%;
}

/* Prevent Superscripts and Subscripts from Affecting Line-Height */

/* https://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/ */
sup,
sub {
  position: relative;
  top: -0.4em;
  vertical-align: baseline;
}

sub {
  top: 0.4em;
}