body {
    background: #e0e5ec;
  }
  h1 {
    position: relative;
    text-align: center;
    color: #353535;
    font-size: 50px;
    font-family: "Cormorant Garamond", serif;
  }
  
  p {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    text-align: center;
    font-size: 18px;
    color: #676767;

    :root {
        --text-color: #000;
        --line-color: #000;
        --icon-color: #000;
        --icons-alignment: center; /* start, center, end */
      }
      
      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
      
      .footer-container {
        width: 100%;
        max-width: 1120px;
        margin: 0 auto;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: var(--icons-alignment);
      }
      
      .footer-container.fixed {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
      }
      
      .footer-content {
        padding: 0 20px;
      }
      
      .footer-link {
        font-size: 14px;
        text-decoration: none;
        text-transform: uppercase;
        font-family: sans-serif;
        letter-spacing: 0.5px;
        position: relative;
        --x: 0;
        --y: 0;
      }
      
      .footer-link svg {
        transform: translate3d(var(--x), var(--y), 10px);
      }
      
      .footer-link-text {
        color: var(--text-color);
        position: relative;
        transition: opacity 0.2s ease-in-out;
      }
      
      .footer-link-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%) scale(0);
        transition: transform 0.4s ease;
      }
      
      .footer-link:after {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background: var(--line-color);
        transform: scaleX(1);
        transform-origin: center;
        transition: transform 0.4s ease-in-out;
      }
      
      .footer-link:hover:after {
        transform: scaleX(0);
      }
      
      .footer-link:hover .footer-link-text {
        opacity: 0;
      }
      
      .footer-link:hover .footer-link-icon {
        transform: translate(-50%, -50%) scale(1);
      }
      
      .footer-content {
        display: flex;
      }
      
      .footer-item:not(:last-of-type) {
        margin-right: 28px;
      }
      
      .footer-link-icon path {
        fill: var(--icon-color);
        pointer-events: none;
      }
      
      @media screen and (max-width: 576px) {
        .footer-container {
          height: unset;
          padding: 40px 0;
        }
      
        .footer-content {
          flex-direction: column;
          align-items: var(--icons-alignment);
        }
      
        .footer-item:not(:last-of-type) {
          margin-right: unset;
          margin-bottom: 28px;
        }
      
        .footer-link {
          font-size: 16px;
        }
      }