/* Sistema 4×4D — Variáveis da marca, splash, navegação, bloqueio antes do login
   (parte do antigo index.html único; a ordem dos arquivos importa) */
:root {
  --verm:    #590202;
  --verm-dk: #3d0101;
  --verde:   #10AB82;
  --branco:  #FFF4E9;
  --cinza:   #242424;
  --muted:   #5a4f4a;          /* era #7a6f6a — escurecido para AA */
  --muted-dim: #7a6f6a;        /* tom anterior, só para detalhes não-críticos */
  --rule:    rgba(89,2,2,0.12);
  --rule-inv: rgba(255,244,233,0.12);
  --laranja: #FFA600;
  --danger:  #FF5A1F;
  /* Textos claros sobre fundo escuro — escala de contraste */
  --light-1: rgba(255,244,233,0.95); /* primário */
  --light-2: rgba(255,244,233,0.75); /* secundário */
  --light-3: rgba(255,244,233,0.55); /* terciário (era 0.3-0.4) */
  --light-4: rgba(255,244,233,0.40); /* divisores/decorativo */
  --nav-h: 72px;               /* altura do menu: o logo precisa de 65px (manual da marca) */
  --banner-h: 0px;             /* aviso do modo aluno (fica acima do menu) */
  --topo: calc(var(--nav-h) + var(--banner-h)); /* onde o conteúdo começa */
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Work Sans',sans-serif;background:var(--branco);color:var(--cinza);font-size:15px;line-height:1.6;overflow-x:hidden;}

/* ── SPLASH / SELEÇÃO DE PROVA ───────────────────────── */
#splash{position:fixed;inset:0;z-index:9999;background:var(--verm-dk);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:2rem;overflow-y:auto;overflow-x:hidden;}
#splash .sp-inner{display:flex;flex-direction:column;align-items:center;width:100%;max-width:560px;padding:1.2rem 0 2rem;}
#splash .sp-logo{margin-bottom:1rem;}
#splash .sp-logo svg{height:36px;}
#splash h1{font-family:'Work Sans',sans-serif;font-weight:800;font-size:clamp(1.3rem,4.32vw,2.52rem);color:var(--branco);text-transform:uppercase;letter-spacing:0;text-align:center;line-height:1.05;margin-bottom:0.2rem;}
#splash h1 em{font-style:normal;color:var(--laranja);}
#splash .sp-sub{font-size:0.68rem;font-weight:300;color:rgba(255,244,233,0.65);letter-spacing:0.15em;text-transform:uppercase;margin-bottom:1.2rem;text-align:center;}
#splash .sp-pergunta{font-size:0.6rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:var(--verde);margin-bottom:0.9rem;display:flex;align-items:center;gap:0.8rem;align-self:flex-start;}
#splash .sp-pergunta::before{content:'';width:28px;height:1px;background:var(--verde);}
#splash .sp-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem;width:100%;}
.prova-btn{background:transparent;border:1px solid rgba(255,244,233,0.12);padding:1.1rem 1rem;cursor:pointer;text-align:left;transition:all 0.2s;position:relative;overflow:hidden;}
.prova-btn::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:var(--verde);transform:scaleY(0);transition:transform 0.2s;transform-origin:bottom;}
.prova-btn:hover{border-color:var(--verde);background:rgba(16,171,130,0.06);}
.prova-btn:hover::before{transform:scaleY(1);}
.prova-btn .pb-org{font-size:0.5rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,244,233,0.55);margin-bottom:0.2rem;}
.prova-btn .pb-nome{font-family:'Anton',sans-serif;font-size:1.6rem;color:var(--branco);text-transform:uppercase;line-height:1;}
.prova-btn .pb-nivel{display:inline-block;margin-top:0.4rem;font-size:0.55rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;padding:0.15rem 0.5rem;border:1px solid;color:var(--laranja);border-color:rgba(255,166,0,0.3);}
.prova-btn.goethe .pb-nivel{color:var(--verde);border-color:rgba(16,171,130,0.3);}
/* Badge discreto pra Pflege (área específica de saúde) */
.prova-btn .pb-tag{position:absolute;top:0.7rem;right:0.7rem;font-size:0.5rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--verde);background:rgba(16,171,130,0.12);padding:0.2rem 0.45rem;border-radius:2px;}
/* RESPONSIVIDADE PROGRESSIVA DO SPLASH */
@media(max-width:720px){
  #splash{padding:1rem;}
  .prova-btn{padding:0.85rem 0.9rem;}
  .prova-btn .pb-nome{font-size:1.35rem;}
}
@media(max-width:500px){
  #splash .sp-grid{grid-template-columns:1fr 1fr;}
  /* Header compacto em mobile — logo + título em linha pra poupar vertical */
  #splash .sp-inner{padding:0.8rem 0 1.5rem;}
  #splash .sp-logo{display:flex;justify-content:center;} /* logo visível em mobile */
  #splash h1{font-size:1.6rem;margin-bottom:0.15rem;}
  #splash .sp-sub{font-size:0.6rem;margin-bottom:0.8rem;letter-spacing:0.1em;}
  #splash .sp-pergunta{font-size:0.55rem;margin-bottom:0.7rem;}
  .prova-btn{padding:0.75rem 0.8rem;}
  .prova-btn .pb-org{font-size:0.45rem;}
  .prova-btn .pb-nome{font-size:1.15rem;}
  .prova-btn .pb-nivel{font-size:0.48rem;margin-top:0.3rem;padding:0.1rem 0.4rem;}
  .prova-btn[style*="span 2"]{grid-column:auto !important;}
}
@media(max-width:380px){
  #splash{padding:0.7rem;}
  #splash .sp-grid{gap:0.5rem;}
  .prova-btn{padding:0.65rem 0.7rem;}
  .prova-btn .pb-nome{font-size:1rem;}
}

/* ── NAVEGAÇÃO PRINCIPAL ────────────────────────────── */
#nav{position:fixed;top:0;left:0;right:0;width:100%;z-index:100;background:var(--verm-dk);border-bottom:1px solid rgba(255,244,233,0.06);display:none;}
.nav-inner{display:flex;align-items:stretch;gap:0;flex-wrap:nowrap;min-height:var(--nav-h);width:100%;}
.nav-inner::-webkit-scrollbar{display:none;}
.nav-logo{padding:0 1.5rem;border-right:1px solid rgba(255,244,233,0.08);flex-shrink:0;display:flex;align-items:center;min-height:var(--nav-h);min-width:60px;}
.nav-logo svg{height:28px;width:130px;}
.nav-tab{padding:0 1.2rem;height:var(--nav-h);display:flex;align-items:center;font-size:0.6rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,244,233,0.55);cursor:pointer;border:none;background:transparent;border-bottom:2px solid transparent;transition:all 0.18s;white-space:nowrap;flex-shrink:0;}
.nav-tab:hover{color:rgba(255,244,233,0.65);}
.nav-tab.active{color:var(--branco);border-bottom-color:var(--verde);}
.nav-home.active{color:var(--branco);border-bottom-color:var(--verde);}
.nav-toggle{display:flex;gap:0.5rem;align-items:center;background:rgba(255,244,233,0.05);border-right:1px solid rgba(255,244,233,0.08);}
.nav-toggle:hover{background:rgba(255,244,233,0.1);color:#FFF4E9;}
.nav-toggle-icon{font-size:0.85rem;color:var(--laranja);}

.nav-prova-badge{padding:0 1.5rem;font-size:0.55rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--laranja);flex-shrink:0;cursor:pointer;border:none;background:transparent;transition:all .15s ease;}

/* ── Dropdown Menu Agrupado ───────────────────────────── */
.nav-menu{position:fixed;top:var(--topo);left:0;right:0;bottom:0;z-index:200;animation:fadeIn 0.15s;}
.nav-menu-bg{position:absolute;inset:0;background:rgba(0,0,0,0.55);backdrop-filter:blur(4px);}
.nav-menu-box{position:relative;background:#242424;border-bottom:3px solid var(--laranja);padding:1.5rem 2rem 2rem;max-height:calc(100vh - var(--topo));overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem 2rem;animation:slideDown 0.2s;}
@keyframes slideDown{from{transform:translateY(-15px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.nav-menu-grupo{display:flex;flex-direction:column;}
.nav-menu-grupo-h{font-family:'Work Sans',sans-serif;font-weight:800;font-size:0.7rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--laranja);margin-bottom:0.7rem;padding-bottom:0.45rem;border-bottom:1px solid rgba(255,244,233,0.08);}
.nav-menu-item{display:flex;align-items:center;gap:0.6rem;width:100%;padding:0.65rem 0.7rem;background:transparent;border:none;font-family:'Work Sans',sans-serif;font-size:0.8rem;color:rgba(255,244,233,0.75);text-align:left;cursor:pointer;transition:all 0.12s;letter-spacing:0.01em;}
.nav-menu-item:hover{background:rgba(255,244,233,0.05);color:#FFF4E9;padding-left:1rem;}
.nav-menu-item.active{background:rgba(255,90,31,0.15);color:var(--laranja);}

/* ── LOCKDOWN: esconde tudo até logar ─────────────────── */
body.locked nav.nav,
body.locked .page,
body.locked #splash,
body.locked .footer-credit{display:none !important;}
body.locked #splash-locked{display:flex !important;}
#splash-locked{display:none;position:fixed;inset:0;background:linear-gradient(135deg,var(--verm-dk),#000);z-index:100;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:#FFF4E9;text-align:center;}
.splash-lock-logo{margin-bottom:2rem;}
.splash-lock-logo svg{width:72px;height:auto;}
.splash-lock-label{font-size:0.6rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:inherit;margin-bottom:1rem;}
.splash-lock-title{font-family:'Anton',sans-serif;font-size:clamp(2rem,7vw,3.6rem);text-transform:uppercase;line-height:1.05;color:var(--branco);margin:0;}
.splash-lock-title em{font-style:normal;color:var(--laranja);}
.splash-lock-sub{font-size:0.95rem;line-height:1.7;color:rgba(255,244,233,0.65);max-width:520px;margin:1.2rem 0 2.5rem;font-weight:300;}
.splash-lock-actions{display:flex;gap:0.6rem;flex-wrap:wrap;justify-content:center;}
.splash-lock-btn{padding:0.9rem 1.8rem;font-family:'Anton',sans-serif;font-size:0.95rem;text-transform:uppercase;letter-spacing:0.05em;border:none;cursor:pointer;transition:all 0.15s;min-width:200px;}
.splash-lock-btn-primary{background:var(--laranja);color:#fff;}
.splash-lock-btn-primary:hover{background:#ff6b35;}
.splash-lock-btn-secondary{background:transparent;color:#FFF4E9;border:1.5px solid rgba(255,244,233,0.3);}
.splash-lock-btn-secondary:hover{border-color:#FFF4E9;background:rgba(255,255,255,0.05);}
.splash-lock-foot{margin-top:2.5rem;font-size:0.7rem;color:rgba(255,244,233,0.65);line-height:1.7;max-width:480px;}
.splash-lock-foot strong{color:inherit;}
.splash-lock-foot a{color:var(--laranja);text-decoration:none;}

@media (max-width:600px){
  .nav-menu-box{padding:1.2rem 1rem 1.5rem;gap:1.2rem 1rem;}
}


/* ── Menu por áreas + abas da área (reorganização da navegação) ── */
.nav-areas .nav-menu-item,.nav-menu-admin .nav-area{align-items:flex-start;}
.nav-area .na-ico{font-size:1.05rem;line-height:1.3;}
.nav-area .na-txt{display:flex;flex-direction:column;gap:0.1rem;min-width:0;}
.nav-area .na-txt strong{font-weight:600;color:#FFF4E9;font-size:0.86rem;}
.nav-area .na-txt small{font-size:0.7rem;color:rgba(255,244,233,0.55);line-height:1.35;}
.nav-area.active{background:rgba(255,90,31,0.15);}
.nav-area.active .na-txt strong{color:var(--laranja);}
.area-abas{background:var(--verm-dk);border-bottom:1px solid rgba(255,244,233,0.1);margin-top:var(--topo);}
/* com a barra de abas visível, ela ocupa o recuo do menu fixo; a página não recua de novo */
.area-abas:not([hidden]) ~ .page.active{padding-top:0;}
.area-abas[hidden]{display:none;}
.area-abas-trilho{display:flex;gap:0.2rem;padding:0 6rem;overflow-x:auto;scrollbar-width:thin;}
.area-aba{flex:0 0 auto;font-family:'Work Sans',sans-serif;font-size:0.72rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,244,233,0.6);background:transparent;border:none;border-bottom:3px solid transparent;padding:0.9rem 0.9rem 0.75rem;cursor:pointer;white-space:nowrap;min-height:44px;}
.area-aba:hover{color:#FFF4E9;}
.area-aba.ativa{color:var(--laranja);border-bottom-color:var(--laranja);}
.area-aba:focus-visible{outline:2px solid var(--laranja);outline-offset:-2px;}
@media(max-width:680px){ .area-abas-trilho{padding:0 0.6rem;} .area-aba{padding:0.8rem 0.7rem 0.65rem;font-size:0.68rem;} }