/* -------------------------------------------------
   Basic reset & typography
------------------------------------------------- */
*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html { font-size: 100%; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
                 Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.6;
    background: #f7fafc;
    color: #333;
}

/* -------------------------------------------------
   Layout
------------------------------------------------- */
.container {
    max-width: 720px;
    margin: 3rem auto;
    padding: 0 1rem;
    text-align: center;
}
.logo {
    width: 120px;
    height: auto;
    margin-bottom: 1rem;
}

/* -------------------------------------------------
   Headings
------------------------------------------------- */
h1 {
    font-size: 2.4rem;
    color: #0066cc;
    margin-bottom: .5rem;
}
.tagline {
    font-size: 1.2rem;
    color: #555;
    margin-bottom: 2rem;
}

/* -------------------------------------------------
   Info section
------------------------------------------------- */
.info h2,
.newsletter h2 {
    font-size: 1.6rem;
    margin-top: 2rem;
    margin-bottom: .8rem;
}
.info ul {
    list-style: disc inside;
    text-align:left;
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.4;
}

/* -------------------------------------------------
   Newsletter form
------------------------------------------------- */
.newsletter form {
    display: flex;
    flex-direction: column;
    align-items:center;
    gap: .5rem;
    margin-top: .8rem;
}
.newsletter input[type="email"] {
    width: 100%;
    max-width: 320px;
    padding: .6rem 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1rem;
}
.newsletter button {
    background:#0066cc;
    color:#fff;
    border:none;
    padding:.6rem 1.2rem;
    border-radius:4px;
    cursor:pointer;
    font-size:1rem;
    transition:background .3s ease;
}
.newsletter button:hover { background:#004c99; }

/* -------------------------------------------------
   Footer
------------------------------------------------- */
footer {
    margin-top: 3rem;
    font-size: .85rem;
    color:#777;
}

/* -------------------------------------------------
   Responsive tweaks
------------------------------------------------- */
@media (max-width:480px) {
    h1 {font-size:2rem;}
    .info ul {text-align:left;padding-left:1rem;}
}