.btn {
    padding: 0;
    border-radius: 0;

    &.btn-sub {
        position: absolute;
        /* right: 0; */
        /* bottom: 12px; */
        top: 34px;
        right: 0;
    }

    &:focus {
        box-shadow: none;
    }
}

.btn-border-blue {
    font-size: 16px;
    font-weight: 600;
    font-family: $font-family-sora;
    color: $color-primary;
    position: relative;
    z-index: 1;
    display: inline-block;
    border: 1px solid $color-primary;
    border-radius: 40px;
    background: transparent;
    padding: 12px 16px;
    overflow: hidden;
    transition: color 0.1s cubic-bezier(0.55, 0.085, 0.68, 0.53);

    &::before {
        content: '';
        width: 150%;
        height: 150%;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: -1;
        will-change: transform;
        border-radius: 50%;
        transform: translateX(-50%) translateY(100%);
        transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    img {
        margin-left: 4px;
    }

    &:hover {
        color: $color-text-white;
        border: 1px solid transparent;

        svg {
            path {
                stroke: $color-text-white;
            }
        }

        &::before {
            border-radius: 50%;
            transform: translateX(-50%) translateY(-50%);
            background: $color-primary;
        }
    }

    &.btn-white {
        border: 1px solid $color-text-white;
        color: $color-text-white;

        svg {
            path {
                stroke: $color-text-white;
            }
        }

        &:hover {
            border: 1px solid transparent;
        }
    }

    &.btn-blue {
        border: 1px solid $light-blue;
        color: $light-blue;
    }
}

.btn-blue {
    display: inline-block;
    padding: 12px 16px;
    border-radius: 24px;
    background: $color-primary;
    color: $color-white;
    font-size: 16px;
    font-weight: 600;
    font-family: $font-family-sora;
    text-align: center;
    text-decoration: none;

    &:hover {
        color: $color-white;
    }

    &:focus {
        box-shadow: none;
    }
}

.btn-form {
    font-size: 16px;
    font-weight: 600;
    font-family: $font-family-sora;
    color: $color-text-white;
    background-color: $color-primary;
    padding: 12px 16px;
    border-radius: 48px;

    &:hover {
        color: $color-text-white;
    }
}