/* Keep the arena treatment scoped to the home screen and navigation. */
header { background:#08090b; border-bottom:1px solid #57202d; backdrop-filter:none; }
.nav { height:76px; max-width:1280px; margin:0 auto; padding:0 24px; gap:24px; background:#060709; border:0; box-shadow:none; backdrop-filter:none; }
main { padding-top:76px; }
.nav-logo { position:static; flex-shrink:0; transform:none; }
.nav-logo .brand-word { font-family:'Archivo','Arial Black',Arial,sans-serif; font-size:28px; font-weight:900; font-style:italic; letter-spacing:0; line-height:1.2; transform:none; text-shadow:none; }
.nav-logo .brand-word span { font-family:inherit; }
.nav-logo .brand-red, .hero .brand-red { color:#ff0738; }
.nav-links { position:static; gap:0; align-items:center; }
.nav-primary { margin-left:auto; }
.nav-secondary { margin-left:-24px; border-left:1px solid #521022; }
.nav-links li + li { border-left:1px solid #521022; }
.nav-links a { display:flex; align-items:center; gap:10px; padding:8px 16px; font-family:Inter,sans-serif; font-size:12px; font-weight:600; letter-spacing:0; color:#e0e0e5; white-space:nowrap; }
.nav-links a::after { bottom:-14px; }
.nav-links a:hover, .nav-links a[aria-current] { color:#fff; }
.nav-links a[aria-current]::after { width:100%; }
.cz-icon { display:inline-block; flex-shrink:0; width:25px; height:25px; background:currentColor; mask:var(--icon) center/contain no-repeat; -webkit-mask:var(--icon) center/contain no-repeat; }
.icon-users { --icon:url('../icons/lucide/users-round.svg'); }
.icon-trophy { --icon:url('../icons/lucide/trophy.svg'); }
.icon-ranking { --icon:url('../icons/lucide/chart-no-axes-column-increasing.svg'); }
.icon-arrow { --icon:url('../icons/lucide/arrow-right.svg'); }
.nav .cz-icon { color:#ff0738; width:24px; height:24px; }
.nav #menuNaoLogado, .nav #menuLogado { position:relative; flex-shrink:0; margin-left:auto; max-width:220px; }
.nav-actions { gap:7px; }
.nav-actions button { font-family:Inter,sans-serif; font-size:11px; letter-spacing:0; min-height:40px; padding:11px 14px; border-radius:3px; clip-path:none; white-space:nowrap; }
.nav-actions .btn-main { background:#f50735; }
.nav #menuLogado .perfilBtn { display:flex; align-items:center; min-width:0; max-width:100%; gap:7px; padding:9px; background:#111216; border:1px solid #25252b; border-radius:3px; clip-path:none; letter-spacing:0; }
.nav #nomeUsuario { min-width:0; max-width:85px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:Inter,sans-serif; font-size:11px; letter-spacing:0; }
.nav #headerBalance { flex-shrink:0; margin:0; font-family:Inter,sans-serif; font-size:11px; letter-spacing:0; }
.nav .nav-avatar { width:25px; height:25px; flex-shrink:0; font-size:11px; }
.nav .admin-badge { font-size:8px; padding:3px; letter-spacing:0; }
.nav .dropdown { background:#111216; border-color:#3f2029; max-width:calc(100vw - 32px); }
.nav :focus-visible, #home :focus-visible { outline:2px solid #fff; outline-offset:5px; }

#home { min-height:calc(100svh - 76px); padding:0; display:grid; grid-template-rows:minmax(440px,1fr) auto auto; align-items:stretch; justify-content:stretch; background:#08090b; isolation:isolate; }
#home.hidden { display:none; }
.hero-stage { position:relative; display:grid; align-items:center; min-width:0; isolation:isolate; overflow:hidden; }
#home .hero-bg { z-index:-1; background:#08090b; pointer-events:none; }
#home .hero-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center 53%; animation:home-arena-entry 6s ease-out both; }
#home .hero-bg::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#08090b22 0%,#08090b30 65%,#08090bd9 100%); }
.hero-motto { position:absolute; top:38px; left:42px; text-align:left; text-transform:uppercase; color:#b2b2bc; font-size:10px; font-weight:600; letter-spacing:0; line-height:1.65; }
.hero-motto span, .home-signoff span { display:block; width:22px; height:2px; background:#d60c31; margin-top:14px; }
#home .hero-content { align-self:center; width:100%; max-width:1080px; margin:0 auto; padding:100px 28px 76px; position:relative; isolation:isolate; }
.hero-reticle { position:absolute; z-index:-1; pointer-events:none; left:50%; top:46%; transform:translate(-50%,-50%); width:520px; max-width:80%; aspect-ratio:1; border:2px solid #ff0738; border-radius:50%; opacity:.23; animation:home-reticle-lock 1.5s cubic-bezier(.2,.8,.2,1) both; }
.hero-reticle span { position:absolute; inset:19%; border:2px dashed #bcbcc7; border-radius:50%; }
.hero-reticle::before, .hero-reticle::after { content:''; position:absolute; background:linear-gradient(to bottom,#ff0738 0%,#ff0738 19%,transparent 19%,transparent 81%,#ff0738 81%,#ff0738 100%); }
.hero-reticle::before { top:-45px; bottom:-45px; left:50%; width:2px; }
.hero-reticle::after { left:-45px; right:-45px; top:50%; height:2px; background:linear-gradient(to right,#ff0738 0%,#ff0738 19%,transparent 19%,transparent 81%,#ff0738 81%,#ff0738 100%); }
.hero-eyebrow { display:inline-flex; align-items:center; gap:10px; font-size:11px; font-weight:600; line-height:1.6; text-transform:uppercase; color:#c3c3cc; letter-spacing:0; margin:0 0 18px; }
.hero-eyebrow::before { content:''; width:22px; height:2px; background:#ff0738; flex-shrink:0; }
#home h1 { display:flex; justify-content:center; font-family:'Archivo','Arial Black',Arial,sans-serif; font-style:italic; font-size:116px; font-weight:900; line-height:1.08; letter-spacing:0; white-space:nowrap; margin:0 0 24px; animation:home-title-reveal .9s .2s cubic-bezier(.7,0,.2,1) both; }
#home h1 span { font-family:inherit; }
.hero-description { color:#d4d4dc; font-size:16px; font-weight:400; line-height:1.75; margin:0 auto; max-width:580px; text-shadow:0 2px 12px #000; }
.hero-description strong { color:#f4f4f7; font-weight:600; }
.hero-btns { display:flex; align-items:stretch; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:28px; }
#home .hero-btns button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:49px; padding:14px 26px; border-radius:4px; clip-path:none; font-size:12px; letter-spacing:0; font-weight:600; text-transform:uppercase; transition:background .18s,border-color .18s; }
#home .btn-primary { min-width:185px; background:#ff0738; box-shadow:0 4px 18px #e9002920; }
#home .btn-primary:hover { background:#d80530; }
#home .btn-outline { border:1px solid #894052; background:#08090be6; }
#home .btn-outline:hover { border-color:#ff0738; color:white; background:#250a13; }
#home .hero-btns .cz-icon { width:17px; height:17px; }
#home .btn-outline .cz-icon { color:#ff0738; }
.home-destinations { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; margin:0; padding:28px max(24px,calc((100% - 1120px)/2)); background:#0c0d10; border-block:1px solid #292329; }
#home .home-destination { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:7px; min-width:0; min-height:96px; padding:0 18px; border:0; border-right:1px solid #35232b; border-radius:0; background:transparent; box-shadow:none; color:#b2b2be; cursor:pointer; transform:none; transition:color .2s; }
#home .home-destination:last-child { border-right:0; }
#home .home-destination:hover { color:white; background:#ffffff04; }
.home-destination .cz-icon { color:#ff0738; width:32px; height:32px; margin-bottom:9px; }
.home-destination strong { font-family:Inter,sans-serif; color:#f1f1f3; font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:0; }
.home-destination > span:last-child { font-size:12px; line-height:1.5; }
.home-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 42px; background:#08090b; }
#home .hero-follow { position:static; display:flex; flex-direction:row; align-items:center; margin:0; width:auto; gap:16px; }
#home .follow-brand { font-family:Inter,sans-serif; font-size:9px; color:#9b9ba3; font-weight:500; letter-spacing:0; margin:0; }
#home .social-links { gap:8px; }
#home .social-link { width:30px; height:30px; background:#0d0e12; border-color:#26272b; border-radius:4px; box-shadow:none; }
#home .social-link img { width:15px; height:15px; }
#home .social-link .social-discord { width:19px; }
.home-signoff { text-align:left; font-size:9px; color:#98989e; font-weight:500; line-height:1.4; text-transform:uppercase; letter-spacing:0; }
.home-signoff span { margin-top:10px; }

@keyframes home-arena-entry {
  from { transform:scale(1.08); }
  to { transform:scale(1); }
}
@keyframes home-reticle-lock {
  from { transform:translate(-50%,-50%) rotate(30deg) scale(1.8); opacity:0; }
  to { transform:translate(-50%,-50%) rotate(0deg) scale(1); opacity:.23; }
}
@keyframes home-title-reveal {
  from { clip-path:inset(0 100% 0 0); }
  to { clip-path:inset(-5% -6%); }
}

@media (min-width:1600px) {
  #home .hero-content { padding-top:100px; padding-bottom:86px; }
  #home h1 { font-size:128px; }
  .hero-description { font-size:16px; }
  .home-destinations { padding-inline:max(42px,calc((100% - 1240px)/2)); }
}
@media (max-width:1350px) and (min-width:1101px) {
  .nav { gap:18px; }
  .nav-links a { gap:8px; padding:8px 12px; font-size:11px; }
  .nav-secondary { margin-left:-18px; }
  .nav-logo .brand-word { font-size:26px; }
  .nav #menuNaoLogado, .nav #menuLogado { max-width:182px; }
  .nav-actions button { padding:10px 8px; font-size:10px; }
}
@media (max-width:1100px) {
  .nav { height:120px; }
  main { padding-top:120px; }
  .nav-logo { position:absolute; left:24px; top:18px; transform:none; }
  .nav #menuNaoLogado, .nav #menuLogado { position:absolute; top:16px; right:24px; }
  .nav-primary, .nav-secondary { position:absolute; top:75px; width:50%; justify-content:center; margin-left:0; }
  .nav-primary { left:0; right:auto; }
  .nav-secondary { left:50%; }
  .nav-links li { flex:1; }
  .nav-links a { justify-content:center; padding:6px 12px; }
  .nav-secondary { border-left:1px solid #521022; }
  .nav-links a::after { bottom:-9px; }
  #home { min-height:calc(100svh - 120px); grid-template-rows:minmax(410px,1fr) auto auto; }
  #home h1 { font-size:84px; }
  .hero-motto { top:28px; left:24px; }
  #home .hero-content { padding:100px 24px 55px; }
}
@media (max-width:600px) {
  .nav { height:113px; }
  main { padding-top:113px; }
  .nav-logo { left:16px; top:19px; }
  .nav-logo .brand-word { font-size:23px; }
  .nav #menuNaoLogado, .nav #menuLogado { right:12px; top:14px; max-width:175px; }
  .nav-actions { gap:5px; }
  .nav-actions button { font-size:10px; padding:10px 8px; }
  .nav-actions .btn-main { max-width:79px; white-space:normal; line-height:1.2; padding:6px 10px; }
  .nav-primary, .nav-secondary { top:70px; }
  .nav-links a { padding:6px 3px; gap:6px; font-size:9px; }
  .nav .cz-icon { width:18px; height:18px; }
  .nav #nomeUsuario { max-width:65px; }
  .nav .admin-badge { display:none; }
  #home { min-height:calc(100svh - 113px); grid-template-rows:minmax(355px,1fr) auto auto; }
  #home .hero-image { object-position:29% center; }
  #home .hero-bg::after { background:linear-gradient(180deg,#08090b30 0%,#08090b45 35%,#08090bcc 100%); }
  .hero-motto { top:20px; left:18px; font-size:8px; }
  #home .hero-content { padding:98px 18px 44px; }
  .hero-eyebrow { font-size:9px; margin-bottom:13px; }
  #home h1 { font-size:44px; margin-bottom:18px; }
  .hero-description { font-size:13px; max-width:345px; }
  .desktop-break { display:none; }
  .hero-btns { gap:10px; margin-top:22px; }
  #home .hero-btns button { min-height:44px; padding:12px 14px; font-size:10px; gap:8px; }
  #home .btn-primary { min-width:135px; }
  .home-destinations { width:100%; padding:24px 18px; grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:24px; }
  #home .home-destination { min-height:95px; padding:0 10px; }
  #home .home-destination:nth-child(2) { border-right:0; }
  .home-destination .cz-icon { width:27px; height:27px; margin-bottom:6px; }
  .home-destination strong { font-size:11px; }
  .home-destination > span:last-child { font-size:11px; line-height:1.5; }
  .home-bottom { padding:18px 20px; }
}
@media (max-width:360px) {
  .nav-logo .brand-word { font-size:20px; }
  .nav #menuNaoLogado, .nav #menuLogado { max-width:155px; }
  .nav #nomeUsuario { max-width:45px; }
  #home h1 { font-size:39px; }
  #home .hero-btns button { padding:12px 10px; }
}
@media (prefers-reduced-motion:reduce) {
  .nav *, #home * { transition:none !important; animation:none !important; }
}