.contact-section .container {
    display: grid;
    grid-template-columns: 1.3fr 1fr;

    #contact-title {
        grid-column: span 2;
    }

    .contact-form-wrapper, .contact-details {
        h3 {
            font-size: 1.4rem;
            font-weight: 100;
            margin: 60px auto 30px 0;
        }

        input, textarea {
            background-color: var(--color-dark-300);
            color: var(--color-light-100);
            width: 100%;
            border: none;
            padding: 15px;
            border-radius: 5px;

            &::placeholder {
                color: var(--color-dark-500);
                font-size: .9rem;
                font-weight: 600;
            }

            &:focus {
                outline: none;
                background-color: var(--color-dark-400);
                color: var(--color-light-100);
            }
        }

        button {
            padding: 15px 30px;
            border: none;
            border-radius: 30px;
            font-size: .8rem;
            transition: 100ms ease-out 100ms;
            margin-top: 30px;
            margin-right: auto;
            width: fit-content;

            &:hover {
                transition: 100ms ease-in;
                transform: translateY(10%) scale(104%);
            }
            
            &.btn-primary {
                background-color: var(--color-primary);
                color: var(--color-dark-100);

                &:hover {
                    background-color: var(--color-secondary);
                }
            }
        }
    }

    .contact-form-wrapper + .contact-details {
        margin-left: 60px;
    }

    .contact-form {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .contact-details-list {
        font-size: .9rem;
        dt {
            color: var(--color-dark-500);
            margin-bottom: 10px;
            text-transform: uppercase;
        }
        
        dd, dd a {
            color: var(--color-dark-600);
            margin-bottom: 30px;
        }
    }
}