:root{
  --color-primary:#c62828;
  --color-secondary:#1565c0;
  --color-bg:#f9f9f9;
  --color-dark:#222;
  --color-light:#fff;
}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Montserrat',sans-serif;}
body{background:var(--color-bg);color:var(--color-dark);overflow-x:hidden;}

header{
  position:relative;
  height:100vh;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));
  color:var(--color-light);
  overflow:hidden;
}

header .content{position:relative; z-index:1; animation: fadeInUp 2s ease; padding:0 15px;}
@keyframes fadeInUp{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}

header img.logo{
  width:250px;
  max-width:90%;
  margin-bottom:20px;
  border-radius:50%;
  background:var(--color-light);
  padding:20px;
  animation:pulse 3s infinite;
  box-shadow:0 0 30px rgba(255,255,255,0.7);
}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.12);}}

header h1{font-size:3rem;margin-bottom:15px;font-weight:700;animation:glow 2s infinite alternate;}
@keyframes glow{from{text-shadow:0 0 15px rgba(255,255,255,0.4);}to{text-shadow:0 0 35px rgba(255,255,255,1));}}

header p{font-size:1.2rem;margin-bottom:30px;animation:fadeIn 3s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}

.btn-primary{
  background: var(--color-light);
  color: var(--color-primary);
  padding:15px 40px;
  border-radius:50px;
  font-weight:700;
  text-decoration:none;
  font-size:1.1rem;
  display:inline-block;
  animation:bounce 3s infinite;
  box-shadow:0 5px 20px rgba(0,0,0,0.2);
  transition:0.3s;
}
@keyframes bounce{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.btn-primary:hover{background:var(--color-secondary);color:var(--color-light);transform:scale(1.05);}

.ticker-container{margin-top:25px;overflow:hidden;width:100%;height:50px;position:relative;}
.ticker{display:flex;position:absolute;white-space:nowrap;animation:scroll 50s linear infinite;}
.ticker span{display:inline-block;margin:0 40px;padding:5px 25px;background: rgba(255,255,255,0.15);border-radius:25px;font-size:1.3rem;font-weight:600;color:#fff;transition:0.3s;}
.ticker span:hover{background: var(--color-light); color: var(--color-primary); transform:scale(1.1);}
@keyframes scroll{0%{transform:translateX(100%);}100%{transform:translateX(-100%);}}

.ticker-frases{margin-top:15px;overflow:hidden;width:100%;height:40px;position:relative;}
.ticker-frases .ticker{animation:scroll 40s linear infinite;}
.ticker-frases span{margin:0 30px;font-size:1.2rem;font-weight:600;color:#fff;padding:5px 15px;background:rgba(0,0,0,0.2);border-radius:20px;}

section{padding:80px 20px;max-width:1000px;margin:auto;text-align:center;background:linear-gradient(135deg,var(--color-secondary),var(--color-primary));color:#fff;}
section h2{font-size:2.2rem;margin-bottom:20px;animation:fadeInUp 1.5s ease;}
section p{font-size:1.1rem;line-height:1.8;color:#fff;}

footer{background: var(--color-dark); color: var(--color-light); text-align:center; padding:20px; animation:fadeIn 2s ease;}

@media(max-width:768px){
  header h1{font-size:2rem;}
  header img.logo{width:180px;}
  .ticker span,.ticker-frases span{font-size:1rem;padding:5px 15px;margin:0 15px;}
}

canvas#particles{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;}