/* ===========================================================================
   NORMALIDAD — fonte oficial da marca
   =========================================================================== */
@font-face{
  font-family:'Normalidad Wide';
  src:url('../fonts/Normalidad_Wide_Medium.woff2') format('woff2');
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Normalidad Wide';
  src:url('../fonts/Normalidad_Wide_Bold.woff2') format('woff2');
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Normalidad';
  src:url('../fonts/Normalidad_Text_Regular.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Normalidad';
  src:url('../fonts/Normalidad_Text_Medium.woff2') format('woff2');
  font-weight:500; font-style:normal; font-display:swap;
}

:root{
  --eerie-black:#1a1a1a;
  --neon-celery:#00ff00;
  --urban-grafitte:#808080;
  --branco:#FFFFFF;
  --superficie:#F5F5F3;
  --superficie2:#EDEDEA;
  --linha:#E4E4E0;
  --linha-forte:#CFCFC9;
  --texto-suave:#6E6E6A;
  --display:'Normalidad Wide',system-ui,sans-serif;
  --body:'Normalidad',system-ui,-apple-system,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}

body{
  background:var(--branco);
  color:var(--eerie-black);
  font-family:var(--body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:1000px;margin:0 auto;padding:0 20px 100px}

/* ---------- topo ---------- */
header{
  padding:40px 0 34px;
  border-bottom:1px solid var(--linha);
  margin-bottom:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.logo{width:132px;height:auto;color:var(--eerie-black);display:block}
.logo path{fill:currentColor}
.topo-user{font-size:13px;color:var(--texto-suave);text-align:right}
.topo-user strong{color:var(--eerie-black);font-weight:500}
.sair{color:var(--texto-suave);text-decoration:underline;cursor:pointer;font-size:12px}

h1{
  font-family:var(--display);
  font-size:clamp(28px,5vw,40px);
  font-weight:700;
  letter-spacing:-.03em;
  line-height:1.05;
}
.barra{height:4px;width:52px;background:var(--neon-celery);margin-top:20px}

.secao-titulo{
  font-family:var(--display);
  font-size:13px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--eerie-black);
  margin:56px 0 6px;
}
.secao-sub{color:var(--texto-suave);margin-bottom:26px;max-width:60ch}

/* ---------- planos ---------- */
.planos{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
@media(max-width:820px){ .planos{grid-template-columns:1fr} }

.plano{
  border:1px solid var(--linha-forte);
  padding:26px 22px;
  display:flex;
  flex-direction:column;
  position:relative;
  background:var(--branco);
}
.plano.destaque{
  border:2px solid var(--eerie-black);
  border-top:4px solid var(--neon-celery);
}
.plano-tag{
  position:absolute;top:-11px;left:22px;
  background:var(--neon-celery);
  color:var(--eerie-black);
  font-size:11px;font-weight:600;
  padding:2px 10px;
  font-family:var(--body);
}
.plano-nome{
  font-family:var(--display);
  font-size:22px;font-weight:700;
  letter-spacing:-.02em;
}
.plano-preco{
  font-family:var(--display);
  font-size:26px;font-weight:700;
  margin:6px 0 4px;
}
.plano-preco span{font-size:14px;color:var(--texto-suave);font-weight:500}
.plano-resumo{font-size:14px;color:var(--texto-suave);margin-bottom:18px;min-height:42px}

.plano-inclui{list-style:none;margin:0 0 18px;padding:16px 0 0;border-top:1px solid var(--linha)}
.plano-inclui li{
  font-size:14px;
  padding:5px 0 5px 24px;
  position:relative;
}
.plano-inclui li::before{
  content:'';
  position:absolute;left:0;top:11px;
  width:12px;height:7px;
  border-left:2px solid var(--neon-celery);
  border-bottom:2px solid var(--neon-celery);
  transform:rotate(-45deg);
}
.plano-entrega{
  font-size:13.5px;
  line-height:1.5;
  color:var(--eerie-black);
  background:var(--superficie);
  padding:14px 15px;
  margin-top:auto;
}
.plano-condicao{
  font-size:12.5px;
  color:var(--eerie-black);
  margin-top:12px;
  padding-left:12px;
  border-left:3px solid var(--neon-celery);
}

.obs-planos{
  font-size:13px;
  color:var(--texto-suave);
  margin-top:22px;
  padding:14px 16px;
  background:var(--superficie);
}

/* ---------- busca e filtros ---------- */
.controles{
  position:sticky;
  top:0;
  background:var(--branco);
  padding:16px 0;
  z-index:5;
  border-bottom:1px solid var(--linha);
}
#busca{
  width:100%;
  font-family:var(--body);
  font-size:16px;
  padding:13px 15px;
  border:2px solid var(--eerie-black);
  background:var(--branco);
  color:var(--eerie-black);
  outline:none;
}
#busca::placeholder{color:var(--urban-grafitte)}
#busca:focus{box-shadow:0 0 0 3px rgba(0,255,0,.3)}

.filtros{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.filtro{
  font-family:var(--body);
  font-size:13px;
  font-weight:500;
  padding:7px 14px;
  border:1px solid var(--linha-forte);
  background:var(--branco);
  color:var(--texto-suave);
  cursor:pointer;
  transition:all .12s;
}
.filtro:hover{border-color:var(--eerie-black);color:var(--eerie-black)}
.filtro.ativo{
  background:var(--eerie-black);
  color:var(--branco);
  border-color:var(--eerie-black);
}

/* ---------- lista de servicos ---------- */
.grupo-cat{margin-top:34px}
.grupo-cat-nome{
  font-family:var(--display);
  font-size:12px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--urban-grafitte);
  padding-bottom:10px;
  border-bottom:1px solid var(--linha);
  margin-bottom:4px;
}

.servico{
  border-bottom:1px solid var(--linha);
}
.servico-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:18px 0;
  cursor:pointer;
}
.servico-head:hover .servico-nome{color:var(--urban-grafitte)}
.servico-nome{
  font-family:var(--display);
  font-size:17px;font-weight:500;
  letter-spacing:-.01em;
  transition:color .12s;
}
.servico-preco{
  font-family:var(--display);
  font-size:17px;font-weight:700;
  white-space:nowrap;
}
.servico-toggle{
  color:var(--urban-grafitte);
  font-size:13px;
  margin-left:4px;
  transition:transform .2s;
  display:inline-block;
}
.servico.aberto .servico-toggle{transform:rotate(180deg)}

.servico-corpo{
  display:none;
  padding:0 0 22px;
}
.servico.aberto .servico-corpo{display:block;animation:sobe .25s ease}
@keyframes sobe{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

.servico-desc{font-size:14.5px;color:var(--texto-suave);margin-bottom:14px;max-width:70ch}

.servico-bloco-titulo{
  font-size:11px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--eerie-black);
  margin:14px 0 8px;
}
.servico-inclui{list-style:none;padding:0;margin:0}
.servico-inclui li{
  font-size:14px;
  padding:4px 0 4px 22px;
  position:relative;
}
.servico-inclui li::before{
  content:'';position:absolute;left:0;top:10px;
  width:10px;height:6px;
  border-left:2px solid var(--neon-celery);
  border-bottom:2px solid var(--neon-celery);
  transform:rotate(-45deg);
}
.servico-resultados{
  font-size:14px;
  line-height:1.5;
  background:var(--superficie);
  padding:13px 15px;
  margin-top:6px;
}

.vazio{
  text-align:center;
  color:var(--texto-suave);
  padding:50px 0;
  font-size:15px;
}

/* ---------- login ---------- */
.login-tela{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.login-box{width:100%;max-width:380px}
.login-box .logo{margin-bottom:30px}
.login-box h1{font-size:28px;margin-bottom:8px}
.login-box p{color:var(--texto-suave);font-size:14px;margin-bottom:26px}
.login-box label{
  display:block;font-size:12px;font-weight:500;
  color:var(--texto-suave);margin-bottom:6px;margin-top:16px;
}
.login-box input{
  width:100%;font-family:var(--body);font-size:16px;
  padding:13px 15px;border:1px solid var(--linha-forte);
  background:var(--branco);color:var(--eerie-black);outline:none;
}
.login-box input:focus{border-color:var(--eerie-black);box-shadow:0 0 0 3px rgba(0,255,0,.3)}
.login-btn{
  width:100%;margin-top:24px;
  font-family:var(--display);font-size:15px;font-weight:700;
  letter-spacing:.02em;text-transform:uppercase;
  padding:16px;border:none;
  background:var(--neon-celery);color:var(--eerie-black);cursor:pointer;
  transition:filter .15s;
}
.login-btn:hover{filter:brightness(.93)}
.login-btn:disabled{background:var(--linha);color:var(--urban-grafitte);cursor:not-allowed}
.login-erro{color:#C4321C;font-size:13px;margin-top:14px;min-height:18px}
.login-aviso{font-size:11px;color:var(--urban-grafitte);margin-top:22px;line-height:1.4}

*:focus-visible{outline:3px solid var(--neon-celery);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}