body{margin:0;font-family:Arial;background:#ffffff;color:#333;}
.header{position:fixed;width:100%;background:#111;color:#fff;padding:15px;}
.nav{display:flex;justify-content:space-between;width:90%;margin:auto;}
.nav a{color:white;margin-left:15px;text-decoration:none;}

.hero{height:100vh;background:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.7)),
url('https://images.unsplash.com/photo-1521737604893-d14cc237f11d') center/cover;
display:flex;align-items:center;justify-content:center;text-align:center;color:white;}

.section{padding:100px 20px;text-align:center;}
.alt{background:#f4f4f4;}
.dark{background:#111;color:white;}

.cards{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.card{background:white;padding:20px;width:260px;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.1);transition:.3s;}
.card img{width:100%;height:150px;object-fit:cover;border-radius:8px;}
.card:hover{transform:translateY(-10px);}

iframe{width:100%;height:300px;border:0;margin-top:20px;}
.btn{background:#ff5722;color:white;padding:12px 25px;text-decoration:none;border-radius:5px;}

/* animations */
.slide{opacity:0;transform:translateY(40px);animation:slideUp 1s forwards;}
.delay{animation-delay:.4s;}
.delay2{animation-delay:.8s;}

@keyframes slideUp{
to{opacity:1;transform:translateY(0);}
}

.fade{opacity:0;transform:translateY(40px);transition:1s;}
.fade.show{opacity:1;transform:translateY(0);}

@media(max-width:768px){
.cards{flex-direction:column;align-items:center;}
}