.or-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
}

.or-divider {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    border-top: 1px solid #ccc; /* The divider line */
    text-align: center;
    margin: 0 10px;
}

.icon-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff; /* Matches background color to 'cut' the line */
    padding: 0 10px; /* Add spacing around the icon */
}

.icon-wrapper i {
    font-size: 16px; /* Adjust the icon size */
    color: #666; /* Icon color */
}
    .container {
        display: flex;
        justify-content: center; /* Center horizontally */
        align-items: center;    /* Center vertically */
        height: 100vh;          /* Full viewport height */
    }
        .gradient-text {
        background: linear-gradient(45deg, #ff6b6b, #fbc531, #4cd137); /* Gradient colors */
        -webkit-background-clip: text; /* Clips background to text */
        -webkit-text-fill-color: transparent; /* Makes the text itself transparent */
        font-weight: bold; /* Optional: for better visibility */
        font-size: 1rem; /* Optional: adjust as needed */
    }