/* Faixa promocional + cabeçalho em estilo game (texto legível) */
.topline{
  background:#dd7136!important;color:#0d0b12!important;border-bottom:4px solid #0d0b12;
  box-shadow:inset 0 4px 0 #f6a26f,inset 0 -4px 0 #9a4617;
}
.topline a{color:#0d0b12!important;text-decoration:none;padding:3px 9px;font-weight:700;box-shadow:3px 3px 0 #0d0b12;background:rgba(255,243,223,.35);border:2px solid #0d0b12}
.topline a:hover{background:#fff3df;transform:translate(-1px,-1px)}
.topline a:active{transform:translate(3px,3px);box-shadow:none}

.header{border-bottom:4px solid #0d0b12!important;background-color:#171719;box-shadow:0 4px 0 #4b3f66}

/* links do menu */
.desktop-nav a,.mobile-nav a{
  font-family:"VT323","Courier New",monospace;font-size:23px;line-height:1;letter-spacing:0;color:#fff;
  padding:6px 8px;border:3px solid transparent;
}
.desktop-nav a:hover,.mobile-nav a:hover{color:#f2a65a;border-color:#4b3f66;background:#262034}
.desktop-nav a:hover::before{content:"▶ ";font-family:"Press Start 2P","Courier New",monospace;font-size:9px;color:#f2a65a}
.desktop-nav a:active{transform:translate(2px,2px)}

/* idioma */
.language{border-radius:0!important;border:3px solid #0d0b12!important;background:#0d0b12!important;gap:3px;padding:3px;box-shadow:3px 3px 0 #4b3f66}
.language button{
  border-radius:0!important;font-family:"Press Start 2P","Courier New",monospace;font-size:9px;letter-spacing:0;line-height:1.4;padding:7px 9px;
  background:#262034;color:#cdbfe6;border:2px solid transparent;transition:none;
}
.language button:hover{color:#fff}
.language button[aria-pressed="true"]{background:#dd7136;color:#0d0b12;box-shadow:inset 2px 2px 0 #f6a26f,inset -2px -2px 0 #9a4617}

/* botão do menu móvel */
.menu-toggle{border-radius:0!important;border:3px solid #0d0b12!important;background:#262034!important;box-shadow:inset 2px 2px 0 #4b3f66,3px 3px 0 #0d0b12}
.menu-toggle span{border-radius:0!important;height:3px!important}
.mobile-nav{border-radius:0;border:4px solid #0d0b12;background:#1b1626;box-shadow:6px 6px 0 #0d0b12,inset 3px 3px 0 #4b3f66}

/* logos: contorno escuro + sombra dura, como nos botões laranja */
img[src$="heycut.svg"]{
  filter:
    drop-shadow(2px 0 0 #0d0b12) drop-shadow(-2px 0 0 #0d0b12)
    drop-shadow(0 2px 0 #0d0b12) drop-shadow(0 -2px 0 #0d0b12)
    drop-shadow(3px 3px 0 #0d0b12);
  transition:filter .08s steps(2,end),transform .08s steps(2,end);
}
.closing img[src$="heycut.svg"]{
  filter:
    drop-shadow(3px 0 0 #0d0b12) drop-shadow(-3px 0 0 #0d0b12)
    drop-shadow(0 3px 0 #0d0b12) drop-shadow(0 -3px 0 #0d0b12)
    drop-shadow(5px 5px 0 #0d0b12);
}
/* hover: o logo muda de cor (fica mais claro) e levanta como um botão */
a:hover>img[src$="heycut.svg"],.closing img[src$="heycut.svg"]:hover,img[src$="heycut.svg"]:hover{
  filter:
    drop-shadow(2px 0 0 #0d0b12) drop-shadow(-2px 0 0 #0d0b12)
    drop-shadow(0 2px 0 #0d0b12) drop-shadow(0 -2px 0 #0d0b12)
    drop-shadow(4px 4px 0 #0d0b12) brightness(1.25) saturate(1.1);
  transform:translate(-1px,-1px);
}
a:hover>.brand-text,.brand:hover>span{color:#f2a65a}
@media (prefers-reduced-motion:reduce){img[src$="heycut.svg"]{transition:none}}

/* barra de rolagem da página: igual à do painel de dúvidas (trilho escuro + polegar laranja) */
html{scrollbar-color:#dd7136 #0d0b12;scrollbar-width:thin}
