/* ===== Variáveis e base ===== */
:root {
  --primary:#ee3919;
  --secondary:#f1ee08;
  --dark:#0b0b0c;
  --light:#f5f5f7;
  --gray:#b9bcc4;
  --dark-gray:#151518;
}

* { margin:0; padding:0; box-sizing:border-box; font-family:'Segoe UI',system-ui,-apple-system,sans-serif; }

body {
  background:var(--dark);
  color:var(--light);
  line-height:1.6;
  padding-top:80px; /* espaço do header fixo */
}

.container { width:100%; max-width:1200px; margin:0 auto; padding:0 20px; }
section { padding:60px 0; }

/* ===== Header ===== */
header {
  position:fixed; inset:0 0 auto 0; height:auto; z-index:1000;
  background:rgba(11,11,12,.95);
  border-bottom:1px solid rgba(255,255,255,.1);
  padding:15px 0;
}
.header-content { display:flex; justify-content:space-between; align-items:center; }
.logo {
  font-size:28px; font-weight:800;
  background:linear-gradient(to right,var(--primary),var(--secondary));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.nav-links { display:flex; gap:30px; }
.nav-links a { color:var(--light); text-decoration:none; font-weight:500; transition:color .3s; }
.nav-links a:hover { color:var(--primary); }

/* ===== Títulos de seção ===== */
.section-title {
  text-align:center; font-size:2.2rem; margin-bottom:40px; color:var(--light); position:relative;
}
.section-title::after {
  content:''; display:block; width:60px; height:4px;
  background:linear-gradient(to right,var(--primary),var(--secondary));
  margin:15px auto; border-radius:2px;
}

/* ===== Hero ===== */
.hero {
  text-align:center;
  padding:80px 0 60px;
  background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7));
  border-radius:0 0 20px 20px;
  margin-bottom:40px;
}
.hero-img {
  display:block;
  margin:0 auto 24px;
  width:100%;     /* ajuste fino: aumente/diminua aqui */
  height:auto;
  border:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
}
.hero h1 {
  font-size:3.5rem; margin-bottom:15px; font-weight:800;
  background:linear-gradient(to right,var(--primary),var(--secondary));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p { font-size:1.2rem; max-width:600px; margin:0 auto 30px; color:var(--gray); }

/* Botões */
.btn {
  display:inline-block; padding:12px 30px; margin:5px; cursor:pointer;
  border:none; border-radius:30px; font-weight:600; text-decoration:none; color:#fff;
  background:linear-gradient(to right,var(--primary),var(--secondary));
  transition:transform .3s, box-shadow .3s;
}
.btn:hover { transform:translateY(-3px); box-shadow:0 10px 20px rgba(0,0,0,.3); }
.btn-outline {
  background:transparent; color:var(--primary);
  border:2px solid var(--primary);
}

/* Fundo alternativo para seções */
.alt { background:var(--dark-gray); }

/* ===== Vídeo (fallback clicável) ===== */
.video-container{
  position:relative; aspect-ratio:16/9;
  border-radius:15px; overflow:hidden; background:#000;
  box-shadow:0 10px 30px rgba(0,0,0,.4); margin-bottom:30px;
}
.yt-fallback{
  position:absolute; inset:0; display:block; width:100%; height:100%;
}
.yt-fallback img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.yt-fallback .play{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:80px; height:80px; border-radius:999px; background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
}
.yt-fallback .play::before{ content:"▶"; color:#fff; font-size:36px; margin-left:4px; }

/* ===== Spotify ===== */
.spotify-container { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; margin-top:30px; }
.spotify-playlist { background:var(--dark-gray); border-radius:15px; overflow:hidden; transition:transform .3s; }
.spotify-playlist:hover { transform:translateY(-5px); }
.spotify-playlist iframe { width:100%; height:380px; border:none; }

/* ===== Agenda ===== */
.agenda-container { background:var(--dark-gray); padding:30px; border-radius:15px; margin-top:30px; }
.agenda-item { display:flex; justify-content:space-between; padding:20px; border-bottom:1px solid rgba(255,255,255,.1); }
.agenda-item:last-child { border-bottom:none; }
.agenda-date { font-weight:700; color:var(--primary); min-width:120px; }
.agenda-location { flex:1; padding:0 20px; }
.agenda-actions { min-width:120px; text-align:right; }

/* ===== Social ===== */
.social-links { display:flex; justify-content:center; gap:20px; margin:40px 0; }
.social-icon {
  width:50px; height:50px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(to right,var(--primary),var(--secondary));
  color:#110101; font-size:20px; transition:transform .3s;
  text-decoration: none;
}
.social-icon:hover { transform:scale(1.1); }

/* ===== Footer ===== */
footer { background:var(--dark-gray); padding:40px 0; text-align:center; margin-top:60px; border-top:1px solid rgba(255,255,255,.1); }
.footer-links { display:flex; justify-content:center; gap:25px; margin:20px 0; }
.footer-links a { color:var(--gray); text-decoration:none; transition:color .3s; }
.footer-links a:hover { color:var(--primary); }
footer .social-links a, footer .social-links i { color:#fff !important; }
.copyright { color:var(--gray); font-size:.9rem; margin-top:20px; }

/* ===== Responsivo ===== */
@media (max-width:768px){
  body{ padding-top:120px; }
  .header-content{ flex-direction:column; gap:15px; }
  .nav-links{ gap:15px; flex-wrap:wrap; justify-content:center; }
  .hero{ padding:60px 0 40px; }
  .hero h1{ font-size:2.5rem; }
  .hero-img{ width:min(320px,90vw); }
  .agenda-item{ flex-direction:column; text-align:center; }
  .agenda-date,.agenda-location,.agenda-actions{ margin-bottom:10px; padding:0; }
  .agenda-actions{ margin-top:15px; }
  .spotify-container{ grid-template-columns:1fr; }
  .section-title{ font-size:1.8rem; }
}
