:root {
  --bg: #121212;
  --fg: #fff;
  --accent: #ffc107;
  --font: 'Orbitron', sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font);
  line-height: 1.5;
}
.container { width:90%; max-width:1200px; margin:0 auto; }

/* Header */
.site-header {
  position: fixed;
  width:100%; top:0; left:0;
  background:rgba(18,18,18,0.9);
  backdrop-filter: blur(5px);
  z-index:1000;
}
.site-header .container {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 0;
}
.logo {
  font-size:1.75rem;
  color: var(--accent);
  text-decoration:none;
}
.logo span { color: var(--fg); }
.nav a {
  margin-left:1.5rem;
  color: var(--fg);
  text-decoration:none;
  position: relative;
}
.nav a::after {
  content:'';
  position:absolute; left:0; bottom:-2px;
  width:0%; height:2px;
  background: var(--accent);
  transition: width .3s;
}
.nav a:hover::after { width:100%; }

/* Hero */
.hero {
  height:80vh;
  background: url('images/cb01.jpeg') center/cover no-repeat;
  display:flex; flex-direction:column;
  justify-content:center; align-items:center;
  text-align:center;
  padding-top:4rem;
}
.hero h1 {
  font-size:3rem; margin-bottom:1rem;
  animation:fadeIn 1.5s ease-in-out;
}
.hero p { font-size:1.25rem; animation:fadeIn 2s ease-in-out; }

@keyframes fadeIn {
  from { opacity:0; transform: translateY(20px); }
  to { opacity:1; transform: translateY(0); }
}

/* Carousel */
.carousel-section { padding:6rem 0 2rem; }
.carousel {
  position:relative; overflow:hidden;
  height:60vh; max-height:500px;
}
.slide {
  position:absolute; top:0; left:0;
  width:100%; height:100%;
  opacity:0; transition:opacity 1s;
  display:flex; justify-content:center; align-items:center;
}
.slide.active { opacity:1; animation:zoom 5s ease-in-out both; }
.slide img {
  width:100%; height:100%; object-fit:cover;
}
@keyframes zoom {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}
.prev, .next {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,0.5); border:none;
  font-size:2rem; color:var(--fg); padding:.5rem;
  cursor:pointer;
}
.prev { left:1rem; }
.next { right:1rem; }

/* Info */
.info-section { padding:4rem 0; text-align:center; }
.map-wrapper {
  width:100%; height:300px; margin:2rem 0;
}
.map-wrapper iframe {
  width:100%; height:100%; border:0;
}
.social-links a {
  margin:0 .5rem;
  text-decoration:none;
  color: var(--accent);
  font-weight:700;
  transition: transform .2s;
}
.social-links a:hover { transform: scale(1.1); }

/* App Download */
.app-section {
  padding:4rem 0; text-align:center;
  background: rgba(255,193,7,0.05);
}
.btn {
  display:inline-block; margin:0.5rem;
  padding:.75rem 1.5rem;
  border:2px solid var(--accent);
  color: var(--accent);
  text-decoration:none;
  font-weight:700;
  border-radius:50px;
  transition: all .3s;
}
.btn:hover {
  background: var(--accent);
  color: var(--bg);
}

/* Footer */
.site-footer {
  padding:2rem 0; text-align:center;
  font-size:.9rem;
  background:rgba(0,0,0,0.8);
}

/* Responsive */
@media(max-width:768px){
  .hero h1 { font-size:2.2rem; }
  .hero p { font-size:1rem; }
  .prev, .next { font-size:1.5rem; }
}