<!
DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>Te amo, mi amor</title>
<style>
body{
margin:0;
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
background: linear-gradient(135deg,#ff9a9e 0%, #fad0c4 100%);
font-family: "Segoe UI", Arial, sans-serif;
}
.card{
text-align:center;
background: rgba(255,255,255,0.95);
padding: 30px 40px;
border-radius: 20px;
box-shadow: 0 8px 30px rgba(0,0,0,0.15);
max-width: 420px;
}
img.foto{
width: 100%;
max-height: 300px;
object-fit: cover;
border-radius: 15px;
margin-bottom: 15px;
box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}
h1{
margin:0 0 10px 0;
font-size: clamp(26px,6vw,40px);
color:#d81e5b;
}
p{
margin:0 0 20px 0;
color:#444;
font-size:18px;
}
.heart{
display:inline-block;
font-size:32px;
margin-left:6px;
animation: beat 1s infinite;
transform-origin:center;
}
@keyframes beat{
0%{ transform: scale(1); }
50%{ transform: scale(1.2); }
100%{ transform: scale(1); }
}
.btn{
display:inline-block;
padding:12px 20px;
font-size:18px;
color:white;
background:#d81e5b;
border:none;
border-radius:12px;
cursor:pointer;
text-decoration:none;
}
iframe { display:none; }
</style>
</head>
<body>
<div class="card">
<!-- FOTO -->
<img src="foto.jpg" alt="Nosotros" class="foto">
<h1>Te amo, mi amor <span class="heart">❤️</span></h1>
<p>Eres lo más hermoso que tengo en mi vida.</p>
<!-- Botón de respuesta por WhatsApp -->
<a class="btn" href="https://wa.me/51979612973?text=Yo%20también%20te%20amo
%20😍" target="_blank">
Responder en WhatsApp 💌
</a>
</div>
<!-- Música Ed Sheeran (Perfect) -->
<iframe width="0" height="0"
src="https://www.youtube.com/embed/2Vv-BfVoq4g?autoplay=1&loop=1&playlist=2Vv-
BfVoq4g"
frameborder="0" allow="autoplay"></iframe>
</body>
</html>
