/*
  Careers CSS
*/

.open-positions {
    display: grid;
    gap: 30px;

    .position {
        display: flex;
        justify-content: space-between;
        gap: 30px;
        border-bottom: 1px solid var(--gray-dark);
        padding-bottom: 30px;

        .title {
            font-size: 32px;
            line-height: 1.3em;
            font-weight: 600;
            margin-bottom: 15px;
        }

        .additional-info {
            display: flex;
            align-items: center;
            gap: 15px;

            .info {
                display: flex;
                align-items: center;
                gap: 7px;
                font-size: 13px;
                line-height: 1.2em;
                font-weight: 600;
                padding: 6px 15px;
                border-radius: 50px;
                border: 1px solid var(--gray-dark);

                svg {
                    width: 15px;
                }
            }
        }

        .btn-apply {
            font-size: 15px;
            text-transform: uppercase;
            font-weight: 600;
            display: flex;
            align-items: center;
            gap: 8px;
            letter-spacing: 1px;
            text-decoration: none;
            transition: all .2s ease-in-out;

            &:hover {
                color: var( --gray-light );
            }

            svg {
                color: var(--gray);
            }
        }
    }
}

/* --------- MOBILE --------- */
@media only screen and (max-width: 768px){
    .open-positions {
        .position {
            flex-direction: column;
            padding-bottom: 20px;
        }
    }
}