body{
  margin:0;
  font-family: system-ui, Arial, sans-serif;
  background:#0b0f16;
  color:white;
}

/* HEADER IMAGE */
.header{
  height:60vh;
  background-image:url("header.webp");
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:flex-end;
  padding:30px;
  box-shadow: inset 0 -150px 150px rgba(0,0,0,0.6);
}

.header-content{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.header h1{
  margin:0;
  font-size:42px;
}

.header-buttons{
  display:flex;
  gap:12px;
}

/* MAIN BUTTONS */
.main-btn{
  padding:10px 18px;
  border-radius:8px;
  border:none;
  background:#2563eb;
  color:white;
  text-decoration:none;
  font-size:14px;
  cursor:pointer;
  transition:0.2s;
}

.main-btn:hover{
  background:#1d4ed8;
}

.main-btn.secondary{
  background:#374151;
}

.main-btn.secondary:hover{
  background:#1f2937;
}

section{
  max-width:1000px;
  margin:auto;
  padding:40px 20px;
}

/* CAROUSEL */
.carousel{
  position:relative;
  overflow:hidden;
  border-radius:16px;
  height:400px;
}

.slides{
  display:flex;
  height:100%;
  transition: transform 0.6s ease;
}

.slide{
  min-width:100%;
  background-size:cover;
  background-position:center;
}

.btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.5);
  border:none;
  color:white;
  font-size:28px;
  padding:10px 16px;
  cursor:pointer;
  border-radius:50%;
}

.prev{ left:10px; }
.next{ right:10px; }

.card{
  background:#111827;
  padding:20px;
  border-radius:12px;
  margin-top:30px;
}

footer{
  text-align:center;
  padding:20px;
  color:#aaa;
  border-top:1px solid #222;
}