Fylo dark theme with HTML validation and no grid, only flexbox

I learned to use flexbox.

I used srcset in <picture> to not use media query on picture display.

<picture class="block-curvy-desktop">
  <source
    media="(max-width: 375px)"
    srcset="images/bg-curvy-mobile.svg">
  <img class="bg-curvy-desktop" src="images/bg-curvy-desktop.svg" alt="background curvy desktop" />
</picture>

I used the HTML validator to avoid JS

<input type="email" placeholder="[email protected]">
<div class="error-message">Please provide a valid email</div>

.error-message {
  visibility: hidden;
  font-weight: 300;
  color: hsl(var(--ligh-red));
}
input:invalid ~ .error-message {
  visibility: visible;
}

I used text-underline-offset to keep the underline by default

.link, a {
    color: hsl(var(--cyan));
    text-underline-offset: 8px;
    position: relative;
}