:root {
  --content-max-width: 1400px;
  --md-screen-margin: 1rem;
  --md-breakpoint: 1010px;

  --computed-section-margin: calc(
    max(100vw - var(--content-max-width), var(--md-screen-margin) * 2) / 2
  );
  interpolate-size: allow-keywords;
}

main {
  margin: 0;
}

a {
  /* color: var(--cl-primary); */
  color: var(--cl-secondary);
  text-decoration: none;
  padding: 0.3rem;
  transition: color 0.1s ease-in-out;
}

a:hover {
  color: var(--cl-primary);
}

input {
  border: 0.1rem solid var(--cl-secondary-accent-2);
  padding: 0.5rem;
  padding-left: 1rem;
  border-radius: var(--b-radius);
  outline: none;
}

input:focus {
  border: 0.1rem solid var(--cl-primary);
}

article {
  border-radius: var(--module-b-radius);
}

h1 {
  font-size: 2.5rem;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.flex > * {
  flex: 1;
}