body{margin:0;font-family:Arial;background:#0d0217;color:#fff}
.top{display:flex;justify-content:space-between;align-items:center;padding:18px 30px;background:#180028;position:sticky;top:0}
nav button,.actions button{margin:5px;padding:10px 18px;border:none;border-radius:25px;background:#ff3d86;color:#fff;cursor:pointer}
.hero{max-width:1300px;margin:30px auto;position:relative}
.hero img{width:100%;border-radius:18px;box-shadow:0 0 35px #ff4fa0;transition:.4s}
.overlay{position:absolute;left:40px;top:40px;max-width:420px;background:rgba(0,0,0,.45);padding:20px;border-radius:16px;backdrop-filter:blur(8px)}
.content{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1200px;margin:30px auto}
.card{background:#1c0b2c;padding:20px;border-radius:16px}
.heart{position:fixed;font-size:24px;animation:f 4s linear forwards}
@keyframes f{to{transform:translateY(-110vh);opacity:0}}

.love-letter-section{
    padding:100px 20px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:linear-gradient(180deg,#130018,#21002f);
}

.love-container{
    width:min(950px,95%);
    background:rgba(255,255,255,.08);
    backdrop-filter:blur(15px);
    border:1px solid rgba(255,255,255,.15);
    border-radius:25px;
    padding:50px;
    box-shadow:0 0 40px rgba(255,0,120,.35);
}

.love-icon{
    font-size:60px;
    display:block;
    text-align:center;
    margin-bottom:20px;
}

.love-container h2{
    text-align:center;
    color:#ff78b2;
    font-size:42px;
    margin-bottom:30px;
}

#typing-text{
    white-space:pre-wrap;
    line-height:2;
    font-size:20px;
    color:#fff5fb;
    text-align:justify;
    min-height:450px;
}

#typing-text::after{
    content:"|";
    color:#ff5c9d;
    animation:blink .8s infinite;
}

@keyframes blink{
    50%{
        opacity:0;
    }
}
.reasons-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:18px;
    margin-top:25px;
}

.reason{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);
    backdrop-filter:blur(12px);
    border-radius:18px;
    padding:18px;
    transition:.35s;
    cursor:pointer;
    line-height:1.6;
}

.reason:hover{
    transform:translateY(-8px) scale(1.03);
    box-shadow:0 15px 40px rgba(255,80,150,.35);
    background:linear-gradient(135deg,#ff4f8b,#8e2de2);
}
