/* ==========================
   Orion Destiny – Dark++ (Hostoo friendly)
   ========================== */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&display=swap');

/* Paleta fixa (sem variáveis)
   bg: #06060a | bg-2: #0b0c11 | bg-3: #101119
   txt: #e6e6ea | muted: #9a9aa3
   primary: #d4af37 | primary-2: #b38f2e
   secondary: #8c6cff
   success: #48ff00
*/

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:#06060a; /* mais escuro e simples */
  color:#e6e6ea;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering: optimizeLegibility;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
a:hover{text-decoration:none}

h1,h2,h3,h4,h5,h6,.medieval-title{font-family:'Cinzel', serif; letter-spacing:.4px}
.lead{color:#9a9aa3}

/* ==========================
   NAVBAR (dark + leve transparência)
   ========================== */
.navbar{
  min-height:92px;
  background: rgba(6,6,10,.6);
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
  border-bottom: 1px solid rgba(212,175,55,.1);
}
.navbar.scrolled{
  background: rgba(10,11,17,.92);
  border-bottom-color: rgba(212,175,55,.18);
  box-shadow: 0 6px 18px rgba(0,0,0,.5);
}
.navbar .logo{height:54px;width:auto; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35));}

.navbar-dark .navbar-nav .nav-link{
  font-size:1.02rem;
  font-family:'Cinzel', serif;
  color:rgba(255,255,255,.88);
  padding:.5rem .85rem;
  border-radius:10px;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.navbar-dark .navbar-nav .nav-link:hover{
  background:rgba(140,108,255,.14);
  box-shadow: 0 4px 14px rgba(140,108,255,.22);
}

/* Botões (Cadastro e Download) */
.navbar .nav-item:nth-last-child(-n+2) .nav-link{
  background: linear-gradient(180deg, #d4af37 0%, #b38f2e 100%);
  color:#0f0f0f !important;
  font-weight:700;
  box-shadow: 0 8px 18px rgba(212,175,55,.28);
  border-radius:999px;
  padding:.5rem 1rem;
}
.navbar .nav-item:nth-last-child(-n+2) .nav-link:hover{
  transform: translateY(-1px);
}

/* Espaço extra entre "Cadastro" e "Download" */
.navbar .nav-item:last-child{ margin-left: 12px; }

/* Foco acessível */
a:focus, button:focus, [role="button"]:focus, .nav-link:focus{
  outline: 3px solid rgba(140,108,255,.35);
  outline-offset: 2px;
  border-radius:12px;
}

/* ==========================
   HERO (overlay escuro e leve vinheta)
   ========================== */
.hero{
  background: url('../img/dragon.jpg') center/cover no-repeat;
  min-height:100vh;
  position:relative;
  display:grid;
  place-items:center;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(50% 60% at 50% 20%, rgba(0,0,0,.35), transparent 60%),
    linear-gradient(180deg, rgba(3,3,6,.78) 0%, rgba(6,6,10,.86) 60%, rgba(5,5,8,.92) 100%);
}
.hero .overlay{display:none}
.hero .hero-content{ position:relative; z-index:1; text-align:center; padding:0 1rem; }
.hero h1{ font-weight:700; text-shadow: 0 10px 28px rgba(0,0,0,.6); }
.hero .lead{max-width:720px;margin:0 auto}

/* Botão principal (Baixe agora) – simples e contrastante */
.auxiliar{
  display:inline-block;
  margin-top:18px;
  padding:12px 26px;
  border-radius:999px;
  font-family:'Cinzel', serif;
  font-weight:700;
  letter-spacing:.5px;
  background: linear-gradient(180deg, #d4af37, #b38f2e);
  color:#0f0f0f !important;
  box-shadow: 0 14px 30px rgba(212,175,55,.35), inset 0 1px 0 rgba(255,255,255,.35);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  border:0;
  text-transform: uppercase;
}
.auxiliar:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 38px rgba(212,175,55,.42);
  filter:saturate(110%);
}

/* ==========================
   SEÇÕES e Títulos
   ========================== */
section{ padding:70px 0; background:transparent }
#sobre h2, #noticias h2, #horarios h2, #taxas h2, #comunidade h2{
  color:#d4af37;
  text-shadow: 0 6px 16px rgba(0,0,0,.6);
}

/* ==========================
   NOTÍCIAS – Cards dark e leves
   ========================== */
#noticias .card{
  background: linear-gradient(180deg, #101119, #0b0c11);
  border:1px solid rgba(212,175,55,.14);
  border-radius:14px;
  overflow:hidden;
  box-shadow: 0 10px 26px rgba(0,0,0,.5);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
#noticias .card:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 34px rgba(0,0,0,.6);
  border-color: rgba(140,108,255,.28);
}
#noticias .card-img-top{
  aspect-ratio:16/9;
  object-fit:cover;
}
#noticias .card-title{ font-family:'Cinzel', serif; }
#noticias .card-footer{
  background:transparent;
  border-top:1px solid rgba(212,175,55,.14);
  color:#d4af37 !important;
  font-weight:600;
}

/* Botão "Saiba Mais" */
.btn-saiba-mais{
  font-family:'Cinzel', serif;
  color:#d4af37;
  border:2px solid #d4af37;
  border-radius:999px;
  padding:9px 20px;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
  background:transparent;
  text-transform:uppercase;
  font-weight:700;
}
.btn-saiba-mais:hover{
  background:#d4af37;
  color:#0f0f0f;
  box-shadow: 0 10px 22px rgba(212,175,55,.32);
}
.btn-saiba-mais:focus{ outline:3px solid rgba(140,108,255,.35); outline-offset:2px }

/* ==========================
   HORÁRIOS – Plaquinhas dark
   ========================== */
#horarios .list-group{ gap:10px; }
#horarios .list-group-item{
  background: linear-gradient(180deg, #0b0c11, #101119);
  border:1px solid rgba(140,108,255,.18);
  color:#e6e6ea;
  border-radius:12px !important;
  padding:.85rem 1rem;
  box-shadow: 0 8px 18px rgba(0,0,0,.35);
}
#horarios h3{ color:#d4af37; }

/* ==========================
   TAXAS – Cards dark
   ========================== */
.taxas-servidor .card{
  background: linear-gradient(180deg, #11121a, #0a0b11);
  border-radius:14px;
  border:1px solid rgba(212,175,55,.16);
  box-shadow: 0 10px 26px rgba(0,0,0,.5);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.taxas-servidor .card:hover{
  transform: translateY(-4px);
  border-color: rgba(212,175,55,.26);
  box-shadow: 0 14px 34px rgba(0,0,0,.6);
}
.taxas-servidor .card-title{ font-family:'Cinzel', serif; }
.taxa-valor, .taxas-servidor .card-text{
  color:#48ff00;
  font-weight:700;
  letter-spacing:.25px;
}

/* ==========================
   COMUNIDADE – Dark + secundária
   ========================== */
.comunidade-card{
  border:1px solid rgba(140,108,255,.18);
  background: linear-gradient(180deg, #0f1017, #0a0b11);
  color:#e6e6ea;
  border-radius:14px;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  box-shadow: 0 10px 26px rgba(0,0,0,.5);
  transform: translateZ(0);
}
.comunidade-card:hover{
  transform: translateY(-4px);
  border-color: rgba(140,108,255,.32);
  box-shadow: 0 14px 34px rgba(0,0,0,.6);
}
.comunidade-card img.logo-midias{
  width:100px; height:auto; border-radius:12px;
  margin-bottom:12px;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.45));
}
.comunidade-card h4{
  font-family:'Cinzel', serif;
  margin:6px 0 10px;
  color:#cfc2ff;
}
.comunidade-card .btn{
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.comunidade-card .btn-outline-light:hover{
  background:#8c6cff; border-color:#8c6cff; color:#0f0f0f;
  box-shadow: 0 10px 22px rgba(140,108,255,.3);
}
.comunidade-card .btn-outline-success:hover{
  background:#48ff00; border-color:#48ff00; color:#0f0f0f;
  box-shadow: 0 10px 22px rgba(72,255,0,.26);
}

/* ==========================
   MENSAGEM MEDIEVAL
   ========================== */
.mensagem-medieval{
  background: linear-gradient(180deg, #0b0c11, #101119);
  border:1px solid rgba(212,175,55,.22);
  color:#d4af37;
  padding:16px 18px;
  border-radius:14px;
  margin-bottom:20px;
  font-family:'Cinzel', serif;
  box-shadow: 0 10px 24px rgba(212,175,55,.12);
  text-align:center;
  opacity:1;
  transition: opacity .6s ease;
}
.mensagem-medieval.fade-out{ opacity:0 }

/* ==========================
   FOOTER (dark sólido)
   ========================== */
footer{
  background: linear-gradient(180deg, #07070c, #05050a);
  color:#e6e6ea;
  padding:24px 0;
  text-align:center;
  border-top:1px solid rgba(212,175,55,.14);
  position:relative; overflow:hidden;
}
footer::before{
  content:"";
  position:absolute; left:50%; margin-left:-30%;
  bottom:0; width:60%; height:2px;
  background: linear-gradient(90deg, transparent, #8c6cff, transparent);
  opacity:.55;
}

/* ==========================
   Título Regras
   ========================== */
.medieval-title{
  color:#d4af37;
  text-shadow: 0 6px 14px rgba(0,0,0,.6);
  margin:20px 0 10px;
}
.regras-content p, .regras-content li{
  font-size:1.08rem; line-height:1.6;
}

/* ==========================
   Notícias (título + hover)
   ========================== */
.news-title{
  text-shadow: 2px 2px 4px rgba(0,0,0,0.65);
  color:#d4af37;
}
.news-card{ transition: transform .2s ease; }
.news-card:hover{ transform: scale(1.02); }

/* ==========================
   Acessibilidade / movimento reduzido
   ========================== */
@media (prefers-reduced-motion: reduce){
  *{transition:none !important}
  .news-card:hover,
  .taxas-servidor .card:hover,
  #noticias .card:hover,
  .comunidade-card:hover,
  .navbar .nav-item:nth-last-child(-n+2) .nav-link:hover,
  .auxiliar:hover{ transform:none !important }
}

/* ==========================
   Responsividade
   ========================== */
@media (max-width: 991.98px){
  .navbar{min-height:80px}
  .navbar .logo{height:48px}
  .hero h1{font-size: calc(1.6rem + 1.5vw)}
  .auxiliar{padding:11px 20px}
}
@media (max-width: 575.98px){
  section{padding:56px 0}
  #noticias .card .card-body{padding:1rem}
}