/* ==========================================================================
   Growy – Pre-Launch (sites-prelaunch/)
   Top-Banner + Subscribe-Modal
   ========================================================================== */

/* --- PRE-LAUNCH TOP BANNER --- */
.pl-banner {
    background: linear-gradient(90deg, var(--accent-green-dark), var(--accent-green));
    color: #04200a;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 8px 16px;
    letter-spacing: 0.02em;
}
.pl-banner strong { font-weight: 700; }
.pl-banner a { color: #04200a; text-decoration: underline; }

/* --- SUBSCRIBE MODAL --- */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
}
.modal-overlay.open { display: flex; }
.modal-card {
    position: relative;
    background: var(--bg-card);
    border: 1px solid var(--accent-green);
    border-radius: var(--radius-lg);
    padding: 40px 32px;
    max-width: 460px;
    width: 100%;
    box-shadow: 0 0 80px rgba(95,211,95,0.2), 0 30px 60px rgba(0,0,0,0.6);
    text-align: center;
}
.modal-close {
    position: absolute;
    top: 14px; right: 14px;
    background: transparent;
    border: none;
    color: var(--text-muted);
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    transition: color 0.2s;
}
.modal-close:hover { color: var(--text-main); }
.modal-card h2 { font-size: 1.6rem; margin-bottom: 0.75rem; }
.modal-card p { font-size: 0.95rem; margin-bottom: 1.5rem; }
.modal-card .raffle {
    display: inline-block;
    background: rgba(95,211,95,0.1);
    border: 1px solid rgba(95,211,95,0.3);
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 0.8rem;
    color: var(--accent-green);
    font-weight: 600;
    margin-bottom: 1.5rem;
}
.modal-input {
    width: 100%;
    padding: 14px 16px;
    background: var(--bg-dark);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    color: var(--text-main);
    font-size: 1rem;
    font-family: inherit;
    margin-bottom: 12px;
    box-sizing: border-box;
}
.modal-input:focus { outline: none; border-color: var(--accent-green); }
.modal-card .btn { width: 100%; }
.modal-note { font-size: 0.78rem; color: var(--text-muted); margin-top: 14px; margin-bottom: 0; }

/* Erfolg-Zustand nach Submit */
.modal-success { display: none; }
.modal-overlay.success .modal-form { display: none; }
.modal-overlay.success .modal-success { display: block; }
.modal-success .check {
    width: 56px; height: 56px;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: rgba(95,211,95,0.15);
    display: flex; align-items: center; justify-content: center;
    color: var(--accent-green);
}
.modal-success .check svg { width: 30px; height: 30px; fill: currentColor; }

@media (max-width: 768px) {
    .modal-card { padding: 32px 22px; }
    .modal-card h2 { font-size: 1.35rem; }
}