/* Wrapper for the top section of page */
.navbar-wrapper {
    display: flex;
    margin-top: 4vh;              /* Changed from 60px */
    margin-left: auto;            /* Changed from 450px - centers horizontally */
    margin-right: auto;           /* Changed from 300px */
    width: 90%;                   /* Changed from auto - responsive width */
    max-width: 1100px;            /* Maintains reasonable max width */
    justify-content: space-between; /* Better flex layout */
}

/* container for name section on left */
.name-container {    
    overflow: hidden; 
    display: block;  
}

/* Big name at top of page */
.name {
    overflow: hidden;         
    font-size: 2.25rem;          /* Changed from 36px */
    font-weight: bold;
}

/* The first letter that turns green */
.name-green {
    color: rgb(53, 232, 200);
}

/* My career and location */
.short-intro-content {
    font-size: 1.5rem;           /* Changed from 24px */
    display: block;
    line-height: 1.6;
}

/* Container for the navbar shortcuts top right of page */
.navbar-container {
    overflow: hidden;
    display: flex;
    margin-left: auto;
    gap: 1.625rem;               /* Changed from 26px */
    cursor: auto;
}

/* Buttons that can be clicked to scroll */
.navbar-buttons {
    font-size: 1.25rem;          /* Changed from 20px */
    overflow: hidden;
    display: inline-flex;
    background: transparent;
    border: none;
    outline: none;
    color: white;
}

/* button behavior when hovered */
.navbar-buttons:hover {
    color: lightgray;
    cursor: pointer;
}

/* Button Scroll behavior */
#intro {
    overflow: hidden;
}

#experience {
    overflow: hidden;
}

#projects {
    overflow: hidden;
}

#contact {
    overflow: hidden;
}