*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;color:#222;background:#fff url('assets/images/background.png') center/cover fixed}
header{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:15px 5%;background:rgba(255,255,255,.85);backdrop-filter:blur(10px)}
.header-logo{height:70px}
nav a{margin:0 12px;text-decoration:none;color:#222;font-weight:bold}
.hero{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center}
.hero h1{font-size:clamp(3rem,8vw,6rem);margin:0;background:linear-gradient(90deg,#ff0080,#00d4ff,#8cff00);-webkit-background-clip:text;color:transparent}
.hero-content{padding:30px;background:rgba(255,255,255,.65)}
button{padding:15px 30px;border:0;border-radius:30px;background:#ff1493;color:white;font-weight:bold}
.cards,.products{display:flex;gap:25px;justify-content:center;flex-wrap:wrap;padding:40px}
.cards article,.products div{background:rgba(255,255,255,.85);padding:30px;min-width:220px;text-align:center;box-shadow:0 10px 30px #0002}
footer{text-align:center;padding:40px;background:#111;color:white}
footer img{max-width:300px}
@media(max-width:700px){header{flex-direction:column}nav{margin-top:10px}.header-logo{height:55px}}