/* Ferramentas SAW — estilo compartilhado (manual da marca: bordôs, golds, Arimo) */
:root {
  --bordo: #411217;
  --bordo-paixao: #56181c;
  --bordo-escuro: #2a0b0e;
  --gold-new: #f4cd96;
  --gold: #deb273;
  --gold-old: #aa8064;
  --fundo: #f7f3ee;
  --card: #ffffff;
  --texto: #1f1416;
  --texto-suave: #6b5a5c;
  --linha: #e7ddd3;
  --parada: #a3262f;
  --parada-fundo: #f9e6e7;
  --improviso: #9a6a1c;
  --improviso-fundo: #fbf0dc;
  --sistema: #2d7a4b;
  --sistema-fundo: #e3f2e8;
  --raio: 14px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: "Arimo", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

.topo {
  background: linear-gradient(160deg, var(--bordo-paixao), var(--bordo-escuro));
  color: #fff;
  padding: 20px 16px 28px;
}
.topo-interno, .conteudo { max-width: 680px; margin: 0 auto; }
.topo img { height: 30px; width: auto; display: block; }
.topo .rotulo {
  margin: 22px 0 4px;
  color: var(--gold);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
}
.topo h1 { margin: 0; font-size: 26px; line-height: 1.2; }
.topo p { margin: 10px 0 0; color: #ecdcd6; font-size: 15px; }

.conteudo { padding: 0 16px 48px; }

.card {
  background: var(--card);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  padding: 18px 16px;
  margin-top: 16px;
}
.card h2 { margin: 0 0 4px; font-size: 18px; color: var(--bordo); }
.card .sub { margin: 0; color: var(--texto-suave); font-size: 14px; }

.aviso {
  margin-top: -12px;
  background: var(--card);
  border: 1px solid var(--linha);
  border-left: 4px solid var(--gold);
  border-radius: var(--raio);
  padding: 12px 14px;
  font-size: 14px;
  color: var(--texto-suave);
  position: relative;
}
.aviso strong { color: var(--texto); }

label.campo { display: block; margin-top: 14px; font-size: 14px; font-weight: 700; }
label.campo:first-of-type { margin-top: 12px; }
input[type="text"] {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 12px;
  font: inherit;
  color: var(--texto);
  background: #fff;
  border: 1px solid var(--linha);
  border-radius: 10px;
}
input[type="text"]:focus { outline: 2px solid var(--gold); border-color: var(--gold); }

.botao {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 20px;
  font: inherit;
  font-weight: 700;
  border-radius: 12px;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
}
.botao-principal { background: var(--bordo); color: #fff; width: 100%; }
.botao-principal:active { background: var(--bordo-escuro); }
.botao-principal[disabled] { opacity: .55; cursor: not-allowed; }
.botao-secundario { background: transparent; color: var(--texto-suave); border-color: var(--linha); width: 100%; margin-top: 10px; }

.rodape { text-align: center; color: var(--texto-suave); font-size: 13px; margin-top: 28px; }
.rodape img { height: 20px; opacity: .8; display: block; margin: 0 auto 8px; }

/* Lista de ferramentas (página inicial) */
.lista-ferramentas { list-style: none; padding: 0; margin: 0; }
.lista-ferramentas a {
  display: block;
  background: var(--card);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  padding: 18px 16px;
  margin-top: 14px;
  color: inherit;
  text-decoration: none;
}
.lista-ferramentas a strong { display: block; color: var(--bordo); font-size: 17px; }
.lista-ferramentas a span { color: var(--texto-suave); font-size: 14px; }
.lista-ferramentas a::after { content: "Abrir →"; display: block; margin-top: 8px; color: var(--gold-old); font-weight: 700; font-size: 14px; }