body {
    margin: 0;
    font-family: 'Host Grotesk', sans-serif; /* Applied Host Grotesk font */
    background: url('images/Aislyticswebpagelogo.png') no-repeat center center fixed;
    background-size: cover;
    color: #FAF3EC; /* Changed default text color */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Distribute space between items */
    align-items: center;
    min-height: 100vh;
    text-align: center;
    position: relative;
    padding: 20px; /* Add some padding to the body */
    box-sizing: border-box; /* Include padding in element's total width and height */
}



.top-content {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px; /* Move logo up slightly more */
}

.new-logo {
    max-width: 60%; /* Shrink to 75% of previous 80% */
    max-height: 300px; /* Shrink to 75% of previous 400px */
}

.bottom-content {
    margin-bottom: 20px; /* Adjust as needed to position content at the bottom */
    max-width: 600px; /* Constrain width of content */
}

h1 {
    font-size: 3.5rem;
    color: black; /* Changed h1 font color to black */
    margin-bottom: 10px;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
}

p {
    font-size: 1.2rem;
    color: black; /* Changed p font color to black */
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.7);
}

.contact-btn {
    display: inline-block;
    padding: 24px 48px; /* Doubled padding */
    background-color: black; /* Changed fill color to black */
    color: #FAF3EC; /* Keep text color as #FAF3EC */
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

.contact-btn:hover {
    background-color: #3C8262; /* Changed hover color to ALT Space */
}

@media (max-width: 768px) {
    .container {
        padding: 30px;
    }
    h1 {
        font-size: 2rem;
    }
    p {
        font-size: 1rem;
    }
}
