@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700;800&display=swap');
*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}
body{background:#0f1923;color:#fff}
a{text-decoration:none;color:#fff}
nav{position:absolute;top:0;left:0;width:100%;padding:25px 6%;display:flex;justify-content:space-between;align-items:center;z-index:10}
.logo{font-size:32px;font-weight:800;color:#ff4655}
.menu{display:flex;gap:35px}
.menu a:hover{color:#ff4655}
.hero{min-height:72vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(15,25,35,.45),rgba(15,25,35,.85)),url("images/BGvalo1.jpg") center/cover no-repeat;z-index:-1}
.hero-content h1{font-size:64px}
.hero-content p{margin-top:18px;font-size:22px;color:#ddd}
.hero-btn{display:inline-block;margin-top:35px;padding:18px 42px;background:#ff4655;border-radius:999px;color:#fff;font-weight:700;font-size:18px;transition:.3s;box-shadow:0 12px 30px rgba(255,70,85,.35)}
.hero-btn:hover{background:#ff2d55;transform:translateY(-3px)}
.section{padding:70px 6%}
.title{text-align:center;font-size:34px;margin-bottom:40px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:35px}
.card{background:#1b2634;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);transition:.3s}
.card:hover{transform:translateY(-8px);box-shadow:0 0 35px rgba(255,70,85,.35)}
.card img{width:100%;height:270px;object-fit:cover}
.content{padding:24px}
.badge{display:inline-block;background:#ff4655;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:700}
.content h2{margin:18px 0}
.spec{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08);color:#ddd}
.price-box{margin:25px 0;padding:20px;border-radius:16px;background:linear-gradient(135deg,#ff4655,#ff2d55);text-align:center;box-shadow:0 12px 35px rgba(255,70,85,.35)}
.price-title{font-size:12px;letter-spacing:2px}
.price{font-size:42px;font-weight:800;margin:8px 0}
.price-note{display:inline-block;padding:8px 18px;border-radius:999px;background:rgba(255,255,255,.15)}
.button{display:block;width:100%;padding:16px;background:#ff4655;border-radius:10px;text-align:center;font-weight:700}
.button:hover{background:#ff2b45}
@media(max-width:768px){
nav{padding:18px 20px}
.menu{gap:16px}
.hero{min-height:55vh}
.hero:before{background-position:65% center}
.hero-content h1{font-size:36px}
.hero-content p{font-size:16px}
.hero-btn{margin-top:24px;padding:15px 28px;font-size:16px}
.grid{grid-template-columns:1fr}
.card img{height:220px}
.price{font-size:34px}
}