.contact-form-section {
      box-sizing: border-box;
      padding: 0;
      font-family: "Inter", sans-serif;
      font-size: 14px;
      font-weight: 400;
      line-height: 24px;
      letter-spacing: -0.01em;

      /* NORMAL */
      --fc-border-color: #ECEFF9;
      --fc-normal-text-color: #0E0B3D;
      --fc-normal-placeholder-color: #B3B8D0;

      /* PRIMARY COLOR | HSL FORMAT*/
      --fc-primary-color-hue: 250;
      --fc-error-color-hue: 356;
      --fc-primary-hsl: var(--fc-primary-color-hue), 0%, 0%;
      --fc-error-hsl: var(--fc-error-color-hue), 100%, 54%;

      /* HOVER */
      --fc-field-hover-bg-color: #F7F9FC;
      --fc-border-hover-color: #DDE0EE;
      --fc-field-hover-text-color: #B3B8D0;

      --fc-border-active-color: #1463FF;
    }

    .contact-form-section * {
      box-sizing: border-box;
    }

    .contact-form-section label {
      display: block;
      cursor: pointer;
    }

    .contact-form-section .formcarry-block:not(:first-child) {
      margin-top: 16px;
    }

    /*=============================================
    =            Fields           =
    =============================================*/
    
    .contact-form-section input,
    .contact-form-section select {
      margin-top: 4px;
      width: 80vw;
      height: 42px;
      border: 1px solid var(--fc-border-color);
      box-shadow: 0 1px 2px var(--fc-border-color);
      color: var(--fc-normal-text-color);
      border-radius: 10px;
      padding: 8px 12px;
      
      font-family: "Inter", sans-serif;
      font-size:14px;
      transition: 125ms background, 125ms color, 125ms box-shadow;
    }

    .contact-form-section form{
        width: fit-content;
        text-align: center;
    }
    .contact-form-section textarea{
      min-height: 188px;
      padding-top: 12px;
      max-width: 80vw;
      margin-top: 4px;
      height: 42px;
      border: 1px solid var(--fc-border-color);
      box-shadow: 0 1px 2px var(--fc-border-color);
      color: var(--fc-normal-text-color);
      border-radius: 10px;
      padding: 8px 12px;
      width: 80vw;
      font-family: "Inter", sans-serif;
      font-size:14px;
      transition: 125ms background, 125ms color, 125ms box-shadow;
    }

    .contact-form-section input::placeholder,
    .contact-form-section textarea::placeholder,
    .contact-form-section select::placeholder {
      color: var(--fc-normal-placeholder-color);
    }

    .contact-form-section input:hover,
    .contact-form-section textarea:hover,
    .contact-form-section select:hover {
      border-color: var(--fc-border-hover-color);
      background-color: var(--fc-field-hover-bg-color);
    }

    .contact-form-section input:hover::placeholder,
    .contact-form-section textarea:hover::placeholder,
    .contact-form-section select:hover::placeholder {
      color: var(--fc-field-hover-text-color);
    }

    .contact-form-section input:focus,
    .contact-form-section textarea:focus,
    .contact-form-section select:focus {
      background-color: #fff;
      border: 2px solid hsl(var(--fc-primary-hsl));
      box-shadow: hsla(var(--fc-primary-hsl), 8%) 0px 0px 0px 3px;
      outline: none;
    }

    .contact-form-section input:focus,
    .contact-form-section select:focus {
      padding: 8px 11px;
    }

    .contact-form-section textarea:focus {
      padding: 11px;
    }

    .contact-form-section select {
      background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.9997 14.5001L8.46387 10.9642L9.64303 9.78589L11.9997 12.1434L14.3564 9.78589L15.5355 10.9642L11.9997 14.5001Z' fill='%236C6F93'/%3E%3C/svg%3E%0A");
      /* background-position: calc(100% - 20px) calc(1em + 4px), calc(100% - 15px) calc(1em + 4px); */
      background-size: 24px 24px;
      background-position: 98%;
      background-repeat: no-repeat;
      appearance: none;
      -webkit-appearance: none;
    }

    .contact-form-section button {
      width: 33%;
      border: 0;
      border-radius: 30px;
      padding: 1em 2em;
      box-sizing: border-box;
      background-color: var(--ghost-accent-color);
      color: #fff;
      cursor: pointer;
      box-shadow: 0 0 0 0 transparent;
      min-width: 155px;
      max-width: 9vw;
      transition: all 0.5s ease-in;
    }
    
    .contact-form-section button:hover {
      transition: all 0.5s ease-out;
      border-radius: 25px;
      background-color: var(--darker-accent-color);
    }
    
    .contact-form-section button:focus {
      background-color: var(--darker-accent-color);
      border-inline: 1px solid inline rgba(255, 255, 255, 0.6);
      box-shadow: 0px 0px 0px 3px rgba(var(--fc-primary-hsl), 12%);
    }

    .contact-form-section button:active {
      background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), hsla(var(--fc-primary-hsl));
    }

    .contact-form-section button:disabled {
      background-color: hsla(var(--fc-primary-hsl), 40%);
      cursor: not-allowed;
    }

    .contact-form-section input:focus:required:invalid,
    .contact-form-section input:focus:invalid, 
    .contact-form-section select:focus:required:invalid,
    .contact-form-section select:focus:invalid
    {
      color: hsl(var(--fc-error-hsl)); 
      border-color: hsl(var(--fc-error-hsl));
      box-shadow: 0px 0px 0px 3px hsla(var(--fc-error-hsl), 12%);
    }

    .contact-container{
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-wrap: nowrap;
    }

    @media only screen and (min-width: 800px) {
        .contact-container{
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-items: flex-start;
        }
        .contact-right-container{
            padding: 0 3vh 0 3vh;
            max-width: 50%;
        }

        .contact-form-section textarea {
            min-height: 188px;
            max-width: 100%;
            height: 42px;
            padding: 8px 12px;
        }
        .contact-form-section input,
        .contact-form-section select {
            width: 20vw;
        }
        .contact-form-section form{
            width: unset;
            text-align: unset;
        }
    
    }