/* --- Only include :root in global.css, not here! --- */

/* ====== Newsletter Page ====== */
.newsletter-main {
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--secondary);
    padding: 60px 0 40px 0;
}
.newsletter-panel {
    background: rgba(28,32,40,0.95);
    border-radius: 22px;
    box-shadow: 0 6px 36px #000b;
    padding: 3.4em 3.3em 2.5em 3.3em;
    height: 700px;
    min-width: 340px;
    max-width: 460px;
    width: 98vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6em;
}
.newsletter-panel h1 {
    font-family: var(--font-title);
    font-size: 2.4em;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.06em;
    margin-bottom: 0.11em;
    text-align: center;
}
.newsletter-panel p {
    color: #b6c0d2;
    font-size: 0.8em;
    text-align: center;
    margin-bottom: 0.8em;
}
.newsletter-footer {
    font-size: 0.97em;
    color: #8a98af;
    text-align: center;
    margin-top: 1.7em;
}

/* ===== Form Styles ===== */
.newsletter-form,
#emailoctopus-form-anchor form,
#emailoctopus-form-anchor .eo-form {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1.1em;
    margin-top: 0.6em;
}

.newsletter-form input[type="email"],
#emailoctopus-form-anchor input[type="email"] {
    background: #191b21;
    color: var(--primary);
    border: 1.5px solid var(--primary);
    border-radius: 9px;
    font-size: 1.13em;
    padding: 14px 16px;
    margin-bottom: 0.3em;
    font-family: var(--font-main);
    outline: none;
    transition: border 0.19s;
}
.newsletter-form input[type="email"]:focus,
#emailoctopus-form-anchor input[type="email"]:focus {
    border-color: var(--accent);
    color: #fff;
}

.newsletter-btn,
#emailoctopus-form-anchor button,
#emailoctopus-form-anchor input[type="submit"] {
    background: var(--primary);
    color: #191b21;
    border: none;
    border-radius: 8px;
    font-family: var(--font-title);
    font-size: 1.14em;
    font-weight: 600;
    padding: 13px 0;
    transition: background 0.18s, color 0.18s;
    cursor: pointer;
    box-shadow: 0 2px 12px #0001;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7em;
}
.newsletter-btn:hover,
#emailoctopus-form-anchor button:hover,
#emailoctopus-form-anchor input[type="submit"]:hover {
    background: var(--accent);
    color: #fff;
}

/* Labels and feedback */
.newsletter-form label,
#emailoctopus-form-anchor label,
#emailoctopus-form-anchor .eolabel {
    color: #b6c0d2 !important;
    font-size: 1em !important;
    margin-bottom: 0.17em;
}
#emailoctopus-form-anchor .eomessages,
#emailoctopus-form-anchor .eosuccess {
    color: var(--primary) !important;
    font-family: var(--font-main) !important;
    background: none !important;
    border: none !important;
    font-size: 1em !important;
    margin-bottom: 0.7em !important;
    text-align: center;
}
#emailoctopus-form-anchor .eosubmit {
    margin-top: 0.8em !important;
}