/* this page is unfinished and honestly looks bad. i would ignore this as its unneeded for the program to function well */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&display=swap');

/* Force the body to fill the screen so centering works */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Prevents unwanted scrollbars */
}

.welcome-container {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;    /* Horizontal Center */
    justify-content: center; /* Vertical Center */
    
    /* The Canva Gradient: Cyan to Blue */
    background: linear-gradient(135deg, #4edeea 0%, #0352ba 100%) !important;
    font-family: 'Space Grotesk', sans-serif;
}

.welcome-content {
    text-align: center;
}

.main-title {
    font-family: 'Libre Baskerville', serif;
    font-size: 5.5rem; /* Big impact like the image */
    font-weight: 700;
    font-style: italic; /* Matches the 'Welcome' look in the image */
    color: #1a1a1a; 
    margin-bottom: 5px;
}

.tagline {
    font-size: 1.2rem;
    color: #1a1a1a;
    font-weight: 600;
    margin-bottom: 60px;
}

.cta-links {
    margin-top: 40px;
}

.cta-link {
    font-family: 'Libre Baskerville', serif;
    text-decoration: none;
    color: #1a1a1a;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 15px;
    transition: 0.3s;
}

.cta-link:hover {
    opacity: 0.6;
}
