/* Existing styles */
html, body {
    height: 100%;
    margin: 0;
    display: flex;
    justify-content: center; /* keep horizontal centering */
    align-items: flex-start; /* move content toward the top */
    background-color: #1f4d25;
}

.container {
    max-width: 100%; /* Ensure image does not exceed container */
    max-height: 100%; /* Ensure image does not exceed container */
    text-align: center; /* Center image horizontally */
    margin-top: 60px; /* increase space from top, adjust as needed */
}

img {
    max-width: 80%; /* Ensure image resizes with container */
    height: auto; /* Maintain aspect ratio */
}

/* --- New styles for POY button --- */
/* Namespaced under .poy-button-container to avoid conflicts */
.poy-button-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
}

.poy-button-container .poy-button {
    display: inline-block;
    text-decoration: none;
    text-align: center;
    margin-top: 15px;
    padding: 12px 30px;
    font-size: 18px;
    font-weight: bold;
    color: #1f4d25;
    background: #ffffff;
    border: none;
    border-radius: 50px; /* rounded */
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.poy-button-container .poy-button:hover {
    background: #9a9a9a; /* darker on hover */
    color: #fff;
    transform: translateY(-2px);
}

/* Responsive for mobile */
@media (max-width: 480px) {
    .poy-button-container .poy-button {
        width: 80%;
        font-size: 16px;
        padding: 10px 0;
    }

    .poy-button-container img {
        max-width: 60%;
    }
}
