body{margin:0;font-family:Arial,sans-serif;background:#fff8f5;color:#333}
.hero{min-height:90vh;background:linear-gradient(135deg,#f8d6d6,#fff);display:flex;flex-direction:column}
nav{display:flex;justify-content:space-between;padding:20px 5%}
.links a{margin-left:20px;text-decoration:none;color:#333}
.hero-content{margin:auto;text-align:center}
.btn{background:#e66f7d;color:#fff;padding:14px 22px;border-radius:30px;text-decoration:none}
.beneficios,.dashboard{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;padding:40px 5%}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;padding:20px 5%}
.card{background:#fff;border-radius:20px;overflow:hidden;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.card img{width:100%;height:220px;object-fit:cover}
.card span{display:block;padding:15px}
section h2{text-align:center}
.panel{background:#1f4b4f;color:white;padding:50px 5%}
.dashboard div{background:white;color:#1f4b4f;padding:20px;border-radius:12px}
footer{background:#18363a;color:white;text-align:center;padding:30px}
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(6px)}
.modal-content{background:white;max-width:500px;margin:10vh auto;padding:30px;border-radius:20px;text-align:center}
#close{float:right;cursor:pointer}